*,
*:before,
*:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html {
    min-width: 940px;
    font-size: 15px;
}

body {
    font: normal 14px 'robotoregular', sans-serif;
    margin: 0;
    background: #fff;
    color: #666666;
}

@font-face {
    font-family: 'oswaldbook';
    src: url('../font/oswald-regular-webfont.eot');
    src: url('../font/oswald-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/oswald-regular-webfont.woff2') format('woff2'),
         url('../font/oswald-regular-webfont.woff') format('woff'),
         url('../font/oswald-regular-webfont.ttf') format('truetype'),
         url('../font/oswald-regular-webfont.svg#oswaldbook') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'oswaldlight';
    src: url('../font/oswald-light-webfont.eot');
    src: url('../font/oswald-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/oswald-light-webfont.woff2') format('woff2'),
         url('../font/oswald-light-webfont.woff') format('woff'),
         url('../font/oswald-light-webfont.ttf') format('truetype'),
         url('../font/oswald-light-webfont.svg#oswaldlight') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'robotoregular';
    src: url('../font/roboto-regular-webfont.eot');
    src: url('../font/roboto-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/roboto-regular-webfont.woff2') format('woff2'),
         url('../font/roboto-regular-webfont.woff') format('woff'),
         url('../font/roboto-regular-webfont.ttf') format('truetype'),
         url('../font/roboto-regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'robotothin_italic';
    src: url('../font/roboto-thinitalic-webfont.eot');
    src: url('../font/roboto-thinitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/roboto-thinitalic-webfont.woff2') format('woff2'),
         url('../font/roboto-thinitalic-webfont.woff') format('woff'),
         url('../font/roboto-thinitalic-webfont.ttf') format('truetype'),
         url('../font/roboto-thinitalic-webfont.svg#robotothin_italic') format('svg');
    font-weight: normal;
    font-style: normal;

}
.wdp80{width:80%;}
.txtcenter{text-align:center;}
.concenter{margin:0 auto;} 
.mgnt60{margin-top:60px;}
.fnt25{font-size:25px;}
.lh70{line-height:70px;}
.padt7{padding-top:7px;}
.wdp100{width:100%;}

section,
header,
footer {
   /* padding: 2em 0;*/width:100%;
}

#wrapper >.active {
    color: red !important;
    -webkit-transition: color 0.4s;
    transition: color 0.4s;
}

#wrapper >:nth-child(even) {
    background: #222;
    color: #fff;
}

.inner {
    max-width: 1000px;
    margin: 0 auto;
	padding: 0 20px;
	height:auto;
}
.inner2 {
    max-width: 1000px;
    margin: 0 auto;
	padding: 0 20px;
	height:auto;
}


h1, h2, h3, h4, h5, h6, h7 {
    font-weight: normal;
}

.fltL { float: left; }
.fltR { float: right; }
.center { text-align: center; }
.clear{clear:both;}

strong { font-weight: bold; }

a {
    text-decoration: none;
    color: inherit;
}

p {
    line-height: 1.5em;
    margin: 1em 0;
}

nav {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 4em;
    padding: 1em 0;
    background: #354ca3;
    background: #fff;
    color: #fff;
    overflow: visible;
    z-index: 2;
}

nav h1 { margin: 0; }

nav input#navTrigger { display: none; }
nav input#navTrigger + label {
    float: right;
    padding: 0 .25em;
    margin: 0 0.25em;
    font-size: 2em;
    border: 1px solid #999999; 
    opacity: 1;
    cursor: pointer;
	color:#999999;
}
nav input#navTrigger + label:hover {
    opacity: 1;
}

nav input#navTrigger + label span {
    display: block;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
    margin-top: -.1em;
}
/*nav input#navTrigger:checked + label span {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    margin-right: -.1em;
}*/
nav ul {
    display: none;
    position: absolute;
    top: 4em;
    left: 0;
    right: 0;
    padding: 0;
}
nav ul li {
    display: block;
}

nav ul li a {
    display: block;
    padding: 1.333em;
    font:  1.333em/1em "oswaldbook", Arial, Helvetica, sans-serif;
    background: #0051a3;
    background: rgba(0, 60, 154, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-width: 0 0 1px 0;
    color: #fff;
    outline: 0;
}
nav ul li a:hover { background: #d71921;color:#fff; text-decoration:none; }

nav ul li:checked ~ ul{ display:none; }


nav ul li:first-child a {
    border-width: 1px 0;
}
nav input#navTrigger:checked ~ ul {
    display: block;
}
nav input ul li a#navTrigger:checked ~ ul {
    display: none;
}

/*  Bullet Navigator Skin Begin */
.jssorb21 div, .jssorb21 div:hover, .jssorb21 .av {
		background: url(../images/b21.png) no-repeat;
		overflow: hidden;
		cursor: pointer;
	}

	.jssorb21 div {
		background-position: -5px -5px;
	}

		.jssorb21 div:hover, .jssorb21 .av:hover {
			background-position: -35px -5px;
		}

	.jssorb21 .av {
		background-position: -65px -5px;
	}

	.jssorb21 .dn, .jssorb21 .dn:hover {
		background-position: -95px -5px;
	}
/*  Arrow Navigator Skin Begin */	
 .jssora21l, .jssora21r, .jssora21ldn, .jssora21rdn {
                    position: absolute;
                    cursor: pointer;
                    display: block;
                    background: url(../images/a21.png) center center no-repeat;
                    overflow: hidden;
                }

                .jssora21l {
                    background-position: -3px -33px;
                }

                .jssora21r {
                    background-position: -63px -33px;
                }

                .jssora21l:hover {
                    background-position: -123px -33px;
                }

                .jssora21r:hover {
                    background-position: -183px -33px;
                }

                .jssora21ldn {
                    background-position: -243px -33px;
                }

                .jssora21rdn {
                    background-position: -303px -33px;
                }
				
/* about section */
.inner h3{ font-family:'robotoregular'; color:#d71921; font-size:40px; text-align:center; text-transform:uppercase; padding-top:80px; }
.inner hr{width:100px;background:#d71921;height:1px;}
.abtquote{font-family:'robotothin_italic'; text-decoration:italic; font-size:35px; text-align:center; }
.abttxt{text-align:center; margin:0 auto; padding:0 0 40px 0; color:#666666;}

/* products section */
.procontainer{ width:86%;margin:0 auto;}
.procontainer .box{ width:234px; float:left; margin:20px; cursor:pointer; position:relative; }
.procontainer .box .img{height:237px; text-align:center; margin:0 auto;}
.procontainer .box .protit{height:70px; width:234px; background:#d71921; color:#ffffff; text-align:center;}
.procontainer .box .protit .proname{color:#ffffff; text-align:center; font-family:'robotoregular'; font-size:20px;}
.procontainer .box .protit .modname{color:#ffffff; text-align:center; font-family:'robotoregular'; font-size:15px;}
.popup h1{font-family:'robotoregular'; color:#d71921; font-size:25px; text-align:left; margin:0 0 20px 0; border-bottom:1px solid #d71921; padding:10px 0;}
.procontainer .box .zoom-icon{ position:absolute; top:10px; right:10px; background:url(../images/zoom-icon.png) no-repeat; width:25px; height:26px; }



/* services section */
.sercontainer{width:100% margin:0 auto; padding:30px 0;}
.sercontainer .serbox{ width:33%; float:left;}
.sercontainer .serbox .icon{margin:0 auto; width:115px; height:115px;}
.sercontainer .serbox .tit{ font-family:'oswaldbook'; text-transform:uppercase; font-size:30px; padding:15px 0 0px 0; font-weight:400; color:#d71921;text-align:center;}
.sercontainer .serbox p{ text-align:center; padding:0 10px;}
/* Clients section */
.clientcontainer{width:100% margin:0 auto; padding:30px 0;}
.clientcontainer .clbox{ /*width:20%;*/ float:left; height:87px; line-height:87px; margin:10px 0;}
.clientcontainer .clbox img{text-align:center}
/* feedback section */
.fbcontainer{width:100% margin:0 auto;}
.fbcontainer input{ width:31.6%; border:1px solid #d5d4d4; float:left; padding:0 3px 0 10px; height:70px;  color:#666666; margin-right:2.5%; margin-bottom:20px; }
.fbcontainer input:last-child{ margin-right:0;}
.fbcontainer input:focus{border:1px solid #333333;}
.fbcontainer textarea{ width:31.6%;  resize:none;border:1px solid #d5d4d4; float:left; padding:23px 3px 0 10px; height:70px;color:#666666; }
.fbcontainer textarea:focus{border:1px solid #333333;}
.fbcontainer .subbtn {background:#d71921; text-transform:uppercase; display:block; color:#ffffff; width:180px; height:50px; line-height:50px; float:right; text-align:center; cursor:pointer;}
.fbcontainer .subbtn:hover {background:#333333; display:block;}

/* contact section */
.inner2 h3{ font-family:'robotoregular'; color:#ffffff; font-size:40px; text-align:center; text-transform:uppercase; padding-top:80px; }
.inner2 hr{width:100px;background:#ffffff;height:1px;}
.cntcontainer{width:100% margin:0 auto;}
.cntcontainer .cntboxlt{width:45%; float:left; color:#fff;}
.cntcontainer .cntboxrt{width:45%; float:right;color:#fff;}
.social-icon{ /*width:30%;*/ margin:0 auto; text-align:center;}
.social-icon img{ margin: 20px 7px 0 7px; cursor:pointer;opacity:0.4; }
.social-icon img:hover{opacity:1;}
/* footer section */
.footerbg{background:#333333; height:75px; line-height75px; display:block;}
.ftcontainer{width:100% margin:0 auto;height:75px; line-height:75px;}
.ftcontainer .cntboxlt{width:70%; float:left; color:#fff;}
.ftcontainer .cntboxlt ul{margin:0; padding:0;}
.ftcontainer .cntboxlt ul li {float:left; list-style:none; color:#999999;padding:0 6px; font-size:11px;}
.ftcontainer .cntboxlt ul li a{float:left; list-style:none; color:#999999;padding:0 6px; font-size:11px;}
.ftcontainer .cntboxlt ul li a:hover{color:#ffffff; text-decoration:none;}
.ftcontainer .cntboxrt{width:25%; float:right;text-align:right;color:#999999;font-size:11px;}


				

/* Responsive styles */

html {
    min-width: 320px;
}


@media only screen and (min-width: 769px) {

    section,
    header,
    footer {
        width:100%;
    }

    header { padding: 12em 0; }

    nav {
        height: 6em;
        overflow: hidden;
		-webkit-transition: all 0.2s;
		transition: all 0.2s;
		border-bottom:1px solid #d71921;
    }

    nav h1 { text-align: center; }
    nav h1 strong { display: block; }

    nav label { display: none; }

    nav.sticky {
        position: fixed;
        height: 4em;
        padding: 0;
    }

    nav ul {
        position: relative;
        top: 0;
        display: block;
        float: right;
        margin: -1em 0;
    }

    nav ul li {
        float: left;
        margin: 0 ;
    }

    nav ul li a {
        display: block;
        padding: 0 10px;
        height: 6em;
        line-height: 6em;
        font-size: 1em;
        background: none;
        color: #010101;
        border: 0;
    }
    nav ul li a.active {
        background: #d71921;
        color: #fff;
		text-decoration:none;
    }

    #wrapper {
        position: relative;
        z-index: 1;
    }

}
@media only screen and (max-width: 480px) {
.sercontainer .serbox{ width:100%; }
.fbcontainer input{ width:100%;}
.fbcontainer textarea{ width:100%; margin-bottom:15px;}
.cntcontainer .cntboxlt{width:100%; color:#fff;}
.cntcontainer .cntboxrt{width:100%; color:#fff;}
.social-icon{width:100%;}
.ftcontainer .cntboxlt{display:none;}
.ftcontainer .cntboxrt{width:100%;text-align:center;color:#999999;font-size:11px;}
.line img{display:none}
.line.stln{border-bottom:1px solid #fff;}
.clientcontainer .clbox{ width:100%; height:87px; line-height:87px; text-align:center;}
.fbcontainer .subbtn{width:100%;}
.procontainer .box{ width:234px; margin:20px auto; cursor:pointer; position:relative; }
.fa-modal{width:100%;}
}
@media only screen and (max-width: 640px) {
.ftcontainer .cntboxlt{display:none; width:100%; text-align:center; float:none;}
.ftcontainer .cntboxrt{width:100%;text-align:center;color:#999999;font-size:11px;}
.sercontainer .serbox{width:100%; padding-bottom:20px;}
.procontainer{ width:93%;margin:0 auto;}
.fa-modal{width:100%;}
}