* { box-sizing:border-box; -moz-box-sizing:border-box; }

body { background: #859DA8; color: #FFF; font-family:'Fjalla One', sans-serif;}
.container_1300 {max-width: 1150px; width:100%; margin:0 auto;padding: 0 10px;/* display: inline-block; *//* text-align: center; *//* position: relative; */}

/* Globals */
a { text-decoration:none; color: #fff; text-transform:uppercase;}

.clickable { cursor:pointer; display:block; }
.clearfix:before { content:" "; display:table; }
.clearfix:after { content:" "; display:table; clear:both; }
h2, h3, h4, h5 {font-weight:normal; text-transform:uppercase;}
/* Header */
header { position:relative; width:100%; background: url('/templates/client/images/bg_pattern.jpg') repeat; padding-bottom:20px;}
header:before {position:absolute; content:""; top:0; left:0;background:#ee1c23; height:10px; width:100%;}
header a.logo {position:relative; float:left; margin-top:30px;}
header a.logo img {width: 75%; height:auto;}
header a.social {float:right;margin-top: 10px; display:block;width:50px;}
header a.social { background: #b33f43; padding:10px; /* width: 30px; */}
header a.social .fa {color:#fff; font-size:25px;width: 30px;text-align: center;}
header .slogan {position:absolute; right:0; top:96px; background: url('/templates/client/images/slogan_bg.png') repeat-y;/* padding-right: 307px; */}
header .slogan h2 {position:relative; padding: 10px 0 10px 70px; font-size: 21px;margin:0px;overflow: hidden;padding-right: 387px;}
header .slogan h2:after {position:absolute; content:""; left: 480px; top:0; height: 150%; width: 72.6%; background: url('/templates/client/images/gears.png') no-repeat; overflow:hidden;background-size: contain;}
@media (max-width:1100px) {
header .slogan {padding-right:2%;}
}
@media (max-width:1100px) {
header .slogan {position:relative;clear:both;top: 10px;background-color: #EE1C23; }
header .slogan h2 {text-align:center; font-size:25px;padding-right: 0;}
header .slogan h2:after {display:none;}
}
@media (max-width:600px){
    header a.logo {margin: 0px auto; float:none;display: block;padding-top: 30px;}
    header a.logo img {display:block; margin:0 auto;}
    header a.social {display:none;}
	header .slogan {display:none;}
    header .slogan h2 {padding-left:0; font-size:22px;}
}
/* Nav */
nav { width:100%; background: url('/templates/client/images/nav_bg.jpg') repeat; position: relative;}
.mobile-menu {background: url('/templates/client/images/nav_bg.jpg') repeat; text-align: right; font-family: 'Droid Sans', sans-serif !important;  /* text-transform:uppercase !important; */ font-size: 26px; color: #FFFFFF; position: relative; right: 3%; top: 0px; display: none;}
.mobile-menu:after {content:"\f0c9"; position:absolute; right: 2%; top: 21%; color:#fff;font-size: 30px; font-family:FontAwesome;}
nav > ul {margin:0; padding:0;}
nav > ul > li {position:relative;float:left; list-style-type:none; border-right:3px solid #fff; transition: 0.1s ease;}
nav > ul > li > a {display:block; position:relative; font-size: 20px; padding: 10px; text-align:center; -webkit-transition: all 0.2s ease;
      -moz-transition: all 0.2s ease;
      -ms-transition: all 0.2s ease;
      transition: all 0.2s ease;
      -webkit-transform-origin: 50% 0%;
      -moz-transform-origin: 50% 0%;
      -ms-transform-origin: 50% 0%;
      transform-origin: 50% 0%;
      -webkit-transform-style: preserve-3d;
      -moz-transform-style: preserve-3d;
      -ms-transform-style: preserve-3d;
      transform-style: preserve-3d;}

@media (min-width:900px) {
	nav > ul > li > a:after {
        content: attr(data-title);
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        padding: 10px 0px;
        color: #fff;
        /* background: rgba(238, 28, 35, 0.45); */
        border-bottom: 2px solid #FFFFFF;
        -webkit-transform-origin: 50% 0%;
        -moz-transform-origin: 50% 0%;
        -ms-transform-origin: 50% 0%;
        transform-origin: 50% 0%;
        -webkit-transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
        -moz-transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
        -ms-transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
        transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
      
        width: 100%;
        height: auto;
}
	nav >ul >li:hover nav >ul >li > a {
		  /* background: blue; */
		  -webkit-transform: translate3d( 0px, 0px, -30px ) rotateX( 90deg );
		  -moz-transform: translate3d( 0px, 0px, -30px ) rotateX( 90deg );
		  -ms-transform: translate3d( 0px, 0px, -30px ) rotateX( 90deg );
		  transform: translate3d( 0px, 0px, -31px ) rotateX( 90deg );
		  transition: 0.2s ease-in-out;
	}
}
nav > ul > li:nth-child(1) {width: 13.03%;}
nav > ul > li:nth-child(2) {width: 13.2%;}
nav > ul > li:nth-child(3) {width:12.90%;}
nav > ul > li:nth-child(4) {width: 13.1%;}
nav > ul > li:nth-child(5) {width:15.85%;}
nav > ul > li:nth-child(6) {width: 17.4%;}
nav > ul > li:nth-child(7) {width:14.50%; border-right:none;}
nav > ul > li ul {height:0; position:absolute; list-style:none;margin:0; padding:1px 0;  width: 206px; left: 0; top: 43px;/* overflow:hidden; */ transition: 0.2s;z-index: 2000;}
			nav > ul > li ul  li  {position:relative; margin: 0; float: left;box-sizing: border-box; margin:1px 1% 1px 0px; width:100%;}
			nav > ul > li ul  li  a {position:relative;display:block; line-height:19px;  padding: 0; letter-spacing: -3px; text-transform: uppercase; font-weight:normal !important;  font-size: 14px; color:rgba(255,255,255,0);  transition: 0.3s;}
			nav > ul > li ul  li  a.pdf:before {position:absolute; right:5px; content:""; top:3px; width:28px; height:23px; background:url(../images/pdf2.png) center top no-repeat;}
			nav > ul > li:hover ul  li  a  {background: #F2F2F2;   letter-spacing: 0;  color: #000000!important; transition: 0.3s;}
			nav > ul > li ul  li:first-child:before {border:none !important}
			nav > ul > li ul  li:hover:before { background:white; background:rgba(255, 255, 255, 1); transition: 0.2s;}
			nav > ul > li:hover ul  li:before {}
			nav > ul > li ul  li:hover a {background: #CB1D20;  color:#ffffff !important; }
			nav > ul > li ul  li:hover  a.pdf:before {background:url(../images/pdf2.png) center -23px no-repeat;}
			nav > ul > li:hover ul {height:205px;  transition: 0.4s ;}
			nav > ul > li:first-child:hover ul {height: 230px !important;}
			nav > ul > li:hover ul li a { padding: 7px; font-size: 17px; }
@media (max-width:1100px) {
nav > ul > li > a {padding: 10px 0;}

}
@media (max-width:900px) {
nav {max-height:0; background: rgb(101, 101, 101);overflow:hidden; transition:1s ease; opacity:0; margin: 0;}
nav > ul.container_1300 {margin:0; padding:0; height:auto;}
nav.open { max-height: 1000px; opacity: 1; box-shadow: none;}
nav > ul > li {width: 100% !important; border-bottom: 1px solid #C7C7C7;height: auto;padding: 0px;background: none;float: none;margin: 0;text-align: center;border-right: none !important;}
nav ul li a {padding: 10px;font-size: 18px; transition:0.4s ease;}
nav ul li:hover {border-bottom:1px solid red;}
nav ul li:hover a {background:red;}
.mobile-menu { display: block; padding: 10px 0; cursor: pointer; transition: 1000ms ease; right: 0; padding-right: 13%; /* text-align: center; */ /* margin-bottom: 5px; */}
nav > ul > li.parent:hover a:before {display:block; border:none;}
nav ul ul li a {padding:15px;}
nav:before, nav:after {height:0;}
nav > ul > li ul {width: 100%; display: none;  height:inherit !important; position: relative;top: 0px !important; padding: 0px; background: #F2F2F2;}
				nav > ul > li:first-child:hover ul {height:inherit !important;}
				nav > ul > li:hover ul, nav > ul > li.opened ul {display: block;}
				nav > ul > li:hover a:before, nav > ul > li.opened a:before {display:block;}
				nav > ul > li ul  li  {width: 100%; margin:0;border-bottom: 1px solid red;text-align: center;}
				nav > ul > li ul  li  a,
				nav > ul > li ul  li:hover a {padding: 0px 0px 0px 0 !important; letter-spacing: 0px; background: none !important;color: #242323 !important;border-top: 1px solid #CB1D20;   font-weight: 300 !important; border-top: none !important; line-height: 34px !important; background: #FFF !important; color: #FF0000 !important; font-size: 16px !important;  text-align: center; }
}
/* Banner */
.home .banner {min-height: 557px; margin:0 auto 15px;/* max-height: 507px; */}
.banner {min-height:404px;}
.banner ul.rslides {width: 100%;max-width: 1150px;margin: 0 auto;margin-top:2px;}
.home .banner li {min-height: 557px;}
.banner li {min-height:404px;}


@media (max-width:767px) {
.banner {min-height: 200px !important;}
.home .banner li, .banner li {min-height:200px; background-size:contain;}
}
/* CTA */
.cta-wrapper {max-width:900px;margin:0 auto;}
.outer-cta-left, .outer-cta-middle, .outer-cta-right { display:block; float:left; /* box-shadow: 0 0 4px #666; */ margin: 10px 1%; max-width: 31%; -webkit-perspective: 1000px;-moz-perspective: 1000px; perspective: 1000px; -webkit-transform-style: preserve-3d;     -moz-transform-style: preserve-3d;     -ms-transform-style: preserve-3d;     transform-style: preserve-3d; /* vertical-align: baseline; */}
.cta{  padding: 15px 24px; text-align: center; color:#3e3e3e; transition:0.4s ease; -webkit-transform-style: preserve-3d;     -moz-transform-style: preserve-3d;     -ms-transform-style: preserve-3d;     transform-style: preserve-3d;  box-shadow: 0 0 4px #666;}
.cta:hover {    -webkit-transform: rotateX(6deg);
    -moz-transform: rotateX(6deg);
    -ms-transform: rotateX(6deg);
    transform: rotateX(6deg);
    -webkit-transform-origin: bottom;
    -moz-transform-origin: bottom;
    -ms-transform-origin: bottom;
    transform-origin: bottom;}
.product-thumb{ background: #dd3e42 none repeat scroll 0 0;  border: 2px solid #dd3e42; border-radius: 55px;  margin: 0 auto;  padding: 15px; max-width: 105px;transition:0.4s ease}
.cta a{font-size:22px; text-transform:uppercase; font-family: 'Oswald', sans-serif;color: #3E3E3E;}
.cta p{text-align:left; font-family: 'Roboto Condensed', sans-serif; font-size:19px;}
.cta:hover{ background:#242323; color:#fff;}
.cta:hover > .product-thumb{ background:#242323; border:2px solid #fff;
    transform: rotate(360deg);
    -webkit-transform:rotate(360deg);
    -moz-transform-: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform-origin: center;
    -moz-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;}
.cta:hover>a {color:#fff;}
/* Main section layouts */
section { width:100%; background:url('/templates/client/images/content_bg.jpg');}
.home .main_content {border-top:5px solid #ee1c23;}
.main_content { color:#3e3e3e; font-family: 'Roboto Condensed', sans-serif; font-size: 16px; padding-top: 50px; padding-bottom: 50px;  }
/* Listings */
.listing_item .main_content p {margin:10px 0;}
.listing_item .main_content >img {float:right;/* width: 25%; */}
.listing_item .main_content div:nth-child(5) {margin-top:50px;margin-bottom:30px;}
.listing_item .main_content div img {float:left;} 
.bodytext {font-family: tahoma,verdana,sans-serif; font-size: 12px; line-height : 18px;	padding: 20px;}
.tabletext { font-family: tahoma,verdana,sans-serif; font-size: 13px;padding : 5px; margin-bottom: 20px !important; /* max-width: 100%; */ /* width: 200px !important; */}
/* Interior */
.interior .main_content {border-top:0;}
.interior .main_content > h1 {background: url('/templates/client/images/bg_pattern.jpg') repeat;  padding: 10px;font-family: 'Oswald', sans-serif; font-weight:normal; font-size: 30px; margin-bottom:30px;color: #fff;text-transform: uppercase;}
.product{border:1px solid #000; margin:20px 0;}
.product_img{ text-align:center; margin:20px 0; float:left; width:25%;}
.text{float:left; width:75%;text-align: left;}
.text a{ text-transform:uppercase; font-size:28px; font-family: 'Oswald', sans-serif; margin-top: 20px; display: block; color: #000; text-decoration: underline; /* width: 100%; */ display: block;}
.text p {color: #595959; font-family: 'Roboto Condensed', sans-serif; font-size: 16px;margin: 10px 0; padding:5px}
section .main_content ul.subnav {background: url('/templates/client/images/bg_pattern.jpg') repeat;  padding: 0px;font-family: 'Oswald', sans-serif; font-weight:normal; color:#fff;margin-bottom: 40px;} 
section .main_content ul.subnav li {position:relative; float:left; width:20%;list-style-type: none;text-align: center;}
section .main_content ul.subnav li:first-child {}
section .main_content ul.subnav li a.active:before {position:absolute; content:""; top:-10px; left:0; height:10px; width:100%; background: url('/templates/client/images/nav_bg.jpg') repeat;/* border:1px solid #000; */ border-bottom:none;box-sizing: border-box;}
section .main_content ul.subnav li a.active:after {position:absolute; content:""; bottom:-10px; left:0; height:10px; width:100%; background: url('/templates/client/images/nav_bg.jpg') repeat;/* border:1px solid #000; */ border-top:none;box-sizing: border-box;-webkit-box-shadow: 0 8px 6px -6px black;      -moz-box-shadow: 0 8px 6px -6px black;           box-shadow: 0 8px 6px -6px black;}
section .main_content ul.subnav li a {display:block;padding:10px;}
section .main_content ul.subnav li a.active {background: red; padding:10px; /* display:block; */ /* height:110%; */;background: url('/templates/client/images/nav_bg.jpg') repeat;border: 0px solid #FFF;border-top: none;border-bottom: none;font-size: 20px;}
section .main_content .back_button {position:relative; padding: 5px 22px; text-decoration: none !important; background: #373737;color: #fff !important;margin-bottom: 10px;display: block;width: 210px;border-radius: 5px;text-align: center;}
.back_button:before {
    position: absolute;
    content: "\f104";
    left: -1px;
    width: 1em;
    height: 1em;
    bottom: 48.4%;
    margin-bottom: -0.4em;
    font-size: 24px;
    z-index: 2;
    font-family: FontAwesome;
    color: #fff;}
@media (max-width:950px) {
.product_img {float:none; width:100%; margin:20px auto;}
.text {float:none; width:100%;}
.text a {text-align:center;}

}
@media (max-width:650px) {
.outer-cta-left, .outer-cta-middle, .outer-cta-right {float:none; display:block; max-width:100%;}
.outer-cta-right .cta p {text-align:center;}
section .main_content ul.subnav li a {display:none;}
section .main_content ul.subnav li {float:none; width:100%;}
section .main_content ul.subnav li a.active {display:block; width:100%}
}
/* Blog */
section .blogitem { border-bottom:1px solid #8AA1AC; }
section .blogitem img { vertical-align:top; float:left; margin:0 0.7em 0.7em 0; }
section .blogitem img:empty {display:none;}
section .blogitem .date { font-style:italic; }
section .blogitem .category { border:1px solid gray; background:lightgray; border-radius:0.5em; font-size:0.9em; padding:0.1em 0.3em; margin-left: 5px;}
section .blogitem  a:not(.category) {color: #ED1B23;margin-left: 5px;font-weight: bold;}

a {}
/* Gallery */
#gallery-categories { list-style: none; padding: 0; margin: 0; /* max-width: 250px; */}
#gallery-categories li { width: 50%; display: block; margin: 0; padding: 1em; /* float:left; */ max-width: 250px; margin: 0 auto;}
#gallery-categories li a { position: relative; display:block; }
#gallery-categories li a span { position: relative; /* right: 0; */ /* bottom: 0; */ background:darkgray; background: rgba(66, 66, 66, 0.58); padding: 0.4em; color: white; margin: -31px auto; text-align: center; display: block; opacity: 1; transition: 0.4s cubic-bezier(0.82, -0.03, 0.75, 1.09); /* padding-bottom: 6px; */}
#gallery-categories li a img { display:block; width:100%; height:auto; }
#gallery-categories li a:hover span {opacity:1;transform: translateY(-10px);}
#gallery-pager { position:relative;}
#gallery-pager ul { list-style: none; padding: 0 0 40px 0; margin: 0 0 -40px 0; overflow-x:scroll; overflow-y:hidden; white-space:nowrap;}
#gallery-pager ul li { display:inline-block; margin:0.2em; border:1px solid transparent;}
#gallery-pager ul li.rslides_here {border-color:#fff; box-shadow: 0px 0px 7px 2px #7D868A;}
#gallery-pager ul li a { display: block;}
#gallery-pager ul li a img { display: block;}
#gallery-pager .prev { position:absolute; left:-0.3em; width:1em; height:1em; bottom:50%; margin-bottom:-0.5em; font-size:2em; z-index:2; font-family: FontAwesome; color: #EE1C23; text-align: center;     background: #fff;}
#gallery-pager .next { position:absolute; right:-0.3em; width:1em; height:1em; bottom:50%; margin-bottom:-0.5em; font-size:2em; z-index:2; color: #EE1C23; font-family: FontAwesome; text-align: center;     background: #fff;}
#gallery-pager ul.js::-webkit-scrollbar { display: none; }

#gallery-photos { position:relative; margin-top: 70px;}
#gallery-photos ul li:active,
#gallery-photos ul li:target { display:block!important; }
#gallery-photos .prev { position:absolute; left:-0.3em; width:1em; height:1em; top:50%; margin-top:-0.5em; bottom:0; font-size:3em; z-index:2; font-family: FontAwesome; color: #EE1C23; text-align: center; background: #fff;}
#gallery-photos .next { position:absolute; right:-0.3em; width:1em; height:1em; top:50%; margin-top:-0.5em; bottom:0; font-size:3em; z-index:2; font-family: FontAwesome; color: #EE1C23; text-align: center; background: #fff;}
#gallery-caption {text-align: center;display: block;margin-top: 10px;}
  
/* Footer */
footer { position:relative; width:100%; background: url('/templates/client/images/bg_pattern.jpg') repeat; padding-bottom: 50px;}
footer > a:first-of-type { position:relative; display:block; width:100%; background: url('/templates/client/images/nav_bg.jpg') repeat; font-family: 'Oswald', sans-serif; text-align:center; margin:0; padding:10px; overflow: hidden; color:#fff; font-size: 24px;}
footer > a:first-of-type:before {position:absolute; content:""; left: 64%; top: -40px; height: 196%; width: 13%; background: url('/templates/client/images/gears.png') no-repeat; overflow:hidden;background-size: contain;}
footer > a:first-of-type:after {position:absolute; content:""; right: 64%; top:0; height: 250%; width: 170%; background: url('/templates/client/images/gears.png') no-repeat; overflow:hidden;transform: rotate(-180deg);background-size: contain;}
footer .copyright {text-align:center;}
.copyright p:first-child {text-transform:uppercase;display: block;/* float: NONE; */text-align: center;border-right: none;margin-bottom: 0;}
.copyright p{ border-right: 1px solid #fff; color: #fff; /* float: left; */ font-family: 'Roboto Condensed', sans-serif; font-size: 18px; padding: 0px 14px;	 display: inline-block; /* text-align: center; */}
.copyright p:last-child {border-right:none;}
@media (max-width:1300px) {	
footer h1:before, footer h1:after {display:none;}
.copyright p {float:none; text-align:center; border-right:none;}
}
/* ResponsiveSlides */
ul.rslides { position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0 auto; max-width: 500px;}
ul.rslides li { -webkit-backface-visibility: hidden; position: absolute; display: none; width: 100%; left: 0; top: 0; }
ul.rslides li:first-child { position: relative; display: block; float: left; }
ul.rslides img { display: block; height: auto; float: left; width: 100%; border: 0; max-width: 500px;}

/* ================================================== Media Queries ================================================== */

/*responsive tables*/
	table.tabletext {position:relative;  width:100%; margin-bottom:30px; box-shadow: 1px 1px 9px rgba(0, 0, 0, 0.25);}
	table.smalltable {box-shadow: 1px 1px 9px rgba(0, 0, 0, 0.25);}
	table tr th {padding:5px 10px; border:none !important;font-size: 18px; background: rgb(70, 70, 70);color: #fff;height: 32px !important;max-height: 32px !important;}
	table tr td {text-align:center; border-top:1px solid #E0DBDB;  padding:5px 10px; background: rgb(241, 238, 238); vertical-align:top;}
	table tr td a {color: #464646; text-decoration:underline;}
	table.tabletext tr td:nth-child(1) {text-align:left;}
	table.smalltable {float:left; border:1px solid #000; width:48%; text-align:center;table-layout: fixed; border:none;margin: 1%; }
	table.smalltable:nth-of-type(1) {/* margin:1%; */clear: both;}
@media (max-width:620px) {
	table.smalltable {float:none; width:100%; margin: 0;margin-bottom: 20px;}
}
@media (max-width:620px) {
	table.smalltext { font-size:12px;}
	table.smalltext tr td { padding:3px;}
	table.smalltext tr:nth-child(2) td { padding:0;font-size:10px;}
}
/*COMPUCAST LOGO CSS start-----------------------------*/
/*.backdrop {position:absolute; top:0; left:0; width:100%; height:100%; background:white; opacity:0.0; z-index:9998; transition:0.3s opacity;}*/
.old-ie {display:none;}
.cc2:hover{fill:rgba(0,0,0,0.4);}

.compucast {display:block; position: relative;  /* bottom: -23%; */ /* right: 0; */margin:10px auto; width:58px; height:64px;  color:black;  border-radius:2px; overflow:hidden;  z-index:9999; transition:0.5s 1.4s;clear: both;}
.compucast.dark {color:white;}
	.logo1, .logo2, .old-ie {position:absolute; top:50%; right: 10px; margin-top: -13px; opacity:1.5; transition:0s}
.compucast:hover, .compucast_hover {width: 225px; background:rgba(0, 0, 0, 0.8); -moz-box-shadow: 1px 7px 16px -7px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 1px 7px 16px -7px rgba(0, 0, 0, 0.3);box-shadow: 1px 7px 16px -7px rgba(0, 0, 0, 0.3);transition:0.3s 0s;}	
.dark:hover { background:rgba(0, 0, 0, 0.8); }
	.compucast p {position:absolute; left:-200px; margin: 0 0 0 10px !important; line-height: 21px; padding: 11px 0 !important; font-family:Arial,"Times New Roman", Times, serif !important; font-size:12px; color: #808080; opacity:0; transition:0.5s 1.4s;text-align: left;}
	.compucast a {font-size:14px; font-weight:bold; color: #000; text-decoration:none; }
	.compucast:hover p {left:0px; opacity:1; transition:0.4s 0.0s;}
	.compucast.dark:hover p { color: #E2DEDE;}
	.compucast.dark a {font-size:14px; color: #fff;}
	
	/*color classes: colored , white and black*/
	.purple {fill:#7F3F98}
	.green {fill:#00A14B}
	.black1 {fill:rgba(0,0,0,1)}
    .black2 {fill:rgba(0,0,0,0.5)}
	.white1 {fill:rgba(255,255,255,1)}
    .white2 {fill:rgba(255,255,255,0.5)}	
@media (max-width:767px) {
.compucast {bottom: -6%;}	
}

/*COMPUCAST LOGO CSS end-------------*/