/* 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;} img{max-width: 100%; height: auto; image-rendering: -webkit-optimize-contrast;}


/* FRAMEWORK */

*{box-sizing: border-box;}
html, body{font-family: 'Montserrat', sans-serif; font-size: 16px; -webkit-text-size-adjust: none} 
html {scroll-behavior: smooth;}
body {overflow-x: hidden; line-height: 1.6; letter-spacing: .02em;}
::-moz-selection{background: #cc511e; color: #fff; text-shadow: none} ::selection{background: #cc511e; color: #fff; text-shadow: none;}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}
button,
input { /* 1 */
  overflow: visible;
}
button,
select { /* 1 */
  text-transform: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

.pad60 {padding: 60px 8%!important;}
.pad30 {padding: 30px!important;}
.orange {color: #cc511e;}
.center {text-align: center;}
.curved-head {background: #fff; width: 100%; height: 30px; border-top-left-radius: 50%; border-top-right-radius: 50%; position: relative; z-index: 0; margin-top: -30px;}

.content-width{margin: 0 auto; width: 93%; max-width: 1280px;}

.column12, .column11, .column10, .column9, .column8, .column7, .column6, .column5, .column4, .column3, .column2, .column1{float: left; padding: 0 25px 0 0;} .column12{width: 100%; padding: 0;} .column11{width: 91.6666%;} .column10{width: 83.3333%;} .column9{width: 75%;} .column8{width: 66.6666%; box-sizing: border-box;} .column7{width: 58.3333%; position: relative; box-sizing: border-box;} .column6{width: 50%; box-sizing: border-box;} .column5{width: 41.6666%; box-sizing: border-box;} .column4{width: 33.3333%; box-sizing: border-box;} .column3{width: 25%; box-sizing: border-box;} .column2{width: 16.6666%; box-sizing: border-box;} .column1{width: 8.3333%;} .last{padding: 0;} .cf{zoom: 1;} .cf:before, .cf:after{content: ""; display: table;} .cf:after{clear: both;} .clear{clear: both;} *{box-sizing: border-box;}


/* TYPOGRAPHY */

a{text-decoration: none; color: inherit; transition: all .2s ease-in-out;} a:hover{color: inherit;}
a#cta-btn {cursor: pointer; display: inline-block; text-align: center; color: #4e2300; font-family: 'Montserrat', sans-serif; margin: 95px 0 20px 0; box-sizing: border-box; font-weight: 800; position: relative; padding: 10px 5%; text-transform: uppercase; border: 1px solid #4e2300; background: transparent; border-radius: 30px; letter-spacing: 1px;}
#form a#cta-btn {margin: 20px 0;}
#form input[type="submit"] {cursor: pointer; display: inline-block; text-align: center; color: #4e2300; font-family: 'Montserrat', sans-serif; margin: 20px 0; box-sizing: border-box; font-weight: 800; position: relative; padding: 10px 5%; text-transform: uppercase; border: 1px solid #4e2300; background: transparent; border-radius: 30px; letter-spacing: 1px;}
a#cta-btn2  {cursor: pointer; display: inline-block; text-align: center;  color: #fff; font-family: 'Montserrat', sans-serif; margin: 15px auto; box-sizing: border-box; font-weight: 600;  position: relative; padding: 10px 10%; text-transform: uppercase; border: 1px solid #fff; border-radius: 30px;}
a#cta-btn3 {float: left; width: calc(33.33% - 15px); display: flex; justify-content: center; align-content: center; cursor: pointer; text-align: center; color: #000; font-family: 'Montserrat', sans-serif; margin: 10px auto; box-sizing: border-box; font-weight: 600;  position: relative; padding: 15px 2%; text-transform: uppercase; border: 1px solid #000; background: transparent;}
a#cta-btn:hover, a#cta-btn2:hover, #form input[type="submit"]:hover, a#cta-btn3:hover, .filter-search form input[type="submit"]:hover, a#cta-btn4:hover {border: 1px solid transparent; transition: all .2s ease-in-out; background: #5b2d13; color: #fff; box-shadow: 5px 5px 5px rgb(0 0 0 / 40%);}
a#cta-btn:hover i, a#cta-btn2:hover i, a#cta-btn3:hover i {color: #cc511e;}

/* HEADER */
.header, .inv-header {width: 100%; text-align: center; background: rgba(242,242,242,.85); position: absolute; z-index: 2;}
.header .column8, .inv-header .column8 {text-align: right;}
.header a#cta-btn2, .inv-header a#cta-btn2 {z-index: 500; position: relative;}
#menu-button, .mobile-display {display: none;}
img.main-logo {width: 100%; max-width: 315px; height: auto; box-sizing: border-box; display: block; position: absolute; top: 0; z-index: 3;}
.hide-desktop {display: none!important;}

.header.clone {position: fixed; top: -270px; left: 0; right: 0; z-index: 999; transition: 0.4s top cubic-bezier(.3,.73,.3,.74);}
body.down .header.clone {top: 0; background: rgba(242,242,242,.85);}
body.down .header.clone img.main-logo {display: block; padding: .5em 0; max-width: 175px; top: -8px;}
body.down .header.clone a#cta-btn {display: none!important;}

/* ALL OTHER STYLES */

.flex-wrapper {display: flex; flex-direction: row!important; flex-wrap: wrap; justify-content: space-between;}
ul.rental-list li {padding: 8px 0; margin: 5px 0; font-weight: 500;}

/* hero/cat slider */
.catslide {position:relative;}
.catslide img {width: 100%;}
.cattitler {
	position: absolute;
    left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
    z-index: 2;
    display: flex!important;
	justify-content: center;
	align-items: center;
    margin: 0 auto;
	box-sizing: border-box;
}
.titleblock h1 {color: #fff; font-size: 55px; line-height: 1.1; text-shadow: 0px 0px 7px #000; font-weight: 900;}
.titleblock a {background:#4f2300; color: #fff; text-align: center; padding: 10px 50px; font-weight: 700; margin-top: 15px; display: inline-block; border-radius: 30px; border: 2px solid #cc511e;}
.titleblock a:hover {background: rgba(79,35,0,.85);}


.homepage-wrapper h1 {font-weight: 900; font-size: 36px; line-height: 1.2;}
.homepage-wrapper h1 span {display: block; color: #e8652c; letter-spacing: 2px; font-size: 30px; font-weight: 400;}
.homepage-wrapper h2 {color: #4f2300; margin: 10px 0 30px 0; font-size: 18px; line-height: 1.3;}

.zoom{float: left; width: calc(50% - 10px); position: relative; margin: 5px; height: auto; max-height: 150px; box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.15); overflow: hidden;}
.zoom img{display: block; width: 100%; height: auto; transition: all .5s ease;}
.zoom .zoom-caption{position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,.5); transition: all .5s ease; z-index: 10;}
.zoom .zoom-caption .zoom-caption-text{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); padding: 5px; font-size: 18px; font-weight: 700; text-align: center; text-transform: uppercase; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5); color: #fff;}
.zoom:hover .zoom-caption{background: rgba(103,55,30,.5);}
.zoom-caption h2 {color: #e8652c; line-height: 1.3; margin: 0; font-size: 30px;}
.zoom-caption h2 span {color: #fff; display: block; font-size: 18px;}

.manu-logos {margin: 5em 0 3em 0;}
.orange-line {display: flex; justify-content: flex-end; background: #cc511e; padding: 1em; margin-bottom: -75px;}

.location-banner {background: #000 url('/siteart/location-banner1.jpg'); background-size: cover; background-position: top; padding: 8em 5%; text-align: center;}
.location-banner h3 {color: #fff; padding: .75em 7%; border: 2px solid #fff; display: inline-block; letter-spacing: 1.5px; font-weight: 600; /*text-shadow: 0px 0px 7px #000;*/ line-height: 1.3;}
.location-banner h3 span {font-weight: 900;}


.page-title {color: #fff; padding: 19em 0 9em 0; text-align: center; background: #000 url('/siteart/title-hero1.jpg'); background-size: cover; background-position: center;}
.page-title.financing {color: #fff; padding: 19em 0 9em 0; text-align: center; background: #000 url('/siteart/finance-hero1.jpg'); background-size: cover; background-position: center;}
.page-title.parts {color: #fff; padding: 19em 0 9em 0; text-align: center; background: #000 url('/siteart/parts-hero1.jpg'); background-size: cover; background-position: center;}
.page-title.service {color: #fff; padding: 19em 0 9em 0; text-align: center; background: #000 url('/siteart/service-hero1.jpg'); background-size: cover; background-position: center;}
.page-title.rentals {color: #fff; padding: 19em 0 9em 0; text-align: center; background: #000 url('/siteart/rentals-hero1.jpg'); background-size: cover; background-position: center;}
.page-title.careers {color: #fff; padding: 19em 0 9em 0; text-align: center; background: #000 url('/siteart/careers-hero1.jpg'); background-size: cover; background-position: center;}
.page-title.hyundai-promo {color: #fff; padding: 19em 0 9em 0; text-align: center; background: #000 url('/siteart/Hyundai-Finance-Dept.jpg'); background-size: cover; background-position: center;}
.page-title h1 {text-transform: uppercase; margin-bottom: 10px!important; font-size: 45px; letter-spacing: 2.5px; text-shadow: 0px 0px 7px #000;}
.page-title p {max-width: 80%; margin: 0 auto; font-weight: 500; text-shadow: 0px 0px 7px #000; font-size: 18px;}

.content-wrapper h2 {font-weight: 800; display: block; margin-bottom: 15px; letter-spacing: 1px;}
.content-wrapper a#cta-btn {margin: 40px 0;}

.showroom-wrapper .column4 {text-align: center; border: 1px solid #ccc; width: 29%; margin: 2%; padding: 0;}
.showroom-wrapper a {display: block; background: #000; color: #fff; padding: .75em 5%; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; font-size: 18px;}
.showroom-wrapper a:hover, .showroom-wrapper .column4:hover a {background: #4f2300;}
/*.showroom-wrapper a:hover:after {content: '\00BB'; margin-left: 5px; color: #fff;}*/
.showroom-wrapper a span {display: block; color: #999; font-size: 13px; letter-spacing: normal; text-transform: capitalize;}

.employee {background: #5b2d13; margin: 1%; width: 48%; padding: 2em!important;}

.sidebar-wrapper h3 {display: block; margin-bottom: 3px; letter-spacing: 2px; background: #000; padding: 15px; color: #fff; border-radius: 30px 30px 0 0;}
/** tabs tart here **/
.tabs {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.tabs label {
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
  width: 100%;
  display: block;
  padding: 20px 5%;
  cursor: pointer;
  background: #4f2300; 
  color: #fff;
  font-weight: 700;
  text-align: center;
  -webkit-transition: background ease 0.2s;
  transition: background ease 0.2s;
}
.tabs.location-page label {width: 50%;}
.tabs .tab {
  -webkit-box-ordinal-group: 100;
  -webkit-order: 99;
  -ms-flex-order: 99;
  order: 99;
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  width: 100%;
  display: none;
  padding: 20px;
  background: #67371e;
  text-align: center;
  color: #ddd;
  border-radius: 0 0 30px 30px;
}
.tabs .tab a:hover {color: #fff;}
.tabs label:hover, .tabs input[type="radio"]:checked + label:hover {color: #fff; background: #000;}
.tabs input[type="radio"] {position: absolute; opacity: 0;}
.tabs input[type="radio"]:checked + label {background: #cc511e;}
.tabs input[type="radio"]:checked + label + .tab {display: block;}

/* new tabs end */


/* form + captcha */
#form {background: rgba(255,255,255,.8); padding: 25px; border: 1px transparent solid; animation: fadeInUp; animation-duration: 1s; margin: 30px 0!important;}
#form .form-row {display: block; /*margin: 0 0 5px;*/ text-align: left!important;}
#form .form-row label{font-weight: 600;}
#form input[type="text"], #form input[type="email"], #form select, #form textarea, #form input[type="date"] {width: 100%; margin: 5px 0 20px; padding: 10px; border: 1px solid #ededed; background: #ededed; font-weight: 500;}
#form textarea {height: 90px;}
#form .checkbox {margin-top: 15px;}
#form h3 {margin-bottom: 10px!important; color: #4e2300; letter-spacing: 2px; font-weight: 900;}

.CaptchaPanel{line-height: normal !important; text-align: left!important;}
.CaptchaAnswerPanel input{width: 250px; max-width: 100%; padding: 5px; margin: 5px 0; background: #f4f4f4; border: 1px solid #ccc;}
.CaptchaMessagePanel{padding: 0 !important; margin: 0 !important; font-weight: normal !important; font-size: 12px; line-height: 14px;}
.CaptchaImage {width: auto!important; padding: 0!important;}
.CaptchaAnswerPanel{margin: 0; padding: 2px 0px 2px 0px !important;}
.CaptchaWhatsThisPanel{line-height: 0; margin: 0; padding: 8px 0 8px 0 !important;}
.CaptchaWhatsThisPanel a{font-size: 12px; color: #000;} .CaptchaWhatsThisPanel a:hover{text-decoration: none;}


/* FOOTER */
.footer {color: #eee;}
.footer .column4 {padding: 8em 5%;}
.footer h3 {color:#fff; font-weight: 800; letter-spacing: 1px; margin-bottom: 15px; display: block;}

/* accordion menu */
#footer-nav {width: 100%; overflow: hidden;}
#footer-nav ul.submenu {list-style: none;}
#footer-nav ul.submenu {padding: 0; background: #67371e;}
#footer-nav ul.submenu li {border-bottom: 1px solid #4f2300;}
#footer-nav ul.submenu li:last-child {border-bottom: none;}
#footer-nav ul.submenu li a {display: block; font-size: 15px; padding: 10px 30px;}
#footer-nav ul.submenu li a:hover {background: #cc511e; color: #fff;}
details summary::-webkit-details-marker {display: none; transition: max-height 0.2s ease-out;}
.accordion__item {position: relative;}
.accordion__title input:focus, .accordion__title2 input:focus {outline: none;}
.accordion__title, .accordion__title2 {
    font-family: 'Montserrat',sans-serif !important;
	padding: 10px 15px;
	position: relative;
	z-index: 20;
	display: block;
	cursor: pointer;
}
.accordion__title:hover, .accordion__title2:hover {font-weight: 500;}
.accordion__title::after {
  display: block;
  content: " + ";
  font-size: 22px;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  transition: 0.3s all;
}
.accordion__title:hover::after {color: #cc511e;}
.accordion__item[open] .accordion__title::after {
  transform: translateY(-50%) rotate(180deg);
  content: ' - ';
}

.align-right {text-align: right;}
.social-links i {margin-left: 5px; font-size: 24px;}
.site-host {margin: 15px 0; font-size: 12px; color: #999;}


/* MEDIA QUERIES (RESPONSIVE) */
@media screen and (max-width: 1500px){
	.header a#cta-btn, .inv-header a#cta-btn, body.down .header.clone a#cta-btn2 {display: none!important;}
	.hide-desktop {display: block!important; padding: 7px 5%!important; max-width: 325px; float: right; margin: 0 15px!important; font-size: 13px;}
	img.main-logo {max-width: 234px;}
	body.down .header.clone img.main-logo {max-width: 165px;}
	.page-title, .page-title.financing, .page-title.rentals, .page-title.service, .page-title.parts {padding: 14em 0 7em 0;}
}

@media screen and (max-width: 1200px) {
	.homepage-wrapper .column6 {margin: 0 auto!important; width: 100%!important; float: none; padding: 0;}
}
	
@media screen and (max-width: 1000px){
	.mobile-display, img#mobile-logo {display: block;}
	.header, .inv-header {position: relative;}
	.page-title, .page-title.financing, .page-title.rentals, .page-title.service, .page-title.parts {padding: 7em 0;}
		
	.titleblock h1 {font-size: 40px;}
	
	.column1, .column2, .column3, .column4, .column5, .column6, .column7, .column8, .column9, .column10, .column11, .column12 {margin: 0 auto!important; width: 100%!important; float: none; padding: 0;}
	
	.tabs label {width: 50%;}	
	
	.footer .column4 {padding: 3em 5%;}
	.site-host {font-size: 12px;}
	.align-right {text-align: center;}
}

@media screen and (max-width: 767px) {		
	.pad30 {padding: 20px 15px!important;}
	.pad60 {padding: 40px 5%!important;}
	
	.hide-desktop {padding: 5px 5%!important; font-size: 12px;}
	img.main-logo {max-width: 210px;}
	
	body.down .header.clone img.main-logo {max-width: 150px;}

	.tabs label, .tabs.location-page label {width: 100%;}
	
	.page-title, .page-title.financing, .page-title.rentals, .page-title.service, .page-title.parts {padding: 6em 0;}
	.page-title h1 {font-size: 36px; line-height: 40px;}
	.page-title p {font-size: 16px;}
}

@media screen and (max-width: 500px) {
	.zoom {float: none; width: 100%;}
	
	.titleblock h1 {display: none; max-width: none;}
	.titleblock a {display: block; width: 100%; box-sizing: border-box; padding: 8px 5%; max-width: 300px;}
	
	.homepage-wrapper h2 {font-size: 16px;}
	
	.header .orange-line, .inv-header .orange-line {padding: .5em;}
	header.header.clone .orange-line {padding: .85em;}
	body.down .header.clone img.main-logo {max-width: 142px;}
	img.main-logo {max-width: 180px;}
	
	.curved-head {display: none;}	
	
	.cattitler {align-items: flex-end; bottom: 1em;}
	
	.page-title, .page-title.financing, .page-title.rentals, .page-title.service, .page-title.parts {padding: 4.5em 0;}
}