* {margin: 0;padding: 0;}
body{font: 14px Georgia,"Times New Roman",Times,serif;background: #348694 url('../images/bg.jpg');padding: 20px 0 50px 0;}h1 {font: "Roboto Condensed", Arial, Helvetica, sans-serif;font-weight: normal;letter-spacing: -1px;}
h2{font: "Roboto Condensed", Arial, Helvetica, sans-serif;font-weight: normal;letter-spacing: -1px;color: #000000;}
p {padding: .75em 0;line-height: 1.7em;    }
a {color: #0C8DA6;text-decoration: underline;}
a:hover {text-decoration: none;}
.logo{ float:left; width:80px; height:100px;}
.logo img{ width:100%;}
.company-name{ width:100%; position: absolute; text-align:center; top:0px; left:0px;color: #2C81BA; font-size:22px; font-weight:bold; padding:10px;box-sizing: border-box;}
.company-head{ width:88%; float:right; height:auto;}
.comany-year{ float:right; width:90px; height:60px;}
.comany-year img{ width:100%;}
.compant-sect{ float:left; position:relative; top:55px;height:50px; width:100px;}
.compant-sect img { width:100%}
/* page */
#page {margin: 0 auto;width: 960px;padding: 0 12px 12px 12px;background: #FFFFFF;-webkit-border-radius: 12px;-moz-border-radius: 12px;border-radius: 12px;    }
#heading{padding-left:20px;margin-bottom: 30px;font: 2.2em "Roboto Condensed", Arial, Helvetica, sans-serif;font-weight:bold;letter-spacing: -1px;color: #FFF;background: transparent url(../images/menubar.jpg) no-repeat;}
/* header */
#header {padding: 10px 0;position:relative; width:100%}

/* menu */
#menu {float: left;padding-left: 20px;}
#menu ul {list-style: none;}
#menu ul li {display: block;float: left;font: 12px "Roboto Condensed", Arial, Helvetica, sans-serif;line-height: 30px;padding-right: 20px;}#menu ul li a {display: block;float: left;text-decoration: none;color: #C4875D;}
#menu ul li.active a, #menu ul li a:hover {color: #2D2322;}
/* menu top */
#menubar{ display: block;float: right;width: 700px;height: 50px;margin: -42px 0 0 0;text-align: center;background: #318bca;
background: -moz-linear-gradient(top,  #318bca 0%, #297bb3 40%, #297bb3 100%);
background: -webkit-linear-gradient(top,  #318bca 0%,#297bb3 40%,#297bb3 100%);
background: linear-gradient(to bottom,  #318bca 0%,#297bb3 40%,#297bb3 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#318bca', endColorstr='#297bb3',GradientType=0 );
font: Arial, Helvetica, sans-serif;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
ul#menu li{ list-style: none;margin: 2px 0 0 0;display: inline;background: transparent;}
ul#menu li a{ float: left;height: 25px;margin: 10px 0 0 0;padding: 5px 15px 0 15px;text-align: center;color: #FFF;text-decoration: none;background: transparent;} 
ul#menu li.current a{ background: #225B82;border: 1px solid #1F4763;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}/* introimg */
#introimg {display: block;padding-bottom: 12px;}
/* main */
#main {padding: 5px 5px 5px 5px;background: #FFFFFF;border: 1px solid #DFECEE;-webkit-border-radius: 12px;-moz-border-radius: 12px;border-radius: 12px;}
/* sidebar */
#sidebar{float: left;width: 265px;background-color: #FFF;    -webkit-border-radius: 12px;-moz-border-radius: 12px;border-radius: 12px;}
#sidebar h2 { font-family:"Roboto Condensed", Arial, Helvetica, sans-serif;letter-spacing: -1px;color: #FFF;background: #318bca;
background: -moz-linear-gradient(top,  #318bca 0%, #297bb3 40%, #297bb3 100%);
background: -webkit-linear-gradient(top,  #318bca 0%,#297bb3 40%,#297bb3 100%);
background: linear-gradient(to bottom,  #318bca 0%,#297bb3 40%,#297bb3 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#318bca', endColorstr='#297bb3',GradientType=0 );}
#sidebar .box {padding: 1.5em 0 2em 0;}
#sidebar p {line-height: 2em;}
#sidebar ul {list-style: none;padding: 2.25em 0 2.75em 0;}
#sidebar ul li {padding: .3em 0 .3em .3em;line-height: 2.5em;border-top: 1px solid #DFECEE;}
/* content */
#content{float: right;width: 610px;padding: 20px 30px 0 30px;background-color: #F9F9F9;border: 1px solid #DFECEE;-webkit-border-radius: 12px;-moz-border-radius: 12px;border-radius: 12px;}
#content .post {padding: 0 0 2.5em 0;}
#content .entry {padding-top: .75em;}
#content h2 {font: 2.75em "Roboto Condensed", Arial, Helvetica, sans-serif;letter-spacing: -1px;}
#content h2 a {color: #333333;text-decoration: none;
}p.postmeta {color: #999999;}
p.readmore {padding-top: 0;    padding-right: 1em;text-align: right;}
p.readmore a {display: block;float: right;width: 100px;height: 20px;text-align: center;line-height: 20px;text-decoration: none;background: #F0F6F7;border: 1px solid #D9E8EB;-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
p.readmore a:hover {color: #087993;}.clear{ clear:both; height:0px; margin:0px; padding:0px;}
.clearing {clear: both;height: 1px;overflow: hidden;}/* footer */
#footer {clear: both;width: 960px;height: 80px;margin: 0 auto;}
#footer p {clear: both;text-align: center;}
#footer a {color: #C4875D;}
.social-links{float:right; padding-top:10px; padding-right:40px}
.social-links a{ display:inline-block; margin:0 5px;}
.side-box{padding: 0 0 0 0; background-color: #F0F0F0; border: 1px solid #DFECEE; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px;}
.side-box-x{padding: 20px 0 0 0; background-color: #F0F0F0; border: 1px solid #DFECEE; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px;}
.side-box h2{ font-size:22px; line-height:40px; padding:0 20px; border-radius: 10px 10px 0px 0px;}
.box4
        {
            border-collapse: collapse;
            width: 165px;
            height: 230px;
            border: 1px solid #e5e5e5;
            margin: 15px 3px;
            display: inline-block;
            background-color: #F0F0F0;
        }
        .box5
        {
            border-collapse: collapse;
            width: 165px;
            height: 245px;
            border: 1px solid #e5e5e5;
            margin: 15px 3px;
            display: inline-block;
            background-color: #F0F0F0;
        }
        .box
        {
            border-collapse: collapse;
            width: 165px;
            height: 300px;
            border: 1px solid #e5e5e5;
            margin: 15px 3px;
            display: inline-block;
            background-color: #F0F0F0;
        }
        .box4 .insidebox4
        {
            border-collapse: collapse;
            display: block;
            width: 155px;
            height: 220px;
            border: 1px solid #e5e5e5;
            margin: 5px;
            background-color: White;
        }
        .box5 .insidebox5
        {
            border-collapse: collapse;
            display: block;
            width: 155px;
            height: 235px;
            border: 1px solid #e5e5e5;
            margin: 5px;
            background-color: White;
        }
        .box .insidebox
        {
            border-collapse: collapse;
            display: block;
            width: 155px;
            height: 285px;
            border: 1px solid #e5e5e5;
            margin: 5px;
            background-color: White;
        }
        #productsimg
        {
            border-collapse: collapse;
            display: block;
            width: 150px;
            margin: 1px;
            border-spacing: 2px;
            border-color: #e5e5e5;
            font-family: Calibri;
        }
        #productsdetail
        {
            display: block;
            border-collapse: collapse;
            border-spacing: 2px;
            border-color: gray;
            font-family: Calibri;
            color: #1b9ddf;
            font: 14px/22px Calibri;
            padding: 5px 0 0 10px;
            line-height: 18px;
        }
        #shortdetail
        {
            padding: 5px 0 10px 0;
            border-collapse: collapse;
            display: block;
            width: 146px;
            color: #626262;
            font: 12px/16px Calibri;
        }

#Contimg{ width:100%}
#Contimg h3{ width:100%; float:left; box-sizing: border-box; padding:0 0 0 40px; position:relative; margin-bottom:10px; line-height:30px; font-size:15px;}
#Contimg h3 img{ position:absolute; left:0; top:0;}

.address{ width:100%; float:left; margin:10px 0px;}
.address .add-co{ float:left; width:40%;}
.address .location{ float:left; width:60%;}
.address .location img{ width:100%;}
@media(max-width:500px){
*{box-sizing: border-box; padding:0px; margin:0px;}
.logo { float: le wft; width: 64px; height: 86px;} 
.company-name{ width:80%; float:right; text-align:left; padding:0 0 5px; position:static;}
.company-head{ width:80%}
.compant-sect{ top:0px;width:88px;}
#menubar{ height:35px; margin:0px;}
#page{ width:100%;}
#header{ height:auto;}
#menubar{ width:100%;}
#content{ width:100%!important; padding: 10px 10px 0 10px;}
#sidebar{ width:100%;}
#sidebar table{ width:100%; padding:0 10px;}
#footer{ width:100%; height:auto; text-align:center;}
#footer #menu{ padding:0px; width:100%; text-align:center;}
#footer #menu li { display:inline-block; float:none; padding:3px; line-height:18px;}
.box4{ margin: 2px 0px; padding:2px;    width: 49.5%; }
.box4 .insidebox4{ width:100%; margin:0px;}
.box4 .insidebox4 #productsimg { width:100%; height:150px;}
.box4 .insidebox4 #productsimg img { width:100%; height:100%;}
.box5{ margin: 2px 0px; padding:2px;  width: 49.5%;}
.box5 .insidebox5{ width:100%; margin:0px;   }
.box5 .insidebox5 #productsimg { width:100%; height:150px;}
.box5 .insidebox5 #productsimg img { width:100%; height:100%;}
.box{ margin: 2px 0px; padding:2px;     width: 49.5%;}
.box .insidebox{ width:100%; margin:0px;}
.box .insidebox #productsimg { width:100%; height:150px;}
.box .insidebox #productsimg img { width:100%; height:100%;}
#shortdetail{ width:100%;}
#Contimg h3{ width:100%; float:left; box-sizing: border-box; padding:0 0 0 40px; position:relative; margin-bottom:10px; line-height:30px;}
.address .add-co{ float:left; width:100%; margin-bottom:10px;}
.address .location{ float:left; width:100%;}
#contact-info{ width:100%;}
#contact-info td { width:100%; float:left;}
#contact-info td > textarea{ width:100%!important}
#feedback{ width:100%;}
#feedback td { width:100%; float:left;}
#feedback td > textarea{ width:100%!important}
	}
	
	@media(max-width:360px){
		
		}