@import url('https://fonts.googleapis.com/css?family=Comfortaa:300,400,700|Lato:400,700|Open+Sans+Condensed:300, 700&subset=latin-ext');
/* This stylesheet generated by Transfonter (http://transfonter.org) on February 9, 2017 2:20 PM */
/*
@font-face {
	font-family: 'Sansation';
	src: url('/font/SansationRegular.eot');
	src: url('/font/SansationRegular.eot?#iefix') format('embedded-opentype'),
		url('/font/SansationRegular.woff') format('woff'),
		url('/font/SansationRegular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Sansation';;
	src: url('/font/SansationBoldItalic.eot');
	src: url('/font/SansationBoldItalic.eot?#iefix') format('embedded-opentype'),
		url('/font/SansationBoldItalic.woff') format('woff'),
		url('/font/SansationBoldItalic.ttf') format('truetype');
	font-weight: bold;
	font-style: italic;
}

@font-face {
	font-family: 'Sansation';;
	src: url('/font/SansationLight.eot');
	src: url('/font/SansationLight.eot?#iefix') format('embedded-opentype'),
		url('/font/SansationLight.woff') format('woff'),
		url('/font/SansationLight.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: 'Sansation';;
	src: url('/font/SansationLightItalic.eot');
	src: url('/font/SansationLightItalic.eot?#iefix') format('embedded-opentype'),
		url('/font/SansationLightItalic.woff') format('woff'),
		url('/font/SansationLightItalic.ttf') format('truetype');
	font-weight: 300;
	font-style: italic;
}

@font-face {
	font-family: 'Sansation';;
	src: url('/font/SansationItalic.eot');
	src: url('/font/SansationItalic.eot?#iefix') format('embedded-opentype'),
		url('/font/SansationItalic.woff') format('woff'),
		url('/font/SansationItalic.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
}

@font-face {
	font-family: 'Sansation';;
	src: url('/font/SansationBold.eot');
	src: url('/font/SansationBold.eot?#iefix') format('embedded-opentype'),
		url('/font/SansationBold.woff') format('woff'),
		url('/font/SansationBold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}
*/
body {
    /*font-family: 'Open Sans Condensed', sans-serif;*/
    /*font-family: 'Sansation' ,sans-serif;*/
    /*font-family: 'Comfortaa', cursive;*/
    font-family: 'Open Sans Condensed', sans-serif;
    color: #13253e;
    font-size: 20px;
    font-weight: 300;
    line-height: 1.8em;    
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    /*font-family: 'Sansation', cursive;*/
    /*font-family: "myriad-pro",sans-serif;*/
    font-family: 'Comfortaa', cursive;
    font-weight: 400;
    color: #2a5491;
}
strong {
    font-weight: 700;
    /*color: #e16e75;*/
    color: #009dc1;
}
.footer strong {color: #666;}
.main-container ul, ol {
    /*color: #e16e75;*/
    color: #009dc1;
}
.main-container ul li *, .main-container ol li * {
    /*color: #13253e;*/
    color: #231f20;
    margin: 0;
}
.main-container ul li strong, .main-container ol li strong {
    color: #009dc1!important;
}
.main-container {overflow: hidden;}

/* X menu SUB */
.nav-hamburger-wrapper {
    float: right;
    height: 100%;
    background-color: transparent; 
    margin: 8px 15px 7px 15px;       
}
.nav-hamburger-wrapper:hover,
.nav-hamburger-wrapper:focus {
    background-color: #fff;
}
.nav-hamburger-wrapper .cell-vertical-wrapper {
    display: table;
    height: 100%;
    width: 100%;        
}
.nav-hamburger-wrapper .cell-vertical-wrapper .cell-middle {
    display: table-cell;
    vertical-align: middle;        
}
.nav-hamburger-wrapper .cell-vertical-wrapper .cell-middle .nav-hamburger {
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    display: block;
    position: relative;
    background: transparent;
    border: 0;
    padding: 0;
    outline: none;
    cursor: pointer;
    margin-top: auto;
    margin-bottom: auto;
    width: 40px;
    height: 50px;        
}
.nav-hamburger-wrapper .cell-vertical-wrapper .cell-middle .nav-hamburger span {
    display: block;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    background-color: #000;
    position: absolute;
    width: 100%;
    height: 2px;
    left: 0;
    top: 50%;
    overflow: hidden;
    text-indent: 200%;        
}
.nav-hamburger-wrapper:hover .cell-vertical-wrapper .cell-middle .nav-hamburger span,
.nav-hamburger-wrapper:focus .cell-vertical-wrapper .cell-middle .nav-hamburger span {
    /*background-color: #2071b6;*/
}
.nav-hamburger-wrapper .cell-vertical-wrapper .cell-middle .nav-hamburger:before, .nav-hamburger-wrapper .cell-vertical-wrapper .cell-middle .nav-hamburger:after {
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    background-color: #000;
    content: " ";
    display: block;
    position: absolute;
    top: 0;
    height: 2px;
    width: 40px;
    left: 0;
    top: 50%;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;        
}
.nav-hamburger-wrapper:hover .cell-vertical-wrapper .cell-middle .nav-hamburger:before, .nav-hamburger-wrapper:hover .cell-vertical-wrapper .cell-middle .nav-hamburger:after,
.nav-hamburger-wrapper:focus .cell-vertical-wrapper .cell-middle .nav-hamburger:before, .nav-hamburger-wrapper:focus .cell-vertical-wrapper .cell-middle .nav-hamburger:after {
    /*background-color: #2071b6;*/
}
.nav-hamburger-wrapper .cell-vertical-wrapper .cell-middle .nav-hamburger:before {
    -webkit-transform: translate3d(0, -12px, 0);
    transform: translate3d(0, -12px, 0);        
}
.nav-hamburger-wrapper .cell-vertical-wrapper .cell-middle .nav-hamburger:after {
    -webkit-transform: translate3d(0, 12px, 0);
    transform: translate3d(0, 12px, 0);       
}
.nav-hamburger-wrapper .cell-vertical-wrapper .cell-middle .nav-hamburger.shown:before {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);        
}
.nav-hamburger-wrapper .cell-vertical-wrapper .cell-middle .nav-hamburger.shown span {opacity: 0;}
.nav-hamburger-wrapper .cell-vertical-wrapper .cell-middle .nav-hamburger.shown:after {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);        
}   
a, a:visited {
    text-decoration: none;
    outline: 0;
    -webkit-transform: translateZ(0);
    -webkit-transition: 0.2s color linear;
    -moz-transition: 0.2s color linear;
    transition: 0.2s color linear;
} 
#navbar {
    position: fixed;
    top: 0;
    left:0;
    right:0;
    margin:0;
    border:0;
    background-color: rgba(255,255,255,1);
    height: 65px;
    width: 100%;
    box-shadow: 0 0 3px #999;
    border-radius: 0;
}
#navbar .logo {
    margin: 10px 0;
    padding: 0;
}
.navbar-header {width: 100%;}
.menu-main {
    margin: 10px 0;
    /*font-family: 'Sansation', cursive;*/
    /*font-family: "myriad-pro",sans-serif;*/
    font-family: 'Comfortaa', cursive;
}
.menu-main > li {
    float:left;
}
.menu-main > li > a {
    position: relative;
    color: #231f20;
    padding: 13px 15px 12px;
    margin: 0;
    text-transform: uppercase;
    font-weight: 600;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    font-size: 14px;
    line-height: 20px;    
    -webkit-transition: all 0.35s;
    -o-transition: all 0.35s;
    transition: all 0.35s; 
}
.menu-main > li > a:before {
    background: #009dc1 none repeat scroll 0 0;
    content: "";
    height: 0;
    left: 0;
    position: absolute;
    bottom: 0;
    transition: all 200ms ease-in-out 0s;
    width: 100%;
    z-index: 1;
}

.menu-main > li > a:hover:before, .menu-main > li > a:focus:before {
    opacity: 1;
    filter: alpha(opacity=100);
    height: 3px;
}
.nav>li>a:focus, .nav>li>a:hover, .nav>li>a.active {
    background-color: transparent;
    color: #009dc1;
}

.nav>li>a.fb-icon:hover:before {
  height: 0;
}

.dropdown-menu {
    padding: 10px 0;
    background: #fff;
    min-width: 250px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;    
    right: 0; 
    z-index: 999;
    border: none;
    display: block;
    visibility:hidden;
    opacity: 0;
    transition: 0.3s;    
}

@media (max-width: 768px) {
  .dropdown-menu {
    display: none;
  }
}

.open>.dropdown-menu {
  opacity: 1;
  visibility:visible;
}

.dropdown-menu li {
    display: block;
    padding: 0;    
}
.dropdown-menu li a {
    min-height: inherit;
    display: block;
    font-weight: 400;
    padding: 5px 15px;
    color: #2a5491;
    text-transform: none;
    -webkit-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    font-size: 14px;    
}
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {
    color: #e16e75;
    text-decoration: none;
    background-color: transparent;
}
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {
    background-color: transparent;
    border-color: #fff;
}
.dropdown-menu li a.promoted {
    font-weight: bold;
    font-size: 16px;
    border-right: 5px solid #2a5491;    
}
body {
    padding-top: 65px;
}
.footer {
    float: left;
    width: 100%;
	background: rgb(221,221,221);
	background: -moz-linear-gradient(top,  rgb(221,221,221) 0%, rgb(242,242,242) 100%);
	background: -webkit-linear-gradient(top,  rgb(221,221,221) 0%,rgb(242,242,242) 100%);
	background: linear-gradient(to bottom,  rgb(221,221,221) 0%,rgb(242,242,242) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#f2f2f2',GradientType=0 );
    padding: 165px 0 0 0;
    margin-top: -50px;
    background-image: url(../img/grass-seamless.jpg);
    background-repeat: repeat-x;
    background-position: 0 0;
}
.footer .row + .row {
    margin-top: 30px;
}
.footer p, .footer a {
    color: #666666;
}
.footer h3 {
    font-size: 18px;
    line-height: 1.1em;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 8px;
    padding: 0;
    border: 0;
    color: #666;    
}
.footer .nav > li {
    float:left;
    width: 50%;
}
.footer .nav > li > a {    
    border-color: #cccccc;
    position: relative;
    color: #666666;
    padding: 0 15px 0 0;
    margin: 0;    
    font-weight: 300;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    font-size: 18px;
    line-height: 26px;    
    -webkit-transition: all 0.35s;
    -o-transition: all 0.35s;
    transition: all 0.35s;   
}

.footer .nav > li > a:hover {
  /*padding:5px 5px 5px 20px;*/
  opacity: 0.8; 
}
.footer .nav > li > a.promoted {color: #000000;font-weight: bold;}

.footer .footer-logos {
  text-align: right;
  filter: grayscale(100%);
}

.footer .footer-logos img {
  margin-bottom: 10px;
}

@media (max-width: 767px) {
  .footer .footer-logos img {
    max-width: 270px;
  }
}

.footer .footer-logos .footer-logo{
  padding-top: 10px;
}

.footer .footer-logos .phsw {
  margin-top: 10px;
  padding-top: 15px;
}

.footer .address {
  /*
  padding-left: 28px;
  border-left: 2px solid #cccccc;
  */
}
.footer p {
    font-size: 18px;
    line-height: 26px;
}
.footer .other-products {
  padding-top: 0;
}

.footer h3 {
  padding-bottom: 10px;
  border-bottom: 2px solid #cccccc;
}

.footer .other-products ul li a {
  font-weight: 300;
}

.vertical-center-parent {
    display: table;
    width: 100%;
    height: 100%;    
}
.vertical-center-child {
    display: table-cell;
    vertical-align: middle;
}
.btn-more {    
    text-align: left;
    line-height: 22px;
    border-width: 0;
    margin: 0px;
    padding: 15px 20px;
    letter-spacing: 8px;
    font-weight: bold;
    font-size: 18px; 
    color: #FFFFFF !important;
    background-color: #ef3940;
    border-color: #e16e75; 
    border-radius: 0;
    text-transform: uppercase;
    box-shadow:  5px 5px 0 0 rgba(128,128,128,0.5);  
    -webkit-transition: background-color 0.3s ease-out;
    -moz-transition: background-color 0.3s ease-out;
    -o-transition: background-color 0.3s ease-out;
    transition: background-color 0.3s ease-out;       
}
.btn-more:hover, .btn-more:focus, .btn-more:active {
    color: #fff;
    background-color: #2a5491;
    border-color: #2a5491;
}
.btn-download {
    white-space: normal;
    text-align: center;
    line-height: 22px;
    border-width: 0;
    margin: 0px;
    padding: 8px 20px;
    letter-spacing: 4px;
    font-weight: bold;
    font-size: 16px; 
    color: #FFFFFF !important;
    background-color: #009dc1;
    border-color: #e16e75; 
    border-radius: 0;
    text-transform: uppercase;
    box-shadow:  5px 5px 0 0 rgba(128,128,128,0.5);   
    -webkit-transition: background-color 0.3s ease-out;
    -moz-transition: background-color 0.3s ease-out;
    -o-transition: background-color 0.3s ease-out;
    transition: background-color 0.3s ease-out;     
}
.btn-download:hover, .btn-download:focus, .btn-download:active {
    color: #FFFFFF !important;
    background-color: #2a5491;  
    border-color: #2a5491;     
}
.btn-nav {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;    
    border-width: 0;
    margin: 0px;
    padding: 0 20px;
    letter-spacing: 8px;
    font-weight: bold;
    font-size: 28px; 
    line-height: 36px;
    color: #FFFFFF !important;
    background-color: #e16e75;
    border-color: #e16e75;      
    border-radius: 0;
    text-transform: uppercase;
    box-shadow:  5px 5px 0 0 rgba(128,128,128,0.5); 
    white-space: normal!important;
    -webkit-transition: background-color 0.3s ease-out;
    -moz-transition: background-color 0.3s ease-out;
    -o-transition: background-color 0.3s ease-out;
    transition: background-color 0.3s ease-out;       
}
.btn-nav:hover, .btn-nav:focus, .btn-nav:active {
    color: #FFFFFF !important;
    background-color: #2a5491;
    border-color: #2a5491;      
}


.btn-baner {
    display: inline-block;    
    text-align: center;    
    border-width: 0;
    margin: 0px;
    padding: 16px 20px;
    width: 100%;
    max-width: 300px;
    letter-spacing: 0;
    font-weight: bold;
    font-size: 24px; 
    line-height: 32px;
    color: #FFFFFF !important;
    background-color: #2594b0;
    border-color: #2594b0;      
    border-radius: 0;
    text-transform: uppercase;
    box-shadow:  none; 
    white-space: normal!important;
    -webkit-transition: background-color 0.3s ease-out;
    -moz-transition: background-color 0.3s ease-out;
    -o-transition: background-color 0.3s ease-out;
    transition: background-color 0.3s ease-out;       
}
.btn-baner:hover, 
.btn-baner:focus, 
.btn-baner:active {
    color: #fff!important;
    background-color: #2a5491;
    border-color: #2a5491;      
}



.nav-links > li {
    height: 120px;
    margin: 15px 0;
}
.vertical-aligner {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}
.vertical-aligner .vertical-aligned {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%); 
    -moz-transform: translateY(-50%); 
    transform: translateY(-50%); 
    left: 0;
    right: 0;   
}
.section-nav {
    float: left;
    width: 100%;
    margin: 40px 0;
}
.text-underline {text-decoration: underline;}
.jumbotron {
	padding: 0;
    background: #fbfbfb url('../img/bgjumbotron.png') repeat-x 0 0;
    max-height: 584px;
    margin-bottom: 0;
}
.banner-carousel {
    margin-bottom: 0;
}

.jumbotron .container {
    max-width: 100%;
    height: 100%;
}

.banner-carousel .caption {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;    
}

.banner-carousel .caption h4 {
    font-size: 22px;
    line-height: 1.2em;
    font-weight: 700;
    display: inline-block;        
    color: #0097be;
    margin-top: 10px;
    margin-bottom: 10px;    
}

.banner-carousel .caption .buttons {
    margin-top: 15px;
}

@media (min-width: 1600px) and (max-width: 1800px) {
    .banner-carousel .caption h4 {
        font-size: 18px;        
    }
    .banner-carousel .caption img.img-product {
        width: auto;
        height: 270px;    
    }
    
    .banner-carousel .caption .btn {
        padding: 12px 30px;
        font-size: 20px;
    }
}

@media (min-width: 1400px) and (max-width: 1599px) {
    .banner-carousel .caption h4 {
        font-size: 18px;
        max-width: 420px;
    }
    .banner-carousel .caption img.img-product {
        width: auto;
        height: 230px;    
    }
    
    .banner-carousel .caption .btn {
        padding: 4px 30px;
        font-size: 16px;
        max-width: 200px;
    }
}


@media (min-width: 1200px) and (max-width: 1399px) {
    .banner-carousel .caption h4 {
        font-size: 18px;
        max-width: 420px;
    }
    .banner-carousel .caption img.img-product {
        width: auto;
        height: 180px;    
    }
    .banner-carousel .caption img.img-logo {
        width: auto;
        height: 25px;    
    }    
    
    .banner-carousel .caption .btn {
        padding: 4px 30px;
        font-size: 16px;
        max-width: 200px;
    }
}

@media (min-width: 1000px) and (max-width: 1199px) {
    .banner-carousel .caption h4 {
        font-size: 16px;
        max-width: 420px;
    }
    .banner-carousel .caption img.img-product {
        width: auto;
        height: 130px;    
    }
    .banner-carousel .caption img.img-logo {
        width: auto;
        height: 25px;    
    }    
    
    .banner-carousel .caption .btn {
        padding: 4px 30px;
        font-size: 16px;
        max-width: 200px;
    }
}


@media (min-width: 768px) and (max-width: 999px) {
    .banner-carousel .caption h4 {
        font-size: 14px;
        max-width: 400px;
    }
    .banner-carousel .caption img.img-product {
        width: auto;
        height: 80px;    
    }
    .banner-carousel .caption img.img-logo {
        width: auto;
        height: 18px;    
    }    
    
    .banner-carousel .caption .btn {
        padding: 4px 30px;
        font-size: 16px;
        max-width: 200px;
    }
}


@media (max-width: 767px) {
    .banner-carousel .caption h4 {
        font-size: 14px;
        max-width: 90%;
        display: none;
    }
    .banner-carousel .caption img.img-product {
        width: auto;
        height: 80px;    
    }
    .banner-carousel .caption img.img-logo {
        width: auto;
        height: 18px;    
    }    
    
    .banner-carousel .caption .btn {
        padding: 4px 15px;
        font-size: 14px;
        line-height: 20px;
        max-width: 50%;
    }
    
    .banner-wrapper.custom-build {
        margin: 0;
        overflow: hidden;
    }    
    
    .baner-mobile {
        background: #fff;
        padding: 30px 15px;
    }
    
    .baner-mobile .buttons {
        margin-top: 15px;
    }
    
    .baner-mobile h4 {
        font-size: 16px;
        line-height: 1.2em;
        font-weight: 700;
        display: inline-block;        
        color: #0097be;
        margin-top: 10px;
        margin-bottom: 10px;
        max-width: 400px;
    }    
}

.element-relative {
    position: relative;
}

.outer {
    position: relative;
    height: 100%;
}

.inner {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  transform: translateY(-50%);
}

.container-half {
    width: 50%;
    padding-left: 15px;
    padding-right: 15px;
}

.push-bg {
  background-position: 0 100%;
}

@media (max-width: 767px) {
  .push-bg {
    background-position: 0 200px;
  }
}

@media (max-width: 400px) {
  .push-bg {
    background-position: 0 125px;
    background-size: 15px;
  }
}

.banner {
    padding-top: 0px;
    padding-bottom: 40px;
    margin-top: 0;
    overflow: hidden;
    position: relative;
    background: url(../img/banner_001.png) no-repeat 100% 180px;
    background-size: auto 360px;
}

@media (min-width: 768px) {
  .banner {
    padding-bottom: 0;
  }
}

@media (min-width: 992px) {
  .banner {
    padding-bottom: 44.5px;
  }
}

@media (min-width: 1200px) {
  .banner {
    padding-bottom: 83.5px;
  }
}

@media (max-width: 767px) {
  .banner {
    padding-bottom: 0;
    background-position: 50% 200px;
  }
}

@media (max-width: 400px) {
  .banner {
    background-position: 50% 130px;
    background-size: 400px;
  }
}

.banner .top {
    margin-bottom: 40px;
}

.banner .right {    
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;    
}

.banner h3 {
    /*color: #2a5491;*/
    color: #009dc1;
    font-weight: 400;
    font-size: 22px;    
}
.banner h3 strong {
    /*color: #2a5491;*/
    color: #009dc1;
}
.banner h3 span {
    font-size: 18px;
    font-weight: 300;  
    margin: 15px auto 10px auto;
    display: block;  
}

.claim {
  padding: 0 0 50px 0;
}
.claim h1 {
	color: #009dc1;
	font-size: 2.7em;
	margin-top: 0;
    margin-bottom: 0;
    text-transform: uppercase;
}
.claim h4 {
    color: #009dc1;
    font-size: 20px;
    line-height: 1.1em;
    font-weight: bold;
    text-transform: uppercase;
}

@media (min-width: 768px) and (max-width: 991px) {
  .claim {
    padding: 20px 0 0 0;
  }
  .claim h1 {font-size: 50px;}
} 

  .claim .top {
    margin-top: 50px;
	margin-bottom: 0;
    padding: 0 10%;
  }
  
  .claim .bottom {
    padding: 0 10%;
  }

.buy {
  padding: 25px 0 20px 0;
}

  .buy .buy-box {
    background: -webkit-linear-gradient(top,  rgba(255,255,255,0.8) 0%,rgba(255,255,255,0) 100%);
    padding: 20px 0;
  }


.claims {
	margin-bottom: 20px;
}
	.claims div {
		margin: 0;
		text-align: center;

	}
		.claims div span {
			display: block;
			margin: 20px;
			padding: 10px;
			background-color: #009dc1;
			font-weight: 700;
			color: #FFFFFF;
		}

.testimonial {
	position: relative;
	padding: 10px 20px;
	margin: 60px auto 60px auto;
}
		.testimonial:before, .testimonial:after {
			content: "\022";
			font-size: 3em;
			position: absolute;
			/*font-family: 'Catamaran';*/
            font-family: 'Comfortaa', cursive;
			font-weight: 400;
			color: #CCCCCC;			
			
		}
		
		.testimonial:before {
			left: 45%;
			top: 0;
		}

 		.testimonial:after {
			left: 45%;
			bottom: -30px;
		}
		
#text-carousel {
	background: #fbfbfb url('../img/bgjumbotron.png') repeat-x 0 0;
	margin: 30px 0;
}
	#text-carousel .carousel-control {
		background-image: none !important;
		background-color: transparent;
		
	}
		#text-carousel .carousel-control .fa {
			position: relative;
			top: 47%;
		}

@media (max-width: 991px) {
	.buy .spacer {
		height: 300px;
	}

  .buy-box {
    background: -webkit-linear-gradient(top,  rgba(255,255,255,0.8) 0%,rgba(255,255,255,0) 100%);
    /*background: -moz-linear-gradient(top,  rgba(255,255,255,1) 50%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%);
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );*/
    padding: 20px 0;
  }
}

@media (max-width: 400px) {
	.buy .spacer {
		height: 200px;
	}
}

.desc {
    /*
    padding: 100px 0 40px 0;
    margin: -10px 0 0 0;    
    */ 
    padding: 65px 0 40px 0;
    margin: 0 0 0 0;
}
.desc.row {
    /*
    margin-left: -15px!important;
    margin-right: -15px!important;
    */
}
.desc.next {
    margin-bottom: 80px;
}
@media (max-width: 768px) {
	.desc {
    padding: 0 0;
    margin: 0; 
  }
}
.desc .left {
    /*padding-right: 40px;*/
}

.products {
  padding-top: 100px;
  margin-top: -100px;
}

 .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
    color: #000;
    cursor: default;
    background-color: rgba(255,255,255,0.5);
    border: 0;
    border-radius: 0; 
}

.nav-tabs > li > a {
    text-align: center;
    border: 0;
}

.nav-tabs {
    margin-top: -106px;
    border-bottom: 0;
}

@media (max-width: 768px) {
  .nav-tabs {
      margin-top: 0;
      border-bottom: 1px solid #1daf4b;
  }
  
  .nav-tabs li a {
      background: #1daf4b;
  }
  
  .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
      // background: #d4efdc;
      border: 1px solid #1daf4b;
      border-bottom: 1px solid #FFFFFF;
      border-radius: 4px 4px 0 0;
  }
  
  .nav-tabs h3 {
    color: #FFFFFF;
  }
  
  .nav-tabs .active h3 {
    color: #1daf4b;
  }
}

.tab-pane .info {
  padding-top: 50px;
}

.tab-pane .dosage {
  padding: 10px 0;
  text-align: center;
  background-color: #F0F0F0;
}

.tab-pane .info p, .tab-pane .info h3, .tab-pane > h3 {
  text-align: center;
}

.tab-content {
	margin-top: -50px;
	padding: 20px;
	z-index: 1000;
}

h1, h2 {
    position: relative;
    font-size: 30px;
    line-height: 1.1em;  
    font-weight: bold;  
    display: inline-block;
    margin-bottom: 30px;
    /*color: #2a5491;*/
    color: #009dc1;
}
/* h1:before, h1:after, h2:before, h2:after  {
    width: 10px;
    height: 10px;
    position: absolute;
    top: 50%;
    content: "";
    margin-top: -5px;
    background-color: #e43636;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;    
}
h1:before, h2:before {
    right: -20px;
}
h1:after, h2:after  {
    left: -20px;
}
*/

.allergy-mini {
	height: 100px;
	float: left;
    margin-right: 20px;
    margin-top: 10px;
}

.allergy-midi {
	height: 180px;
	float: left;
    margin-right: 20px;
    margin-top: 10px;
}

.product-list {
    margin-top: 20px;
    margin-bottom: 20px;
}
.product-list .row {
  display: table;
}

.product-list .herb-desc {
  text-shadow: 0 0 3px #FFFFFF;
  display: table-cell;
  vertical-align: middle;
}

.links {
  border-top: 1px solid #cccccc;
  padding-top: 5px;
}
#help-popup {display:none;}
#help-popup .overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.8);
    z-index: 9999;    
}
#help-popup .content {
    position: fixed;
    top: 20%;
    left: 0;
    right: 0;
    margin: auto;
    width: 750px;
    padding: 40px 15px 30px;
    border-radius: 10px;
    background-color: #fff;
    font-size: 16px;
    line-height: 1.375em;
    z-index: 10000;
}
#help-popup ul {
    text-align: center;
}
#help-popup ul > li {
    display: inline-block;
    margin: 0;
}
#help-popup ul > li + li {margin-left: 40px;}
#help-popup .btn-open {
    background-color: #2a5491;
    border-color: #2a5491;
    color: #fff;
    line-height: 22px;
    border-width: 0;
    margin: 0px;
    padding: 15px 20px;
    letter-spacing: 8px;
    font-weight: bold;
    font-size: 18px;
    border-radius: 0;
    text-transform: uppercase;  
    box-shadow: 5px 5px 0 0 rgba(128,128,128,0.5);  
}
#help-popup .btn-close {
    background-color: #e16e75;
    border-color: #e16e75;
    color: #fff;
    line-height: 22px;
    border-width: 0;
    margin: 0px;
    padding: 15px 20px;
    letter-spacing: 8px;
    font-weight: bold;
    font-size: 18px;
    border-radius: 0;
    text-transform: uppercase;  
    box-shadow: 5px 5px 0 0 rgba(128,128,128,0.5);      
}
img.block-first {}
.video-wrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.video-wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.explanation {
    padding: 40px 0 0;
    font-size: 22px;
    line-height: 1.375em;    
    float: right;
}
.subinfo {
    font-size: 16px;
    line-height: 20px;
    display: block;
    color: #231f20;    
}
/* cookie */
#cookie-law {
    z-index: 999999;
    opacity: 1;
    position: fixed;
    padding: 6px 15px;
    width: 100% !important;
    font-size: 14px;
    line-height: 16px;
    font-weight: normal;
    text-align: left;
    color: #FFF;
    font-family: Arial,sans-serif;
    box-shadow: none;
    border-radius: 0;
    bottom: 0 !important;
    left: 0;
    background: rgba(0,0,0,0.7);   
}
#cookie-law p {
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal;
    text-align: left;
    color: #ffffff;
    font-family: Arial,sans-serif;
    text-align: center;    
}
#cookie-law .close-cookie-banner, #cookie-law .close-cookie-banner:visited {
    background-color: #1e9bdb;
    color: #ffffff;
    padding: 0px 10px;
    line-height: 20px;
    display: inline-block;
    border-radius: 4px;
    margin: 0 8px;
}
#cookie-law a.btn-link  {
    text-decoration: underline;
    color: inherit;
    font-weight: bold;
    display: inline-block;
    color: #ffffff;
}
@media only screen and (min-width: 1200px) {
    .footer .footer-logos {margin-top: 125px;}
    .menu-main > li.dropdown:hover .dropdown-menu {
        display: block;
        opacity: 1;
        visibility: visible;    
    }
}    
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .footer .footer-logos {margin-top: 125px;}
    .menu-main > li > a {padding: 13px 10px 12px;}
    .banner {
        background-size: auto 280px;
        background-position: 100% 195px;
    }
    .btn-nav {font-size: 22px;}
    .footer .nav > li > a {padding-right: 5px;}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    #navbar .logo img {max-height: 40px;}
    .maxless-sm {max-width: 100%!important;max-height: 100%!important;}
    .min-width-sm {max-width: 72px!important;}
    .menu-main > li > a {
        padding: 13px 10px 12px;
        max-width: 90px;
        font-size: 13px;
    }
    .menu-main > li > a .caret {display: none;}
    .menu-main {margin: 0;}
    .product-types .nav-tabs > li > a > .item .title > span {font-size: 20px;} 
    .product-types .nav-tabs > li > a > .item .title > strong {font-size: 40px;}
    .banner {
        background-size: auto 280px;
        background-position: 100% 250px;
    }
    .nav-links > li {height: 85px;}
    .footer .nav > li > a {padding-right: 5px;}  
    .footer {margin-top: 15px;}
    .footer .footer-logos img {margin-bottom: 20px;margin-top: 20px;}  
    .desc + .desc {margin-top: 30px;}
}  
@media only screen and (min-width: 768px) {
    .nav-hamburger-wrapper {display: none;}
    .xs-only {display: none;}
}
@media only screen and (max-width: 767px) {
    #help-popup .content .text {
        height: 190px;
        max-height: 190px;
        overflow: auto;        
    }    
    .btn-extend {
        text-align: left;
        line-height: 22px;
        border-width: 0;
        margin: 0px;
        padding: 5px 15px!important;
        letter-spacing: 4px;
        font-weight: bold;
        font-size: 14px;
        color: #FFFFFF !important;
        background-color: #e16e75;
        border-color: #e16e75;
        border-radius: 0;
        text-transform: uppercase;
        box-shadow: 5px 5px 0 0 rgba(128,128,128,0.5);
        -webkit-transition: background-color 0.3s ease-out;
        -moz-transition: background-color 0.3s ease-out;
        -o-transition: background-color 0.3s ease-out;
        transition: background-color 0.3s ease-out; 
        margin-bottom: 35px;       
    }
    .nav-hamburger-wrapper {display: block;}
    .container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header {margin:0;}
    #navbar {height: auto;}
    #navbar .container {padding-left: 0;padding-right: 0;}
    .navbar-default .navbar-collapse, .navbar-default .navbar-form {
        width: 100%;
        background: rgba(255,255,255,0.9);
    }
    .menu-main {margin: 0;width: 100%;}
    .menu-main > li {
        float:left;
        width: 100%;
        border-bottom: 1px solid #ededed;
    }
    .menu-main > li > a {
        display: block;
        width: 100%;
    }
    #navbar .logo {padding: 0 0 0 15px;}
    .navbar-collapse {padding-left: 0;padding-right: 0;}
    .dropdown-menu {
        position: relative;
        width: 100%;
        margin: 0;
        padding: 0;
        box-shadow: none;
    }
    .dropdown-menu > li + li {
        border-top: 1px solid #ededed;
    }
    .footer [class*="col-"] + [class*="col-"] {
        margin-top: 25px;
    }
    .footer .nav > li {width: 50%;}
    .footer .nav > li > a {padding-left: 0;}
    h1, h2 {font-size: 26px;}
    .claim h1 {font-size: 40px;margin: 0;}
    h1:before, h1:after, h2:before, h2:after {display: none;}
    .banner .right {
        height: 100%;
        position: static;
        right: auto;
        top: auto;
        margin-top: 30px;
    }    
    .dropdown-menu li a {
        padding: 10px 15px 10px 25px;
        display: block;
    }
    .claim {padding: 15px 0 0;}
    .claim .top {padding: 0;max-width: 320px; margin-left: auto; margin-right: auto;}  
    .push-bg {
        background-position: 0 110px;
    }      
    .banner {
        background-position: 50% 200px;
        background-size: 190px;
    }
    .jumbotron {background: #fbfbfb;}
    .buy .spacer {
        height: 230px;
    }    
    .nav>li>a .caret {display: none;}
    .btn-nav {font-size: 20px;}
    .nav-links > li {height: 90px;}
    .footer .nav > li > a {padding-right: 5px;} 
    .footer .footer-logos img {margin-bottom: 20px;margin-top: 20px;}  
    .footer {margin-top:  15px;}
    .section-nav {margin: 30px 0 15px;}
    .desc.next {margin-bottom: 20px;}
    #help-popup .content {width: 290px;top: 65px;}
    #help-popup ul > li {
        width: 100%;        
    }
    #help-popup ul > li + li {
        margin-top: 15px;
        margin-left: 0;
    }
    #help-popup .btn {font-size: 16px;padding: 10px 15px;}
    .main-container img {margin-top: 10px!important;}
    .explanation {float: left; text-align: center; padding-bottom: 15px;}
    .desc + .desc {margin-top: 30px;}
}
@media only screen and (max-width: 440px) {
    .banner {
        background-position: 50% 200px;
        background-size: 190px;
    }
}
.plugins {
    width: 0!important;
    height: 0!important;
    display: none!important;
}

.slick-dotted.slick-slider {
    margin-bottom: 0;
}
.slick-arrow::before {
    color: #2594b0;
    font-size: 40px;
    display: none;
}

@media only screen and (max-width: 900px) and (orientation: landscape) {
    .slick-arrow::before {
        display: block;
    }
}
.slick-prev {
    left: 20px;
    z-index: 10;
}
.slick-next {
    right: 20px;
}
.banner-carousel:hover .slick-arrow::before {
    display: block;
}



@media only screen and (max-width: 767px) {
    .jumbotron {
        overflow: hidden;
    }
    .banner-wrapper {
        margin: 0 -33.333%;
        overflow: hidden;
    }
    .banner-wrapper .slick-slider {
        margin-bottom: 0;
    }
    .banner-carousel .slick-arrow::before {
        display: block;
    }
}


.btn-cta {
    background-color: #32A6BA;
    border-color: #32A6BA;
    color: #fff;
    line-height: 22px;
    border-width: 0;
    margin: 0px;
    padding: 15px 20px;
    letter-spacing: 8px;
    font-weight: bold;
    font-size: 18px;
    border-radius: 0;
    text-transform: uppercase;
    box-shadow: 5px 5px 0 0 rgba(128,128,128,0.5);
    transition: all .35s ease-in-out;
}

.cat-buttons {
    margin-top: 50px;
}

.btn-cta:hover,
.btn-cta:focus,
.btn-cta:active {
    background-color: #ABEEFA;
    border-color: #1e3b67;
    color: #fff;   
}

.btn-cta img {
    margin-top: 8px!important;
}

.list-btns:before,
.list-btns:after {
    content: "";
    display: table;
}

.list-btns:after {
    clear: both;
}

.list-btns {
    max-width: 1110px;
    margin: 0 auto;
}

.list-btns > li {
    position: relative;
    float: left;
    width: 100%;
    min-height: 1px;
    margin-top: 15px;
    margin-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
    text-align: center;
}

.swapped-product {
    padding-left: 50px;
}

@media (max-width: 768px) {
    .swapped-product {
      padding-left: 15px;
    }
} 

@media (min-width: 576px) {
    .list-btns > li {
        width: 50%;
    }
}

@media (min-width: 992px) {
    .list-btns > li {
        width: 25%;
    }
}

.side-effects {
  display: flex;
  align-items: center;
  padding: 0;
  background-color: transparent;
  position: relative;
  z-index: 1;
}

.side-effects-logo {
  background: url('./assets/images/Bausch_&_Lomb-Logo.wine.png') no-repeat;
  background-size: 100%;
  height: 20px;
  flex-grow: 0;     /* do not grow   - initial value: 0 */
  flex-shrink: 0;   /* do not shrink - initial value: 1 */
  flex-basis: 244px;
}

.side-effects-text {
  margin-left: 0;
  font-size: 15px;
  font-family: "Centrale sans light", sans-serif;
  color: #0f1010;
  padding: 50px 0 70px;
  line-height: 1.3em;
}

.side-effects-text h4{
	margin-bottom: 0.2em;
	font-size: 18px;
    line-height: 1.1em;
    font-weight: 400;
    margin-top: 0;
    color: #666;
}

.side-effects-text a {
  color: #337ab7;
}

.appeal {
  padding: 20px;
}

.appeal p {
  margin: 0 auto;
  max-width: 1185px;
  font-size: 14px;
}

@media only screen and (max-width: 1150px) {
  .side-effects {
    padding: 40px 20px;
  }

  .side-effects-logo {
    display: none;
  }

  .side-effects-text {
    margin-left: 0;
    padding: 0;
    text-align: center;
    width: 100%;
    font-size: 16px;
  }

  .side-effects-text a {
    max-width: calc(100% - 30px);
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    display: block;
  }
}