﻿/***** BEGIN RESET *****/

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 {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;	
}

ol, ul {
	list-style: none;
}

table{border-collapse:collapse; width:100%;}
td{vertical-align:top;}

/* Make HTML 5 elements display block-level for consistent styling */  
header, nav, article, footer, address {  
    display: block;  
} 

/*-------- COLORS --------

*/

/***** END RESET *****/
::-moz-selection {
    background: #000; 
    color: #fff;
    text-shadow: none;
}
::selection {
    background: #000;
    color: #fff;
    text-shadow: none;
}


/* Clearfix */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

/*-------- BODY STYLES --------*/

body {

}

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}

/*--- HEADER STYLES ---------------------*/
header {}
.topheader {
    display: flex;
	padding: 5px 2%;
}
.headerright {
    display: flex;
    align-items: center;
    width: 80%;
    justify-content: flex-end;
}
.headlogosect {
    width: 20%;
}
.headerinfo a{
font-family: "Manrope", system-ui;
color: #000;
padding-left: 10px;
transition-duration: 0.5s;
}
.headerinfo a:hover{
font-weight: 500;
}
.headerinfo {
    width: 30%;
    margin-right: 24px;
}
.mobileheaderinfo{
	display: none;
}
.headerinfobtn {
    font-family: 'New Amsterdam';
    font-size: 18px;
    background: #84f3ff;
    color: #000;
    width: 250px;
    text-align: center;
    padding: 10px 0px;
    box-sizing: border-box;
	border:5px solid #84f3ff;
	transition-duration: 0.5s;
}
.headerinfobtn:hover {
    background: #fff;
	border-radius: 15px;
}
.headerinfobtn a{
    color: #000;
}
.herosection{
	background: url("/siteart/Olympia-hero.jpg");
	background-size: cover;
	width: 100%;
	height: 750px;
	background-position: bottom;
	display: flex;
	flex-wrap: wrap;
}
.herotextsect {
    background: #84f3ffdb;
    width: 720px;
    clip-path: polygon(0 0, 100% 0, 72% 100%, 0% 100%);
    display: flex;
    align-items: center;
    box-sizing: border-box;
    flex-wrap: wrap;
    align-content: center;
}
.mobileheroimg{display: none;}
.heroheader {
    font-family: 'New Amsterdam';
    font-size: 98px;
    font-weight: 200;
	line-height: 80px;
	padding-bottom: 25px;
}
.herotext {
    font-family: 'Manrope';
    font-size: 22px;
    padding-bottom: 70px;
}
.heropadding {
    width: 82%;
    padding: 0% 5%;
    box-sizing: border-box;
}
.herobtnsect {
    background: #000;
    position: absolute;
    left: -10%;
    width: 795px;
    top: 715px;
    color: #fff;
    padding: 12px 0px 12px 12%;
    box-sizing: border-box;
}
.herobtn {
    color: #fff;
    font-family: 'New Amsterdam';
    font-size: 25px;
	transition-duration: 0.5s;
}
.herobtn:hover {
    color: #e6fdff;
}
.herobtn i{
    color: #000;
    font-size: 15px;
	background: #00d4e9; 
	padding: 10px;
	margin-left: 70px;
	transition-duration: 0.5s;
}
.herobtn i:hover{
	padding: 10px 15px;
	margin-left: 70px;
	background: #e6fdff;
}
.trailer-cat-sect {
    padding: 4%;
    display: flex;
    flex-wrap: wrap;
	justify-content: space-between;
}
.trailer-cat-sect h2{
  width: 100%;
}
.smheadertext{
    font-family: 'New Amsterdam';
	text-transform: uppercase;
	font-size: 30px;
	font-weight: 300;
	line-height: 32px;
	padding-bottom: 10px;
	color: #405560;
}
.headertext{
    font-family: 'New Amsterdam';
	text-transform: uppercase;
	font-size: 40px;
	font-weight: 300;
	line-height: 36px;
	padding-bottom: 10px;
}
.headertext span{
    font-family: 'New Amsterdam';
	text-transform: uppercase;
	font-size: 48px;
	font-weight: 300;
}
.paratext{
font-family: "Manrope", system-ui;
font-size: 18px;
line-height: 28px;
}
.hp-trailer-cat {
    display: flex;
    flex-wrap: wrap;
    border-bottom: 14px solid #00d4e9;
    width: 22%;
    padding: 50px 30px 5px 30px;
    box-sizing: border-box;
}
.hp-trailer-cat img{
    width: 100%;
	padding-bottom: 20px;
}
.cat-trailer-link {
    font-size: 20px;
    font-family: 'New Amsterdam';
    color: #405560;
    width: 100%;
    padding-bottom: 6px;
	transition-duration: 0.5s;
}
.cat-trailer-link:hover {
    color: #000;
}
.cat-trailer-link i{
    font-size: 14px;
    background: #405560;
    color: #fff;
    padding: 8px;
	margin-left: 10px;
	transition-duration: 0.5s;
}
.cat-trailer-link i:hover{
    padding: 8px 10px;
	background: #000;
}
.hp-finance-left {
    width: 58%;
    display: flex;
    flex-wrap: wrap;
    border-bottom: solid 30px #00d4e9;
    justify-content: center;
    padding-bottom: 20px;
}
.hp-finance-right p{
   padding: 5px 0px 25px 0px;
}
.hp-finance-sect{
	    padding: 50px 4%;
		display: flex;
		justify-content: space-between;
		align-items: center;
}
.hp-finance-right {
    width: 38%;
}
.bluebtn i{
    color: #000;
    font-size: 15px;
	margin-left: 30px;
}
.bluebtn {
      font-family: 'New Amsterdam';
    font-size: 18px;
    background: #84f3ff;
    color: #000;
    width: 250px;
    text-align: center;
    padding: 10px 0px;
    box-sizing: border-box;
	display: block;
	border: solid 5px #84f3ff;
	transition: 0.5s;
}
.bluebtn:hover {
    background: #fff;
	border-radius: 15px;
}
.hp-consign-sect {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
	padding: 100px 4%;
}
.hp-consign-left{
	width: 55%;
}
.hp-consign-right{
	width: 45%;
}
.hp-about-sect{
	background: url("/siteart/triangle-about-background.jpg");
	background-size: cover;
	background-position: center;
	padding: 50px 5%;
	
}
.hp-about-text {
    background: #fff;
    padding: 10% 5%;
}
.hpmapsect{
	width: 100%;
	height: 350px;
}
/*---BODY--------------------------------*/
.pageheadersect {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 20px;
	text-align: center;
	flex-wrap: wrap;
}
.pageheader {
    font-family: 'New Amsterdam';
    font-size: 42px;
    font-weight: 300;
	margin-bottom: 30px;
}
.pageheader span {
    width: 100%;
    display: block;
    line-height: 20px;
    font-size: 54px;
}
.pageheaderunderline{
	width: 100%;
	height:30px;
	background: url("/siteart/triangle-about-background.jpg");
	background-size: cover;
}
.pagepadding {
    padding: 20px 3% 40px 3%;
}
.flexbox {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
	padding-bottom: 20px;
}
.contactpageleft{
	width: 65%;
}
.contactpageright {
    width: 30%;
    padding-top: 5%;
}
.cpinfo {
	padding: 22px 0px;
}
.cpinfo i{
	font-size: 20px;
	color: #405560;
}
.cpinfo a{
	font-family: "Manrope", system-ui;
    color: #000;
    padding: 0px 8px;
    font-size: 20px;
	transition-duration: 0.5s;
}
.cpinfo a:hover{
	font-weight: 500;
}
/*--------FORM STYLES--------------------*/
.formflex {
    padding: 20px 0px;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
	font-family: "Manrope", system-ui;
}
.subhead {
    font-family: "Manrope", system-ui;
    font-size: 18px;
    font-weight: 800;
    text-transform: uppercase;
    padding: 8px 0px;
}
.formflex .subhead{
	width: 100%;
}
.halfformfields {
    width: 48%;
    margin-right: 1%;
	margin-bottom: 10px;
    height: 40px;
    padding: 0px 5px;
	font-size: 16px;
    box-sizing: border-box;
	font-family: "Manrope", system-ui;
}
.fullformfields {
    width: 97%;
	margin-bottom: 10px;
    height: 40px;
	font-size: 16px;
    padding: 0px 5px;
    box-sizing: border-box;
	font-family: "Manrope", system-ui;
}
.comments {
    width: 97%;
	margin-bottom: 10px;
    height: 200px;
	font-size: 16px;
    padding: 10px 5px;
    box-sizing: border-box;
	font-family: "Manrope", system-ui;
}
.fullcenter {
    width: 100%;
    text-align: center;
	display: flex;
	justify-content: center;
}
.submitform{
    width: 310px;
    text-align: center;
    background: #84f3ff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'New Amsterdam';
    color: #000;
    font-size: 20px;	
	border: 5px solid #84f3ff;
	padding: 8px 0px;
	transition-duration: 0.5s;
	cursor: pointer;
}
.submitform:hover{
    background: #fff;
	border-radius: 15px;
}

/*-------- FOOTER STYLES ----------------*/
.footer {
    display: flex;
    justify-content: space-between;
    padding: 40px 3%;
    border-top: solid 12px #000;
}
.footerlinks {
    display: flex;
    flex-wrap: wrap;
    width: 35%;
}
.halffooterlinks {
    color: #000;
    font-family: 'New Amsterdam';
    font-size: 20px;
    font-weight: 300;
    width: 50%;
	transition-duration: 0.5s;
}
.halffooterlinks:hover{
    letter-spacing: 0.3px;
}
.footerinfo {
    width: 30%;
    display: flex;
    flex-wrap: wrap;
}
.footercontact {
    width: 100%;
    font-family: 'New Amsterdam';
    font-size: 20px;
    color: #000;
	transition-duration: 0.5s;
}
.footercontact:hover {
     letter-spacing: 0.3px;
}
.footercontact i{
    font-size: 18px;
   padding-right: 5px;
}
.footerlogo {
    width: 30%;
}
.footerbutton {
    width: 310px;
    text-align: center;
    background: #84f3ff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'New Amsterdam';
	border: 5px solid #84f3ff;
    color: #000;
    font-size: 20px;
	transition-duration: 0.5s;
}
.footerbutton:hover {
    background: #fff;
	border-radius: 15px;
}
.CaptchaPanel{
	width: 100%;
}
.CaptchaWhatsThisPanel a {
	color: #000!important;
}
/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/

.invpadding{
	padding: 20px 0px;
}
.list-top-section .list-listings-count{
color: #405560!important;

}
.faceted-search-content .selected-facets-container .selected-facet{
    background: #84f3ff!important;
    color: #000!important;	
}
.list-redesign .other-site-data-section .rent-lease .rent-lease-price{
color: #405560!important;
	
}

.list-top-section .list-title .list-title-text{
    font-family: 'New Amsterdam'!important;	
	font-weight: 400!important;
	font-size: 2.4em!important;
}


/*---------- RESPONSIVE STYLES ----------*/



@media only screen and (max-width: 1550px) {
.contactpageleft {
    width: 54%;
}	
.contactpageright {
	width: 40%;}	
}
@media only screen and (max-width: 1520px) {
.headerinfo {
    width: auto;
	padding: 0px 20px;
}
.headerinfobtn {
    width: 180px;
    text-align: center;
    padding: 5px 0px;
}
}

@media only screen and (max-width: 1380px) {
.hp-trailer-cat {
    width: 40%;
    padding: 50px 30px 5px 30px;
    margin: 0px 5%;
}
.trailer-cat-sect{
	    justify-content: center;	
	}
}
@media only screen and (max-width: 1280px) {
.heroheader {    
	font-size: 88px;
    line-height: 68px;
	}
.herotext {
    font-size: 20px;
    padding-bottom: 55px;
}	
.herotextsect {
	    width: 598px;
    clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%);
	}
.herobtnsect{width: 700px; top: 695px;}
}
@media only screen and (max-width: 1160px) {
.contactpageleft {width: 45%;}
.contactpageright {width: 50%;}

}
@media only screen and (max-width: 1090px) {
    .headerinfo {
        width: auto;
        padding: 0px 5px;
    }	
}

@media only screen and (max-width: 1023px) {
	.headerright {display: none;}
	.topheader{padding: 0px 0%; justify-content: space-between; align-items: flex-start; margin-bottom: -25px;}
	
.mobileheaderinfo {
    display: flex;
    background: #00d4ea;
    align-items: center;
    padding: 25px 20px;
    width: 160px;
	box-sizing: border-box;
    justify-content: flex-end;
}	
.mobileheaderinfo a{
   color: #000;
   font-size: 20px;
   padding: 0px 18px;
}
.headlogosect {
    width: 50%;
}
.headlogosect img {
     width: 225px;
     padding-top: 10px;
}
.footer{
	flex-wrap: wrap;
	padding: 20px 3% 40px 3%;
}
.footerlogo {
    width: 100%;
	padding-bottom: 10px;
}
.footerlogo img {
    width: 200px;
}
.footerlinks{
	width: 50%;
}
.footerinfo {
	width: 45%
}
.footercontact{
    padding-bottom: 10px;		
}
.contactpageleft {
    width: 100%;
}
.contactpageright {
    width: 100%;
}
.pageheadersect {padding: 30px 20px;}
.herosection{margin-top: 15px;}
}
@media only screen and (max-width: 920px) {
.hp-finance-sect{flex-wrap: wrap;}	
.hp-finance-left{width: 100%; box-sizing: border-box; padding: 20px 60px;}
.hp-finance-right {
    width: 100%;
    padding-top: 25px;
}
}
@media only screen and (max-width: 890px) {
	.herosection{
		height: 750px;
		background: #fff;
	}
	.mobileheroimg {
        height: 385px;
        background: url(/siteart/Olympia-hero.jpg);
        background-size: cover;
        display: block;
        width: 100%;
    }
	    .herotextsect {
        width: 100%;
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
        height: 355px;
		background: #fff;
    }
	    .herobtnsect {
        width: 100%;
        top: -82px;
        position: relative;
        padding: 12px 0px 12px 15%;
    }
	.hp-trailer-cat {
        width: 48%;
        margin: 0px 1%;
    }
    .hp-consign-left {
    width: 100%;
    padding-bottom: 30px;
}
	.hp-consign-right {
    width: 100%;
}
	.hp-consign-sect{padding: 50px 4%;}
}
@media only screen and (max-width: 760px) {
.halfformfields {width: 97%;}	
.hp-finance-left {padding: 20px 15px;}
	
}
@media only screen and (max-width: 660px) {
    .mobileheroimg {height: 265px;}	
	.herosection {height: 595px;}
	.herotextsect{height: 352px; align-items: flex-start; padding-top:30px; align-content: flex-start; }
	    .heroheader {
        font-size: 65px;
        line-height: 50px;
    }
	    .herotext {
        font-size: 17px;
        padding-bottom: 16px;
    }
	.herobtnsect {
        top: -130px;
    }
	.herobtn{font-size: 20px;}
	.herobtn i {
    font-size: 12px;
	margin-left: 40px;}
	.herobtn i:hover {
		margin-left: 40px;}
}
@media only screen and (max-width: 620px) {
    .footerinfo {
        width: 100%;
		padding-top: 20px
    }
	.footerlinks {
        width: 100%;
    }
	.pageheadersect {
        padding: 30px 20px 10px 20px;
    }
	.hp-trailer-cat img {width: 68%;}
	.hp-trailer-cat {width: 98%; justify-content: center;}
	.hp-about-sect{padding: 50px 0%;}
}
@media only screen and (max-width: 530px) {
    .mobileheroimg {
        height: 200px;
    }
	    .herosection {
        height: auto;
			align-items: flex-start
    }
	    .herotextsect {
        height: auto;
        align-items: flex-start;
        padding-top: 15px;
        align-content: flex-start;
    }
	.herobtnsect {
        top: 0px;
    }
	.hp-trailer-cat img {
		width: 95%;}
	.trailer-cat-sect {
		padding: 10% 4%}
}
@media only screen and (max-width: 480px) {
.heroheader {
        font-size: 58px;
        line-height: 50px;
        width: 100%;
        padding-bottom: 12px;
    }	
}
@media only screen and (max-width: 400px) {
	.pageheader span{line-height: 40px; font-size: 48px;}	
	.pageheader{line-height: 30px; margin-bottom: 15px;}
	.mobileheaderinfo{width: 120px; padding: 25px 5px;}
	.headlogosect img {width: 195px;}
	.topheader {margin-bottom: -10px;}
	.mobileheroimg {
        height: 180px;
    }
	.heropadding {
    width: 100%;
	padding: 0% 3%}
	.headertext{font-size: 33px; line-height: 30px;}
	.headertext span {font-size: 42px;}

}
@media only screen and (max-width: 370px) {
.halffooterlinks{
	width: 100%;
    padding-bottom: 5px;
}	
.heroheader {
        font-size: 52px;
        line-height: 42px;
        width: 100%;
        padding-bottom: 12px;
    }
.cpinfo {padding: 16px 0px;}
.cpinfo a{font-size: 16px; padding: 0px 4px;}
.headertext{font-size: 34px;}
.paratext{font-size: 15px; line-height: 22px;}	
.hp-trailer-cat img { width: 100%;}
.hp-trailer-cat{padding: 50px 15px 5px 15px;}
.hp-finance-left{border-bottom: solid 15px #00d4e9;}
}
@media only screen and (max-width: 335px) {
    .headlogosect img {
        width: 165px;
    }
	.topheader {
        margin-bottom: 5px;
    }
	.herobtn i {
        font-size: 12px;
		margin-left: 5px;}
	.herobtn i:hover {
		margin-left: 5px;}
	.bluebtn {
		width: 100%;
	}
}