/***** BEGIN RESET *****/
* {
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0;
    font-family: 'roboto_condensedbold', "Roboto Condensed", Arial, sans-serif;
}

div#menu-button {
    display: none;
    text-align: left !important;
    !i;
    !;
}

nav#menu {
    display: none;
}

ol,
ul {
    list-style: none;
}

.clear {
    clear: both;
    height: 0px;
    margin: 0;
}

/***** END RESET *****/

@font-face {
    font-family: 'roboto_condensedregular';
    src: url('../fonts/RobotoCondensed-Regular-webfont.eot');
    src: url('../fonts/RobotoCondensed-Regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/RobotoCondensed-Regular-webfont.woff') format('woff'),
        url('../fonts/RobotoCondensed-Regular-webfont.ttf') format('truetype'),
        url('../fonts/RobotoCondensed-Regular-webfont.svg#roboto_condensedregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_condensedbold';
    src: url('../fonts/RobotoCondensed-Bold-webfont.eot');
    src: url('../fonts/RobotoCondensed-Bold-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/RobotoCondensed-Bold-webfont.woff') format('woff'),
        url('../fonts/RobotoCondensed-Bold-webfont.ttf') format('truetype'),
        url('../fonts/RobotoCondensed-Bold-webfont.svg#roboto_condensedbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

h1 {
    font-size: 60px;
    color: #ec141d;
    text-align: center;
}

#welcomestuff h1 {
    margin-top: 20px;
}

h3 {
    font-size: 18px;
    color: #000;
}

h3 a {
    color: #000;
    text-decoration: none;
}

h3 a:hover {
    color: #ec141d;
}

h4 {
    font-size: 18px;
}


/******** Basic Styles ********/
.show-menu-for-mobile {
    display: none;
}

body {
    background: #fff;
    -webkit-text-size-adjust: none;
    overflow-x: hidden;
}

#site-width {
    width: 1020px;
    margin: 10px auto;
    text-align: center;
}

#site-width.invPage {
    width: 100%;
}

/******** Header Styles ********/
#headerwrap {
    background: white;
    /* background: #252734; */
}

header {
    width: 100%;
    max-width: 1820px;
    margin: 0 auto;
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    box-sizing: border-box;
}

#contact {
    float: right;
    text-align: right;
    color: #fff;
    /* width: 40%; */
    padding-top: 5px;
    display: flex;
    align-items: center;

}

div#contact h4 {
    width: 170px;
    color: black !important;
    !i;
    !;
}

#contact a {
    color: black;
    text-decoration: none;
}

#contact a:hover {
    text-decoration: underline;
}

/******** Content Styles ********/
.hosted-content #listings-title html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
    /* text-align: left; */
}

.wrapstuffmenu {
    width: 100%;
    align-items: center;
    display: flex;
}

.hero {
    POSITION: RELATIVE;
}

.hero.notslideshow .cycle-slideshow .twoimgs {
    display: flex;
}

img.overlaylogo {
    position: absolute;
    z-index: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    MARGIN-TOP: -60px;
    width: max(110px, 21vw);
}

.twoimgs.cycle-slide {
    display: flex !important;


    justify-content: space-between;
    width: 100%;
}

.twoimgs.cycle-slide img {
    width: 50% !important;


    height: 39.6vw;
    object-fit: cover;
}

div#welcomestuff {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0 30px;
    display: flex;
    flex-direction: row;
}

div#welcomestuff IMG {
    HEIGHT: MAX(110PX, 6VW);
    WIDTH: MAX(280PX, 19VW);
    OBJECT-FIT: contain;
}

div#welcomestuff h1 {
    PADDING: 2VW 4VW;
}

div#flexstuff {
    display: flex;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
    max-width: 1640px;
    margin: 0 auto;
    flex-direction: column-reverse;
    /* margin-top: -180px; */
    z-index: 3;
    position: relative;
    margin-top: -180px;
}

@media screen and (max-width: 1200px) {
    .notslideshow .cycle-slideshow img {
        width: 50% !important
    }
}

#main img {
    width: 100%;
    margin: 0 auto;
}

.logo {
    font-size: 70px;
}

#btnwrap {
    /* margin: 0 auto; */
    padding: 15px 0 25px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin-right: 0 !important;
    flex-wrap: wrap;
    width: 70%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    /* Sets 20px gap between rows and columns */
    height: 160px;
    transform: scale(1);
    margin: 0 auto !important;
    !i;
    !;
}

/*#leftbtn {float:left; width:49%;}
#leftbtn img {float:left; width:100%;}

#rightbtn {float:right; width:50%; }
#rightbtn img {float:right; width:100%;}
*/

.btn {
    /* display: inline-block; */
    width: 100%;
    background: #ec141d;
    color: #fff !important;
    text-transform: uppercase;
    text-align: center;
    font-size: 2.75rem;
    padding: 20px 0;
    margin: .25%;
    text-decoration: none;
    padding: 19px;
    font-size: max(24px, 1.7vw);
    box-sizing: border-box;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn:hover {
    background: linear-gradient(#ec141d, #dc1018);
}

.btn img {
    width: 100%;
}

.formwrap {
    max-width: 1020px;
    width: 100%;
    margin: 0 auto;
}

.formwrap a {
    color: #131c5b;
    text-decoration: none;
}

.formwrap a:hover {
    color: #ea1f28;
}

.cycle-slideshow {
    position: relative;
    width: 100%;
    margin: 0 auto;
    z-index: 0 !important;
}

.cycle-slideshow img {
    width: 100%;
    height: auto;
    position: relative;
    z-index: 0;
}

.notslideshow .cycle-slideshow img {
    height: 41vw;
    width: 50%;
}


#formpage {
    vertical-align: top;
}

#formpage div {
    vertical-align: top;
    padding: 3px 5px;
}

#formpage input {
    padding: 6px 5px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border: 1px solid #000;
    font-family: 'roboto_condensedbold', "Roboto Condensed", Arial, sans-serif;
    color: #000;
    font-size: 12px;
}

#formpage textarea {
    padding: 6px 5px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border: 1px solid #000;
    font-family: 'roboto_condensedbold', "Roboto Condensed", Arial, sans-serif;
    background: #fff;
    font-size: 12px;
}


/* selects have similar styles to input & textarea fields, but with no padding. Text in a dropdown select is positioned differently */
#formpage select {
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border: 1px solid #fff;
    font-family: 'roboto_condensedbold', "Roboto Condensed", Arial, sans-serif;
    color: #8e8d8d;
    vertical-align: middle;
    font-size: 12px;
    line-height: normal;
    padding: 5px;
}

#formpage input {
    width: 100%;
}

#formpage input.larger {
    width: 100%;
}

#formpage textarea {
    width: 100%;
    height: 85px;
}

/* focus states of various types of fields */

#formpage input:focus,
#formpage textarea:focus,
#formpage select:focus {
    background: #fff;
    color: #000;
    border: 1px solid #16598d;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    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: 200px;
    margin: 10px 0;
    padding: 7px 0;
    background: #131c5b url('../siteart/submit_btn.jpg') repeat-x;
    border: 2px #192578 solid;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 14px;
    font-weight: bold;
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .6);
}

#formpage input.button:hover {
    background: #ea1f28;
    color: #fff;
    text-shadow: none;
    border: 2px #D11F27 solid;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
}



/* for plain text next to an input field, if not using a table structure */
#formpage label.basic {
    color: #212121;
    font-size: 13px;
    text-align: left;
}

#formpage label.checkbox {
    /*  color:#212121;*/
    font-size: 13px;
    text-align: left;
    display: inline;
    padding: 0;
}


/*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;
}

.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 0 0;
    padding: 8px 0 8px 0 !important;
}

.CaptchaWhatsThisPanel a {
    color: #000;
}

.CaptchaWhatsThisPanel a:hover {
    text-decoration: none;
}


/******MAIN NAVIGATION******/

#navwrap {
    float: left;
    width: 60%;
    display: flex;
    align-items: center;
    width: 100% !important;
}

#nav {
    position: relative;
    display: block;
    z-index: 9000;
    margin: 0 auto 0 auto;
    padding: 0 0 0 0;
    text-align: center;
    width: 100%;
}

#nav ul,
nav li {
    list-style: none;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

#nav ul li {
    display: block;
    position: relative;
    float: left;
    text-align: center;
}

#nav li ul {
    display: none;
}


#nav ul li a {
    /* appearance of the first-level links */
    display: block;
    text-decoration: none;
    color: black !important;
    !i;
    !;
    font-weight: normal;
    font-size: max(14px, 1vw);
    line-height: 18px;
    transition: color .2s ease-in-out;
    -moz-transition: color .2s ease-in-out;
    -webkit-transition: color .2s ease-in-out;
    padding: 8px 1vw;
    height: 1%;
    text-transform: uppercase;
    text-shadow: none;
    text-align: center;
    font-family: 'roboto_condensedbold', "Roboto Condensed", Arial, sans-serif;
}

#nav ul li a:hover {
    /* appearance of the first-level links on hover */
    height: 1%;
    color: #ec141d;
}


#nav ul li li a {
    /* appearance of the sub-level links */
    width: 215px;
    padding: 8px 0 8px 15px;
    text-align: left;
    background: #090909;
    border-bottom: 1px #333 solid;
    border-right: 1px solid #333;
    border-left: 1px solid #333;
    background: url("../siteart/footbg.png") repeat-x;
    color: white !important;
}

#nav ul li li a:hover {
    /* appearance of the sub-level links on hover */
    color: #fff;
    background: #ec141d url("../siteart/nav-ro-bg.jpg") repeat-x;
}

/* Unless needing to do something extra or experimental, DON'T edit these positioning styles below! */
#nav ul ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
}

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

#nav ul li:hover>ul {
    display: block;
    line-height: 18px;
    /* make sure your line-height always matches that of your main link styles!*/
    z-index: 100;
    background: #4b0000;
    /* make sure your background color always matches your link styles!*/
}

#nav ul ul li {
    float: none;
    position: relative;
}


/******AUCTION NAVIGATION******/
.nav {
    position: relative;
    display: block;
    z-index: 9000;
    margin: 0 auto 0 auto;
    padding: 0 0 0 0;
    text-align: center;
    width: 100%;
}

.nav ul,
nav li {
    list-style: none;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

.nav ul li {
    display: block;
    position: relative;
    float: left;
    text-align: center;
}

.nav li ul {
    display: none;
}


.nav ul li a {
    /* appearance of the first-level links */
    display: block;
    text-decoration: none;
    color: #fff;
    font-weight: normal;
    font-size: 16px;
    line-height: 18px;
    transition: color .2s ease-in-out;
    -moz-transition: color .2s ease-in-out;
    -webkit-transition: color .2s ease-in-out;
    padding: 8px 17px;
    height: 1%;
    text-transform: uppercase;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, .6);
    text-align: center;
    font-family: 'roboto_condensedbold', "Roboto Condensed", Arial, sans-serif;
}

.nav ul li a:hover {
    /* appearance of the first-level links on hover */
    height: 1%;
    color: #ec141d;
}


/******BOTTOM NAVIGATION******/
.secondnav {
    margin: 20px auto;
}

.secondnav a {
    color: #000;
    text-decoration: none;
}

.secondnav a:hover {
    color: #ec141d;
}

.secondnav img {
    width: 15%;
    margin: 10px auto;
}


/************************************************** Equipment Images *****************/



.box-contain {
    width: 100%;
    float: none;
    margin: 0 auto 10px;
    text-align: center;
    display: block;
    padding: 25px 0;
    background: #fafafa;
}

.box-wrap {
    width: calc(100% - 40px);
    float: none;
    margin: 0 auto;
    text-align: center;
}

.zoom-container {
    float: none;
    width: calc(24% - 3px);
    max-width: 500px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    display: inline-block;
    box-sizing: border-box
}

.zoom-container img {
    display: block;
    width: 100%;
    height: auto;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    padding: 0;
    margin: 0;
    border: 2px solid rgba(0, 0, 0, 0);
    box-sizing: border-box;
}

.zoom-container h3 {
    text-transform: uppercase;
    text-decoration: none;
    text-align: center;
    color: #262836;
}

.zoom-container a:hover h3 {
    color: #ec141d;
}

.zoom-container a {
    text-decoration: none;
}

.zoom-container:hover img {
    /** -webkit-transform:scale(1.25); 
	-moz-transform:scale(1.25); 
	-ms-transform:scale(1.25); 
	-o-transform:scale(1.25); 
	transform:scale(1.25); 
	display: block;**/
    border: 2px solid #ec141d;
}


#footer {
    background: url("../siteart/footbg.png") repeat-x;
    padding: 15px;
    line-height: 15px;
    color: #fff;
}

a.footerlink:link,
a.footerlink:visited,
a.footerlink:active {
    text-decoration: underline;
    font-family: 'roboto_condensedregular', Arial, sans-serif;
    font-size: 11px;
    color: #fff;
}

a.footerlink:hover {
    text-decoration: none;
    font-family: 'roboto_condensedregular', Arial, sans-serif;
    font-size: 11px;
    color: #fff;
}

.footertext {
    font-family: 'roboto_condensedregular', Arial, sans-serif;
    font-size: 11px;
    color: #fff;
}

.smallfootertext {
    font-family: 'roboto_condensedregular', Arial, sans-serif;
    font-size: 11px;
    color: #fff;
}

.divfooter {
    width: 450px;
    text-align: center;
    margin: 0 auto;
}




/************************************************ Responsive Styles **/
@media screen and (max-width: 1720px) {
    #btn {
        width: 49.3%;
    }
}

@media screen and (max-width: 1280px) and (min-width:1024px) {
    .show-menu-for-mobile {
        display: none;
    }

    header {
        width: 95%;
    }

    #site-width {
        width: 95%;
    }

    .formwrap {
        width: 95%;
    }

    #nav ul li a {
        font-size: 16px;
        padding: 8px 10px;
    }

    #btn {
        font-size: 2rem;
    }


}



@media screen and (max-width: 1023px) and (min-width:501px) {
    .show-menu-for-mobile {
        display: none;
    }

    h3 {
        font-size: 16px;
        color: #000;
    }

    h4 {
        font-size: 12px;
    }

    header {
        width: 91%;
        margin: 0 auto;
        padding: 5px 0;
    }

    /*#navwrap {width:70%;}*/
    #nav ul li a {
        padding: 6px 5px;
        font-size: 13px;
    }

    #contact {
        width: 30%;
        text-align: right;
        color: #fff;
        padding-top: 5px;
    }

    #contact a {
        color: black;
        text-decoration: none;
    }

    #contact a:hover {
        text-decoration: underline;
    }

    #site-width {
        width: 95%;
    }

    #btn {
        width: 49.2%;
        font-size: 1.5rem;
    }

    .formwrap {
        width: 90%;
    }

    .secondnav {
        font-size: 13px;
        margin: 10px auto;
    }

    .divfooter {
        width: 95%;
    }

    .zoom-container {
        width: calc(49% - 3px);
    }
}

@media screen and (max-width: 767px) {
    .show-menu-for-mobile {
        display: block;
    }

    .hide-for-mobile {
        display: none;
    }

    .hide {
        display: none;
    }


    #navwrap {
        width: 40%;
    }

    header img {
        margin: 0 !important;
        !i;
        !;
    }

    .wrapstuffmenu {
        width: unset;
        color: black !important;
        !i;
        !;
        !u;
        !ui;
        !;
    }

    #contact {
        width: 55%;
        text-align: center !important;
        padding-top: 10px;
        display: none;
    }

    header {
        display: flex;
        flex-direction: row;
    }

    #contact * {
        text-align: center !important;
    }

    #contact h4 {
        /* text-align: right !important; */
    }

    #btn {
        width: 49.1%;
        font-size: 1rem;
    }

    /******************styles for the main site navigation during mobile display*************/
    #navicon {
        float: left;
        font-size: 24px;
        font-size: 1.5em;
        text-decoration: none;
        position: relative;
        z-index: 99999999999999999;
        margin: 0.25rem 0 0 0.5rem;
        color: #fff;
    }

    #nav {
        /* display: none; */
    }
}

@media screen and (max-width: 500px) and (min-width:321px) {
    .show-menu-for-mobile {
        display: block;
    }

    .hide-for-mobile {
        display: none;
    }

    .hide {
        display: none;
    }

    h1 {
        font-size: 36px;
    }

    h3 {
        font-size: 16px;
        color: #000;
    }

    h4 {
        font-size: 12px;
    }

    header {
        width: 90%;
        margin: 0 auto;
        padding: 5px 0;
    }

    #navwrap {
        width: 20%;
    }

    #contact {
        width: 70%;
        text-align: right;
        color: #fff;
        padding-top: 10px;
    }

    #contact a {
        color: #fff;
        text-decoration: none;
    }

    #contact a:hover {
        text-decoration: underline;
    }


    #site-width {
        width: 95%;
    }

    /*#site-width img {width:25%;}*/

    .logo {
        font-size: 50px;
    }

    #btnwrap {
        width: 100%;
        margin: 0 auto;
        padding: 0px 0 15px 0;
    }

    #leftbtn {
        float: none;
        width: 100%;
    }

    #leftbtn img {
        float: none;
        width: 100%;
    }

    #btn {
        display: block;
        width: 100% !important;
    }

    #btn a {
        text-decoration: none !important;
    }

    #rightbtn {
        float: right;
        width: 100%;
    }

    #rightbtn img {
        float: right;
        width: 100%;
    }

    .formwrap {
        width: 80%;
    }

    .secondnav {
        font-size: 13px;
        margin: 10px auto;
    }

    .divfooter {
        width: 95%;
    }

    /******************styles for the main site navigation during mobile display*************/
    #navicon {
        float: left;
        font-size: 24px;
        font-size: 1.5em;
        text-decoration: none;
        position: relative;
        z-index: 99999999999999999;
        margin: 0.25rem 0 0 0.5rem;
        color: #fff;
    }

    #nav {
        display: none;
    }
}

@media screen and (max-width: 500px) {
    #btn {
        width: 32.5%;
    }

    .zoom-container {
        width: calc(100% - 3px);
    }

}



@media screen and (max-width: 320px) {
    .show-menu-for-mobile {
        display: block;
    }

    .hide-for-mobile {
        display: none;
    }

    .hide {
        display: none;
    }

    h1 {
        font-size: 32px;
    }

    h3 {
        font-size: 16px;
        color: #000;
    }

    h4 {
        font-size: 11px;
    }

    header {
        width: 90%;
        margin: 0 auto;
        padding: 5px 0;
    }

    #navwrap {
        width: 20%;
    }

    #contact {
        width: 70%;
        text-align: right;
        color: #fff;
        padding-top: 8px;
    }

    #contact a {
        color: #fff;
        text-decoration: none;
    }

    #contact a:hover {
        text-decoration: underline;
    }


    #site-width {
        width: 90%;
    }

    .logo {
        font-size: 45px;
    }

    #btnwrap {
        width: 100%;
        margin: 0 auto;
        padding: 15px 0 25px 0;
    }

    #leftbtn {
        float: none;
        width: 100%;
    }

    #leftbtn img {
        float: none;
        width: 100%;
    }

    #btn {
        width: 100%;
    }

    #rightbtn {
        float: right;
        width: 100%;
    }

    #rightbtn img {
        float: right;
        width: 100%;
    }

    .formwrap {
        width: 75%;
    }

    #formpage input.button,
    #formpage input.button:focus {
        width: 100%;
    }

    .secondnav {
        font-size: 13px;
        margin: 10px auto;
    }



    .divfooter {
        width: 95%;
    }

    /******************styles for the main site navigation during mobile display*************/
    #navicon {
        float: left;
        font-size: 24px;
        font-size: 1.5em;
        text-decoration: none;
        position: relative;
        z-index: 99999999999999999;
        margin: 0.25rem 0 0 0.5rem;
        color: #fff;
    }

    #nav {
        display: none;
    }
}


@media screen and (max-width: 1000px) {
    div#welcomestuff {
        order: 2
    }

    .text-container p {

        font-weight: 100 !important;
        !i;
        !;

        font-size: 21px;

        line-height: 1.7;
    }

    div#flexstuff {
        flex-direction: column;
        overflow: hidden;
        display: flex;
    }

    #btnwrap {
        margin-right: 0;
        grid-template-columns: 1fr;
        height: 350px;
        order: 1;
    }
}

.auction-section {
    display: flex;
    justify-content: space-between;
    margin: 20px;
    align-items: center;
    margin-bottom: 60px;
}

.text-container {
    flex: 1;
    padding: 20px;


    font-size: 36px;
}

.text-container p {
    width: 50vw !important;
}

.image-container {
    flex: 1;
    padding: 20px;
    border-right: 1px solid #ccc;
    /* Add right border */
}

.image-container img {
    width: max(220px, 40vw);
    margin: ;
}

/* Responsive Design (Optional) */
@media (max-width: 768px) {
    .auction-section {
        flex-direction: column;
        /* Stack elements on smaller screens */
    }
}