@charset "utf-8";
/* CSS Document */
*{padding:0; margin:0; outline:0;}
body{font-family: 'Open Sans', Arial, sans-serif; padding:0; margin:0; outline:0; max-width:100%;}
.main{width:100%; float:left; width:100%; max-width:100%; overflow:hidden;}
.wrapper{width:1200px; margin:0 auto; position:relative;}
.wrapper1{width:600px; margin:0 auto; position:relative;}

 .jssorb05 {
            position: absolute;
        }
        .jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
            position: absolute;
            /* size of bullet elment */
            width: 16px;
            height: 16px;
            background:url(../img/b05.png) no-repeat;
            overflow: hidden;
            cursor: pointer;
        }
        .jssorb05 div { background-position: -7px -7px; }
        .jssorb05 div:hover, .jssorb05 .av:hover { background-position: -37px -7px; }
        .jssorb05 .av { background-position: -67px -7px; }
        .jssorb05 .dn, .jssorb05 .dn:hover { background-position: -97px -7px; }

       
        .jssora22l, .jssora22r {
            display: block;
            position: absolute;
            /* size of arrow element */
            width: 40px;
            height: 58px;
            cursor: pointer;
            background:url(../img/a22.png) center center no-repeat;
            overflow: hidden;
        }
        .jssora22l { background-position: -10px -31px; }
        .jssora22r { background-position: -70px -31px; }
        .jssora22l:hover { background-position: -130px -31px; }
        .jssora22r:hover { background-position: -190px -31px; }
        .jssora22l.jssora22ldn { background-position: -250px -31px; }
        .jssora22r.jssora22rdn { background-position: -310px -31px; }
		
		/*end of slider css*/

.top_line{width:100%; height:35px; font-size:12px; background-color: rgba(0, 0, 0, 0.8); color:#FFFFFF;}
.top_line_left{width:50%; float:left; margin-left:10%; margin-top:10px; font-size:12px;}
.top_line_right{width:30%; float:left; margin-right:10%; margin-top:10px;} 

.top_social{margin-top:10px; width:100%;} 

.top_social span{float:right; font-size:15px; color:#333333;}

.register{float:right;}

	.register ul{list-style:none;}

	.register ul li{float:left; margin-left:10px;}

	.register ul li a{font-size:12px; text-decoration:none; cursor:pointer; font-weight:bold; padding:5px 10px 5px 10px;; color:#191919; background:#FFFFFF;}

	.register ul li a:hover{background:none; color:#FFFFFF;}

.icon_logo{width:100%; float:left;}


.logo{ float:left; margin-top: 30px; padding: 0 0 0 15px;}
.logo a{ text-decoration:none;}

.social_icon{float:right; position:absolute; top:30px; right:10px; width:300px;}

.top_menu{float:right; margin-top:-70px;}
.top_menu ul{list-style:none;}
.top_menu ul li{float:left; padding-top: 30px; }
.top_menu ul li a{float:left; text-decoration:none; font-size: 12px; border: none; font-weight: 700; color: #777; text-transform: uppercase; padding-bottom: 6px;
padding-top: 5px; line-height: 30px; font-weight: 700; transition: all .3s ease; padding-left:10px; padding-right:10px;}
.top_menu ul li a:hover{background:#e1e1e1;}

.social_media{float:right; margin-top:20px;}
.social_media ul{list-style:none;}
.social_media ul li{float:left; width:32px; height:32px; margin-left:10px;}
.social_media ul li a{float:left; width:32px; height:32px; background:url(../images/social_media.png) no-repeat 0 0;}
.social_media ul li.tw a{background-position:-42px;}
.social_media ul li.in a{background-position:-84px;}
.social_media ul li.p a{background-position:-126px;}
.social_media ul li.rss a{background-position:-168px;}
.social_media ul li.sms a{background-position:-211px;}

.main_slider{width:100%; float:left;}

.main_marquee{width:100%; float:left; margin-top:20px;}
.main_marquee span{float:left; width:100%; text-align:center; font-weight:bold; font-size:20px; font-family:Arial, Helvetica, sans-serif; color:#2f87c3;}
.main_marquee a{text-decoration:none; color:#666666; font-size:13px; color:#333333;}

.social_icon{float:right; position:absolute; top:30px; right:10px; width:300px;}

.about_main{width:100%; float:left; margin-top:20px;}
.about_main ul{list-style:none;}
.about_main ul li{float:left; width: 23.5%; float:left; background:#f8f8f8; text-align:center; margin-left:10px;}
.about_main ul li h2{font-size:17px; width:100%; float:left; text-align:center; color:#000000; margin:20px 0px;}
.about_main ul li p{width:80%; float:left; text-align:center; color:#333333; font-size:13px; margin:20px 0px;margin-left: 25px; line-height: 21px;}
.about_main ul li a{width:100%; float:left; text-align:center; text-decoration:none; color:#FFFFFF; font-size:16px; background:#428bca; padding:20px 0px; font-weight:bold;}
.about_main ul li.first{margin:0;}


.project_main{width:100%; float:left; margin-top:10px;}
.project_main h2{ width:100%; font-weight:bold; font-size:20px; background:#f9f9f9; padding:15px 0px; text-align:center; color: #333; margin-bottom: 20px; font-style: normal;}
.project_main ul{list-style:none;}
.project_main ul li{ width:23.33333%; float:left; margin-left:10px; margin-top:15px; position:relative; min-height:300px;}
.project_main ul li.first{margin-left:0; margin-top:15px;}
.project_main ul li a{ width:100%; float:left; text-decoration:none; position:relative; z-index:1;}
.project_main ul li a img{width:100%; z-index:1;}
.project_main ul li span a{text-decoration:none; float:left; font-size:13px; color:#333333; margin-top:10px; background:url(../img/c-finger-pointing.png) no-repeat 0 6px; padding-left:20px;}


.project_main ul li a span{background:none; color:#FFFFFF; font-size:0px; width:96.3%; float:left; height:55px; position:absolute;
 left:0; bottom:3px; z-index:9; padding-left:10px; font-style:italic;}
.project_main ul li a span:hover{background:#666666; color:#FFFFFF; font-style:italic; font-size:30px; padding-top:15px; width:96.3%; float:left; height:55px; position:absolute; left:0; bottom:3px; z-index:9; padding-left:10px; opacity:0.6;}



.last_footer{width:100%; float:left; margin-top:20px;}
.left_ft{width:50%; color:#FFFFFF; font-size:12px; float:left; text-align:left; color:#FFFFFF;} 
.right_ft{width:50%; color:#FFFFFF; font-size:12px; float:left; text-align:right; color:#FFFFFF;} 

.scrollup {position:absolute; right:60px; bottom:-20px; width: 32px; height: 32px; background:url(../img/arrow_ft.png) no-repeat 10px 15px #222222;}
a.scrollup{outline: 0; text-align: center;}

.bannerform2 { position: absolute; top: 50px; left:0px; z-index: 999999999; width:100%;}
.bannerform2 ul {list-style: none;}
.bannerform2 ul li{float:left; list-style: none; margin-top: 15px; margin-left: 10px; text-align:center; width:100%; float:left;}
.bannerform_child2{width:450px; height: 50px; background: #ffffff; border: 1px solid #999999; color: #999999; padding-left: 5px; font-weight: bold; border-radius: 10px;}
.bannerform_child_btn { padding: 12px 30px 12px 30px; background: #2f87c3; color: #FFFFFF; font-size: 15px; border: none; font-weight: bold; border-radius: 10px; cursor:pointer;}
.bannerform2 ul li a{ text-decoration:none;}


.about_bnr{width:100%; float:left;}
.about_bnr img{width:100%;}

	.register_form{width:30%; margin:0 auto;  color:#333333;}

	.register_form ul{list-style:none;}

	.register_form ul li{float:left; margin-top:10px; font-size:15px; color:#999999; font-weight:bold; width:100%;}
      .register_form ul li span{margin-left:10px;}
	.form_child{width:100%; height:40px; font-size:14px; padding-left:10px; color:#999999; font-weight:normal; border:1px solid #999999; border-radius:5px;} 

	.child_btn{padding:10px 20px 10px 20px; cursor:pointer; font-weight:normal; font-size:14px; background:#999999; color:#FFFFFF;
	 border:1px solid #999999; border-radius:5px; margin-top:15px;}

	.child_btn:hover{background:#FFFFFF; color:#999999;}


.about_cntnt{width:100%; float:left; margin-top:10px;}
.about_cntnt h1{width:100%; float:left; font-size:25px; color:#000000; border-bottom: 1px solid #eee; padding-bottom:20px;}
.about_cntnt h2{width: 100%; float:left; font-size: 18px; color:#999999; font-weight:normal; margin-top:30px;}
.about_cntnt p{ width:100%; float: left; text-align: justify; font-size: 15px; color:#666666; margin-top:10px; line-height:23px;} 
.about_cntnt p span{ width:200px; height:165px; float:right; padding-left:10px; padding-bottom:10px;}


.add_prod{width:100%; float:left; margin-top:10px;}
.add_prod ul{list-style:none;}
.add_prod ul li{float:left; width:49%; color:#333333; font-size:15px; line-height:40px; margin-bottom:20px;}
.select_form{width:100%; float:left; height:40px; border-radius:5px; border:1px solid #999999; padding-left:5px;}
.select_form1{width:100%; height:100px; float:left; border-radius:5px; border:1px solid #999999; padding-left:5px;}
.select_btn{padding:10px 12px; background:#337ab7; border-radius:5px; color:#FFFFFF; font-size:14px; border:1px solid #2e6da4; cursor:pointer;}
.select_btn:hover{ background:#286090;}

.line{width:100%; float:left; margin-top:20px;}

.gallery_main{width: 100%; float: left;}
.gallery_menu{width: 20%; float: left; margin-top: 20px; }
.gallery_menu ul{list-style: none; margin: 0;}
.gallery_menu ul li{float: left; position: relative;}
.gallery_menu ul li a{ float: left; text-decoration: none; font-size: 13px; background: #515151 url(../img/plus-icon.jpg) no-repeat right; padding-left: 5px; color: #FFFFFF; width: 222px; margin-bottom: 1px; line-height: 40px; font-weight: bold;}
.gallery_menu ul li a:hover{ background:#393939;}

.gallery_menu ul li:hover ul{position:absolute; top:0; left:227px; display:block;}
.gallery_menu ul li ul {display:none;}
.gallery_menu ul li ul li{float:left;}
.gallery_menu ul li ul li a{float:left; background-image:none;}



.right_gl{width: 80%; float: right;}
.right_gl ul{ list-style: none;}
.right_gl ul li {float: left; width: 22%; margin-left: 15px; margin-top: 20px; border: 1px solid #999999; padding: 5px; -webkit-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.75);
 -moz-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.75); box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.75); min-height: 322px;}
 
 .right_gl ul li p { color: #3d81bb; font-size: 15px; float: left; font-weight: bold; margin-bottom: 10px; width: 100%; text-align: right; line-height: 30px;}
 .right_gl ul li img {border: 1px solid #DDD; padding: 5px; margin-bottom: 10px; width: 95%;}
 .right_gl ul li a {float: left; padding: 10px 15px; text-decoration: none; background: #515151; color: #FFFFFF; font-size: 12px; margin-top: 10px; border-radius: 5px; font-weight: bold;}
 .right_gl ul li a:hover{background:#333333;}

h6{width:100%; float:left; font-size:20px; color:#666666;}

.detail_main{width:75%; float:right;}
.detail_main h1{width:100%; float:left; font-size:20px; color:#333333; margin-bottom:15px;}
.detail_main ul{list-style:none;}
.detail_main ul li{float:left; width:40%;}
.detail_main ul li img{width:100%;}
.detail_main ul li a{float: left; margin-top: 10px; background: #666666; color: #FFFFFF; font-size: 14px; border-radius: 5px; text-decoration: none; padding: 7px 10px 7px 10px;}
.detail_main ul li.last{float:right; width:50%;}

.five_gl { float: left; width:100%; margin-top:20px;}
.five_gl ul{list-style: none;}
.five_gl ul li{float:left; width:20%; height:20%; margin-right:10px;}

.five_gl h2 { width:93%; float: left; font-size: 16px; color: #000; background: none repeat scroll 0% 0% #E5E5E5; height: 36px; line-height: 36px; 
border-radius: 5px 5px 0px 0px; float: left; padding: 0px 15px; border-bottom: 1px solid #F8F8F8; font-weight: bold; text-transform: uppercase; margin-top:20px;}

.five_gl p{ width:100%; float:left; font-size:14px; color:#666666; margin-top:10px;}


.table_main{width:100%; float:left;}
.table_main h2{width:93%; float: left; font-size: 16px; color: #000; background: none repeat scroll 0% 0% #E5E5E5; height: 36px; line-height: 36px; 
border-radius: 5px 5px 0px 0px; float: left; padding: 0px 15px; border-bottom: 1px solid #F8F8F8; font-weight: bold; text-transform: uppercase; margin: 0px;}
.table_main h2.last{margin-top:5px;}
.table_main p{}


.table{width:100%; float:left; border:none;}
.tr{width:100%; float:left;}
.td{width: 46.777%; float:left; border:1px solid #d0d0d0; padding:5px 0px 5px 10px;}


.footer_main{ width:100%; float:left; background:#515151; margin-top:20px;} 
.footer{width:100%; float:left; margin:20px 0px;}
.footer ul{list-style:none;}
.footer ul li.first{margin-left:0;}
.footer ul li{float:left; width:24%; margin-left:10px; display:block;}
.footer ul li h5{ width:100%; float:left; font-size:15px; color:#FFFFFF; font-weight:bold; margin-bottom:10px;}
.footer ul li p{width:100%; font-size:12px; float:left; margin-bottom:10px; color:#FFFFFF; line-height:20px;}

.footer ul li ul{list-style:none;}
.footer ul li ul li{float:left; width:100%;}
.footer ul li ul li a{float:left; width:100%; text-decoration:none; font-size:12px; color:#FFFFFF; padding-top:10px;}

.footer ul ul ul li{width:56px; height:56px; float:left; padding-left:5px; padding-bottom:10px; !important;}
.footer ul ul ul li.first{padding-left:0;}
.footer ul ul ul li img{width: 100%; height: 100%;}


ul.topnav {
  list-style-type: none;
  float:right;
  margin: 0;
  padding: 0;
  overflow: hidden;
  float:right;
  width:53%;
  margin-top: -54px;
}

ul.topnav li {float: left;}

ul.topnav li a {
  display: inline-block;
  color: #777;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  transition: 0.3s;
  font-size: 17px;
}

ul.topnav li a:hover {background-color: #111; color:#FFFFFF;}

ul.topnav li.icon {display: none;}

@media screen and (max-width:680px) {
  ul.topnav li:not(:first-child) {display: none;}
  ul.topnav li.icon {
    float: right;
    display: inline-block;
	
  }
}

@media screen and (max-width:680px) {
  ul.topnav.responsive {position: relative;}
  ul.topnav.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  ul.topnav.responsive li {
    float: none;
    display: inline;
  }
  ul.topnav.responsive li a {
    display: block;
    text-align: left;
  }
}