@charset "utf-8";

/* GOOGLE FONTS */
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,600i,700');
@import url('https://fonts.googleapis.com/css?family=Nunito');

@font-face {
  font-family: "Futura";
  src: url("/styles/fonts/futura-md-bt_481.ttf") format("opentype");
}

/* GENERAL */
body { color:#666666; font-size:16px; line-height: 24px; background-color:#fff; font: 16px/28px 'Open Sans'; }
a { color:#6c2d01; text-decoration:none; }
a:hover { color:#e99c00; text-decoration:none; } 
a:focus { color:#e99c00; text-decoration:none; }
h1, .h1 { margin:0; padding:15px 0; font: 22px 'Futura'; line-height: 30px; color:#6c2d01; font-weight:700; }
h2, .h2 { margin:0; padding:15px 0; font: 22px 'Futura'; line-height: 30px; color:#525252; font-weight:700; }
h3, .h3 { margin:0; padding:5px 0; font: 22px 'Nunito'; line-height: 30px; color:#e99c00; font-weight:600; }
h4, .h4 { margin:0; padding:0; font: 16px 'Nunito'; line-height: 20px; color:#e99c00; }
img { height: auto; max-width: 100%; }
p { margin-bottom: 15px; }
ul, ol {  margin-bottom: 15px; }
@media screen and (min-width: 992px) {
	h1, .h1 { font-size: 34px; line-height: 42px;}
	h2, .h2 { font-size: 34px; line-height: 42px; }
}


/* NAV MENU */
header { display: inline-block; width: 100%; }
.navbar { margin:0; position:relative; z-index:1030; }
.navbar-brand { height:auto; padding: 0; overflow:hidden; margin: 10px 0 4px 15px; }
.dropdown-menu { font: 14px 'Nunito'; }
.dropdown-menu > li > a { color: #8a8a8a; }
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus { color:#e99c00; background-color:transparent; }
.navbar-default { background-color:transparent; border-color:transparent; background-color:transparent;}
.navbar-default .navbar-nav > li > a { font:28px 'Futura', 'Open Sans', sans-serif; color:#777777; transition: 0.3s; }
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a.active { color:#e99c00; }
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus { background-color:transparent; color:#e99c00; }
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus { background-color: transparent; color: #e99c00; }
.navbar-default .navbar-nav > li >  a.lang { opacity: 0.4; padding-left: 0; padding-right: 0; }
.navbar-default .navbar-nav > li >  a:hover.lang { opacity: 1; }
.navbar-default .navbar-nav > li >  a.lang.active { opacity: 1; }
.navbar-toggle { margin-top: 21px; }
.navbar-default .navbar-toggle { border-color:#ccc; }
.navbar-default .navbar-toggle .icon-bar { background-color:#ccc; }
.navbar-default .navbar-collapse, .navbar-default .navbar-form { border-color: rgba(255, 255, 255, 0.2); }
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background-color:#6c2d01;  border-color:#6c2d01; }
.navbar-default .navbar-toggle:hover .icon-bar, .navbar-default .navbar-toggle:focus .icon-bar { background-color:#fff; }
@media screen and (max-width: 767px) {
	.navbar-nav li { text-align: center; }
	.navbar-default .navbar-nav .open .dropdown-menu > li > a { color: #888888; }
	.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
	.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { color: #e99c00; }
	.navbar-default .navbar-nav > li > a.active { border-bottom:none; color:#e99c00; }
	.navbar-default .navbar-nav > li > a:hover.active { color:#e99c00; }
	.navbar-default .navbar-nav > li > a.lang { opacity: 1; }
	.navbar-collapse { border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
	.navbar-brand { width: 210px; }
}
@media screen and (min-width: 768px) {
	.navbar { width:100%; float:left; margin:-36px 0 0 0; }
	.navbar-nav { float:right; margin-top:28px; margin-right:-10px; }
	.navbar-nav > li > a { padding-bottom: 0; /*height: 90px;*/ }
	.navbar-default .navbar-nav > li > a { margin: 7px 0; padding: 3px 7px; border-top: 5px solid transparent; }
	.navbar-default .navbar-nav > li > a:hover,
	.navbar-default .navbar-nav > li > a:focus,
	.navbar-default .navbar-nav > li > a.active { border-bottom: 4px transparent; }
	.navbar-default .navbar-nav > li > a.lang { border-color: transparent; }
	.navbar-default .navbar-nav > li > a.lang img { display: block; }
	.dropdown-menu > li > a { border-bottom:1px solid #cccccc; margin:0 20px; padding:10px 0; }
	.dropdown-menu > li:last-child > a { border:none; }
	.navbar-nav > li > .dropdown-menu { margin-top: -4px; padding:0 0 5px 0; }
	.navbar-nav > li > .dropdown-menu li:first-child { border-top: 4px solid #e99c00; }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
	.navbar-nav { margin-top: 35px; }
	.navbar-default .navbar-nav > li > a { font-size:24px; margin: 0; padding-top: 42px; }
	.navbar-brand { width: 210px;  margin: 54px 0px 11px 15px;  }
	.navbar-default .navbar-nav > li >  a.lang { margin: 1px 7px; }
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
	.navbar-default .navbar-nav > li > a { font-size:28px; padding-top: 42px; }
	.navbar-default .navbar-nav > li > a.lang { margin: 10px 5px 0 5px; }
	.navbar-brand { width: 250px; margin:54px 0px 18px 15px; }	
}
@media screen and (min-width: 992px) {
	.navbar-default .navbar-nav > li > a { padding-left: 12px; padding-right: 12px; }
  header { background-color: #fff; position: fixed; left:0; top:0; z-index: 999; }
  .navbar-default .navbar-nav > li > a.button { border: 1px solid #2ba0db; border-radius: 4px; color:#2ba0db; text-transform: uppercase; font-size: 15px; padding:8px 15px;  margin: 39px 22px 2px 15px; }
  .navbar-default .navbar-nav > li > a:hover.button { background-color:  #2ba0db; color: #fff; }
  .navbar {border-bottom: 3px solid #e99c00 !important;}
}
@media screen and (min-width: 1200px) {
	.navbar-default .navbar-nav > li > a.button { font-size: 17px; margin: 48px 22px 4px 15px; }
	.navbar-default .navbar-nav > li > a.lang { margin: 13px 5px 0 5px; }
	.navbar-default .navbar-nav > li > a { padding-top: 42px; }
	.navbar-default .navbar-nav > li > ul {display: none;  transition: all .3s ease;  background-color:rgba(255,255,255,0.9);  position: absolute;  width: 150px;  top: 88px;  left: 0px;  padding: 10px 0;}
	.navbar-default .navbar-nav > li > ul> li { height: 35px;  line-height: 35px;text-align: center;}
	.navbar-default .navbar-nav > li > ul> li a{ width: 50px;  line-height: 45px;}
	.navbar-default .navbar-nav > li > ul> li:hover{ background-color: gainsboro;}

	.navbar-brand { margin: 54px 0 16px 15px; }

}
@media (max-width: 768px) {
  .navbar .pull-right { float: none !important; }
}

/* HEADER */
.headerBlock { width:100%;  height: 200px;  background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; }
@media screen and (min-width: 768px) and (max-width: 991px) {
	.headerBlock { height: 300px; }
}
@media screen and (min-width: 992px) {
	.headerBlock { height: 400px; margin-top: 126px; }
}
@media screen and (min-width: 1280px) {
	.headerBlock { height: 480px; margin-top: 126px; }
}

/* BUTTONS */
.btn { font: 16px/17px 'Nunito'; text-transform:uppercase; border:none; padding:10px 15px; transition: 0.3s; }
.btn .fa { margin:0 0 0 5px; position: relative; top: 1px; }
.btn .fa.left { margin:0 5px 0 0; }
.btn1, .btn1:focus, .btn1.focus { background-color: transparent; border: 1px solid #6c2d01; color: #6c2d01; }
.btn1:hover, .btn1:active, .btn1.active, .open > .dropdown-toggle.btn1 { background-color: #6c2d01; color: #fff; }
.btn2, .btn2:focus, .btn2.focus { background-color: transparent; border: 1px solid #666666; color: #666666; }
.btn2:hover, .btn2:active, .btn2.active, .open > .dropdown-toggle.btn2 { background-color: #666666; color: #fff; }
.btn3, .btn3:focus, .btn3.focus { background-color: #6c2d01; border: 1px solid #6c2d01; color: #fff; }
.btn3:hover, .btn3:active, .btn3.active, .open > .dropdown-toggle.btn3 { background-color: #6c2d01; color: #fff; }

/* MARGINS */
.top10 { margin-top: 10px !important; }

/* VIDEO */
.videoBlock1 { text-align:center; text-shadow: 2px 2px 2px #6c2d01;position:relative; overflow:hidden; color:#fff; background-position: 50% 50%;background-size: cover; }
.videoBlock1 h1, .videoBlock1 h1 span { color:#fff; }
.videoBlock1 p { font-size: 16px; font-family: "Verdana";}
.videoBlock1 p a { color:#fff; }
.videoBlock1 p a:hover { color:#fff; text-decoration:underline; }
.videoBlock1 b,
.videoBlock1 strong { color: #fff; }
.videoBlock1 video { z-index:-1; position:absolute; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; }
.videoBlock1 .btn { border-color: #fff; color: #fff; }
.videoBlock1 .headerimage { z-index: -1; position: absolute; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; background-size: cover; background-position: center top; display: }
.videoBlock1 .videofallback { z-index: -1; position: absolute; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; background-size: cover; background-position: center center; display: none; }
.videoBlock1 .textContainer { padding-top: 30px; padding-bottom: 30px; }
.videoBlock1 .imageContainer { margin-right: -15px; margin-left: -15px;  display:none; }

@media screen and (max-width:480px) {
	.videoBlock1 .btn { width:100%; margin-bottom:10px; }	
}
@media screen and (min-width:481px) {
	.videoBlock1 p { line-height: 34px; margin: 0 auto 30px; max-width: 900px; }
	.videoBlock1 .btn { font-size:20px; padding:14px 30px 14px 30px; }
	.videoBlock1 .btn .fa { margin: 0 0 0 8px; }
}
@media screen and (min-width: 768px) {
	.videoBlock1 .form .btn { margin-top: 10px; }
}
@media screen and (min-width: 992px) {
	.videoBlock1 .textContainer { padding-top:100px; padding-bottom:70px; }
	.videoBlock1 { margin-top: 105px; }
	.videoBlock1 p { font-size: 20px; }
	.videoBlock1 .imageContainer { display:block; }
}
@media screen and (min-width: 1200px) {
	.videoBlock1 { margin-top: 121px; }
}



/* MENU BLOCK */
.menuBlock { margin-top: 20px; }
.menuBlock a { transition: 0.3s; }
.menuBlock .intro { text-align: left; margin-bottom: 30px; color: #909090; }
.menuBlock .intro .logo { max-height: 90px; margin-top : 0px;}
.menuBlock .intro h2 { font: 44px 'Futura', 'Open Sans', sans-serif; padding: 0 25px 5px 25px; display: inline-block;  text-transform: uppercase; color:#e99c00;}
.menuBlock .intro p { font-size: 25px; }
.menuBlock .intro1 { text-align: center; margin-bottom: 30px; color: #909090; }
.menuBlock .intro1 .logo { max-height: 90px; margin-top : 0px;}
.menuBlock .intro1 h2 { font: 44px 'Futura', 'Open Sans', sans-serif; padding: 0 25px 5px 25px; display: inline-block;  text-transform: uppercase; color:#e99c00;}
.menuBlock .intro1 p { font-size: 25px; }
.menuBlock .content { text-align: center; }
.menuBlock .item { text-align: center; margin-bottom: 50px; }
.menuBlock .title { font: 25px 'Futura', 'Open Sans', sans-serif; text-transform: uppercase; padding-top: 10px; line-height: 26px; color: #6c2d01; }
.menuBlock .title a:hover { text-decoration: none; }
.menuBlock .text { font-size: 16px; line-height: 24px; padding-top: 10px; padding-bottom: 10px; font-family: "Verdana"; }
.menuBlock .text p { margin-bottom: 0px; }
.menuBlock .button { margin-top: 3px; }
.menuBlock .hebei {color : #e99c00}
.menuBlock .cofco { color : #6c2d01}
.menuBlock .team img {max-height:30%; margin-top: 20px; margin-bottom:10px; border-bottom: solid 3px #6c2d01; }
.menuBlock .extras img {max-height:30%; margin-top: 20px; margin-bottom:10px; }
.ourvalues .image {padding-top: 25px;}


@media screen and (max-width:480px) {
	.menuBlock { margin-top: 40px; }
	.menuBlock .intro h2 { font-size: 25px; }
	.menuBlock .intro .logo { max-height: 90px; margin-top :0px;}
}
@media screen and (min-width:480px) {	
	.menuBlock .intro h2 { font-size: 32px; }
}
@media screen and (min-width: 992px) {
	.menuBlock { margin-top: 25px; margin-bottom: 25px; }
	.menuBlock .title { font-size: 24px; line-height: 32px; }	
	.menuBlock .intro .logo { max-height: 90px; margin-top :-45px;}
	.menuBlock .intro h2 { font-size: 44px; }
}





/* CONTACT BLOCK */
.contactBlock { margin-top: 20px; margin-bottom: 30px; }
.contactBlock a { transition: 0.3s;}
.contactBlock .intro { text-align: center; margin-bottom: 30px; color: #999999; }
.contactBlock .intro h2 { padding: 0 25px 5px 25px; margin-bottom: 15px; border-bottom: 3px solid #6c2d01; display: inline-block; }
.contactBlock .content { text-align: center; }
.contactBlock .item { text-align: center; margin-bottom: 50px; }
.contactBlock .title { font: 18px 'Nunito'; text-transform: uppercase; padding-top: 10px; line-height: 26px; color: #e99c00; }
.contactBlock .title a:hover { text-decoration: none; color:  #6c2d01; }
.contactBlock .adress { margin-bottom: 30px; margin-top: 10px; font-family: "Verdana"}
.contactBlock .adress li { padding: 0 0 0 28px; position: relative; margin-bottom: 8px; }
.contactBlock .adress p { padding: 0 0 0 0px; position: relative; margin-bottom: 0px; }
.contactBlock .adress li a { color:#666666; }
.contactBlock .adress li a:hover { color:#e99c00; text-decoration: none; }
.contactBlock .adress li .fa { position: absolute; top: 3px; left: 0; color: #e99c00; }
.contactBlock .adress li .fa-map-marker { left: 4px; font-size: 24px; }
.contactBlock .adress li .fa-envelope { top: 6px; }
.contactBlock .adress li .fa-phone { left: 2px; top: 6px; }
.contactBlock .adress li .fa-fax { top: 5px; }
.contactBlock .adress .office { margin-bottom: 10px; }
.contactBlock .adress .email { margin-bottom: 10px; }
.contactBlock .adresslocation li {font: 14px Verdana;display: inline; list-style-type: none; padding-right: 10px; color: #999999;}




.contactBlock .form-inline {padding: 20px; }
.contactBlock .form-inline .help-block { font-size: 14px; }
.contactBlock .form-inline .form-group { width: 100%; margin-bottom: 10px; }
.contactBlock .form-inline .form-control { width: 100%; padding: 10px 15px; font-size: 16px; }
.contactBlock .form-inline input.form-control { height: 40px; }
@media screen and (max-width:480px) {
	.contactBlock { margin-top: 40px; }
	.contactBlock .form-inline .btn { width: 100%; }
}
@media screen and (min-width: 992px) {
	.contactBlock .adress { font-size: 18px; line-height: 30px; }
	.contactBlock { margin-top: 160px; margin-bottom: 60px; }
	.contactBlock .title { font-size: 24px; line-height: 32px; }
	.contactBlock .form-inline { padding: 30px; }
}


.contactBlock .tab-content {border:none;}
.contactBlock .nav-tabs { border:none; padding-bottom: 15px;}
.contactBlock .nav-tabs a { color: #999999;}
.contactBlock .nav-tabs .active a { font-weight: bold; color:#6c2d01; background-color: transparent;}
.contactBlock .nav-tabs li a {border:none; padding-left: 0px;}
.contactBlock .nav-tabs li.active a {border:none;}
.contactBlock .nav-tabs a:hover { background-color:transparent;}


/* TEXT BLOCK */
.textBlock { text-align: center; background-color:#ebebeb; }
.textBlock a { transition: 0.3s; }
.textBlock .content { padding-top: 40px; }
.textBlock .content h2 { padding: 0 25px 5px 25px; margin-bottom: 15px; border-bottom: 3px solid #e99c00; display: inline-block;  text-transform: uppercase; }
.textBlock .content p { margin-bottom: 20px; font-family: "Verdana";}
@media screen and (min-width: 992px) {
	.textBlock .content { padding-top: 70px; padding-bottom: 20px; font-size: 18px; line-height: 34px; }
	.textBlock .content p { margin-bottom: 25px; }
	.textBlock .content .btn { font-size: 18px; padding: 12px 25px 12px 25px; }
}



/* GOOGLE MAPS */            
#map { width: 100%; height: 400px; }

/* FOOTER BLOCK */
.footerBlock { padding-top: 90px; padding-bottom: 70px; background-color: #6c2d01; line-height:30px; color: #fff; background-image: url('../images/footer_back.png'); background-position: center top; background-size: cover; }
.footerBlock .title { font-weight: 700; color:#e99c00; font: 22px 'Nunito'; margin-bottom: 4px;  text-transform: uppercase;}
.footerBlock p { margin-bottom: 0px; }
.footerBlock a { color: #fff; transition: 0.3s; }
.footerBlock a:hover { color:#e99c00; text-decoration: none; }
.footerBlock ul { margin-bottom: 0; }
.footerBlock .adress,
.footerBlock .links,
.footerBlock .socialmedia { margin-bottom: 35px; }
.footerBlock .adress strong { font-size: 24px;  font-family: "Futura"}
.footerBlock .adress li { padding: 0 0 0 24px; position: relative; font-family: "Verdana"}
.footerBlock .adress li .fa { position: absolute; top: 2px; left: 0; color: #e99c00; }
.footerBlock .adress li .fa-map-marker { left: 4px; font-size: 20px; }
.footerBlock .adress li .fa-envelope { top: 7px; }
.footerBlock .adress li .fa-phone { left: 2px; top: 7px; }
.footerBlock .adress li.fax { display:none; }
.footerBlock .adress .office { line-height:24px; margin-bottom: 10px; }
.footerBlock .adress .email { margin-bottom: 10px; }
.footerBlock .socialmedia { margin-top: 13px; }
.footerBlock .socialmedia li { float: left; margin-right: 20px; }
.footerBlock .socialmedia li a { border-radius: 50%; border: 1px solid #fff; padding: 12px; width: 52px; height: 52px; font-size: 28px; display: block; }
.footerBlock .socialmedia li a .fa-facebook { position: relative; left: 4px; }
.footerBlock .socialmedia li a .fa-twitter { position: relative; left: 1px; }
.footerBlock .socialmedia li a .fa-linkedin { position: relative; left: 2px; top: -2px; }
@media screen and (min-width: 768px) and (max-width: 991px) {
	.footerBlock { padding-top: 90px; padding-bottom: 60px; }
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
	.footerBlock { padding-top: 90px; padding-bottom: 25px; }
}
@media screen and (min-width: 1200px) and (max-width: 1279px) {
	.footerBlock { padding-top: 90px; padding-bottom: 25px; }
}
@media screen and (min-width: 1280px) and (max-width: 1599px) {
	.footerBlock { padding-top: 90px; padding-bottom: 30px; }
}
@media screen and (min-width: 1600px) {
	.footerBlock { padding-top: 90px; padding-bottom: 30px; }
}



/* SCROLL TO TOP */
#scrolltop { position: fixed; bottom: 30px; right: 0; z-index: 10; padding: 10px 10px 15px 16px; background-color: #e99c00; color: #fff; border-radius: 50% 0 0 50%; cursor: pointer; display: none; font-size: 30px; transition: 0.3s; }