

.country-page .page-header .icon--globe{
  margin-right:5px
}
.country-page .page-header+section{
  margin-bottom:40px
}
.country-page .section-header{
  text-transform:uppercase;
  padding-bottom:4px;
  font-weight:bold;
  border-bottom:1px solid #d9d9d9;
  margin-bottom:20px
}
.country-page .locale-wrapper a,.country-page .countries-list li a{
  font-size:14px;
  font-weight:normal;
  text-decoration:none;
  padding-left:4px;
  padding-right:4px;
  border-left:1px solid #666b6e;
  display:inline
}
.country-page .locale-wrapper a:first-of-type,.country-page .countries-list li a:first-of-type{
  font-weight:bold;
  border-left:none;
  padding-left:0
}
.country-page ul.countries-list{
  list-style-type:none;
  padding-left:0;
  margin-bottom:0
}
.country-page ul.countries-list li{
  padding:8px 0;
  width:33.33333%;
  float:left;
  line-height:1rem
}
@media all and (max-width:767px){
  .country-page ul.countries-list li{
    display:block;
    width:100%;
    float:none
  }
}
.country-page ul.countries-list li:after{
  content:'';
  display:table;
  clear:both
}
.country-page ul.countries-list li a{
  line-height:1rem;
  text-decoration:none
}
@media all and (max-width:769px){
  .country-page ul.countries-list li a{
    display:inline;
    float:none
  }
}
.country-page ul.countries-list li a:hover{
  text-decoration:none;
  color:#f196c6
}
.country-page ul.countries-list:after{
  content:'';
  display:table;
  clear:both
}
@media(min-width:768px){
  .body-container-wrapper-wrapper{
    padding:30px;
    position:relative
  }
}
.selectbox-list-box.language-select-list{
  max-height:100%;
  background-color:#e1e3e4;
  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  border:1px solid #6a6c6b;
  border-top:1px solid #e1e3e4
}
.selectbox-list-box.language-select-list li.selectbox-list-item{
  text-transform:uppercase;
  white-space:nowrap;
  padding:0
}
.selectbox-list-box.language-select-list li.selectbox-list-item [data-lang-icon]{
  display:flex;
  align-items:center
}
.selectbox-list-box.language-select-list li.selectbox-list-item [data-lang-icon] img{
  max-height:12px;
  margin-right:4px
}
.selectbox-list-box.language-select-list li.selectbox-list-item:hover{
  background:none
}
.selectbox-list-box.language-select-list li.selectbox-list-item:hover a{
  color:#f196c6
}
.selectbox-list-box.language-select-list li.selectbox-list-item a{
  display:block;
  width:100%;
  padding-top:5px;
  padding-bottom:5px;
  padding-left:5px;
  text-decoration:none
}
.selectbox-list-box.language-select-list li.selectbox-list-item a[data-lang-icon]{
  padding:5px
}
.selectbox-list-box.language-select-list .selectbox-list{
  font-size:12px;
  padding-top:0;
  margin-bottom:0
}
.language-switch{
  display:inline-flex
}
.language-switch.language-switch--w-icons .languages .selectbox{
  min-width:80px!important
}
.language-switch .languages{
  margin-left:30px
}
@media all and (max-width:769px){
  .language-switch .languages{
    margin-left:10px
  }
}
.language-switch .languages .selectbox{
  border:1px solid #6a6c6b;
  min-width:53px!important;
  border-radius:3px;
  display:inline-block
}
.language-switch .languages .selectbox.state-focus{
  background-color:#e1e3e4;
  border-bottom:1px solid #e1e3e4;
  border-bottom-left-radius:0;
  border-bottom-right-radius:0
}
.language-switch .languages .selectbox-button,
.language-switch .languages .language-select a{
  display:flex;
  align-items:center;
  font-weight:bold;
  cursor:pointer;
  position:relative;
  padding:5px;
  text-transform:uppercase;
  font-size:12px;
  line-height:18px;

}
.language-switch .languages .selectbox-button[data-lang-icon] img{
  max-height:12px;
  margin-right:4px
}
.language-switch .languages .selectbox-button:focus{
  outline:none
}

.language-switch .languages .language-select{
   cursor: pointer; 
}

.language-switch .languages .language-select a{
  color: #666b6e !important;
  font-size: 12px;
}

.language-switch .languages .language-select a:hover{
  background-color: #e8e8e8;
}

.language-switch .languages .selectbox-button .icon.icon--arrow-down{
  margin-left:auto;
  margin-right:3px
}
.language-switch .languages .icon.icon--arrow-down{
  font-size:10px;
  line-height:0;
  margin-left:20px;
  display:inline-block;
  cursor:pointer
}
a .language{
  font-size:.9rem;
  float:left;
  color:#666b6e;
  margin-left:5px;
  padding:1px 4px;
  border:1px solid transparent;
  text-transform:uppercase
}
a .language:hover{
  color:#fff;
  background-color:#f196c6
}
a .language.selected{
  border:1px solid #666b6e
}
.global-website{
  text-decoration:none;
  color:#666b6e
}
.global-website span.content-text{
  font-size:12px;
  padding:0 5px
}
.global-website .icon--arrow-down{
  font-size:10px
}
.global-website:hover{
  color:#f196c6
}
.off-canvas-menu .language-switch{
  position:absolute;
  top:30px;
  right:30px
}
@media(max-width:285px){
  .language-switch{
    flex-direction:column;
    align-items:flex-end
  }
}
@media(min-width:1280px)and (max-width:1300px){
  .language-switch .languages{
    margin-left:0
  }
}
.off-canvas-backdrop{
  position:fixed;
  width:100%;
  height:100%;
  z-index:19;
  background-color:rgba(255,255,255,0);
  display:none
}
.off-canvas-menu{
  position:fixed;
  z-index:20;
  top:0;
  left:0;
  width:0;
  height:100vh;
  overflow-y:hidden;
  overflow-x:hidden;
  background-color:#fff;
  -webkit-transform:translateX(-101%);
  -moz-transform:translateX(-101%);
  -ms-transform:translateX(-101%);
  -o-transform:translateX(-101%);
  transform:translateX(-101%)
}
.off-canvas-menu.loaded{
  padding:80px 0 0;
  width:33%;
  overflow-x:visible;
  transition:transform 600ms ease-in-out,width 100ms ease-in-out 600ms;
  -webkit-transform:translateX(-101%);
  -moz-transform:translateX(-101%);
  -ms-transform:translateX(-101%);
  -o-transform:translateX(-101%);
  transform:translateX(-101%)
}
.off-canvas-menu.loaded.open{
  -webkit-transform:translateX(0);
  -moz-transform:translateX(0);
  -ms-transform:translateX(0);
  -o-transform:translateX(0);
  transform:translateX(0);
  box-shadow:3px 0 5px -2px #ccc;
  transition:transform 600ms ease-in-out
}
.off-canvas-menu.loaded.open+.off-canvas-backdrop{
  display:block
}
.off-canvas-menu .menu-wrapper{
  overflow-y:auto;
  height:100%;
}
@media(min-width:0){
  .off-canvas-menu.loaded.open{
    width:100%
  }
}
@media(min-width:640px){
  .off-canvas-menu.loaded.open{
    width:50%
  }
}
@media(min-width:769px){
  .off-canvas-menu.loaded.open{
    width:50%
  }
}
@media(min-width:1280px){
  .off-canvas-menu.loaded.open{
    width:25%
  }
}
.menu-icon{
  position:fixed;
  top:30px;
  left:30px;
  z-index:13;
  cursor:pointer;
  width:30px;
  height:22px;
  -webkit-transition:opacity .3s ease,z-index .3s ease;
  -moz-transition:opacity .3s ease,z-index .3s ease;
  -ms-transition:opacity .3s ease,z-index .3s ease;
  -o-transition:opacity .3s ease,z-index .3s ease;
  transition:opacity .3s ease,z-index .3s ease
}
.modal-shown .menu-icon{
  z-index:0
}
.menu-icon .bar{
  position:relative;
  display:block;
  height:2px;
  width:30px;
  background-color:#666b6e;
  -webkit-transition:all .3s ease;
  -moz-transition:all .3s ease;
  -ms-transition:all .3s ease;
  -o-transition:all .3s ease;
  transition:all .3s ease
}
.menu-icon .middle{
  margin:8px auto
}
.menu-icon.close{
  position:fixed;
  z-index:1000
}
.menu-icon.close .top{
  -webkit-transform:translateY(10px) rotateZ(45deg);
  -moz-transform:translateY(10px) rotateZ(45deg);
  -ms-transform:translateY(10px) rotateZ(45deg);
  -o-transform:translateY(10px) rotateZ(45deg);
  transform:translateY(10px) rotateZ(45deg)
}
.menu-icon.close .bottom{
  -webkit-transform:translateY(-10px) rotateZ(-45deg);
  -moz-transform:translateY(-10px) rotateZ(-45deg);
  -ms-transform:translateY(-10px) rotateZ(-45deg);
  -o-transform:translateY(-10px) rotateZ(-45deg);
  transform:translateY(-10px) rotateZ(-45deg)
}
.menu-icon.close .middle{
  width:0
}
.menu-icon .menu-text{
  opacity:0;
  font-size:14px;
  margin:2px 50% 0;
  -webkit-transform:translateX(-50%);
  -moz-transform:translateX(-50%);
  -ms-transform:translateX(-50%);
  -o-transform:translateX(-50%);
  transform:translateX(-50%);
  display:inline-block;
  word-break: keep-all;
}
.menu-icon:hover .menu-text{
  opacity:1;
  color:inherit
}
@media(max-width:640px){
  .menu-icon{
    left:20px;
    top:22px
  }
}
.container-fluid{
  height:100%;
  width:100%
}
.body-container-wrapper{
  position:relative;
  overflow:auto;
  overflow-x:hidden;
  z-index:auto
}
.modal-shown .body-container-wrapper{
  z-index:10
}
.page-wrapper{
  left:0;
  position:relative;
  transition:all 600ms ease-in-out
}
.page-wrapper .body-container-wrapper{
  width:100%;
  background-color:#fff
}
.page-wrapper.toggled{
  left:33%;
  background:#000
}
.page-wrapper.toggled footer,
.page-wrapper.toggled .body-container-wrapper,.page-wrapper.toggled header{
  opacity:.5
}
.page-wrapper.toggled .header-nav{
  display:none
}
.page-wrapper.modal-open .body-container-wrapper{
  overflow:hidden;
  height:0;
  padding:0
}
.stage{
  background-color:grey;
  width:100%;
  height:100vh
}
.content-area,.p-stage__slide-inner{
  max-width:1280px;
  margin:0 auto;
  padding-top:85px
}
.content-area::after,.p-stage__slide-inner::after{
  content:'';
  display:block;
  clear:both
}
.body-container-wrapper-wrapper{
  width:100vw;
  margin:0 auto;
  position:relative
}
@media(min-width:0){
  .page-wrapper.toggled{
    left:0
  }
}
@media(min-width:640px){
  .page-wrapper.toggled{
    left:50%
  }
}
@media(min-width:768px){
  .body-container-wrapper-wrapper{
    padding:30px
  }
}
@media(max-width:767px){
  .body-container-wrapper-wrapper{
    padding:15px
  }
}
@media(max-width:641px){
  .content-area,.p-stage__slide-inner{
    margin:0 20px
  }
}
@media(min-width:1280px){
  .page-wrapper.toggled{
    left:25%
  }
}
@media(max-width:1280px)and (min-width:641px){
  .content-area,.p-stage__slide-inner{
    margin:0 30px 0
  }
}
header{
  position:fixed;
  z-index:10;
  left:0;
  height:85px;
  display:flex;
  align-items:center;
  width:100%;
  top:0;
  transform:translate3d(0,0,0);
  pointer-events:none
}
header a{
  pointer-events:all
}
@media(max-width:640.98px){
  header{
    height:68px
  }
}
.modal-shown header{
  z-index:0
}
header .header-logo{
  position:absolute;
  right:30px;
  top:22px;
  width:114px
}
@media(max-width:640.98px){
  header .header-logo{
    right:20px;
    top:17px;
    width:97px
  }
}
header .header-logo>a{
  display:block
}
header .header-logo>a svg{
  max-height:42px
}
@media(max-width:640.98px){
  header .header-logo>a svg{
    max-height:37px
  }
}
header .breadcrumbs{
  display:none
}
header.sticky{
  background-color:#fff;
  -webkit-box-shadow:0 0 5px 3px #999;
  -moz-box-shadow:0 0 5px 3px #999;
  box-shadow:0 0 5px 3px #999
}
header.sticky:after{
  background-color:#fff;
  -webkit-box-shadow:0 0 0 10px rgba(255,255,255,.5);
  -moz-box-shadow:0 0 0 10px rgba(255,255,255,.5);
  box-shadow:0 0 0 10px rgba(255,255,255,.5);
  content:"";
  width:100%;
  position:absolute;
  bottom:0;
  left:0;
  -webkit-transform:translateY(-100%);
  -moz-transform:translateY(-100%);
  -ms-transform:translateY(-100%);
  -o-transform:translateY(-100%);
  transform:translateY(-100%)
}
header.sticky ul.breadcrumbs{
  display:block
}
.header-nav{
  position:fixed;
  top:0;
  left:0;
  z-index:12;
  padding-left:60px;
  height:85px;
  display:flex;
  justify-content:flex-start;
  align-items:center;
  flex-wrap:nowrap
}
.modal-shown .header-nav{
  z-index:0
}
@media(max-width:640.98px){
  .header-nav{
    padding-left:50px;
    height:68px
  }
}
.header-nav .header-nav__item{
  margin-left:10px
}
.header-nav .header-nav__item.account-icon{
  margin-bottom:2px
}
@media(max-width:640px){
  .header-nav .header-nav__item{
    margin-left:8px
  }
}
.header-nav .header-nav__item:first-child:not(.mega-menu-toggler){
  margin-left:20px
}
@media(max-width:640px){
  .header-nav .header-nav__item:first-child:not(.mega-menu-toggler){
    margin-left:16px
  }
}
.header-nav .header-nav__item+.mega-menu-toggler{
  margin-left:2px
}

.close{
  float:right;
  font-size:21px;
  line-height:1;
  color:#000;
  opacity:.2
}
.close:hover{
  -webkit-opacity:1;
  -khtml-opacity:1;
  -moz-opacity:1;
  opacity:1;
  -ms-filter:alpha(opacity=100);
  filter:alpha(opacity=100)
}


.navigation-menu>span>div>ul{
  margin:10px 0 0;
  padding:0;
  overflow-y:auto!important;
  width:100%;
  color:#666b6e;
  line-height:1.5rem
}
.navigation-menu>span>div>ul li{
  position:relative;
  border-bottom:1px solid #b5b9bb;
  cursor:pointer;
  padding-bottom:0;
  width: 100%;
}
.navigation-menu>span>div>ul li img{
  position:absolute;
  left:30px;
  top: 7px;
  max-width: 26px;
}
.navigation-menu>span>div>ul li a{
  display:block;
  color:#666b6e;
  padding:10px 40px 10px 7px;
  font-size:16px;
  transition:background-color .5s ease-out;
  -o-transition:background-color .5s ease-out;
  -moz-transition:background-color .5s ease-out;
  -webkit-transition:background-color .5s ease-out;
  line-height:1.4rem;
  text-transform:uppercase;
  text-decoration:none;
  padding-left: 60px;
}
.navigation-menu>span>div>ul li a:hover{
  background-color:#f196c6;
  text-decoration:none;
  color:#fff
}
.navigation-menu>span>div>ul li .icon{
  font-size:10px;
  position:absolute;
  top:0;
  right:0;
  display:block;
  height:40px;
  width:40px
}
.navigation-menu>span>div>ul li .icon::before{
  position:absolute;
  top:13px;
  right:15px;
  transition:transform 300ms ease
}
.navigation-menu>span>div>ul li.active>a{
  color:#f196c6
}
.navigation-menu>span>div>ul li.active>a:hover,.navigation-menu>span>div>ul li.active>a:focus{
  color:#fff
}
.navigation-menu>span>div>ul li.opened>.icon::before{
  -webkit-transform:rotate(45deg);
  -moz-transform:rotate(45deg);
  -ms-transform:rotate(45deg);
  -o-transform:rotate(45deg);
  transform:rotate(45deg)
}
.navigation-menu>span>div>ul li.opened.active>.icon::before{
  color:#f196c6
}
.navigation-menu>span>div>ul li>ul{
  padding:0;
  display:none;
  overflow:hidden;
  transition:max-height .2s ease-out;
  margin-bottom:0
}
.navigation-menu>span>div>ul li>ul li{
  border:none;
  font-weight:normal;
  padding-left:0;
  -webkit-transition:background-color 300ms ease;
  -moz-transition:background-color 300ms ease;
  -ms-transition:background-color 300ms ease;
  -o-transition:background-color 300ms ease;
  transition:background-color 300ms ease;
  width: 100%;
}

.navigation-menu>span>div>ul li>ul li{
  border-bottom: 1px solid #b5b9bb;
}

.navigation-menu>span>div>ul li>ul li a{
  padding:7px 40px 7px 7px;
  font-size:14px;
  padding-left: 60px !important;
}
.navigation-menu>span>div>ul li>ul li.opened{
  background-color:#f7f8f8
}
.navigation-menu>span>div>ul li>ul li ul li a{
  padding:7px 10px 7px 15px;
  text-transform:none
}
.navigation-menu>span>div>ul li>ul li ul li.opened{
  background-color:#f0f1f2
}
.navigation-menu>span>div>ul li>ul li ul li.opened>a{
  background-color:#f7f8f8;
}
.navigation-menu>span>div>ul li>ul li ul li.opened>a:hover,.navigation-menu>span>div>ul li>ul li ul li.opened>a:focus{
  background-color:#f196c6;
}
.navigation-menu>span>div>ul li>ul li ul li ul li a{
  padding:7px 10px 7px 25px;
}
.meta-navigation>span>div a{
  font-size:13px;
  text-transform:uppercase;
  color:#666b6e;
  text-decoration:none
}
.meta-navigation>span>div a:hover{
  color:#f196c6;
  text-decoration:underline
}
.meta-navigation>span>div ul{
  list-style-type:none;
  padding-left:0;
  padding-top:40px;
  display: block;
}
.meta-navigation>span>div ul li{
  padding:5px 0
}

.hs-menu-wrapper.hs-menu-flow-horizontal.flyouts> ul li.hs-item-has-children: hover> ul.hs-menu-children-wrapper {  
  opacity: 0;
  visibility: invisible;
} 

.hs-menu-wrapper.hs-menu-flow-horizontal.flyouts> ul li.hs-item-has-children.active> ul.hs-menu-children-wrapper {
  opacity: 1;
  visibility: visible;
}  

.country-page,.search-overlay,.installer-search-overlay,.product-modal{
  opacity:0;
  transition:opacity .25s ease-in-out;
  -moz-transition:opacity .25s ease-in-out;
  -webkit-transition:opacity .25s ease-in-out;
  z-index:4;
  position:fixed;
  display:none;
  background-color:#fff;
  min-height:100vh;
  top:0;
  width:100%;
  left:0;
  color:#666b6e;
  height:100%;
  overflow-y:auto
}
.country-page.up,.search-overlay.up,.installer-search-overlay.up,.product-modal.up{
  opacity:1;
  display:block;
  z-index:4000
}
.country-page .page-content-wrapper,.search-overlay .page-content-wrapper,.installer-search-overlay .page-content-wrapper,.product-modal .page-content-wrapper{
  margin:0 auto;
  width:100%;
  overflow:hidden
}
.country-page .main-container,.search-overlay .main-container,.installer-search-overlay .main-container,.product-modal .main-container{
  height:auto;
  padding-bottom:60px;
  margin:0 auto;
  max-width:1280px;
  overflow:hidden
}
.country-page .page-header,.search-overlay .page-header,.installer-search-overlay .page-header,.product-modal .page-header{
  text-align:center;
  font-size:24px;
  font-weight:bold
}
@media all and (max-width:767px){
  .country-page .page-header,.search-overlay .page-header,.installer-search-overlay .page-header,.product-modal .page-header{
    margin-top:55px;
    margin-bottom:50px
  }
}
.country-page .btn,.search-overlay .btn,.installer-search-overlay .btn,.product-modal .btn{
  margin-top:25px
}
.close-icon{
  position:absolute;
  right:15px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid #fff;
  border-radius:50%;
  background-color:#f196c6;
  height:40px;
  width:40px;
  box-shadow:2px 2px 12px #888;
  cursor:pointer;
  font-size:0
}
.close-icon .icon--close{
  color:#fff
}
.close-icon .icon--close:before{
  font-size:16px
}
.country-page section,.search-overlay section{
  margin-bottom:70px
}
.installer-search-overlay,.search-overlay{
  min-height:auto!important
}



.header-breadcrumb ul{
  margin: 0 auto;
  padding: 0;
  max-width: 60%;
  text-align: center; 
}
.header-breadcrumb li{
  list-style: none;
  display: inline;
}

.header-breadcrumb  a,
.header-breadcrumb  span{

  font-size: 12px;
  text-transform: uppercase;
  text-decoration: none;
  color: #666b6e;
}  

.breadcrumb-menu-divider:before{
  content:'›';
  color:#666b6e;
  font-size: 18px;
  margin-left: 8px;
}

@media(max-width:768px){
  .header-breadcrumb{
    display: none;
  }
  
  header,
  .menu-icon,
  .header-nav{
    position: absolute !important;
  }
  
  .menu-icon.close{
    position: fixed !important;
  }
}


.off-canvas-menu .menu-wrapper::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 5px rgba(98,134,164,0.3);
	background-color: #F5F5F5;
}

.off-canvas-menu .menu-wrapper::-webkit-scrollbar
{
	width: 5px;
	background-color: #F5F5F5;
}

.off-canvas-menu .menu-wrapper::-webkit-scrollbar-thumb
{
	background-color: rgb(98,134,164);
	border: 2px solid #F5F5F5;
}
