@charset "utf-8";
img { max-width: 100%; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; /*For IE 6&7 only*/ }

#map{width:450px; height:300px;}
.info span { margin-right: 5px; }

.wrapper { background: url(../images/page_bg.jpg) repeat-x; }
.wrapper.index { background: url(../images/index_bg.jpg) repeat-x; }
.toggle-menu { display: none; }

@media (max-width:1280px) {
	[canvas=container] { background-color: #fff; }
	.wrapper, .wrapper.index { background: none; }
	#container, .footer { width: 100%; }
	aside { width: 22%; }
	#main { width: 78%; }
	.com .left, .com .right { width: 50%; }
	.main-info { background: #003466; padding: 10px 15px 20px; margin: 10px 0; }
	.figure { width: 49%; }
}

@media (max-width:1200px) {
	header nav li { margin: 0 6px; }
	.contact .left, .contact .right { width: 100%; float: none; }
	#map{width:100%; height:30%;}
  .google-maps { position: relative; padding-bottom: 40%; height: 0; overflow: hidden; }
  .google-maps iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; }
	.contact table { width: 90%; margin: auto; }
	.contact table th { width: 90px; }
	.contact table td { padding: 10px 5px; }
	.contact input, .contact textarea { width: 100%; }
}

@media (max-width:1024px) {
	header nav li { margin: 0; }
	aside { width: 30%; }
	#main { width: 70%; padding-left: 0; }
}

@media (max-width:960px) {
	header nav li a { padding: 4px; }
	.logo { margin: 10px; width: 300px; }
	.com .right { float: none; margin-bottom: 20px; text-align: center; width: 100%; }
	.com .left { float: none; width: 100%; padding: 0; }
}

@media (max-width:800px) {
	.menu, aside { display: none; }
	#main { width: 100%; padding: 15px; }
	.about-pro { width: 45%; }
	.contact .left, .contact .right { width: 100%; float: none; }
/*	#map{width:100%; height:300px;}*/
	.contact table { width: 90%; margin: auto; }
	.contact table th { width: 90px; }
	.contact table td { padding: 10px 5px; }
	.contact input, .contact textarea { width: 100%; }
	.toggle-menu { display: block; font-size: 24px; background: #012758; color: #fff; padding: 15px 10px; }
	[off-canvas] { background-color: rgba(0,0,0,.85); }
	[off-canvas*=left] { width: 375px; }
	.side-menu .menu, .side-menu aside { display: block; float: none; }
	.side-menu nav { margin-top: 30px; }
	.side-menu .language a { font-size: 20px; }
	.side-menu nav li { border-top: rgba(255,255,255,.3) 1px solid; }
	.side-menu nav ul ul li { border-bottom: rgba(255,255,255,.3) 1px solid; padding-left: 35px; }
	.side-menu nav ul ul li a { line-height: 1.2em; padding: 18px 0; font-size: 16px; }
	.side-menu nav ul ul li a:before { content: "\f24d"; font-family: FontAwesome; font-style: normal; font-weight: normal; text-decoration: inherit; margin-right: 5px; }
	.side-menu nav a { color: #fff; font-size: 18px; line-height: 2em; text-decoration: none; display: block; padding: 10px;  }
	.side-menu>.menu>nav>ul>li>a:before { content: "\f0a9"; font-family: FontAwesome; font-style: normal; font-weight: normal; text-decoration: inherit; margin-right: 10px; }
	.side-menu>.menu>nav>ul>li.active>a { color: #fff; background: #d61518; }
	.side-menu .menu nav a.active { color: #d61518; font-weight: bold; }
}

@media (max-width:640px) {
	header { height: auto; border-bottom-width: 10px; }
	.logo { float: none; margin: 10px auto; }
	.contact .btn { width: 45%; margin: 0 4px; }
}
	
@media (max-width:480px) {
	.logo { margin: 4px auto; padding: 0 20px; }
	.about { padding: 6px 0 50px; }
	.about-pro { width: 100%; float: none; margin-left: 10px; }
	.app p { margin: auto; }
	.figure { width: inherit; text-align:center; display: block; }
	.equipment img { margin: auto; }
	.contact table { width: 100%; }
	.sitemap ul { margin-left: 10px; }
	.sitemap ul ul { margin-left: 24px; }
	.footer { padding: 30px 15px; }
	.info .email { display: block; }
}
@media (max-width:375px) {
	[off-canvas*=left] { width: 100%; }
	.contact .btn { width: 44%; }
	.info span { display: block; }
}