/*Custom Cover manaSu*/
body{ font-family: museo, sans-serif; font-size: 16px; color: #000;}
#mainnav{ margin-top: -1px; margin-left: -1px; position: relative; z-index: 99;  }
#mainnav ul{list-style: none; text-align: center;}
#mainnav li{display: inline-block; font-weight: bold; font-size: 15px;}
#mainnav a{ display: block; line-height: 31px;}
#mainnav span{display: block;}
#mainnav li.active a,#mainnav li a:hover {background-color: #000;color: #fee200;}
.nav>li>a:focus{ background: transparent;}
#mainnav a{color: #000;}
#mainnav .navbar-header{background: #000;} 
#mainnav .mainnav-title{   margin-top: -51px;background: #fee200;transform: skewX(40deg); -webkit-transform: skewX(40deg); /* WebKit */-moz-transform: skewX(40deg); /* Mozilla */-o-transform: skewX(40deg); /* Opera */-ms-transform: skewX(40deg); /* Internet Explorer */ margin-right: 70px;line-height: 51px;margin-left: -33px; padding-left: 50px; font-size: 24px; font-weight: bold;}
#mainnav .mainnav-title span{transform: skewX(-40deg);-webkit-transform: skewX(-40deg); /* WebKit */-moz-transform: skewX(-40deg); /* Mozilla */-o-transform: skewX(-40deg); /* Opera */-ms-transform: skewX(-40deg); /* Internet Explorer */}
#mainnav button span{background: #fee200;}
#mainnav .nav>li>a{padding: 15px 21px;}
.navbar-responsive-collapse{background: #fee200; padding: 0px 146px 11px 104px;margin-top: 0px;}
#mainnav .col-md-3{padding:0px !important; max-width: 270px;}
.social-ic img{width:50%;}
.social-ic a{    line-height: 57px !important;margin-left: 20px;}
.container-fluid{max-width: 1500px !important; position: relative; }
.inner-wrap{padding-left: 6%; padding-right: 6%;}
#slidebox{ position: absolute; top: 0;left:0;}
.carousel-caption{background: #000;width: 62%;color: #fee200;text-shadow: none;padding: 20px 36px 20px 30px;font-size: 30px;text-align: left;}
.carousel-indicators li{background: #494949; border: none; margin: 0px;}
.carousel-indicators li, .carousel-indicators li.active{height: 14px; width: 14px;}
.carousel-indicators{left: 50%;}
h1,h2{font-size: 31px;font-weight: bold;}
h1,h2,p{padding-bottom: 14px;}
.highlight{font-weight: bold;}
.top-gap{padding-top: 20px;}
.login-box{border-bottom: 1px solid #cacaca;padding-bottom: 34px;padding-left: 9px;width: 368px;}
.login-box a:hover{ color: #c1a600;}
.login-box ul{margin: 0px 0px 20px 0px; padding: 0px; overflow: hidden;}
.login-box ul li{ list-style: none; display: inline; padding-left: 4px;}
.login-box ul li:first-child{padding-left: 0px;}
.headtxt{font-size: 23px;}
.login-box ul li a{font-size: 13px; color: #d7ba07; text-decoration: underline; margin-right: 9px;}
/*CA: updated below*/
input[type="text"],input[type="email"], input[type="password"]{ width: 350px;padding: 7px 5px;border: 1px solid #7f7f7f;margin-bottom: 10px;}
input[type="checkbox"]{margin-right: 8px;}
input[type="submit"]{background: #000;border: none;padding: 11px 16px;color: #fee200;margin-right: 10px;}
input[type="submit"]:hover{background:#fee200; color: #000;}
.input-wrap{overflow: hidden;}
.l-float{float: right;}
.tip{width: 350px;margin-top: 40px;background: url('../img/tooltip_tail.png')no-repeat left bottom;padding-bottom: 30px;}
.tipbox{padding: 20px;background: #fee200;margin-top: 16px;}
#imageblock .row{background: #d9bc09;padding-top: 45px;padding-bottom: 45px;}
#imageblock .col-lg-3{margin-left: -5px;}
.showcase{ width:325px;}
.num-i,.num-ii,.num-iii,.num-iv{ font-size: 60px;font-weight: 900;padding-left: 20px;}
.num-i{color: #000;}
.num-ii{color: #362f01;}
.num-iii{color: #6b5e02;}
.num-iv{color: #a38c08;}
.txtline1{background: url('../img/action_fuel.jpg') no-repeat 0 0; color: #d8be0f; }
.txtline2{background: url('../img/action_dump.jpg') no-repeat 0 0; color: #fce500;}
.txtline3{ background: url('../img/action_garden.jpg') no-repeat 0 0; color: #dab606;}
.txtline4{ background: url('../img/action_water.jpg') no-repeat 0 0; color: #000203;}
.txtline1 a{color: #d8be0f; }
.txtline2 a{color: #fce500;}
.txtline3 a{color: #dab606;}
.txtline4 a{color: #000203;}
.txtline1, .txtline2, .txtline3, .txtline4{height: 327px; margin-bottom: 23px;color: #d9bd04;font-size: 22px;padding: 24px;}
.act{color: #fff;font-size: 16px;width: 246px;overflow: hidden;margin-bottom: 20px;padding-left: 20px;}
.act a{ color: #fff;}
.act .glyphicon{color: #e3cd46;font-size: 45px;vertical-align: -10px;text-height: 17px;}
.act span, .act-ii span{/* font-weight: bold; */}
.learn{ width: 174px;}
.act-ii{color: #000;font-size: 16px;width: 246px;overflow: hidden;padding-left: 20px;}
.act-ii a{color: #000;}
.act-ii .glyphicon{color: #a38d07;font-size: 45px;vertical-align: -10px;}
footer.row{padding-top: 45px;padding-bottom: 45px;background: #cbcbcb;}
.footer-i{overflow: hidden;border-bottom: 1px solid #fff;padding-bottom: 26px;}
.footer-unit .headtxt{color: #fff;padding-bottom: 10px;}
.footer-unit ul{list-style: none;margin: 0px;padding: 0px;margin-bottom: 20px;}
.footer-unit ul li{line-height: 30px;}
.footer-unit ul li a{color: #000;}
.footer-ii{overflow: hidden;padding-top: 26px;}
.footer-ii, .footer-ii a{color: #fff;font-size: 13px;}
.footer-ii a{text-decoration: underline;}
.nav .open>a, .nav .open>a:hover, .nav .open>a:focus {background-color: transparent !important; border-color: transparent !important;  color: #000 !important;   }
.nav .vsited{ background-color: transparent !important;}

/*------Font Include-----*/

@font-face {font-family:"museo"; src: url("../fonts/museo-300.ttf") format('truetype');font-weight: normal;}
@font-face {font-family:"museo"; src: url("../fonts/museo-500.ttf") format('truetype'); font-weight: bold;}
@font-face {font-family:"museo"; src: url("../fonts/museo-700.ttf") format('truetype'); font-weight: 700;}
@font-face {font-family:"museo"; src: url("../fonts/museo-1000.ttf") format('truetype'); font-weight: 900;}

/*------Responsive Conditions-----*/

@media screen and (min-width: 768px) {
    #mainnav li { transform: skewX(40deg); -webkit-transform: skewX(40deg); /* WebKit */-moz-transform: skewX(40deg); /* Mozilla */-o-transform: skewX(40deg); /* Opera */-ms-transform: skewX(40deg); /* Internet Explorer */}
    #mainnav li span{transform: skewX(-40deg);-webkit-transform: skewX(-40deg); /* WebKit */-moz-transform: skewX(-40deg); /* Mozilla */-o-transform: skewX(-40deg); /* Opera */-ms-transform: skewX(-40deg); /* Internet Explorer */}
    #mainnav li ul  { transform: skewX(-40deg);}
    #mainnav li ul li {transform: skewX(0deg); }
    .carousel-caption{left:7%;}
    #mobile-block, .mobile-login { display: none;}
}
       
@media screen and (max-width: 767px) {
    .menu-slogan{display: none;}
    .menu-slogan img{height: 192px;}
    .social-ic{filter: invert(100%);}
    .navbar-responsive-collapse{background: #000;padding: 0px 15px 0px 15px;margin-left: -1px;margin-right: -1px;}
    .pull-left{float:none !important;}
    #mainnav a{color: #fff;}
    #mainnav ul li {border-bottom: 1px solid #fee100; font-size: 21px; font-weight: normal;}
    #mainnav .nav>li>a{padding: 12px 15px !important;}
    #mainnav ul li:first-child{padding-top: 20px;}
    #mainnav li{ display: block; text-align: left;}
    #mainnav .open>a, #mainnav .open>a:hover{ color: #000 !important; background: #fee200 !important;}
    .carousel-caption{position: relative; width: 100%; left: 0; right: 0; bottom: 0; font-size: 18px !important; padding: 8px 26px 8px 30px;}
    .carousel-indicators {bottom: -12px; left: 50%;}
    .carousel-indicators li, .carousel-indicators li.active{height: 12px; width: 12px;}
    .social-ic img{width:auto;} 
    .social-ic a{ margin-left: 0px; padding-bottom: 10px;}
    .login-box, .tip,.act,.act-ii, .num-i,.num-ii,.num-iii,.num-iv{ display: none;}
    .showcase{width: auto;}
    .txtline1{background: url('../img/action_fuel.jpg') no-repeat 0 0;background-size:100% auto;}
    .txtline2{background: url('../img/action_dump.jpg') no-repeat 0 0; background-size:100% auto;}
    .txtline3{ background: url('../img/action_garden.jpg') no-repeat 0 0; background-size:100% auto;}
    .txtline4{ background: url('../img/action_water.jpg') no-repeat 0 0; background-size:100% auto;}
    .txtline1, .txtline2, .txtline3, .txtline4{height: 169px;height: 48vw;margin-bottom: 0px;color: #d9bd04;padding: 19px; width: 192px; width: 48vw;font-size: 16px;}
    #imageblock .col-xs-6{margin-left: -15px;margin-right: 14px;}
    .inner-wrap{padding-left: 0%;padding-right: 0%;}
    #mobile-block{padding-top: 0px !important;margin-top: -18px;padding-bottom: 24px !important;}     
    #mobile-block .headtxt{font-size: 18px;color: #000;}
    #mobile-block .headtxt a{ color: #000;}
    .headtxt .glyphicon{font-size: 43px;vertical-align: -12px;}
    .txtline1 a, .txtline2 a, .txtline3 a, .txtline4 a, #mobile-block .headtxt a { text-decoration: underline;}  
    header{ height: 0px !important;}
    #slidebox{ position: relative; top: 0;left:0;}
    .mobile-login{padding: 20px 0px;}
    .mobile-login.headtxt{font-size: 21px;font-weight: 700;color: #d9bc09;}
    .mobile-login.headtxt a{color: #d9bc09; text-decoration: underline;}
    /* Carlin Update: */
    /*#maincontent .txt p:not(:nth-child(2)){display: none;}*/  
    /*#maincontent .txt{display: none;}*/  
    .carousel-indicators{
        display:none;
    }

    #mainnav li.active a,#mainnav li a:hover {background-color: transparent;}
    #mainnav ul li.dropdown{background: #000 url('../img/pointer.png') no-repeat 96% center;}
    #mainnav ul li.open{background: #000 url('../img/pointer_bottom.png') no-repeat 96% 12%;}
    #mainnav ul li.open ul li:last-child{border: none;}
    #mainnav{ margin-right: -1px;}
    
}

@media screen and (min-width:768px) and (max-width: 992px) {
    .navbar-responsive-collapse{ padding: 0px 0px 11px 50px; border-radius: 0px 4px 4px 0px; }
    #mainnav .nav>li>a{ padding: 15px 15px 14px 15px;}
}

@media screen and (max-width: 992px) {
    .menu-slogan img{width: 42%;}
    .l-float{ float: none;}
}

@media screen and  (min-width: 992px) and (max-width: 1142px){
    .navbar-responsive-collapse{ padding: 0px 0px 11px 50px; }
    #mainnav .nav>li>a{ padding: 15px 10px 14px 10px;}
}

@media screen and (max-width: 1142px) {
    #mainnav .hallmark{display: none;}
    .carousel-caption{font-size: 20px;}
}

@media screen and (min-width: 1142px) and (max-width: 1227px){
    .navbar-responsive-collapse{ padding: 0px 0px 11px 50px; }
    #mainnav .nav>li>a{ padding: 15px 15px 14px 15px;} 
}

@media screen and (min-width: 1227px) and (max-width: 1412px){
.navbar-responsive-collapse{ padding: 0px 6px 11px 104px; }
}