.brooksite-header,
.brooksus_bs3 .dropdown-menu>.dropdown,
.navbar-header {
  position: relative
}

body {
  font-size: 16px;
  font-weight: 300
}

body.contentpane {
  padding: 15px
}

.nav .fa.fa:after,
.nav .fa.fa:before {
  font: normal normal normal 14px/1 FontAwesome
}

.white-bg-container .color1 .container,
.white-bg-container .color2 .container,
.white-bg-container .extra .container,
.white-bg-container .extramobile .container,
.white-bg-container .middle-navbar .container,
.white-bg-container .post-parallax .container,
.white-bg-container .pre-parallax .container,
.white-bg-container .top-brand-search-cart .container {
  background: #fff;
  padding-top: 15px;
  padding-bottom: 15px
}

.white-bg-container .post-parallax,
.white-bg-container .pre-parallax {
  background-image: none
}

.white-bg-container .middle-navbar .container {
  margin-top: 5px;
  margin-bottom: 6px
}

.white-bg-container .middle-navbar .breadcrumb {
  margin-top: 0;
  margin-bottom: 0
}

.extra,
.extramobile {
  margin-bottom: 30px
}

.container-fluid {
  background-color: #fff
}

.top-section-container .container,
.top-section-container.fluid-navbar {
  border-bottom: 1px solid #d0d0d0;
  background-color: #f5f5f5
}

header {
  padding: 0;
  border-top: 2px solid
}

.brooksite-header {
  top: 0;
  left: 0;
  padding: 0;
  width: 100%
}

.brooksite-header-large {
  min-height: 46px
}

.top-section-container {
  position: relative;
  font-size: 12px;
  line-height: 47px;
  z-index: 1000
}

.top-section-container .top-section-right div[class*=wrap-] {
  float: right;
  text-align: right;
  padding-left: 5px
}

.top-section-container .top-section-right::after {
  content: '';
  display: table;
  float: none;
  clear: both
}

.top-section-container select#id_currency {
  max-width: 75px
}

.top-section-container.fluid-navbar .container {
  border-bottom: none
}

.top-brand .name {
  font-size: 22px;
  font-weight: 700;
  padding: 0;
  margin: 15px 0 0 7px
}

.top-brand .slogan {
  display: block;
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase
}

.top-brand a {
  text-decoration: none;
  color: #444
}

.top-brand-search-cart .container {
  padding-bottom: 0 !important
}

.top-brand-search-cart .top-address,
.top-brand-search-cart .top-brand,
.top-brand-search-cart .top-cart,
.top-brand-search-cart .top-compare,
.top-brand-search-cart .top-search,
.top-brand-search-cart .top-wishlist {
  vertical-align: middle;
  padding: 5px;
}

.top-brand-search-cart .top-cart,
.top-brand-search-cart .top-compare,
.top-brand-search-cart .top-wishlist {
  float: right
}

.top-brand-search-cart .top-cart:after,
.top-brand-search-cart .top-compare:after,
.top-brand-search-cart .top-wishlist:after {
  float: none;
  clear: both;
  display: block;
  content: ''
}

.top-brand-search-cart .top-compare .min_view.compare-wrapp {
  width: 100%
}

.logo {
  max-height: 76px
}

.top-navbar-wrap .moduletable {
  background-color: #fff;
  margin-left: -15px;
  margin-right: -15px
}

.top-navbar.affix {
  top: 0;
  margin: auto;
  width: 100%;
  z-index: 1000
}

.navbar {
  margin-bottom: 0;
  padding: 0;
  border: 0
}

.navbar.navbar-default {
  background-color: transparent;
  border-top: 3px double #eee;
  border-bottom: 3px double #eee
}

.navbar-header img.logo-image {
  display: none
}

.fluid-navbar .navbar.navbar-default {
  border-top: none;
  border-bottom: none
}

.top-navbar.fluid-navbar.tmpl-bgcolor {
  box-shadow: 0 1px 3px #666
}

ul.jshop-menu-first .nth-child-0 {
  background: #666;
  margin-bottom: 0 !important;
  color: #fff
}

ul.jshop-menu-first .nth-child-0>a:nth-child(1) {
  color: #fff !important
}

.navbar-flat .navbar-nav>.active>a,
.navbar-flat .navbar-nav>.active>a:focus,
.navbar-flat .navbar-nav>.active>a:hover,
.navbar-flat .navbar-nav>li>a:focus,
.navbar-flat .navbar-nav>li>a:hover {
  background-color: transparent
}

.tmpl-bgcolor .navbar.navbar-default .navbar-nav>.active>a,
.tmpl-bgcolor .navbar.navbar-default .navbar-nav>li>a:focus,
.tmpl-bgcolor .navbar.navbar-default .navbar-nav>li>a:hover {
  color: #333
}

.tmpl-bgcolor .navbar.navbar-default .dropdown-menu>.active>a,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu>.active>a:focus,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu>.active>a:hover,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu>li>a,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu>li>a:focus,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu>li>a:hover {
  color: #777
}

.tmpl-bgcolor .navbar.navbar-default ul li:focus,
.tmpl-bgcolor .navbar.navbar-default ul li:hover {
  border-color: transparent
}

.navbar-toggle {
  margin-top: 0;
  border: none;
  float: none
}

.navbar-flat .navbar-toggle .icon-bar {
  background-color: #888
}

.navbar-header {
  z-index: 99
}

.navbar-collapse {
  padding-left: 0;
  padding-right: 0
}

.navbar-collapse.in {
  padding-left: 15px;
  padding-right: 15px
}

.navbar.navbar-default.top-navigation ul.navbar-nav>li {
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: -2px
}

.navbar.navbar-flat.top-navigation {
  min-height: inherit
}

.navbar.navbar-flat.top-navigation .navbar-collapse.in {
  width: 280px
}

.navbar.navbar-flat.top-navigation ul.navbar-nav>li {
  padding-top: 0;
  padding-bottom: 0
}

.navbar.top-navigation ul li.parent:focus ul.dropdown-menu:not(.dropdown-submenu),
.navbar.top-navigation ul li.parent:hover ul.dropdown-menu:not(.dropdown-submenu) {
  display: block
}

.navbar.top-navigation ul li {
  border-bottom: 2px solid transparent
}

.navbar.top-navigation ul li:focus,
.navbar.top-navigation ul li:hover {
  border-bottom: 2px solid;
  transition: all .5s linear;
  -webkit-transition: all .5s linear;
  -moz-transition: all .5s linear;
  -ms-transition: all .5s linear;
  -o-transition: all .5s linear
}

ul>li.dropdown.submenu-parent>a:after,
ul>li.dropdown>a:after {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\f107';
  padding-left: 5px;
  transition: all .5s linear;
  -webkit-transition: all .5s linear;
  -moz-transition: all .5s linear;
  -ms-transition: all .5s linear;
  -o-transition: all .5s linear
}

ul>li.dropdown>a:hover:after {
  transform: translateY(2px);
  transition: all .5s linear;
  -webkit-transition: all .5s linear;
  -moz-transition: all .5s linear;
  -ms-transition: all .5s linear;
  -o-transition: all .5s linear
}

ul>li.dropdown.submenu-parent>a:hover:after {
  transform: translateX(2px);
  transition: all .5s linear;
  -webkit-transform: translateX(2px);
  -moz-transform: translateX(2px);
  -ms-transform: translateX(2px);
  -o-transform: translateX(2px);
  -webkit-transition: all .5s linear;
  -moz-transition: all .5s linear;
  -ms-transition: all .5s linear;
  -o-transition: all .5s linear
}

ul>li.dropdown.submenu-parent>a:after {
  content: '\f105'
}

.brooksus_bs3 li.submenu-parent:focus>ul.dropdown-submenu,
.brooksus_bs3 li.submenu-parent:hover>ul.dropdown-submenu {
  display: block;
  margin: 0
}

.navbar-nav li a {
  margin-left: 2px;
  padding: 6px 15px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  font-size: 14px;
  font-weight: 400;
  text-transform: uppercase;
  color: #777
}

.badge,
.badge a {
  font-weight: 300
}

.tmpl-bgcolor .navbar-default .navbar-nav li a {
  color: #fff;
  outline: 0;
  border: none;
}

k.navbar-flat .navbar-nav.brooksus_bs3 li a {
  font-size: 11px;
  font-weight: 300;
  padding-top: 15px
}

.middle-navbar,
footer {
  font-size: 14px
}

.brooksus_bs3 .dropdown-menu {
  border: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0
}

.brooksus_bs3 ul.dropdown-submenu {
  display: none
}

.navbar-nav.brooksus_bs3>li>.dropdown-menu {
  margin-top: 0;
  padding: 0
}

.brooksite-header-small .navbar-nav.brooksus_bs3>li>.dropdown-menu {
  margin-top: 19px
}

.top-navigation .brooksus_bs3 .dropdown-menu {
  left: 0;
  right: auto
}

.brooksus_bs3 .dropdown-menu>li>a {
  line-height: 2.428571;
  border-top: 1px solid #dbdbdb
}

.brooksus_bs3 .dropdown-menu>.dropdown>.dropdown-menu {
  position: absolute;
  top: 0;
  left: 100%;
  display: none;
  float: left;
  min-width: 160px;
  padding: 0;
  margin: 2px 0 0;
  list-style: none;
  font-size: 14px;
  background-color: #f7f7f7;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  background-clip: padding-box
}

.breadcrumb,
.navbar-default .navbar-toggle:focus,
.navbar-default .navbar-toggle:hover {
  background-color: transparent
}

.navbar-default .navbar-toggle {
  margin: 0px;
  float: right;
}

.banner-container,
.breadcrumb {
  margin-top: 15px
}

.navbar-default span.sr-only {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
  float: right;
  margin-left: 25px;
  margin-bottom: 0;
  line-height: 16px
}

.grid-tile1,
.grid-tile2,
.grid-tile3,
.grid-tile4 {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 4
}

.breadcrumb,
.mb15,
.pre-contetn {
  margin-bottom: 15px
}

.vertical-menu.navbar-nav>li {
  float: none
}

.banner {
  text-align: center
}

.banner-container-wrap {
  padding: 0
}

select.clearstyle,
select.clearstyle:focus,
select.clearstyle:hover {
  border: none;
  background-color: transparent;
  box-shadow: none;
  outline: 0
}

.dnone {
  display: none
}

.inline-block {
  display: inline-block
}

.bs3.radius_none .inputbox,
.radius_none .chzn-container-single .chzn-single {
  border-radius: 0
}

.tmpl-bordercolor {
  border: 1px solid
}

.pd15 {
  padding: 15px
}

.mt50,
.top50 {
  margin-top: 50px
}

img {
  max-width: 100%
}

.row-fw {
  padding-top: 40px;
  padding-bottom: 40px
}

.grey-text {
  color: #646464
}

.section.main {
  margin-top: 0;
  margin-bottom: 15px
}

section.section.main .container {
  background-color: #fff;
  padding-top: 15px
}

.post-parallax,
.pre-parallax {
  border-bottom: none;
  padding-top: 90px;
  padding-bottom: 90px
}

.pre-parallax {
  background: url(../../images/parallax-pre.jpg) no-repeat fixed
}

.post-parallax {
  background: url(../../images/parallax-post.jpg) no-repeat fixed
}

footer {
  color: #6f7375
}

.grid-tile1 {
  background: url(../../images/gridtile.png)
}

.grid-tile2 {
  background: url(../../images/gridtile_3x3.png)
}

.grid-tile3 {
  background: url(../../images/gridtile_white.png)
}

.grid-tile4 {
  background: url(../../images/gridtile_3x3_white.png)
}

.site-up {
  display: none;
  position: fixed;
  cursor: pointer;
  bottom: 10px;
  right: 10px;
  color: #888;
  opacity: .8;
  z-index: 10
}

.error.jumbotron {
  border: 1px solid #ccc
}

.error-404 {
  background-color: #fff;
  font-size: 48px !important;
  color: #444;
  border: 3px solid red;
  border-radius: 50%;
  display: inline-block;
  padding: 50px;
  box-shadow: 0 0 10px #999
}

.alert-notice {
  background-color: #d9edf7;
  border-color: #bce8f1;
  color: #31708f
}

.badge a {
  color: #fff;
  text-decoration: none
}

.custom-login {
  background: #fbfbfb;
  padding: 15px
}

.form-control.invalid {
  border: 1px solid #f80
}

.alert-error {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1
}

footer a,
footer a:focus,
footer a:hover {
  color: #206d8a
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s
}

.animated.bounceIn,
.animated.bounceOut,
.animated.flipOutX,
.animated.flipOutY {
  -webkit-animation-duration: .75s;
  animation-duration: .75s
}

.form-control.g-recaptcha {
  border: none;
  background-color: transparent;
  box-shadow: none;
  width: inherit;
  height: inherit;
  padding: inherit;
  font-size: inherit;
  line-height: inherit;
  display: inherit
}

@-webkit-keyframes bounce {

  20%,
  53%,
  80%,
  from,
  to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(.755, .050, .855, .060);
    animation-timing-function: cubic-bezier(.755, .050, .855, .060);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0)
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(.755, .050, .855, .060);
    animation-timing-function: cubic-bezier(.755, .050, .855, .060);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0)
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0)
  }
}

@keyframes bounce {

  20%,
  53%,
  80%,
  from,
  to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(.755, .050, .855, .060);
    animation-timing-function: cubic-bezier(.755, .050, .855, .060);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0)
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(.755, .050, .855, .060);
    animation-timing-function: cubic-bezier(.755, .050, .855, .060);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0)
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0)
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom
}

@-webkit-keyframes bounceIn {

  20%,
  40%,
  60%,
  80%,
  from,
  to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1)
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3)
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1)
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9)
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03)
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97)
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1)
  }
}

@keyframes bounceIn {

  20%,
  40%,
  60%,
  80%,
  from,
  to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1)
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3)
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1)
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9)
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03)
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97)
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1)
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn
}

@-webkit-keyframes bounceInDown {

  60%,
  75%,
  90%,
  from,
  to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1)
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0)
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0)
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0)
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0)
  }

  to {
    -webkit-transform: none;
    transform: none
  }
}

@keyframes bounceInDown {

  60%,
  75%,
  90%,
  from,
  to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1)
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0)
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0)
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0)
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0)
  }

  to {
    -webkit-transform: none;
    transform: none
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown
}

@-webkit-keyframes bounceInLeft {

  60%,
  75%,
  90%,
  from,
  to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1)
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0)
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0)
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0)
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0)
  }

  to {
    -webkit-transform: none;
    transform: none
  }
}

@keyframes bounceInLeft {

  60%,
  75%,
  90%,
  from,
  to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1)
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0)
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0)
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0)
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0)
  }

  to {
    -webkit-transform: none;
    transform: none
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft
}

@-webkit-keyframes bounceInRight {

  60%,
  75%,
  90%,
  from,
  to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1)
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0)
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0)
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0)
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0)
  }

  to {
    -webkit-transform: none;
    transform: none
  }
}

@keyframes bounceInRight {

  60%,
  75%,
  90%,
  from,
  to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1)
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0)
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0)
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0)
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0)
  }

  to {
    -webkit-transform: none;
    transform: none
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight
}

@-webkit-keyframes bounceInUp {

  60%,
  75%,
  90%,
  from,
  to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1)
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0)
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0)
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0)
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0)
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
  }
}

@keyframes bounceInUp {

  60%,
  75%,
  90%,
  from,
  to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1)
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0)
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0)
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0)
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0)
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

@keyframes fadeIn {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown
}

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft
}

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight
}

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp
}

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig
}

.animation-d1 {
  -webkit-animation-duration: .5s;
  -webkit-animation-delay: 1s;
  animation-duration: .5s;
  animation-delay: 1s
}

.animation-d2 {
  -webkit-animation-duration: 1.5s;
  -webkit-animation-delay: .1s;
  animation-duration: 1.5s;
  animation-delay: .1s
}

.animation-d3 {
  -webkit-animation-duration: .5s;
  -webkit-animation-delay: .5s;
  animation-duration: .5s;
  animation-delay: .1s
}

::-webkit-scrollbar {
  width: 12px
}

::-webkit-scrollbar-track {
  background: #e6e6e6
}

::-webkit-scrollbar-thumb {
  background: #ccc
}

::-webkit-scrollbar-thumb:window-inactive {
  background: #ccc
}

@media (max-width:1170px) {
  .container-fluid {
    width: auto !important
  }

  .fluid-style .image_middle img[id^=main_image_] {
    width: auto
  }
}

@media (min-width:768px) and (max-width:992px) {

  .top-brand-search-cart .top-address,
  .top-brand-search-cart .top-brand,
  .top-brand-search-cart .top-cart,
  .top-brand-search-cart .top-compare,
  .top-brand-search-cart .top-search,
  .top-brand-search-cart .top-wishlist {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .logo-header {
    text-align: center
  }

  .top-navigation,
  .top-navigation .navbar-brand {
    float: none !important
  }

  .navbar-nav.brooksus_bs3 li a {
    padding: 6px 10px;
    font-size: 12px
  }
}

@media (max-width:768px) {
  .brooksite-header {
    position: relative !important
  }

  .page-wrapper {
    margin-top: 0 !important
  }

  .top-brand-search-cart .top-address,
  .top-brand-search-cart .top-brand,
  .top-brand-search-cart .top-cart,
  .top-brand-search-cart .top-compare,
  .top-brand-search-cart .top-search,
  .top-brand-search-cart .top-wishlist {
    padding-top: 10px;
    padding-bottom: 10px;
    width: 50%;
    transform: scale(0.8);
  }

  .navbar-collapse {
    padding-left: 15px;
    padding-right: 15px
  }
}

/**Line Style**/

body,
.nav *.fa {
  font-family: "Roboto", sans-serif;
}

@font-face {
  font-family: Roboto;
  src: local("Roboto Thin"), local("Roboto-Thin"), url(../fonts/Robotothin.woff2) format("woff2"), url(../fonts/Robotothin.woff) format("woff"), url(../fonts/Robotothin.ttf) format("truetype");
  font-weight: 100;
  font-style: normal
}

@font-face {
  font-family: Roboto;
  src: local("Roboto Thin Italic"), local("Roboto-ThinItalic"), url(../fonts/Robotothinitalic.woff2) format("woff2"), url(../fonts/Robotothinitalic.woff) format("woff"), url(../fonts/Robotothinitalic.ttf) format("truetype");
  font-weight: 100;
  font-style: italic
}

@font-face {
  font-family: Roboto;
  src: local("Roboto Light"), local("Roboto-Light"), url(../fonts/Robotolight.woff2) format("woff2"), url(../fonts/Robotolight.woff) format("woff"), url(../fonts/Robotolight.ttf) format("truetype");
  font-weight: 300;
  font-style: normal
}

@font-face {
  font-family: Roboto;
  src: local("Roboto Light Italic"), local("Roboto-LightItalic"), url(../fonts/Robotolightitalic.woff2) format("woff2"), url(../fonts/Robotolightitalic.woff) format("woff"), url(../fonts/Robotolightitalic.ttf) format("truetype");
  font-weight: 300;
  font-style: italic
}

@font-face {
  font-family: Roboto;
  src: local("Roboto"), local("Roboto-Regular"), url(../fonts/Roboto.woff2) format("woff2"), url(../fonts/Roboto.woff) format("woff"), url(../fonts/Roboto.ttf) format("truetype");
  font-weight: 400;
  font-style: normal
}

@font-face {
  font-family: Roboto;
  src: local("Roboto Italic"), local("Roboto-Italic"), url(../fonts/Robotoitalic.woff2) format("woff2"), url(../fonts/Robotoitalic.woff) format("woff"), url(../fonts/Robotoitalic.ttf) format("truetype");
  font-weight: 400;
  font-style: italic
}

@font-face {
  font-family: Roboto;
  src: local("Roboto Medium"), local("Roboto-Medium"), url(../fonts/Robotomedium.woff2) format("woff2"), url(../fonts/Robotomedium.woff) format("woff"), url(../fonts/Robotomedium.ttf) format("truetype");
  font-weight: 500;
  font-style: normal
}

@font-face {
  font-family: Roboto;
  src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), url(../fonts/Robotomediumitalic.woff2) format("woff2"), url(../fonts/Robotomediumitalic.woff) format("woff"), url(../fonts/Robotomediumitalic.ttf) format("truetype");
  font-weight: 500;
  font-style: italic
}

@font-face {
  font-family: Roboto;
  src: local("Roboto Bold"), local("Roboto-Bold"), url(../fonts/Robotobold.woff2) format("woff2"), url(../fonts/Robotobold.woff) format("woff"), url(../fonts/Robotobold.ttf) format("truetype");
  font-weight: 700;
  font-style: normal
}

@font-face {
  font-family: Roboto;
  src: local("Roboto Bold Italic"), local("Roboto-BoldItalic"), url(../fonts/Robotobolditalic.woff2) format("woff2"), url(../fonts/Robotobolditalic.woff) format("woff"), url(../fonts/Robotobolditalic.ttf) format("truetype");
  font-weight: 700;
  font-style: italic
}

@font-face {
  font-family: Roboto;
  src: local("Roboto Black"), local("Roboto-Black"), url(../fonts/Robotoblack.woff2) format("woff2"), url(../fonts/Robotoblack.woff) format("woff"), url(../fonts/Robotoblack.ttf) format("truetype");
  font-weight: 900;
  font-style: normal
}

@font-face {
  font-family: Roboto;
  src: local("Roboto Black Italic"), local("Roboto-BlackItalic"), url(../fonts/Robotoblackitalic.woff2) format("woff2"), url(../fonts/Robotoblackitalic.woff) format("woff"), url(../fonts/Robotoblackitalic.ttf) format("truetype");
  font-weight: 900;
  font-style: italic
}

body {
  background-color: #ffffff
}

body.body-bg {
  background: url(../img/glyphicons-halflings-white (22).png) no-repeat center top fixed
}

.color1-bg {
  background-color: #ffffff;
}

.color2-bg {
  background-color: #575454;
}

a,
.tmpl-color,
.pagination>li>a,
.pagination>li>span,
.navbar .navbar-nav>.active>a,
.navbar .navbar-nav>li>a:hover,
.navbar .navbar-nav>li>a:focus,
.navbar .navbar-nav>.active>a:hover,
.navbar .navbar-nav>.active>a:focus,
.dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus,
.dropdown-menu>.active>a,
.dropdown-menu>.active>a:hover,
.dropdown-menu>.active>a:focus,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu>li>a:hover,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu>li>a:focus,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu>.active>a,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu>.active>a:hover,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu>.active>a:focus {
  color: #206d8a;
  background-color: transparent;
  transition: all 0.7s linear;
}

header,
.brooksus_bs3 .dropdown-menu,
.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus,
.navbar.top-navigation ul li:hover,
.navbar.top-navigation ul li:focus,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu ul li a:hover,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu ul li a:focus,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu .active>a,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu .active>a:hover,
.tmpl-bgcolor .navbar.navbar-default .dropdown-menu .active>a:focus,
.tmpl-bordercolor {
  border-color: #206d8a;
}

.tmpl-bgcolor,
.top-navbar-wrap .moduletable.tmpl-bgcolor,
.fluid-navbar .top-navbar-wrap .moduletable,
.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus {
  background-color: #1392c1;
}

.top-brand .logo {
  max-height: 50px;
  max-width: 76px;
  margin-top: 5px;
}

.affix .navbar-header img.logo-image {
  display: inline-block;
  max-width: 50px;
  margin: 2px 5px 0 5px;
  vertical-align: middle;
}

.white-bg-container .page-content-wrapper:before {
  content: '';
  background: #f5f5f5;
  /* width: 1300px;*/
  width: auto;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: -1;
}

.moduletable1 {
  clear: both;
  border: 1px solid #CCCCCC;
  border-top: none;
  opacity: 1;
  max-height: 2000px;
  -webkit-transition: opacity .5s ease-out, max-height .5s ease-out;
  transition: opacity .5s ease-out, max-height .5s ease-out;
  margin: 0;
}

.top-brand .name {
  font-size: 37px;
  font-weight: 700;
  max-width: 90px;
  padding: 0;
}

.top-brand .slogan {
  display: block;
  font-size: 10px;
  font-weight: 400;
  text-transform: uppercase;
  /* font-size: 10px; */
  line-height: 16px;
  /* height: 100px; */
  width: 145px;
  margin-top: 5px;
}

.nav-header {
  margin-left: 0px;
  padding: 5px 78px 5px 78px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  font-size: 16px;
  font-weight: 400;
  text-transform: uppercase;
  font-weight: bold;
  background: #0891d5;
  color: #ffffff;
  display: flex;
}

.navbar-flat .navbar-nav.brooksus_bs3 li a {
  font-size: 13px;
  font-weight: 300;
  padding: 10px;
  border-top: 1px solid #ebebeb;
  display: table;
  table-layout: fixed;
  width: 100%;
  color: #000000;
}

.banneritem {
  margin-top: 25px;
  /* box-shadow: 3px 0px 3px 1px rgb(0 0 0 / 6%), 0 3px 5px rgb(1 1 1 / 10%);*/
  padding: 5px;
  border: 1px solid #eeeeee;

}

.alert-message {
  color: #000000;
  background-color: #ffffff;
  /* border-color: #d6e9c6; */
  padding: 15px;

}

.vopros {
  padding: 5px;

  text-align: center;
  font-weight: bold;
}

.banneritem_text {
  margin-top: 25px;
  /* box-shadow: 3px 0px 3px 1px rgb(0 0 0 / 6%), 0 3px 5px rgb(1 1 1 / 10%); */
  /* padding: 10px; */
  /* background: #f3f3f3; */
}

.katal-head {
  padding: 10px;
  background: #e1e1e14a;
  font-weight: bolder;
  /*margin-top: 20px;*/
}

.filter_head {
  background: #e1e1e14a;

  margin-top: 0px;
  padding: 10px;

}

.custom_poleznoe1 {
  padding: 10px;
}

.navbar-default span.sr-only {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
  float: right;
  /* margin-left: 41px; */
  margin-bottom: 0;
  line-height: 40px;
  padding-top: 6px;
  padding-left: 20px;
  height: 40px;
  padding: 0px 0px -1px 0px;
  height: 51px;
  font-weight: 300;
}

.moduletable_filter {
  margin-top: 20px;
}

.moduletable_poleznoe1 {
  margin-top: 20px;
  border: 1px solid #eeeeee;
}

.navbar-toggle .icon-bar {
  display: block;
  width: 26px;
  height: 1.5px;
  /* border-radius: 1px; */
  background-color: #ffffff;
  margin-top: 16px;
}

@media screen and (max-width: 700px) {
  .top-brand .name {
    font-size: 40px;
    font-weight: 700;
    max-width: 90px;
    padding: 0;
    transform: scale(1);
  }

  .top-brand-search-cart .top-brand {
    margin-top: 16px;
    transform: scale(1);
  }

  .top-brand-search-cart .top-search {
    margin-top: -25px;
    transform: scale(0.75);
  }

  .top-address {
    float: right;
    margin-top: -55px;
    margin-bottom: -25px;
  }

  .banneritem {
    display: none;
  }

  .bannergroup_banners {
    display: none;
  }

  .moduletable_poleznoe1 {
    display: none;
  }

  .moduletable_menu {
    display: none;
  }

}

a:active,
a:focus {
  outline: 0;
  border: none;
  -moz-outline-style: none;
}