body	{width: 100%; overflow-x: hidden;}

header	{position: relative; top:0; left:0; width:100%; height:120px; min-width:1200px; z-index: 100; top: 0; transition: all 0.5s; border-bottom: 1px solid transparent;}
header a{color:white;}
.bold	{font-weight: bold;}

header:hover #logo	{background-image: url("../img/logo.png") !important;}



#bar_box	{width: 30px; height:20px; position: fixed;z-index: 1000; right: 30px; top:15px;}
.bar	{width:100%; height:4px; background:#ff6b57 !important; margin-bottom:3px; transition: all 0.5s;position: relative;}
#home	{width:50px; height:50px; color:#7F7F7F; position:absolute; margin-top:10px; left: 30px;}
#home i	{font-size:40px; width:25px; height:25px; color:white;}
#m_menu_top	{width: 100%; height: 60px;}

.bar1	{transform: rotate(45deg); margin-top:7px;}
.bar2	{opacity: 0;}
.bar3	{transform: rotate(-45deg);margin-top:-14px; }



#m_header	{position:fixed; width: 100%; height:100%; top: 0; right:-100%; transition: all 0.5s;}
#m_header_color	{position: absolute; width: 100%; height: 100%; background: black; opacity: 0.7;}
#header_inner	{width: 90%; height: 100%; right: 0px; position: absolute; background:black;}
#header_inner hr{width: 85%; margin: 0 auto; height: 3px; border: none; background: white; margin-top: 10px; background: #ff6b57;}
#header_inner p	{color:white; padding: 5px 20px 5px 23px; font-size: 2vh;}
#header_inner p:nth-of-type(1)	{margin-top: 20px;}


.m_nav_title h3	{
	padding-left:23px;
	font-weight: bold !important;
	font-size: 20px !important;
	color: white;
    line-height: 52px;
    position: relative;
}
.m_nav_title p {
    position: absolute;
    top: 0px;
    right: 20px;
    transition: all 0.5s;
    transform: rotate(0deg);
}
.m_menu_box	{
	padding: 0px 32px;
    background: #000000;
    box-sizing: border-box;
    height: 0%;
    overflow: hidden;
    display:none;
    transition: all 0.5s;
}
.m_sub_title	{
	padding: 8px 0;
    position: relative;
    padding-left: 8px;
    font-size: 14px;
}
.contact_us	{margin-top: 70px;}
.m_sub_title a	{color: #a8a8a8;}
.m_skyblue	{line-height: 30px;}
.on	.m_menu_box	{display: block}
.block	{right: 0% !important; }
.none	{opacity: 0 !important;}


#header_color	{background: black; width: 100%; height:100%; position: absolute; margin-top: -10px; border-radius: 30px; opacity: 0.2; padding-right: 1200px;}
#bar_box	{display: none;}

.sub_title	{    padding-top:32px;}

.sub_title a:first-child li	{border-radius:0px;}
.sub_title a:last-child li	{border-radius:0px;}

.sub_title a li	{background:none;}

#bat span	{font-weight: normal;}

.inblock	{display: inline-block; box-sizing:border-box;}
#header_top	{position: relative; top:0; left:0; width:100%; height:100%; background:none; transition: all 0.5s; z-index: 100}
.width	{width: 1200px; margin:0 auto; height: 100%; text-align: center;}
#top_left	{width: 27%; text-align: left;height: 100%;}
#top_center	{width: 49%; text-align: left; height: 100%;}
#top_center img	{height: 75px; margin-top:20px; margin-left:30px; opacity: 0; transition: all 0.5s;}

#logo	{ width:225px; height:75px; background-image: url("../img/logo2.png"); background-size: 100% 100%; margin-top:20px; margin-left:30px; transition: all 0.5s;}
header:hover #logo	{background-image: url("../img/logo3.png");}

header:hover #top_center img	{opacity: 1;}

#top_right	{width:40%; height:100%; font-size: 14px; text-align:left;position: absolute; right:150px;}
#top_right p{font-size: 16px; color:#ff6b57;font-weight: bold;}

nav	{position: relative; top: 35px; left:0; width: 100%; height:51.5px; box-sizing: border-box; z-index: 10; color:black; transition: all 0.5s;}
.nav_title	{display: inline-block; width:19%; height: 35px; text-align: center;  box-sizing: border-box; cursor: pointer; font-size: 16px; transition: all 0.5s; border-radius: 10px; line-height: 35px;
color:white; position: relative; z-index: 1;}
.sub_title	{position: absolute;width: 199px; display: inline-block; margin-left:-100px; text-align: center; height: 100%; margin-top:-24px; padding-top:40px;}

.sub_title li	{line-height: 25px; padding: 7px 0; height: 25px; background: #0b79db;}
.sub_title a:last-child li	{border-radius:0px 0px 25px 25px}
.skyblue:hover{color:lightgray;}
.skyblue:hover .submene_sub li	{color:white !important;}

.nav_title:hover .menu_box	{visibility: visible; opacity: 1; margin-top:10px; transition: all 0.5s;}

.menu_box	{width: 100%; height: 100%; padding:5px; visibility:hidden; box-sizing:content-box; z-index: 1000; position: relative;
font-weight:normal; color:white; opacity: 0; margin-top:0px;}
.menu_img	{width: 350px; height: 270px; background: green;position: absolute;}

#navmenu	{position:absolute; height: 150px; bottom: 40%;width: 100%;}
.menu_img img	{width:100%; height:100%;}
#menu_bottom	{position: absolute; left:0px; bottom:0px; width: 100%; height:80%; background:none;}
#menu_bottom div{display: inline-block;box-sizing:border-box}

#top_img span	{text-shadow: 2px 2px 0px grey;}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
.sub_title	{margin-left:-30px!important;}
#model	{margin-top:-150px!important;}
#aa	{margin-top: -122px;}
.b3d	{color:#194768 !important; border:1px solid #194768;}
}

@media screen and (max-width:1200px){
#top_right	{width:47%;}
	
#media	{background-size: 100% 800px!important;}
#mebtn	{width:100%; height:0% !important; margin-top:-785px; z-index:0!important;}

.mobilepopup.open .mobilepopup-overflow	{width:100%!important; height:100%!important;}
.mobilepopup-outer	{max-width:900px !important; max-height:1100px !important;}
.mobilepopup.open .mobilepopup-outer .mobilepopup-inner .content	{font-size: 16px!important;}
.mobilepopup.open .mobilepopup-outer .mobilepopup-inner .header	{font-size: 50px!important;}

#hs	{position: absolute; top: 360px; left:105px !important; opacity: 0; transition: all 1s!important;}
#hs img{width:350px!important;}

#down	{position: absolute; top: 80px; left:780px !important; opacity: 0; transition: all 1s!important;}
#down img{width:350px!important;}

#menu_bottom	{padding-bottom:10px; height: 40%;}
#button	{top:680px !important; left:140px!important; width: 110px!important; height:40px!important;}
#button1{top:680px !important; left:280px!important; width: 110px!important; height:40px!important;}
.b3d	{font-size:17px!important; line-height:40px!important;}
.demo_title	{font-size: 27px!important; padding-top:10px!important; padding-bottom:10px!important;}
.demo_sub	{padding-bottom:10px!important;}
.loopslider	{min-height:auto;}
#top_img	{background-repeat: no-repeat; background-size: 100% 100% !important;}
}
@media screen and (max-width:768px){
	#header_top	{height: 50%;}
	#logo	{background-image: url("img/logo2.png") !important; width: 160px !important; height: 60px; margin-left:-30px; margin-top:-15px;position: absolute; opacity: 1; transition: all 0.5s;}
	#bar_box	{display: block;}
	
	header	{min-width: 100%; height: 50px;}
	#top_right	{display: none;}
	main	{min-width: 100%; margin-top:-51px;}
	#work	{min-width: 100%; height:2250px;}
	.width	{width: 100%;}
	#company	{min-width: 100%;}
	#map	{min-width:100%;}
	#copy	{min-width: 100%; height: 380px;}
	iframe	{width: 100%;}
	#back	{max-width: 100%;}
	
	
	
	#top_center	{width: 100%;}
	
	.slider__content h1	{margin-left:20px; margin-top:30px; font-size: 8.1vh; width: 75%;}
	
	.slider__slide:nth-of-type(1) h1 	{margin-top:30px; margin-left:20px; font-size: 7vh;}
	.slider__slide hr	{margin: 40px 0px 20px 0px; margin-left:20px;     width:80%;}
	.slider__slide:nth-of-type(1) h2	{width: 80%; margin-left:20px;}
	.slider__slide p	{margin-left:20px; width:80%; font-size: 2.5vh;}
	
	.slider__content a	{bottom: 20px;}
	.go-to-prev	{left:110px;}
	.go-to-next	{right:110px;}
	
	#ba li	{width:100%; margin-top: 200px; padding: 0px;}
	#ba li:first-child	{margin-top:0px;}
	#ba li p	{font-size: 2.5vh;}
	
	#new_img	{background-image: url('img/m_center_m1.jpg');}
	
	#company	{height: 820px; padding: 50px 0;}
	
	#cpl	{width:100%; padding-right: 0px; height: 500px !important; border:none;}
	#cpr	{width:100%; padding-left:0px;}
	
	#company .width div	{text-align: center;}
	#mail div p	{width:100%; text-align: center; margin-bottom: 10px; font-size: 4vh;}
	#cpinput	{width:60%; text-align: center;}
	input	{padding-left: 0px;}
	#mail div	{width: 99%;}
	#show	{font-size: 2.5vh;}
	#cpl input[type=checkbox]	{margin-left:1%; width: 100%; height: 25px;}
	#submit	{ width: 40% !important;}
	
	.contact	{height:23%;}
	.contact p	{font-size: 4vh;}
	.contact p span	{font-size:2.5vh;}
	.icon	{height:50px !important; width:50px; font-size: 4vh; margin-left: 5%;}
	.fa	{position: relative; top: -13px;}
	#cpr img	{position: relative; top: -7px;}
	
	#story	{height: 100%; padding-bottom: 10px;}
	#story h1	{font-size:4vh;}
	
	#map	{height: 100%; padding-bottom: 0px;}
	#mapbottom	{height: 100%;}
	#mapbottom div	{width:100%; text-align: center;}
	#mapbottom p	{margin-left: 0px; width:100%; }
	#mapbottom div i	{margin-top: 40px;}
	#map1	{margin-top: 0px; position: relative; top:-30px;}
	#mapbottom div:nth-child(2)	{margin-left: 0px;}
	#map2	{left: 0px; top: -35px; font-size:3vh;}
	
	#mapbottom div:nth-child(2) i	{margin-top:0px;}
	
	#btmlogo	{float: none; margin: 0 auto; height: 30%;}
	#btmlogo img	{margin-top: 20px; margin-left: -15px; width: 90px;}
	#btmlogo div:nth-of-type(2)	{margin-top: -10px !important; margin-left: -15px;}
	#right	{width: 100%; font-size:2.8vh; padding: 0px; padding-bottom: 36%;}
	#topbtm	{margin: 0 auto; float:none; width: 20%; height:30px; margin-top:46%; padding:10px; position:absolute; bottom:0px; left:38%;}
	
	.mobilepopup.open .mobilepopup-outer:not(.disable-mobile-fullscreen)	{width: 100vw!important; height: 100vh!important;}
	.mobilepopup.open .mobilepopup-outer .mobilepopup-inner .header	{line-height: 52px;}
	.mobilepopup.open .mobilepopup-outer .mobilepopup-inner .content	{font-size: 12px !important;}
}