/* CSS Document */

body {font-size:16px; position:relative}

/*-----------------------------------*/
/*           TYPOGRAPHICAL           */
/*-----------------------------------*/



/*-----------------------------------*/
/*             STRUCTURAL            */
/*-----------------------------------*/

img.fill {margin-bottom:0;}

/*-----------------------------------*/
/*               HEADER              */
/*-----------------------------------*/

#header-top, #header-navs .main-menu {display:none;}
#header {position:absolute;}
#header-navs {padding:20px 0;}
#hamburger {float:right; display:block; margin-top:12px;}

#mobile-menu {position:fixed; width:100%; height:100%; display:none; background:rgba(255,255,255,0.9); overflow:hidden; z-index:9999999;}
.mobile-menu-inner {display:table-cell; vertical-align:middle; padding:0 50px; position:relative;}
#mobile-menu a {text-transform:uppercase; color:#000; font-size:200%; padding-bottom:5px; margin-bottom:10px; display:inline-block;}
#mobile-menu li.current-menu-item > a {border-bottom:solid thin #000;}
#mobile-menu ul ul {margin-left:20px;}
#mobile-menu li {}
#mobile-menu .close {position:absolute; top:20px; right:50px; margin-left:0; }

#header-bottom {display:none;}
#submenu .over, #submenu.keep-alive {display:none;}

/*-----------------------------------*/
/*             FRONT PAGE            */
/*-----------------------------------*/

#brand-window {}
#brand-window.front section {padding-top:200px;}
.page-content.front {padding:50px 0;}
.front-logos {overflow:hidden;}

#front-brand-window {min-height:550px;}
#front-brand-window section {padding-top:200px;}
#front-brand-window .brand-content {width:60%;}

#front-brand-window .newsroom {top:110px;}
#front-brand-window .newsroom img {width:120px;}

/*-----------------------------------*/
/*               CONTENT             */
/*-----------------------------------*/

#brand-window section {padding-top:150px;}
#second-brand {padding:100px 0;}
#brand-window .brand-drop {display:none;}

#brand-window, .page-template-template-productcats #brand-window, .page-template-template-careers #brand-window,
.page-template-template-history #brand-window {min-height:0;}
#brand-window .brand-image {background-size:cover;}
#brand-window section {padding-top:0px !important; width:100%; }
.page-template-template-history #brand-window .brand-content {width:92%}
#brand-window.front .brand-content,
#brand-window .brand-content,
.page-template-template-leadership #brand-window .brand-content {width:84% !important; padding:190px 8% 50px; background-color:rgba(55,55,55,0.6);}

#leadership .leadership {width:47%; margin:0 1% 15px; text-align:center;}

.page-template-template-leadership .lower-content .core-content {padding-bottom:80px;}
.join-our-team {font-size:100%}

#locations-map .map-legend {position:relative; bottom:auto; left:auto; display:none;}
#locations-map {background-color:#abaaaa;}

.product-category {min-height:0;}
.page-template-template-productcats .col-50 {width:100%;}
.page-template-template-productcats .major-padded-inner-vert,
.page-template-template-productcats #second-brand {padding-top:0 !important; padding-bottom:0 !important;}
.page-template-template-productcats #page-wrap section {padding:80px 4%; background-color:rgba(55,55,55,0.6);}

.page-template-template-spotlight #second-brand {background-size:cover;}
.page-template-template-spotlight #second-brand .image {float:none; width:100%;}
.page-template-template-spotlight #spotlight-bands #second-brand img {max-width:500px; width:100%; margin-left:0; display:block; margin:0 auto;}
.page-template-template-spotlight #second-brand .content {float:none; width:100%;}

.page-template-template-careers #brand-window .brand-content {padding-bottom:130px;}
.brochure-icon {bottom:20px; left:3%; right:auto;}
#careers-bands #second-brand, 
#careers-bands .third-content {background-size:cover;}
#careers-bands #second-brand {background-position:center left;}
#careers-bands .third-content {background-position:center right;}
#careers-bands .careers-second {width:100%;}
#careers-bands .careers-third {width:100%; float:none;}
#careers-bands .careers-third .padded-inner {padding-left:0 !important; padding-right:0 !important;}
.careers-icon {right:auto; left:0; width:200px; top:auto; margin-left:0; margin-top:0;}
#second-brand .content {padding-bottom:100px;}
#careers-bands .careers-second .padded-inner {padding:30px 0 60px;}

.normal-page {padding-top:150px;}

/*-----------------------------------*/
/*            MEDIA QUERIES          */
/*-----------------------------------*/

@media (max-width:900px) {
	#contact-companies .company {width: 48%; border:none;}
}

@media (max-width:800px) {
	
	#front-social .social,
	#front-social .careers {border:none; float:left; width:100%; margin:0; padding-left:0; padding-right:0}
	#front-social .careers {border-top:solid thin #ccc;}
	
	.col-50,
	.col-49,
	.col-60,
	.col-40,
	.col-30,
	.col-20,
	.col-59,
	.col-39,
	.col-45 {width:100%;}

	.padded-inner,
	.major-padded-inner {width:calc(100% - 50px); padding:25px;}
	.padded-inner-sides {width:calc(100% - 50px); padding:0 25px;}
	.major-padded-inner-sides {padding:0 25px;}
	.padded-inner-vert {padding-top:25px; padding-bottom:25px;}
	.major-padded-inner-vert {padding-top:25px; padding-bottom:25px;}
	
	#careers-bands .careers-second .padded-inner,
	#careers-bands .careers-third .padded-inner {width:100%;}
	
	.third-bullets > div {width:100%;}

	.left,
	.right {float:none;}
	
	.about-videos .video-top {width:100%;}
	.videos .col-49 {width:49%;}
	.videos .left {float:left;}
	.videos .right {float:right;}
	.videos .main,
	.videos .thumbs {width:100%; float:none;}
	.videos .main {margin-bottom:30px;}
	
	.history .bg-cover {background-size:200% auto;}
	
	.history.bg-top {background-position:top right; color:#fff;}
	.history .col-50 {background-color:rgba(55,55,55,0.6);}
	#history-fields .lower-content .match-height {padding:50px 0 20px;}
	
	.join-our-team {padding:15px;}
}

@media (max-width:750px) {
	footer .left,
	footer .right {float:none; width:100%; text-align:center;}
	#footer-social ul, footer .footer-menu {text-align:center;}
	#searchform input[type=text] {float:none; margin:0 auto;}
	footer .top-menu, footer .main-menu {display:none;}
	#footer-social li {margin:0 5px;}
	
	.timeline .normal {display:none;}
	.timeline-mobile {display:block;}
	
	#companies .company {width:calc(33% - 10px);}
	
	#brand-window.front .brand-content p br {display:none;}
	
	#second-brand .content {padding-bottom:0px;}
	.life-cycle {margin-bottom:50px;}
	#companies {padding-top:25px; padding-bottom:50px;}
	
	.product-category-companies li {padding:0 6px;}
	
	#spotlight-bands #second-brand {padding:50px 0;}
	
	#careers-bands .careers-second {padding-bottom:100px;}
	
	#undership .undership {width:30%; font-size:90%;}
	
	#second-brand {padding:50px 0;}
}

@media (max-width:650px) {
	body {font-size:14px;}
	#front-brand-window .brand-content h2,
	#brand-window .brand-content h2 {font-size:200%;}
	
	#front-brand-window {min-height:500px; overflow:hidden;}
	#front-brand-window .brand-image {background-position:center right -180px;}
	.circle-arrow, .black-arrow {margin-top:30px;}
	#front-brand-window section {padding-top:230px; margin:0; padding-left:8%; padding-right:8%; width:84%; background-color:rgba(55,55,55,0.6);}
	#front-brand-window .brand-content {width:100%;}
	#front-brand-window .newsroom {left:8%;}
	#front-brand-window .newsroom img {width:120px;}
	
	.front-logos a {width:100px; height:50px;}
	.front-logos a.ditch {margin-left: -118px;}
	.front-logos a.auger {margin-right: -118px;}
	.front-logos a.subsite {margin-top: -94px;;}
	.front-logos a.trencor {margin-top: -94px;}
	.front-logos a.hammer {margin-bottom: -94px;}
	.front-logos a.dwtxs {margin-bottom: -94px;}
	.front-logos a.mti {margin-left: -118px;}
	.front-logos a.radius {margin-right: -118px;}
	
	#contact-companies .company {width: 98%; border:none;}
	#contact-companies .company p {font-size:120%;}
	
	.brand-content h1 br, #careers-bands h2 br, #front-brand-window .brand-content br, h1 br {display:none;}
	
	.social-list li {padding:70px 0 20px;}
	.social-list li:before {width:100%; height:40px !important; background-position:contain}
}

@media (max-width:540px) {
	#brand-window .brand-image {background-position:center right -350px;}
	#header-navs .logo {float:none; margin:0 auto; display:block; width:100%; max-width:400px;}
	footer .logo {width:100%; max-width:400px;}
	#hamburger {float:none; margin:20px auto 0; height:25px;}
	#front-brand-window section {padding-top:250px;}
	#front-brand-window .newsroom {top:150px;}
	
	#companies .company {width:calc(50% - 10px);}
	
	#undership .undership {width:47%; }
}
