﻿/***** 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 ---------------------*/
.headersect {
	width: 100%;
	display: flex;
	
}
.navleft{
	display: flex;
	width: 35%;
	align-items: center;
    flex-wrap: wrap;
	align-content: center;
}
.navright{
	display: flex;
	width: 35%;
	align-items: center;
    flex-wrap: wrap;
	text-align: right;
	align-content: center;
}
.navcenter{
	display: flex;
	width: 30%;
}
.navlogo{
	width: 100%;
}
.header {
    margin: 2% 18%;
}
.navbottomleft{
	width:100%;
}
.navtopleft{
	width: 100%;
	padding: 0px 10px;
}
.navbottomright{
	width:100%;
}
.navtopright{
	width: 100%;
	padding: 0px 10px;

}
.navlink{
	font-family: 'Montserrat', sans-serif;
	color: #ed1b24;
	font-weight: 600;
	font-size: 12px;
}
.navicons{
	font-size: 18px;
	color: #ed1b24;
	padding: 0px 10px 0px 0px;
}
/*---BODY--------------------------------*/
.herosect{
	background: url("/siteart/AdobeStock_92422772.jpg");
	background-position: 20% 75%;
	background-repeat: no-repeat;
	background-size: cover;
	    display: flex;
    align-items: flex-end;
	height: 600px;
}
.herotextsect{
	display: flex;
	width: 100%;
    justify-content: center;
	align-items: flex-start;
	padding: 65px;
}
.herostars{
	width: 4%;
	padding: 0px 35px;
}
.starimg{
	width: 100%;
}
.heroheadertext {
    display: flex;
    width: 55%;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
}
.heroheader {
    font-family: 'Suwannaphum', serif;
    color: #fff;
    width: 100%;
    font-size: 55px;
    font-weight: 900;
	line-height: 42px;
}
.herosubhead {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 36px;
    color: #cbcbcb;
}
.mobilestars{
	display: none;
}

.hpbtnsect{
	background: url("/siteart/AdobeStock_346804034.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	display: flex;
	padding: 7% 10%;
	justify-content: center;
}
.hpinvbtn {
    width: 20%;
    background: #fff;
    text-align: center;
    padding: 35px 10px;
	margin: 10px;
}
.invicon{
	width: 185px;
}
.bluesubhead{
	 font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    font-size: 22px;
	color: #004077;
}
.hpaboutsect{
display: flex;
}
.hpaboutimagesect{
width: 60%;
background: url("/siteart/iStock_000014425346XLarge.jpg");
background-repeat: no-repeat;
background-size: cover;
}
.hpabouttextsect {
    width: 35%;
	padding: 8% 5% 6% 5%;
}
.redheader{
font-family: 'Suwannaphum', serif;
font-weight: 900;
font-size: 45px;
line-height: 42px;
color: #e50000;
}
.blueheader{
font-family: 'Suwannaphum', serif;
font-weight: 900;
font-size: 45px;
line-height: 42px;
color: #004077;
}
.blackpara{
	color: #000;
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
	line-height: 25px;
    padding: 10px 0px 40px 0px;
}
.redbtn{
	background:#e50000;
	padding: 10px 50px;
	font-family: 'Montserrat', sans-serif;
	color: #fff;
}
iframe.scrolling {
    width: 100%;
    height: 90px;
}
/*--------ABOUT PAGE STYLES--------------------*/

.aboutheader{
	background: #154da0;
	text-align: center;
	padding: 2% 0%;
}

.headerstars{
	width: 8%;
}
.whtheader{
	color: #fff;
	font-family: 'Suwannaphum', serif;
	font-weight: 800;
	font-size: 38px;
	line-height: 40px;
}
.abouttext{
	padding: 4% 20% 8% 20%;

	
}
.submit{
	background:#e50000;
	padding: 10px 50px;
	font-family: 'Montserrat', sans-serif;
	color: #fff;	
	border:none;
}
.contactrightsect{
	margin: 0% 5%;
	width: 40%;
}
/*--------CONTACT PAGE STYLES--------------------*/
.contactpagesect{
	display: flex;
	margin: 3% 0%;
    align-items: center;
}
.contactleftsect{
	width: 26%;
	background: #154da0;
	padding: 10% 6%;

}
.contactstars{
	width: 26%;
}
.contactformfields{
	width: 100%;
    border: none;
    background: #154da029;
    padding: 12px;
    color: #000;
	font-family: 'Montserrat', sans-serif;
	margin: 12px 0px;
}
.contactcomments active{
	border: thin;
	
}
.contactcomments{
	width: 100%;
    border: none;
    background: #154da029;
    padding: 12px;
    color: #000;
	font-family: 'Montserrat', sans-serif;
	margin: 12px 0px;
	height: 75px;
}
.thankyoupadding{
	padding: 14vh 12% 20vh 12%;
}


/*--------FORM STYLES--------------------*/

.CaptchaPanel{
	text-align: left!important;
	margin: 0px 0px 0px 0px!important;
    padding: 0px!important;
}
.CaptchaMessagePanel{
font-family: 'Montserrat', sans-serif!important;
color: #154da0!important;
font-size: 13px!important;
padding: 0px 5px 4px 5px;
font-weight: 400;
}
.CaptchaWhatsThisPanel a{
font-family: 'Montserrat', sans-serif!important;
color: #154da0!important;
font-size: 13px!important;
font-weight: 600!important;
}
/*-------- FOOTER STYLES ----------------*/
.footer{
background: #000;
padding: 2% 15%;
display: flex;
align-items: flex-start;
}
.quicklinksect{
	width: 25%;
	padding: 0% 5%;
}
.footerhoursect{
width: 25%;
padding: 0% 5%;

}
.footermapsect{
	width: 50%;
	padding: 0% 2%;
}
.footermap{
	width: 100%;
	height: 250px;
}
.whitesubhead{
font-family: 'Suwannaphum', serif;
font-weight: 900;
font-size: 25px;
line-height: 30px;
color: #fff;
}
.redunderline{
	border-bottom: 3px solid #e50000;
}
.whitelinks{
	color: #fff;
	font-family: 'Montserrat', sans-serif;
	font-size: 15px;
	line-height: 20px;
}
.greytext{
	color: #A4A4A4;
	font-family: 'Montserrat', sans-serif;
	font-size: 15px;
	line-height: 20px;	
}
.whitetext{
	color: #fff;
	font-family: 'Montserrat', sans-serif;
	font-size: 15px;
	line-height: 20px;	
}
/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/

.invpadding{
	padding: 1% 0% 8% 0%;
}

.list-top-section .list-title .list-listings-count{
color: #154da0!important;	
}
.list-top-section .list-title{
color: #ed1b24!important;	
font-family: 'Suwannaphum', serif!important;
}
.list-top-section .list-title .list-title-text{
font-family: 'Suwannaphum', serif!important;
	
}
.list-content .media-buttons .print-this, .list-content .media-buttons .email-this{
	background-color: #000!important;
    color: #fff!important;
	border-radius: 0px!important;
	border: none!important;
	font-family: 'Montserrat', sans-serif!important;
}
.list-content .list-error-container .info button{
	background-color: #154da0!important;
}
.faceted-search-content .selected-facets-container .selected-facet{
	background-color: #154da0!important;
	
}
.list-content .list-error-container .info .selected-facet button{
	background: transparent!important;
}
.list-content .price-container .price {
	color: #154da0!important;
}
.view-listing-details-link{
	background-color: #ed1b24!important;
}
.faceted-search-content button.faceted-search{
background: #000!important;	
}
.faceted-search-content .faceted-section-box .faceted-btn-container .faceted-show-all-btn{
background: #000!important;	
	
}
.list-content .list-container .buy-btn, .list-content .list-container .contact-btn, .list-content .list-container .check-availability, .list-content .list-container .email-seller, .list-content .list-container .video-chat, .list-content .list-container .facebook-messenger, .list-content .list-container .whatsapp, .list-content .list-container .text{
background-color: #154da0!important;	
}
.list-top-section .sticky-top-menu .listing-option-bar-content .list-listings-count{
color: #154da0!important;	
	
}
.mobile-option-bar .mobile-option-bar-filter{
	color: #154da0!important;
}
.faceted-search-content .mobile-done-button-container .mobile-done-button{
background-color: #154da0!important;	
	
}
/*---------- RESPONSIVE STYLES ----------*/



@media only screen and (max-width: 1530px) {
.heroheadertext {
    width: 65%;	}
	.hpbtnsect{
	padding: 7% 5%;
	}
	.footer{
		padding: 2%;
	}
}
@media only screen and (max-width: 1460px) {
.header {
    margin: 2% 8%;
}
.heroheadertext {
    width: 75%;
}	
}
@media only screen and (max-width: 1425px) {
.contactleftsect {
    width: 35%;
}
.contactrightsect {
    margin: 4% 3%;
    width: 38%;
}	
	
}


@media only screen and (max-width: 1230px) {
	
.abouttext {
    padding: 6% 10% 12% 10%;
}	
	
}
@media only screen and (max-width: 1200px) {
	
.hpaboutimagesect {
	width: 45%;
	}	
.hpabouttextsect {
    width: 48%;
    padding: 6% 5% 6% 4%;
}	
}
@media only screen and (max-width: 1160px) {
	.herotextsect{
	padding: 65px 0px;	
	}
	.heroheadertext {
    width: 80%;
}
	.hpbtnsect {
    padding: 7% 0%;
}
.hpinvbtn {
	width: 25%;}
.header {
    margin: 2% 3%;
}
}
@media only screen and (max-width: 1120px) {
	.footermapsect {
	width: 36%;
	}
	.quicklinksect {
	width: 25%;
	padding: 0% 2%;
	}
	.footerhoursect {
	width: 25%;
	padding: 0% 2%;
	}
	.abouttext {
    padding: 10vh 10% 14vh 10%;
	}
	.thankyoupadding {
    padding: 17vh 5% 25vh 10%;
}
}
@media only screen and (max-width: 1025px) {
.herostars {
    width: 7%;
    padding: 0px 15px;
}	
.heroheadertext {
    width: 80%;
}	
.heroheader {
    font-size: 46px;
    line-height: 40px;
}
.herosubhead {
    font-size: 26px;
}
	.aboutheader{
		margin: 5% 0% 2% 0%;
		padding: 5% 2%;
	}
	.abouttext {
    padding: 4vh 10% 12vh 10%;
}
.contactstars {
    width: 125px;
}
.contactleftsect {
    width: 85%;
	padding: 3% 5%;
}
.contactrightsect {
    margin: 3% 3%;
    width: 90%;
}
	.contactpagesect {
    margin: 5% 0%;
    align-items: center;
    flex-wrap: wrap;
}
}
@media only screen and (max-width: 1020px) {
.mobilelogo{
    width: 218px;
}
.mobileicons{
    width: 100%;
	text-align: right;
}
.navicons{
	font-size: 20px;
}
}
@media only screen and (max-width: 995px) {
.herostars {
    padding: 0px 15px;
}
.heroheadertext {
    width: 85%;
}
.herotextsect{
	align-items: center;
}
}


@media only screen and (max-width: 830px) {
.hpinvbtn {
    width: 30%;
	padding: 35px 4px;
}	
.invicon {
    width: 145px;
}	
.hpaboutsect {
    display: flex;
    flex-wrap: wrap;
}
	.hpaboutimagesect {
    width: 100%;
    height: 410px;
}
	.hpabouttextsect {
    width: 100%;
    padding: 6% 5% 6% 4%;
}
}
@media only screen and (max-width: 720px) {
	.footer{
		flex-wrap: wrap;
	}
	.quicklinksect{
		width: 46%;
		padding: 2% 2% 5% 2%;

	}
	.footermapsect {
    width: 100%;
}
	.footerhoursect {
    width: 46%;
    padding: 2% 2% 5% 2%;
}
.headerstars {
    width: 15%;
}
	.contactrightsect {
    margin: 3% 3%;
    width: 78%;
}
}
@media only screen and (max-width: 690px) {
	.herostars{
		display: none;
	}	
	.mobilestars{
		display: inline-block;
		width: 100%;
		text-align: center;
    	padding: 10px 0px;
	}
	.mobilestar{
		width: 15%;
	}
	.herotextsect{
		flex-wrap: wrap;
	}
	.heroheader {
    font-size: 40px;
    line-height: 35px;
	}
	.herosubhead {
    font-size: 24px;
	}
	.herotextsect {
    padding: 35px 0px;
	}
	.herosect{
		height: 450px;
	}
	.heroheadertext {
    width: 100%;
	}
	.abouttext {
    padding: 3vh 3% 8vh 3%;
}
	.aboutheader {
    margin: 8% 0% 2% 0%;
}
	.whtheader {
    font-size: 36px;
    line-height: 40px;
}

}
@media only screen and (max-width: 665px) {
	
	.hpbtnsect{
	flex-wrap: wrap;	
	}
	.hpinvbtn {
	width: 90%;}
	.headerstars {
    width: 20%;
}
}
@media only screen and (max-width: 450px) {
.hpabouttextsect {
    width: 100%;
    padding: 10% 5% 15% 4%;
}	
	.blueheader{
	font-size: 38px;
 	line-height: 32px;	
	}	
	.redheader{
	font-size: 38px;
    line-height: 30px;	
	}	
	.hpaboutimagesect{
		background-position: 20%;
	}
.headerstars {
    width: 30%;
}
}
@media only screen and (max-width: 420px) {
.mobilestar {
    width: 24%;
}	
.heroheader {
    font-size: 30px;
    line-height: 28px;
}	
.herosubhead {
    font-size: 17px;
    line-height: 16px;
}
.mobilestars{
	padding: 5px 0px;
}
.footerhoursect {
	width: 95%;
}	
.quicklinksect {
    width: 95%;
	}
}
@media only screen and (max-width: 360px) {
.mobilelogo {
    width: 180px;
}	
.whtheader {
    font-size: 28px;
    line-height: 28px;
}	
	.aboutheader{
	padding: 8% 0%;	
	}
	.contactrightsect {
    margin: 3% 3%;
    width: 80%;
}
	.contactstars {
    width: 90px;
}
	.thankyoupadding {
    padding: 15vh 5% 15vh 10%;
}
}

@media only screen and (max-width: 285px) {
.heroheader {
    font-size: 9vw;
    line-height: 9vw;
}	
.herosubhead {
    font-size: 5vw;
    line-height: 5vw;
}	
.mobilestar {
    width: 30%;
}
.herosect {
    height: 360px;
}
.bluesubhead{
	font-size: 19px;	
	}
.redheader {
    font-size: 10vw;
    line-height: 8vw;
}
.blueheader {
    font-size: 10vw;
    line-height: 8vw;
}
	.blackpara{
		font-size: 5vw;
	}
	.redbtn{
		font-size: 12px;
		padding: 10px 15px;
	}
	.whtheader {
    font-size: 9vw;
    line-height: 10vw;
}
}
@media only screen and (max-width: 266px) {
.mobileicons {
    text-align: center;
}	
.mobilelogo {
    width: 100%;
}
.bluesubhead{
	font-size: 8vw;	
}
.invicon {
    width: 100%;
}
	
}




