/* Set viewport width: 1000 */
/* Set separate viewport width for font-size and line-height: 1200 */
/*===================== Color information green- 197b30 bright green - 13c53d maroon- 5e0d24 blue/gray- d2d6e2 gray logo color- a3a0a1 =======================*/
/*===================== CSS reset/normalize =======================*/
/**Correct `block` display not defined in IE 8/9.**/
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
    display: block;
}

main.subpage {
    display: flex;
}

main.subpage img {
    object-fit: cover;
    width: 31vw;
}

pre {
    white-space: pre-wrap;
}

small {
    font-size: 80%;
}

nav ul li {
    list-style-type: none;
}

/*===================== @Font-Face =======================*/
/*===================== base styles =======================*/
html {
    font-family: Arial, sans-serif;
    /* 1 */
    -ms-text-size-adjust: 100%;
    /* 2 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
}

body {
    margin: 0;
}

body,
html {
    overflow-x: hidden;
}

svg:not(:root) {
    overflow: hidden;
    /*reset*/
}

/* clear floats */
.group:before,
.group:after {
    content: "";
    display: table;
}

.group:after {
    clear: both;
}

.group {
    zoom: 1;
}

.clear {
    clear: both;
}

/*image replacement*/
.hide-text {
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    border-style: solid;
    height: 0;
}

img {
    border: 0;
}

.contactInfo {
    flex-direction: row;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    background: #0057B7;
    padding: 8px 230px;
    padding: max(4px, 0.41667vw) max(20px, 11.97917vw);
}

.contactInfo .contactsnip a,
.contactInfo .contactsnip span {
    font-family: "interstate", sans-serif;
    font-weight: 800;
    font-size: 25.6998px;
    font-size: max(13px, 1.03853vw);
    line-height: 48px;
    line-height: max(30px, 2.5vw);
    color: #FFFFFF;
}

.contactInfo .contactsnip span {
    padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
nav.primary ul li a {
    font-family: "interstate-condensed", sans-serif !important;
    font-weight: bold !important;
}

.contactInfo span {
    color: white;
    font-size: 31px;
    font-size: max(19px, 1.61458vw);
    padding: 0 20px;
    padding: 0 max(10px, 1.04167vw);
}

header {
    flex-direction: row;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 150px;
    padding-left: max(30px, 7.8125vw);
    margin-bottom: -68px;
    margin-bottom: min(-35px, -3.54167vw);
}

.otherpage header {
    margin-bottom: 0;
}

header a img {
    width: 290px;
    width: max(151px, 15.10417vw);
}

/***** Start of primary nav ******/
#menu-button {
    display: none;
}

nav.mobile {
    display: none;
}

nav.primary {
    padding: 0;
    display: inline-block;
    margin: 0;
    width: 79%;
    position: relative;
    /* background: #000; */
}

nav.primary ul {
    margin: 0;
    padding: 0;
    justify-content: flex-end;
    display: flex;
    padding-right: 130px;
    padding-right: max(68px, 6.77083vw);
}

nav.primary li ul {
    width: 22vw;
    box-sizing: revert-layer;
}

nav.primary ul li {
    display: inline-block;
    margin: 0;
    list-style-type: none;
    width: auto;
}

nav.primary ul li a {
    color: black;
    font-size: 14px;
    font-size: max(9px, 0.72917vw);
    line-height: 60px;
    line-height: max(38px, 3.125vw);
    text-decoration: none;
    display: block;
    margin: 0;
    text-align: center;
    text-transform: uppercase;
    -webkit-transition: .4s ease-in;
    -moz-transition: .2s ease-in;
    -o-transition: .2s ease-in;
    transition: .2s ease-in;
    font-weight: 500;
    padding: 0 12px;
    padding: 0 max(6px, 0.625vw);
    font-family: "interstate", sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 28.3167px;
    font-size: max(18px, 1.25vw);
    line-height: 34px;
    line-height: max(21px, 1.77083vw);
    /* justify-content: flex-end; */
    /* display: flex; */
    padding: 0 29px !important;
    padding: max(15px, 0.91042vw) max(15px, 1.51042vw) !important;
}

nav.primary ul li a:hover {
    background: #000;
    color: white;
}

/* Appearance of the sub-level links */
nav.primary ul li li a {
    font-size: 16px;
    font-size: max(10px, 0.83333vw);
    line-height: 16px;
    line-height: max(10px, 0.83333vw);
    padding: 10px;
    padding: max(5px, 0.52083vw);
    color: #fff;
    background: #181818;
    text-align: left;
    border-right: none;
    FONT-SIZE: max(18px, 1.47483vw);
    border-left: none;
    border-bottom: #303030 solid 1px;
}

/* Appearance of the sub-level links on hover */
/* This controls the Primary nav dropdowns for sublinks. Should not have to edit this too muuch */
nav.primary ul ul {
    display: none;
    position: absolute;
}

nav.primary ul ul ul {
    position: absolute;
    left: 100%;
    top: 0;
}

nav.primary ul li:hover>ul {
    display: block;
    line-height: 18px;
    line-height: max(11px, 0.9375vw);
    z-index: 100;
}

nav.primary ul ul li {
    float: none;
    width: 270px;
    width: max(141px, 17.0625vw);
    position: relative;
    margin: 0;
    display: block;
    width: 100%;
}

@media screen and (max-width: 1730px) {
    nav.primary ul li a {
        padding: 0 7px;
    }
}

@media screen and (max-width: 1575px) {
    nav.primary ul li a {
        /* font-size: 12px; */
    }
}

@media screen and (max-width: 1400px) {
    nav.primary {
        width: 82%;
    }
}

/******** End of primary Nav ***************/
@media screen and (max-width: 1340px) {

    /*============================== Mobile Nav Styles ================================*/
    nav.primary {
        display: none;
    }

    #menu-button {
        width: 74%;
        display: inline-block;
        font-size: 24px;
        position: relative;
        line-height: 60px;
        z-index: 400;
        /* needs to be lower than nav.mobile, adjust as needed */
        /* background: #000; */
        text-align: right;
        padding-right: 20px;
    }

    #menu-button a {
        color: black;
        text-decoration: none;
        padding-right: 20px;
        font-weight: normal;
    }

    nav.mobile {
        display: block;
        position: fixed;
        top: 0;
        left: -250px;
        width: 250px;
        height: 100%;
        background: #333;
        z-index: 500;
        /* needs to be higher than #menu-button, adjust as needed */
        overflow: auto;
    }

    /* MENU HEADER SOCIAL MEDIA */
    nav.mobile .social-media {
        position: relative;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        word-spacing: 13px;
        padding: 0 0 0 15px;
        color: #ccc !important;
    }

    nav.mobile .social-media a:link,
    nav.mobile .social-media a:visited {
        color: #ccc;
        text-decoration: none;
    }

    nav.mobile .social-media a:hover,
    nav.mobile .social-media a:active {
        color: #fff;
        text-decoration: underline;
    }

    /* MENU HEADER STYLES */
    nav.mobile .mobile_top {
        position: relative;
        display: block;
        padding: 0;
        margin: 50px 0 10px 0;
        color: #999;
        font-size: 18px;
        font-weight: 400;
    }

    /* MENU CLOSE 'X' BUTTON */
    nav.mobile .menu-toggle {
        position: absolute;
        padding: 3px 8px 3px;
        font-family: Arial, sans-serif;
        font-size: 24px;
        font-weight: bold;
        line-height: 1;
        background: #222;
        color: #999;
        text-decoration: none;
        top: -38px;
        right: 13px;
    }

    nav.mobile .menu-toggle:hover {
        /* Menu close button on hoveer */
        color: #fff;
    }

    /* MENU LIST STYLE */
    nav.mobile ul {
        list-style: none;
        font-weight: 300;
        margin: 0;
        padding: 0;
    }

    nav.mobile ul li {
        border-top: 1px solid #454545;
        border-bottom: 1px solid #151515;
        position: relative;
    }

    /* FIRST LEVEL */
    nav.mobile ul li a {
        position: relative;
        display: block;
        font-size: 15px;
        padding: 10px;
        color: #999;
        text-decoration: none;
        border-left: 4px #333 solid;
        text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
        text-align: left;
    }

    nav.mobile ul li a:hover {
        background: rgba(45, 45, 45, 0.5);
        color: #fff;
        /* border-left: 4px #CB1C1C solid; */
        /* border highlight - Change to fit match site colors */
    }

    /* SECOND LEVEL */
    nav.mobile ul li li:last-child {
        border: none;
    }

    nav.mobile ul li li a {
        background: #444;
        position: relative;
        display: block;
        padding: 10px 10px 10px 15px;
        border-left: 4px #444 solid;
        color: #ccc;
        text-decoration: none;
    }

    nav.mobile ul li li a:hover {
        background: rgba(65, 65, 65, 0.5);
    }

    /* THIRD LEVEL */
    nav.mobile ul li li li:last-child {
        border: none;
    }

    nav.mobile ul li li li a {
        background: #555;
        position: relative;
        display: block;
        padding: 10px 10px 10px 25px;
        color: #ccc;
        text-decoration: none;
        border-left: 4px #555 solid;
    }

    nav.mobile ul li li li a:hover {
        background: rgba(85, 85, 85, 0.5);
    }

    nav.mobile ul li .click {
        /* dropdown menu idicator arrow be sure to include this image with your image files */
        position: absolute;
        display: block;
        cursor: pointer;
        z-index: 12399994;
        top: 0;
        right: 0;
        width: auto;
        height: auto;
        padding: 12px 20px;
        color: #fff;
    }

    .nav-footer {
        color: #1B1B1B;
        position: relative;
        text-align: center;
        font-size: 14px;
        line-height: 16px;
        padding: 15px 0;
    }

    /* FONT AWESOME ICONS */
    nav.mobile ul li a .fa {
        width: 25px;
        font-weight: 100;
        padding: 8px 3px;
        margin: 0 6px 0 0;
        text-align: center;
        background: #292929;
        -webkit-border-radius: 30px;
        -moz-border-radius: 30px;
        border-radius: 30px;
        text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
    }

   nav.mobile ul li .fa-chevron-down {
        color: #999!important;
    }

    /* SLIDE DOWN NAV STYLES */
    /*#menu-button{display:inline-block;position:relative;line-height:60px;z-index:400;line-height:1;text-align:right;font-family:interstate,sans-serif;font-size:16px;letter-spacing:0.03em;line-height:32px;text-align:left;color:#413f40;text-transform:uppercase;font-weight:bold;}#menu-button a{color:#000;text-decoration:none;}nav.mobile{display:block;position:fixed;top:0;top:-100%;width:100%;height:100%;background:#eaeaea;z-index:99999;overflow:auto;}.flexSurround{display:flex;align-items:center;justify-content:center;flex-direction:column;height:90vh;overflow:hidden;}nav.mobile .social-media{position:relative;text-decoration:none;display:inline-block;font-size:16px;word-spacing:13px;padding:0 0 0 15px;color:#ccc!important;}nav.mobile .social-media a:link,nav.mobile .social-media a:visited{color:#ccc;text-decoration:none;}nav.mobile .social-media a:hover,nav.mobile .social-media a:active{color:#fff;text-decoration:underline;}nav.mobile .mobile_top{position:relative;display:block;padding:0;margin:50px 0 10px 0;color:#999;font-size:18px;font-weight:400;top:0;right:0;width:100%;}nav.mobile .menu-toggle{position:absolute;padding:3px 8px 3px;font-family:Arial,sans-serif;font-size:44px;font-weight:100;line-height:1;color:var(--neutral2);text-decoration:none;bottom:0px;right:13px;}nav.mobile .menu-toggle:hover{color:var(--secondary2);}nav.mobile ul{list-style:none;font-weight:300;margin:0;padding:0;width:100%;}nav.mobile ul *{transition:all 0.1s ease-out;}nav.mobile ul li{position:relative;}nav.mobile ul li a{position:relative;display:block;font-size:16px;padding:16px;color:var(--neutral2);font-family:interstate,sans-serif;text-decoration:none;text-align:center;text-transform:uppercase;}nav.mobile ul li a:hover{background:rgba(45,45,45,0.5);color:#f9f9f9;}nav.mobile ul li li:last-child{border:none;}nav.mobile ul li li a{background:#444;position:relative;display:block;padding:10px 10px 10px 15px;border-left:4px #444 solid;color:#ccc;text-decoration:none;}nav.mobile ul li li a:hover{background:rgba(65,65,65,0.5);}nav.mobile ul li li li:last-child{border:none;}nav.mobile ul li li li a{background:#555;position:relative;display:block;padding:10px 10px 10px 25px;color:#ccc;text-decoration:none;border-left:4px #555 solid;}nav.mobile ul li li li a:hover{background:rgba(85,85,85,0.5);}nav.mobile ul li .click{position:absolute;display:block;cursor:pointer;z-index:12399994;top:0;right:0;width:auto;height:auto;padding:17px 20px;color:#fff;}.nav-footer{color:#1B1B1B;position:relative;text-align:center;font-size:14px;line-height:16px;padding:15px 0;}nav.mobile ul li a .fa{width:25px;font-weight:100;padding:8px 3px;margin:0 6px 0 0;text-align:center;background:#292929;-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px;text-shadow:1px 1px 1px rgba(0,0,0,0.3);}nav.mobile ul li .fa-chevron-down{color:#999;}*/
}

@media screen and (max-width: 1020px) {
    #menu-button {
        width: 34%;
    }
}

@media screen and (max-width:450px) {
    #menu-button {
        width: 100%;
    }
}

#hero {
    background-image: linear-gradient(rgba(227, 180, 35, 0.7), rgba(227, 180, 35, 0.7)), url("/siteart/dozers.png");
    background-size: cover;
    /* Ensures the image covers the entire element */
    background-position: center;
    /* Centers the image */
    background-repeat: no-repeat;
    /* Prevents repetition */
    background-attachment: fixed;
    /* Creates a parallax effect */
    margin-bottom: -60px;
    margin-bottom: min(-31px, -3.125vw);
    padding-bottom: 40px;
    padding-bottom: max(21px, 2.08333vw);
}

#hero .herotext {
    width: 620px;
    width: max(323px, 32.29167vw);
}

#hero .herotext h1 {
    font-family: "interstate", sans-serif;
    font-weight: 400;
    font-size: 94.5787px;
    font-size: max(59px, 4.92597vw);
    line-height: 113px;
    line-height: max(71px, 5.88542vw);
    color: #000000;
    padding: 205px 70px 0px;
    padding: max(107px, 10.67708vw) max(36px, 3.64583vw) 0px;
}

#hero .herotext h2 {
    font-family: "interstate", sans-serif;
    font-weight: 400;
    font-size: 56.6214px;
    font-size: max(35px, 2.94903vw);
    line-height: 68px;
    line-height: max(43px, 3.54167vw);
    color: #000000;
    padding-left: 70px;
    padding-left: max(36px, 3.64583vw);
    padding-right: 70px;
    padding-right: max(36px, 3.64583vw);
}

#bottomglobe {
    background-image: linear-gradient(rgba(0, 87, 183, 0.8), rgba(0, 87, 183, 0.8)), url('/siteart/earth.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* background-attachment: fixed; */
    padding: 160px 90px 130px;
    padding: max(83px, 8.33333vw) max(47px, 4.6875vw) max(68px, 6.77083vw);
    margin: 0 74px;
    margin: 0 max(39px, 3.85417vw);
    display: block;
    position: relative;
}

#bottomglobe h2 {
    font-family: "interstate", sans-serif;
    font-weight: 400;
    font-size: 49.7197px;
    font-size: max(28.9px, 2.28957vw);
    line-height: 60px;
    line-height: max(38px, 3.125vw);
    color: #000000;
    margin: 0;
}

main .surroundtext {
    font-family: "interstate", sans-serif;
    font-weight: 400;
    font-size: 32.2006px;
    font-size: max(13px, 1.07711vw);
    line-height: 60px;
    line-height: max(38px, 3.125vw);
    color: #000000;
    padding: 100px 280px 150px;
    padding: max(52px, 5.20833vw) max(146px, 14.58333vw) max(78px, 7.8125vw);
    text-align: center;
}

main .surroundtext {
    text-align: left;
    padding: max(52px, 5.20833vw) max(86px, 6.58333vw) max(78px, 7.8125vw);
}

.mapareastuff {
    width: 40vw;
    height: 21vw;
}

.leftrightstuff {
    display: flex;
}

.mapareastuff iframe {
    width: 100%;
    height: 100%;
}

.contactsection {
    padding-right: 30px;
}

.contactsection a {
    color: #0057b7;
}

.areastuff {
    display: flex;
    text-align: left;
    padding-left: 40px;
}

main .surroundctas {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* changed from space-between */
  gap: max(16px, 1.5625vw);
  padding: 0px max(44px, 6.42708vw) max(112px, 11.19792vw);
}


main .surroundctas .cta {
  text-decoration: none;
  flex-direction: column;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background: #FACD40;
  flex: 1 1 31%;
  max-width: 31%;
  box-sizing: border-box;
  padding: 0; 
  overflow: hidden;
}

/* Hover effect */
main .surroundctas .cta:hover {
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

dev.cta .contactsection {
    width: 89%;
    padding: 16px;
    font-family: "interstate", sans-serif;
}

.contactsection span {
    padding: 0 !important;
}

.contactsection a {
    padding: 0 !important;
    color: black;
}

.contactsection,
.contactsection * {
    font-size: 18px !important;
}

main .surroundctas .cta img {
    width: 510px;
    width: max(266px, 26.5625vw);
    width: 100%;
    height: 377.2px;
    height: max(196px, 19.64583vw);
    object-fit: cover;
}

main .surroundctas .cta span {
    font-family: "interstate-condensed", sans-serif !important;
    font-weight: 400;
    font-size: 41.5218px;
    font-size: max(26px, 2.16259vw);
    line-height: 50px;
    line-height: max(31px, 2.60417vw);
    color: #000000;
    text-decoration: none !important;
    padding: 15px;
    padding: max(8px, 0.78125vw);
}

footer {
    background: black;
    display: flex;
    justify-content: space-between;
    padding: 135px 205px 240px 95px;
    padding: max(70px, 7.03125vw) max(107px, 10.67708vw) max(125px, 12.5vw) max(49px, 4.94792vw);
}

.leftarea i {
    /* Earning your business the BEST way for your EQUIPMENT */
    font-family: "interstate", sans-serif;
    font-style: italic;
    font-weight: 400;
    font-size: 28.6884px;
    font-size: max(18px, 1.49419vw);
    line-height: 53px;
    line-height: max(33px, 2.76042vw);
    /* identical to box height, or 186% */
    text-align: center;
    color: #FFFFFF;
}

footer .leftarea a img {
    width: max(200px, 16vw);
}

footer .rightarea {
    display: flex;
    gap: 65px;
    gap: max(34px, 3.38542vw);
}

footer .rightarea .contactsection {
    font-family: "interstate", sans-serif;
    font-weight: 800;
    font-size: 25.6998px;
    font-size: max(16px, 1.33853vw);
    line-height: 48px;
    line-height: max(30px, 2.5vw);
    color: #FFFFFF;
    text-decoration: none !important;
    font-weight: normal;
    color: white;
}

footer .rightarea .contactsection * {
    font-family: "interstate", sans-serif;
    font-weight: 800;
    font-size: 25.6998px;
    font-size: max(16px, 1.33853vw);
    line-height: 48px;
    line-height: max(30px, 2.5vw);
    color: #FFFFFF;
    text-decoration: none !important;
    font-weight: normal;
    color: white;
}

footer .rightarea .contactsection strong {
    font-weight: bold;
}

@media screen and (max-width: 1200px) {
    header #menu-button {
        background: none;
    }
}

@media (max-width: 1024px) {
  main .surroundctas .cta {
    flex: 1 1 45%;
    max-width: 45%;
  }
}

@media screen and (max-width: 1000px) {
    footer {
        flex-direction: column;
    }

    footer .rightarea {
        justify-content: space-between;
        padding-top: 30px;
    }
}

@media screen and (max-width: 767px) {
	
	 main .surroundctas .cta {
    flex: 1 1 100%;
    max-width: 100%;
  }
	
    main.subpage {
        flex-direction: column;
    }

    main.subpage img {
        width: 100%
    }

    .leftrightstuff {
        flex-direction: column
    }


    .leftrightstuff {}

    .leftrightstuff .mapareastuff {

        width: 100%;

        margin-bottom: 30px;

        height: 271px;
    }

    .leftrightstuff .mapareastuff .leftrightmap {

        width: 100%;
    }

    .leftrightstuff .areastuff {

        display: flex;

        flex-direction: column;

        text-align: center;
    }

    .leftrightstuff .areastuff .contactsection {}

    .leftrightstuff .areastuff .contactsection strong {}

    .leftrightstuff .areastuff .contactsection br {}

    .leftrightstuff .areastuff .contactsection a {}

    .leftrightstuff .areastuff .contactsection a br {}

    .contactInfo {
        text-align: center;
        justify-content: center;
    }

    main .surroundtext {
        padding: 40px;
    }

    main .surroundctas {
        flex-direction: column;
    }

    main .surroundctas .cta {
        width: 100%;
    }

    footer {
        flex-direction: column;
    }
}

@media screen and (max-width: 500px) {
    footer {
        flex-direction: column;
    }

    footer .rightarea {
        flex-direction: column;
    }
}