﻿/***** BEGIN RESET *****/
* {
    background:transparent;
    border:0;
    margin:0;
    padding:0;
    font-family:'robotoregular', Arial, sans-serif;
}
ol, ul {list-style: none;}
.clear {clear: both; height:0px; margin:0;}
/***** END RESET *****/

@font-face {
    font-family:'roboto_condensedbold';
    src: url('../webfonts/RobotoCondensed-Bold-webfont.eot');
    src: url('../webfonts/RobotoCondensed-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../webfonts/RobotoCondensed-Bold-webfont.woff') format('woff');
    font-weight:normal;
    font-style:normal;
}
@font-face {
    font-family:'robotoregular';
    src: url('../webfonts/Roboto-Regular-webfont.eot');
    src: url('../webfonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../webfonts/Roboto-Regular-webfont.woff') format('woff');
    font-weight:normal;
    font-style:normal;
}
@font-face {
    font-family:'robotobold';
    src: url('../webfonts/Roboto-Bold-webfont.eot');
    src: url('../webfonts/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../webfonts/Roboto-Bold-webfont.woff') format('woff');
    font-weight:normal;
    font-style:normal;
}
@font-face {
    font-family:'robotobold_italic';
    src: url('../webfonts/Roboto-BoldItalic-webfont.eot');
    src: url('../webfonts/Roboto-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../webfonts/Roboto-BoldItalic-webfont.woff') format('woff');
    font-weight:normal;
    font-style:normal;
}

::-moz-selection{background: #000; color: #fff; text-shadow: none} ::selection{background: #000; color: #fff; text-shadow: none;}

header, nav, article, footer, img {display:block;}

body {background:#000; font-size:16px; font-weight:normal; line-height:normal; -webkit-text-size-adjust:none;}

.clear-it:after {content:""; display:block; clear:both;}
.wrap {width:94%; margin:0 auto; max-width:1290px;}
.sm-wrap {width:94%; margin:0 auto; max-width:1160px;}

.show-tablet, .clear-mobile {display:none;}

.col1,.col2,.col3,.col4,.col5,.col6,.col7,.col8,.col9,.col10,.col11,.col12 {box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.col1 {width:8.33333%; float:left;}
.col2 {width:16.66666%; float:left;}
.col3 {width:25%; float:left;}
.col4 {width:33.33333%; float:left;}
.col5 {width:41.66666%; float:left;}
.col6 {width:50%; float:left;}
.col7 {width:58.33333%; float:left;}
.col8 {width:66.66666%; float:left;}
.col9 {width:75%; float:left;}
.col10 {width:83.33333%; float:left;}
.col11 {width:91.66666%; float:left;}
.col12 {width:100%; float:left;}

.col-lt-pad {padding:0 0 0 10px;}
.col-rt-pad {padding:0 10px 0 0;}
.col-center-pad {padding:0 5px 0 5px;}

.pad-tb-15 {padding:15px 0;}

.thirds {width:33.33333%; float:left;}


/*** typography ***/
p {margin-bottom:14px;}
.no-margin {margin:0!important;}

p.small {font-size:12px;}

.black {color:#000;}
.yellow {color:#fc0;}
.drk-yellow {color:#E1BE1F;}
.white {color:#fff;}

strong {font-weight:normal; font-family:'robotobold';}
.bold-italic {font-family:'robotobold_italic';}
.caps {text-transform:uppercase;}
.text-right {text-align:right;}

a {color:#666; text-decoration:none;}
a:hover {color:#fc0;}

a.blk-btn {width:96%; display:block; background:#000; color:#fff; text-align:center; padding:10px 2%; font-family:'robotobold';}
a.blk-btn:hover {background:#333;}

h1, h2, h3, h4, h5, h6 {font-family:'roboto_condensedbold'; font-weight:normal;}
h1 {font-size:28px; color:#000; text-transform:uppercase; margin-bottom:16px;}
h2 {font-size:24px; margin-bottom:12px;}
h3 {font-size:28px; margin-bottom:6px; text-transform:uppercase;}
h4 {font-size:22px; margin-bottom:5px;}
h5 {font-size:20px; margin-bottom:2px;}
h6 {font-size:18px; margin-bottom:8px; text-transform:uppercase;}

ul.loc-links {list-style:none; margin:0;}
ul.loc-links li {list-style:none; margin:0; padding:2px 0;}

ul.list {list-style:disc; margin:0 0 14px 14px;}
ul.list li {list-style:disc; margin-left:14px;}


/** hidden search styles **/
.hidden-search {width:100%; display:block; background:#000; padding:25px 0 10px 0;}


/*** header ***/
header {width:100%; background:#222; padding:15px 0;}
header .wrap {display: flex; justify-content: space-between; align-items: center;}
.logo {width:24%; float:left; margin-right:5%;}
.logo img {width:100%; height:auto; max-width:309px;}

.rt-header {}
.tagline {text-align:center; margin-top:20px; color:#fc0; font-size:26px; text-transform:uppercase; font-family:'roboto_condensedbold';}

.head-contact {/*margin:27px 0 0 2%;*/ text-align:right;}
.head-contact i {margin-right:5px;}
.head-contact a {color:#fff!important; margin-left:25px; font-family:'robotobold'; font-size:16px; white-space:nowrap;}
.head-contact a:hover {color:#fc0!important;}
.head-contact a:first-of-type {margin-left:0;}


/*** nav ***/
nav {width:100%; background:#000;}
nav ul {width:90%; margin:0 auto; float:left;}
nav li {position:relative; display:inline; float:left;}
nav a:link, nav a:active, nav a:visited {display:block; line-height:36px; text-decoration:none; font-size:16px; color:#fff; font-family:'roboto_condensedbold'; padding:0 11px;}
nav a:hover {color:#fc0;}

nav ul ul {display:none; position:absolute;  z-index:99999; top:36px; left:0; width:220px; background:#333;}
nav ul ul ul {position:absolute; left:100%; top:0;}
nav ul li:hover > ul {display:block; z-index:99999;}
nav ul ul li {float:none; position:relative; display:block;}
nav ul ul li a:link, nav ul ul li a:active, nav ul ul li a:visited {font-size:14px; line-height:16px; padding:7px 0px 7px 10px; border-bottom:1px solid #555; text-align:left; color:#fff;}
nav ul ul li a:hover {background:#000; color:#fc0;}

#mobile-nav .close-nav {width:100%; display:block; height:30px; border-bottom:1px #333 solid; line-height:30px; text-align:right; cursor:pointer;}
#mobile-nav .close-nav i {font-size:18px; margin-right:15px;}

#mobile-nav {display:none; position:absolute; position:fixed; top:0; height:100%; z-index:9999; width:260px; overflow-x:none; overflow-y:auto; font-size:15px; background:#000; color:#fff; margin:0!important;
	-moz-box-shadow:2px 0px 3px rgba(0,0,0,.4); -webkit-box-shadow:2px 0px 3px rgba(0,0,0,.4); box-shadow:2px 0px 3px rgba(0,0,0,.4);}
#mobile-nav ul {clear:both; display:block; padding:0;}
#mobile-nav ul li {display:block; margin:0; line-height:40px; position:relative; border-bottom:1px solid #333;}
#mobile-nav ul li a, #mobile-nav ul li span {padding:0 15px; display:block; font-family:'roboto_condensedbold'; text-decoration:none; color:#fff;}
#mobile-nav ul li a:hover {color:#fc0;}

#mobile-nav ul li.expandable .end {position:absolute; top:0px; right:0px; width:auto; height:40px; display:block;}
#mobile-nav ul li.expandable .end.rotate {-ms-transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg);}
#mobile-nav ul ul.collapsed {display:none;}
#mobile-nav ul ul.expanded {display:block;}

#mobile-nav ul li ul {border-bottom:none; margin:0; background:#333;}
#mobile-nav ul li ul li {line-height:40px; font-size:13px; border-bottom-color:#555;}
#mobile-nav ul li ul li:last-child {border-bottom:none;}
#mobile-nav ul li ul li a, #mobile-nav ul li ul li span {color:#fff; padding-left:30px;}
#mobile-nav ul li ul li a:hover {background:#000; color:#fc0;}

.search-btn {width:10%; float:left; line-height:36px; cursor:pointer; font-size:16px; color:#fc0; font-family:'roboto_condensedbold'; text-align:right;}
.search-btn:hover {color:#fff;}
.search-btn i {margin-right:5px;}


/*** home page elements ***/
.photo-btns {width:100%; display:flex; flex-wrap: wrap; border-top:2px #fff solid; border-bottom:2px #fff solid;}
.photo-btns a {width:33.33333%; display:block; float:left; border-left:2px #fff solid; overflow:hidden; background-position:center; background-repeat:no-repeat; background-size:cover; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.photo-btns a:first-of-type {border-left:none;}
.photo-btns a.construction {background-image:url('../siteart/construction.jpg');}
.photo-btns a.landscaping {background-image:url('../siteart/landscaping.jpg');}
.photo-btns a.ag {background-image:url('../siteart/agriculture.jpg');}
.photo-btns a.power {background-image:url('../siteart/power-system.jpg');}
.photo-btns a.rental {background-image:url('../siteart/rental.jpg');}
.photo-btns img {width:100%; height:auto; position:relative;}
.photo-btns .caption {position:relative; margin-top:50%; z-index:2; width:100%; display:block; background:rgba(0,0,0,0.70); padding:20px 15px; color:#fc0; font-size:18px;
	text-transform:uppercase; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -webkit-transition:.5s all; transition:.5s all; -moz-transition:.5s all;}
.photo-btns .caption span {font-family:'roboto_condensedbold'; width:calc(100% - 30px); float:left;}
.photo-btns .caption i {float:right; font-size:22px;}
.photo-btns a:hover .caption {background:rgba(0,0,0,0.90); color:#fff;}

.quick-search {width:100%; background:url('../siteart/layout/dirt.jpg') no-repeat center; background-attachment:fixed; background-size:cover; padding:45px 0;}
.search-box {width:100%; background:#000; padding:25px 25px 10px 25px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}

.box-bar {width:100%; display:block; border-bottom:2px #fff solid;}
.locations {background:#fc0; color:#000; padding:15px 20px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.locations img {width:90%; height:auto; max-width:127px; margin:0 auto;}
.loc-text, .trade-pad {padding:15px 0;}
.trade {background:#000; color:#fff; padding:15px 20px; border-left:2px #fff solid; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.trade i {font-size:32px;}

.sign-up {background:#fc0; color:#000; padding:15px 20px; border-left:2px #fff solid; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
#formpage input.emailbox {background:rgba(255,255,255,0.3); width:calc(100% - 100px); float:left;}
.signup-btn {background:#000; color:#fff; width:90px; float:right; font-size:14px; padding:6px 0; font-family:'robotobold'; text-align:center; cursor:pointer;}
.signup-btn:hover {background:#333; color:#fff;}
.captcha-box .CaptchaWhatsThisPanel, .captcha-box .CaptchaWhatsThisPanel a {display: none;}
.captcha-box {position:fixed; top:0; left:35%; background:#fff; margin:0 auto; width:30%; z-index:9; padding:10px 15px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;
	-moz-box-shadow:0px 0px 5px rgba(0,0,0,.5); -webkit-box-shadow:0px 0px 5px rgba(0,0,0,.5); box-shadow:0px 0px 5px rgba(0,0,0,.5);}
.captcha-box .CaptchaPanel input {border:1px #ddd solid;}
.captcha-box i {font-size:20px; float:right; margin-bottom:5px; cursor:pointer;}
.captcha-box .CaptchaImagePanel {padding: 5px!important;}
.captcha-box .CaptchaImagePanel img {max-width: 130px;}
.captcha-box .CaptchaMessagePanel {font-size: 10px;}
.captcha-box input.button {font-size: 14px!important;}

.locations:hover {color:inherit; cursor:pointer; background:#E4AE2E; transition: .3s ease-in-out all;}
.trade:hover {color:inherit; cursor:pointer; background:#333; transition: .3s ease-in-out all;}


.service-box {width:100%; display:block; background:#fff; position:relative;}
.service-text {width:45%; float:left; padding:60px 5%; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.diagonal {width:10%; position:absolute; top:0; right:45%; background:url('../siteart/layout/diagonal-lg.png') no-repeat center; background-size:cover;}
.service-photo {width:55%; float:left; background:url('../siteart/service.jpg') no-repeat center; background-size:cover;}


/*** content ***/
article {background:#fff; width:100%; padding:40px 0;}
.main-content {width:71%; float:left; margin-right:3%;}
.banner-ad {width:26%; float:left;}
.banner-ad img {width:100%; height:auto; max-width:300px; margin:0 auto;}

.hero {width:100%; display:block; position:relative; background:#dfdfdf;}
.hero img {width:100%; height:auto; position:relative; margin:0 auto; max-width:1160px}
.page-title {position:absolute; top:0; left:25%; text-align:center; z-index:2; width:50%; margin:0 auto; padding-top:10%;}
.page-title h1 {color:#fff; font-size:48px; line-height: 1; border:3px #fff solid; padding:2%; text-shadow:2px 2px 2px rgba(0,0,0,.6);}

.lg-map {width:100%; display:block;}
.lg-map iframe {width:100%; height:480px;}
.loc-box {width:31.33333%; float:left; margin:0 2% 25px 0; border: 1px solid #999; /*background:#f6f6f6;*/ padding:15px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.loc-box:nth-of-type(3n+1) {clear:left;}

.sm-map {width:60%; float:left; margin:0 3% 0 0;}
.sm-map iframe {width:100%; height:400px;}
.loc-info {width:37%; float:left;}

a.cat-box {width:31.33333%; float:left; display:block; margin:0 2% 25px 0; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
a.cat-box:nth-of-type(3n+1) {clear:left;}
a.cat-box img {width:100%; height:auto;}
a.cat-box span {width:96%; text-align:center; display:block; padding:8px 2%; background:#333; color:#fff; font-family:'robotobold'; -webkit-transition:.5s all; transition:.5s all; -moz-transition:.5s all;}
a.cat-box:hover span {background:#000; color:#fc0;}


/*** footer ***/
.foot {width:100%; display:block; background:#222; padding:35px 0 20px 0; color:#fff; box-sizing: border-box;}
.foot p {margin-bottom:20px;}
.foot a {color:#fc0!important;}
.foot a:hover {color:#E4AE2E!important;}

footer {width:100%; padding:15px 0;}
.copyright {width:100%; text-align:center; color:#999; font-size:12px;}
.copyright a {color:#999; text-decoration:none;}
.copyright a:hover {color:#fff; text-decoration:underline;}


/*** form styles ***/
#formpage input {width:100%; width:calc(100% - 10px); padding:6px 5px; color:#000; font-size:14px; background:#fff; margin-bottom:15px; -webkit-appearance:none; border-radius:0; -moz-border-radius:0; -webkit-border-radius:0;}
#formpage textarea {width:100%; width:calc(100% - 10px); padding:6px 5px; color:#000; font-size:14px; height:120px; background:#fff; margin-bottom:15px; -webkit-appearance:none; border-radius:0; -moz-border-radius:0; -webkit-border-radius:0;}
#formpage select {width:100%; color:#000; vertical-align:middle; font-size:14px; line-height:normal; padding:5px; background:#fff; margin-bottom:15px; border-radius:0; -moz-border-radius:0; -webkit-border-radius:0;}
#formpage input.checkbox {padding:0; border:0; margin:0 5px 0 0; width:13px; height:13px; display:inline; background-color:#fff;}
#formpage input.radio {padding:0; border:0; margin:0 5px 0 0; width:15px; height:15px; display:inline;}

#formpage.bordered input, #formpage.bordered textarea, #formpage.bordered select {border:1px #999 solid;}

/* focus states of various types of fields */
#formpage input:focus, #formpage textarea:focus, #formpage select:focus {
	background:#f6f6f6; color:#000; outline-style:none;}
#formpage input.radio:focus, #formpage input.checkbox:focus {
	background:none; border:0; outline-style:none;}

#formpage input.button, #formpage input.button:focus {width:100%; margin:0; border:none; padding:7px 0; background:#fc0; font-size:16px; line-height:16px; font-family:'robotobold'; color:#000; -webkit-appearance:none; cursor: pointer;}
#formpage input.button:hover {background:#E4AE2E; color:#000;}

/*control the Captcha */
.CaptchaPanel {margin:0 0 0 0 !important; padding:0 0 0 0 !important; text-align: center; line-height:normal !important;}
.CaptchaImagePanel {margin:0 0 0 0; padding:0 0 0 0;}
.CaptchaImagePanel img {width:100%; height:auto; max-width:160px; margin:0 auto;}
.CaptchaMessagePanel {padding:0 0 0 0 !important; margin:0 0 0 0 !important; font-weight:normal !important; font-size:12px; line-height:14px;}
.CaptchaAnswerPanel {margin:0 0 0 0; padding:2px 0px 2px 0px !important;}
.CaptchaWhatsThisPanel {line-height:0; margin:0 0 5px 0; padding:8px 0 8px 0 !important;}
.CaptchaWhatsThisPanel a {color:#000;}
.CaptchaWhatsThisPanel a:hover {text-decoration:none;}

/*** responsive ***/
@media screen and (max-width:1366px) {
	.page-title {padding-top:14%;}
}
@media screen and (max-width:1250px) {
	.logo {margin-right:2%;}
	.tagline {width:42%;}
	
	.service-text {padding:60px 3%;}
}
@media screen and (max-width:1155px) {
	.logo {width:26%;}
	.tagline {width:100%; margin-top:0;}
	
	.photo-btns a {width:50%;}
	.photo-btns .caption {font-size:16px; padding:15px;}
	.photo-btns span i {font-size:18px;}
}
@media screen and (max-width:1024px) {
	.logo {width:35%;}
	nav a:link, nav a:active, nav a:visited {font-size:14px; padding:0 7px;}
	.search-btn {font-size:14px;}
	
	.photo-btns .caption {height:72px;}
	
	.thirds {width:50%;}
	.trade-pad {padding:0;}
	.thirds.sign-up {width:100%;}
	.sign-up {border-left:0; border-top:2px #fff solid;}
	
	.service-text {padding:30px 3%; width:50%;}
	.diagonal {width:15%; right:35%;}
	.service-photo {width:50%;}
	
	.page-title {width:60%; left:20%;}
	
	.foot .col9 .col3 {width:50%;}
	.foot .col3, .foot .col4, .foot .col9 {width: 100%; padding: 0;}
	.foot .col9 {margin-top: 2em;}
}
@media screen and (min-width:769px) {
	#mobile-nav {display:none!important;}
}
@media screen and (max-width:768px) {
	.show-tablet {display:block;}
	.hide-tablet {display:none;}
	
	.col2 {width:25%;}
	.col3, .col4 {width:50%;}
	.col9 {width:100%;}
	.col-lt-pad-tablet {padding:0 0 0 10px;}
	.col-rt-pad-tablet {padding:0 10px 0 0;}
	.col-center-pad-tablet {padding:0 5px 0 5px;}
	.pad-clear-tablet {padding:0;}
	
	.tagline {font-size:20px;}
	#simple-menu {float:left; height:34px; line-height:34px; width:80px; display:block; cursor:pointer; font-family:'roboto_condensedbold'; color:#fff; font-size:16px;}
	.search-btn {font-size:16px; width:80px; float:right;}
	
	.photo-btns .caption {font-size:14px; padding:12px; height:62px;}
	.photo-btns span i {font-size:14px;}
	
	.main-content {width:100%; margin:0 0 15px 0;}
	.banner-ad {width:100%;}
	
	.thirds {width:100%;}
	.trade {border-left:0; border-top:2px #fff solid;}
	.thirds .col3 {width:25%;}
	.captcha-box {width:50%; left:25%;}
	
	.service-text {padding:20px 3%; width:100%;}
	.service-photo {width:100%; border-top:7px #fc0 solid;}
	.service-photo img {width:100%; height:auto;}
	
	.page-title h1 {font-size:36px;}
	.sm-map {width:100%; margin:0 0 20px 0;}
	.sm-map iframe {height:300px;}
	.loc-info {width:100%;}
	
	.lg-map iframe {height:350px;}
	.loc-box {width:48%;}
	.loc-box:nth-of-type(3n+1) {clear:none;}
	.loc-box:nth-of-type(odd) {clear:left;}
	
	a.cat-box {width:48%;}
	a.cat-box:nth-of-type(3n+1) {clear:none;}
	a.cat-box:nth-of-type(odd) {clear:left;}
	
	.foot .col9 {margin-top:15px;}
}
@media screen and (max-width:640px) {
	p {margin-bottom:12px;}
	
	h1 {font-size:20px; margin-bottom:8px;}
	h2 {font-size:20px; margin-bottom:6px;}
	h3 {font-size:24px; margin-bottom:3px;}
	h4 {font-size:18px;}
	h6 {font-size:16px; margin-bottom:5px;}
	
	header {padding:12px 0;}
	.logo {width:43%;}
	
	.photo-btns .caption {padding:8px;}
	
	.search-box .col3, .search-box .col4 {width: 100%; padding: 0;}
	
	.quick-search {padding:20px 0;}
	.search-box {padding:15px;}
	article {padding:20px 0;}
	.foot {padding:25px 10px 10px 10px;}
	.foot p {margin-bottom:15px;}
	footer {padding:10px 0;}
	.copyright {font-size:10px;}
	
	.page-title {width:80%; left:10%;}
}
@media screen and (max-width:540px) {
	.photo-btns a {width:100%; border-left:none; border-top:2px #fff solid;}
	.photo-btns a:first-of-type {border-top:none;}
	.photo-btns .caption {height:auto;}
}
@media screen and (max-width:480px) {
	.hide-480 {display:none;}
	.clear-mobile {display:block;}
	
	header .wrap {flex-wrap: wrap; justify-content: center;}
	.head-contact {text-align: center;}
	
	.col2, .col3, .col4, #formpage .col6, .foot .col9 .col3 {width:100%;}
	.pad-clear-mobile {padding:0;}
	
	.logo {width:100%; margin:0 15%;}
	.logo img {margin:0 auto;}
	.rt-header {width:100%;}
	.tagline {font-size:16px; margin-top:5px;}
	.head-contact {margin-top:5px;}
	
	.lg-map iframe {height:300px;}
	.loc-box {width:100%; margin-right:0;}
	
	.captcha-box {width:70%; left:15%;}
	
	.page-title {padding-top:12%;}
	.page-title h1 {font-size:28px;}
	
	a.cat-box {width:100%; margin-right:0;}
}
@media screen and (max-width:320px) {
	.foot .col6 {width: 100%;}
}