﻿/* BEGIN RESET */
body{background:transparent; border:0; margin:0; padding:0; font-family: 'Open Sans', sans-serif !important; font-style:normal; line-height:normal; -webkit-text-size-adjust: none;}
ol, ul, li {list-style: none; font-size:15px; line-height:25px;}
.clear {clear: both; height:0px; margin:0;}

h1 {font-size:36px; color:#c73132; text-transform:uppercase;}
h2 {font-size:22px; }
h3 {font-size:21px; font-weight:800;margin-bottom:5px;}
h4 {font-size:19px;margin-bottom:5px; line-height:40px;}
p {font-size:15px; line-height:24px;}

a {text-decoration:none;}

.pad{padding: 30px 0;}      
     
h5 {
    color:#000;
    font-size:2em;
    font-weight:normal;
    margin-bottom:0;
}  

/* BASIC STYLES */
#contentwrap {width:90%; margin:0px auto;}
#pagetext {width:75%; margin:30px auto 0; text-align:center;}
#contentwrap a {color:#000;}
#contentwrap a:hover {color:#c73132;}

.subpage h2, .manu h2{
	font-size: 36px;
    color: #c73132;
    text-transform: uppercase;
}

.subpage h3{
	font-size: 28px;
}

.bodywrap{
	display: flex;
}

/* HEADER */
header {
	background: url(../siteart/mapbg.jpg) repeat; 
	-moz-background-size: cover; 
	-o-background-size: cover; 
	-webkit-background-size: cover; 
	background-size: cover; 
	padding: 15px 0;
}
.logo {display: block; width:100%; margin: 0 auto; text-align:center;position: relative}
.logo img {width:100%; max-width: 700px;}

.app-icons {
    position: absolute;
    top: 0;
    right: 0;
	display: flex;
	gap: 20px;
	align-items: center;
}

.app-icon img {
    max-width: 100%;
}

.pad-xl {
	padding: 40px 0;
}

.loc-map {width:250px; height:170px; background:url('../siteart/loc-map.png') no-repeat; margin:-30px 0 0 450px; position:absolute; top:10px; z-index:-99;}
.loc-map a {color:#c73132;}

.sioux-falls {display:block; position:absolute; top:130px; left:135px; width:14px; height:14px;}
.sioux-falls-info {display:none; z-index:9999; background:#fff; color:#000; padding:10px; font-size:14px; font-weight:normal; top:10px; left:0; position:relative;  width:200px;}
.sioux-falls:hover .sioux-falls-info {display:block !Important;}

.albert-lea {display:block; position:absolute; top:120px; left:195px; width:14px; height:14px;}
.albert-lea-info {display:none; z-index:9999; background:#fff; color:#000; padding:10px; font-size:14px;  font-weight:normal; top:10px; left:0; position:relative; width:200px;}
.albert-lea:hover .albert-lea-info {display:block !Important;}

.luverne {display:block; position:absolute; top:120px; left:145px; width:14px; height:14px;}
.luverne-info {display:none; z-index:9999; background:#fff; color:#000; padding:10px; font-size:14px; font-weight:normal; top:10px; left:0; position:relative; width:200px;}
.luverne:hover .luverne-info {display:block !Important;}

.phonewrap {width:100%; font-size:14px; line-height:20px;display: flex;}
.phonewrap a {color:#000;} .phonewrap h3{font-size: 17px;}
.phone {flex: 1; text-align: center; margin: 0 5px; vertical-align: top}

#address-star{width: 100%; max-width: 90%; display: block; position: relative; z-index: 99; margin-bottom: -20px; text-align: left}

/* CONTENT STYLES */
.homevideoswrap {display:inline-block; width:33%; box-sizing:border-box; vertical-align:top; text-align:center; font-size:50px; font-weight:bold;}
.homevideoswraptitle {display:inline-block; width:33%; box-sizing:border-box; vertical-align:top; text-align:center; font-size:50px; font-weight:bold; margin-top:10%;}
.videoslot {float:left; width:100%;}

/*.html5-video-player a {display:none!important;}
.ytp-title-enable-channel-logo .ytp-title-channel {dispalY:none!important;}
background-image {display:none!important;}
.ytp-title-channel-logo {display:none!important;}*/
.homevideos {display:inline-block; width:100%; box-sizing:border-box;}
.pageleft {float:left; width:60%; margin:10px 0 30px;}
.pageright {float:right; width:30%; margin:10px 0;}


.hero-overlay{position: absolute; z-index: 99; bottom: 3vw; left: 5vw; width: 100%;  max-width: 400px; border: 1px solid #fff}
.hero-overlay #hero-btn{background:#c73132; color: #fff; font-size: 20px; font-weight: 700; padding: 20px 0; display: block; text-align: center}
.hero-overlay #hero-btn:hover{background: #fff; color: #c73132}


.partsmanu img {margin:5px 7px;}

.location {float:left; width:30%;}
.location img {width:75%;}
.map {float:right; width:68%;}

.creditbtn {font-size:20px; font-weight:400; background:#c73132; color:#fff; width:600px; padding:10px 0; margin:0px 0; text-align:center;}
.creditbtn:hover {
	background: #c73132; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#c73132, #b52627); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#c73132, #b52627); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#c73132, #b52627); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#c73132, #b52627); /* Standard syntax */ 
}


ul.cargo-list,ul.cargo-list li {list-style: disc !important;}
.rental {width:100%; margin-bottom:10px;}
.rental img {width:100%;}

ul.aboutnav {float:left; padding: 10px 10px;list-style: none; font-size: 13px;}
ul.aboutnav li {display: inline;}
ul.aboutnav li+li:before {padding: 8px; color: #000;}
ul.aboutnav li a {color: #c73132;}


/*---HOME PAGE -----------------*/
.store-feature{display: flex; align-items: center; width: 95%; margin: 0 auto; padding: 50px 0;}

.store-feature .left{justify-content: flex-start; width:50%; text-align: left}
.store-feature .left img{width: 90%; max-width: 500px; text-align: left;}

.store-feature .center{justify-content: flex-start; width: 50%; text-align: center}
.store-feature .center img{width: 100%; max-width: 100%;}

.store-feature .center #red-btn{background:#c73132; color:#fff; padding: 10px 20px; font-weight: 800; display: inline-block;}
.store-feature .center #red-btn:hover{background: #a12425}


/*.store-feature .right{justify-content: flex-start; width: 25%; text-align: center}
.store-feature .right img{width: 100%; max-width: 300px; box-shadow: 0px 6px 10px -7px #767676; border: 1px solid #e6e6e6}
.store-feature .right h2{color: #C73132; text-align: center;}
*/



/*--categories--*/
.grid {
	position: relative;
	margin: 0 auto;
	width: 100%;
	list-style: none;
	text-align: center;
	text-transform: uppercase;
	padding: 30px 0;
	display: block
}

#pad-xl {
	padding-top: 50px !important;
	padding-bottom: 50px !important;
}
/* Common style */
.grid figure {
	position: relative;
	float: left;
	overflow: hidden !important;
	width: 24.5%;
	text-align: center;
	cursor: pointer;
	display: inline-block;
	margin: 5px 3px;
	vertical-align: top;
}

.grid figure img {
	position: relative;
	display: block;
	min-height: 99.9%;
	max-width: 99.9%;
}

.grid figure figcaption {
	padding: 1px;
	color: #fff;
	text-transform: uppercase;
	font-size: 18px;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	font-weight: 700;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 99.9%;
	height: 99.9%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure figcaption > a {
	z-index: 1000;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}
.grid figure h2 {color:#fff;}


.grid figure h2,
.grid figure p {
	margin: 0;
}

.grid figure p {
	letter-spacing: 1px;
	font-size: 68.5%;
}


figure.effect-julia img {
	max-width: 100%;
	height: auto;
	-webkit-transition: opacity 1s, -webkit-transform 1s;
	transition: opacity 1s, transform 1s;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

figure.effect-julia figcaption {
	text-align: center;
}

figure.effect-julia h2 {
	position: relative;
	padding: 29% 0;
	text-align: center
}
figure.effect-julia #ref-units h2 {padding: 25% 0}

figure.effect-julia:hover img {
	opacity: 0.4;
	-webkit-transform: scale3d(1.1,1.1,1);
	transform: scale3d(1.1,1.1,1);
}

.grid-btns{position: absolute; z-index: 9999; margin: -110px auto 0 auto;left: 0; right: 0}
.grid-btns #new{background: #000; color: #fff !important; padding: 10px 0; width: 100px; text-align: center; display: inline-block; margin: 0 5px 5px 5px}
.grid-btns #used{background: #c73132; color: #fff !important; padding: 10px 0; width: 100px; text-align: center; display: inline-block; margin: 5px}
.grid-btns #new:hover,.grid-btns #used:hover{background: #fff; color: #000 !important}

.service-requestform {
	text-align: center;
	margin-top: 80px;
}

.service-requestform h2 {
	font-size:  30px;
}

.parts-requestform {
	text-align: center;
	margin-top: 30px;
}

.parts-requestform h2 {
	font-size:  30px;
}


.service-parts-specials {
	text-align: center;
	margin-top: 30px;
}

.service-parts-specials h2 {
	font-size: 30px;
}

.promotions {
	text-align: center;
	margin-top: 30px;
}

.promotions h2 {
	font-size: 30px;
}

.grid-clear{clear: both;}

/* BROCHURE PAGE */
.brochure {float:left; width:20%;  margin:1% 3% 1% 0; text-align:center;}
.brochure img {width:100%;}
.brochurebtn {background:#c73132; color:#fff; padding:10px 0; margin-top:5px; font-size:16px; font-weight:800; width:100%; text-align:center; text-transform:uppercase; margin-bottom:20px;}
.brochurebtn:hover {
	background: #c73132; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#c73132, #b52627); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#c73132, #b52627); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#c73132, #b52627); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#c73132, #b52627); /* Standard syntax */ 
}

/* ABOUT PAGE */
.employeewrap {float:left; width:19.5%;  margin:1%; /*height:625px;*/ height:500px; text-align:center; border:1px solid #ccc; padding:20px; }
.employeewrap h2 {text-transform: uppercase !important;}
.employeewrap p {font-size:14px;}
.employee img {width:100%;}
.circular--square {border-radius: 50%;}
.description {float:left; width:75%;}
.line {border-bottom:1px solid #ccc; width:100%; padding:10px 0; margin:10px auto;}
.email {width:8%; vertical-align:top;}

/* ICON BUTTONS */
.homeinventory {width:25%; float:left;}
.homeinventory img {width:100%;}

.hovereffect {width: 100%; height: 100%; float: left; overflow: hidden; position: relative; text-align: center; cursor: default;}
.hovereffect .overlay {width: 100%; height: 100%; position: absolute; overflow: hidden; top: 0; left: 0;}

.hovereffect img {display: block; position: relative; -webkit-transition: all 0.4s ease-in; transition: all 0.4s ease-in;}
.hovereffect:hover img {
  filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0 0 0 1 0" /><feGaussianBlur stdDeviation="3" /></filter></svg>#filter');
  filter: grayscale(1) blur(3px);
  -webkit-filter: grayscale(1) blur(3px);
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}

.hovereffect a.info {display:inline-block; margin: 0 auto; font-size:35px; letter-spacing: 1px; font-weight:800; width:90%; height:70%; color:#fff; padding-top:35%;}

.style1 {font-weight:400;}
.btn {font-size:20px; font-weight:400; background:#c73132; width:30%; padding:5px 0; margin:15px auto 0;}
.btn:hover {
	background:#background: #c73132; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#c73132, #b52627); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#c73132, #b52627); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#c73132, #b52627); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#c73132, #b52627); /* Standard syntax */ 
}



.email-ico 	{width:15%;}


/* MANU */
#colorblock {background:#c73132; text-align:center; padding:50px 0 30px;}
#colorblock img {margin:5px 40px 0; display:inline-block; vertical-align:middle; width:12%;}

figure.apu {display: inline-block !important; margin: 0px;}
img.apuimg {width: 150px !important;}
figure a:hover, figure a {color: #000 !important;}

/* FORM */
#formpage {vertical-align:top;}
#formpage div {vertical-align:top; padding:3px 5px;}

#formpage input {padding:6px 5px; border:1px solid #8e8d8d; color:#8e8d8d; font-size:12px;}
#formpage textarea {padding:6px 5px; border:1px solid #8e8d8d; color:#8e8d8d; 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:1px solid #8e8d8d; color:#8e8d8d; vertical-align:middle; font-size:12px; line-height:normal; padding:5px; width:100%;}
#formpage input  {width:100%;}
#formpage input.larger  {width:100%;}
#formpage textarea {width:100%; height:85px;}

#formpage input.checkbox {padding:0;  border:0; margin:0 5px 0 0; width:13px; height:13px; display:inline;  background-color:#fff;}
#formpage input.radio {padding:0;  border:0; margin:0 5px 0 0; width:15px; height:15px; display:inline;}

/* focus states of various types of fields */
#formpage input:focus,#formpage textarea:focus,#formpage select:focus {background:#FFF;  color:#000; border:1px solid #c73132; 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:0; padding:10px 0; background:#c73132 url('../siteart/submit_btn.jpg') repeat-x; border:2px #c73132 solid; font-size:14px; line-height:14px; font-weight:bold; color:#fff;}
#formpage input.button:hover {
	background:#background: #c73132; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#c73132, #b52627); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#c73132, #b52627); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#c73132, #b52627); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#c73132, #b52627); /* Standard syntax */ 
	color:#fff text-shadow:none; border:2px #c73132 solid;}

/* 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 */
.captcha {width:200px; margin:0;}
.CaptchaPanel {margin:0 0 0 0 !important; padding:0 0 0 0 !important; text-align: left !important; 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;}  

#gal_container {padding:0 20px 0 0;}
/*Style to make the thumbnail image style on the gallery page.*/
#gal_container img {height:90px; margin:0 5px 5px 0; border:1px #ccc solid;}

/* FOOTER */
footer {padding:30px 0;}
.footerleft {float:left; width:55%;}
.bottomnav {color:#c73132; font-size:11px; margin:5px 0;}
.bottomnav a {color:#c73132; font-size:13px; font-weight:600;}
a.footerlink:link, a.footerlink:visited, a.footerlink:active{font-size:12px; color:#000;}
a.footerlink:hover {font-size:12px; color:#c73132;}
.footertext{font-size:12px; color:#000;}
.smallfootertext{font-size:12px; color:#000;}
.divfooter {width:100%;}

.socialmedia {display:inline-block;zoom: 1;*display: inline; width:5%; margin:10px 0;}
.socialmedia img {width:100%;}
.footerright {float:right; width:28%; text-align:center; color:#c73132;}
.footerright img {width:100%; padding-top:10px;}

/* ---- Back to Top Styles ---- */
.go-top {position: fixed;bottom:25px;right:15px;text-decoration: none;color:#fff!important;background:rgba(199,49,50,0.8);font-size:20px;padding:5px 10px;display: none;}
.go-top:hover {background:rgba(185,40,41,0.97);}

/************************************************ Responsive Styles **/
@media screen and (max-width: 1480px) and (min-width:1281px) {
#pagetext {width:90%;}
#inventorywrap {width:90%;}
header {padding:35px 0;}
.loc-map {margin:-35px 0 0 325px;}

#colorblock img {/*height:125px; width:auto;*/ margin:0 15px; width:11%;}

.employeewrap {width:19%; height:500px; /*height:700px;*/}

.brochurebtn {font-size:14px;}

.creditbtn {font-size:18px; width:65%;}

.pageleft {width:55%;}
.pageright {width:40%;}

.partsmanu img {height:48px; margin:5px;}

.footerleft {width:60%;}
.bottomnav {font-size:11px;}
.bottomnav a {font-size:11px;}
}
@media screen and (max-width: 1420px) {

.phonewrap {font-size:13px; line-height:18px;}
figure.effect-julia #ref-units h2 {padding: 20% 0}
	.grid-btns{margin: -80px auto 0 auto;}
	.grid-btns #new,.grid-btns #used{padding: 5px 0; font-size: 14px; width: 75px;}
	.app-icons {
		position: unset !important;
		justify-content: center;
		margin: 20px 0;
	}
}

@media screen and (max-width: 1280px) and (min-width:1025px) {
h1 {font-size:28px;}
h2 {font-size:18px;}
h3 {font-size:16px; margin-bottom:2px;}
p {font-size:14px;}
ol, ul, li {font-size:14px;}

#pagetext {width:90%;}
#inventorywrap {width:90%;}
header {padding:15px 0;}
.logo {float:none; width:75%; max-width: 650px; margin:0 auto 20px; text-align: center; display: block}
.loc-map {margin:-50px 0 0 250px;}
.phonewrap {width: 100%; margin: 0 auto; text-align: center; float: none; display: block}
.phone {width:29%;font-size:12px; text-align: center; float: none; display: inline-block}
	
#pagetext {width:90%;}

.btn {font-size:14px;}
#colorblock img {/*height:100px; width:auto;*/ margin:0 10px;width:11%;}

.employeewrap {/*width:20.5%;*/ width:32%; margin:1%; height:500px; /*height:685px;*/ padding:20px 10px;}
.email {width:10%; vertical-align:middle;}

.pageleft {width:55%;}
.pageright {width:40%;}

.brochure {width:30%;}
.brochurebtn {font-size:12px;}

.creditbtn {font-size:16px; width:80%;}

.partsmanu img {height:50px; margin:5px;}

.footerleft {width:70%;}
.bottomnav {font-size:11px;}
.bottomnav a {font-size:11px;}
.footerright {width:25%;}
	
	
	.grid figure {width: 24%;}	
}

@media screen and (max-width: 1024px) and (min-width:768px) {
h1 {font-size:24px; margin-bottom:5px;}
h2 {font-size:15px;}
h3 {font-size:14px; margin-bottom:2px;}
h4 {font-size:13px;}
p {font-size:13px;}
ol, ul, li {font-size:13px;}

#pagetext {width:90%;}
#inventorywrap {width:90%;}
header {padding:15px 0;}
.logo {float:none; width:75%; max-width: 500px; margin:0 auto 20px; text-align: center; display: block}
.loc-map {margin:-50px 0 0 250px;}
.phonewrap {width: 100%; margin: 0 auto; text-align: center; float: none; display: block}
.phone {width:29%;font-size:12px; text-align: center; float: none; display: inline-block}

#pagetext {width:90%;}
.hovereffect a.info {margin:4%; font-size:25px; line-height:20px; width:90%; height:75%; padding-top:25%;}
	
.btn {font-size:12px; margin-top:5px;}
#colorblock {padding:20px 0;}
#colorblock img {/*height:75px; width:auto;*/width:10.5%; margin:0 10px;}

.employeewrap {/*width:19.5%;*/ width:28.5%; margin:1%; /*height:775px;*/ height:500px; padding:20px 10px;}
.email {width:10%; vertical-align:middle;}

.pageleft {width:55%;}
.pageright {width:40%;}

.brochure {width:30%;}
.brochurebtn {font-size:10px;}

.creditbtn {font-size:16px; width:80%;}

.partsmanu img {height:35px; margin:5px;}

.captcha {width:90%; margin:0 auto;}
#formpage input.button,#formpage input.button:focus {width:100%;}

.homevideoswraptitle {font-size:32px; margin-top:12%; width:32%;}	
	
.footerleft {float:none; width:100%; text-align:center;}
.bottomnav {font-size:11px;}
.bottomnav a {font-size:11px;}
.footerright {float:none; width:50%; margin:0 auto;}


	
	.grid figure {width: 24%;}	
}
@media screen and (max-width: 1200px) {
	.hovereffect a.info {padding-top: 20% !important;font-size: 28px !important;line-height: 1.25 !important;}
}
@media screen and (max-width: 900px) {

figure.effect-julia #ref-units h2 {padding: 22% 0}
	.grid-btns{margin: -50px auto 0 auto;}
	.grid-btns #new,.grid-btns #used{padding: 5px 0; font-size: 14px; width: 75px;}
	
	header {padding:15px 0;}
.logo {float:none; width:75%; max-width: 600px; margin:0 auto 20px; text-align: center; display: block}
.loc-map {margin:-50px 0 0 250px;}
.phonewrap {width: 100%; margin: 0 auto; text-align: center; float: none; display: block}
.phone {width:29%;font-size:12px; text-align: center; float: none; display: inline-block; vertical-align: top}

}

@media screen and (max-width: 767px) and (min-width:551px) {
h1 {font-size:16px; margin-bottom:5px;}
h2 {font-size:14px;}
h3 {font-size:16px; margin-bottom:2px;}
h4 {font-size:12px;}
p {font-size:12px; line-height:20px;}
ol, ul, li {font-size:12px; line-height:20px;}

#pagetext {width:90%;}
#inventorywrap {width:90%;}
	
	

#pagetext {width:90%;}
.homeinventory {margin-top:20px;}
.hovereffect a.info {margin:4%; font-size:12px; line-height:12px; width:90%; height:75%; padding-top:8%;}
.btn {font-size:10px; margin-top:5px;}
#colorblock {padding:20px 0;}
#colorblock img {/*height:75px; width:auto;*/ width:18%; margin:0 10px;}

.employeewrap {/*width:26.5%;*/ width:43%; margin:1%; /*height:670px;*/ height:500px; padding:10px;}
.email {width:10%; vertical-align:middle;}

.pageleft {width:55%;}
.pageright {width:40%;}

.brochure {float:left; width:30%;}
.brochurebtn {font-size:9px;}

.creditbtn {font-size:14px; width:65%;}

.partsmanu img {height:28px; margin:5px;}

.captcha {width:90%; margin:0 auto;}
#formpage input.button,#formpage input.button:focus {width:100%;}

.location {float:left; width:40%;}
.location img {width:100%;}
.map {float:right; width:56%;}

#gal_container img {width:19%; height:auto; margin:0 auto 5px;}

.homevideoswrap {width:49.5%;}
.homevideoswraptitle {display:none;}


.footerleft {float:none; width:100%; text-align:center;}
.bottomnav {font-size:12px;}
.bottomnav a {font-size:12px;}
a.footerlink:link, a.footerlink:visited, a.footerlink:active{font-size:10px;}
a.footerlink:hover {font-size:10px;}
.footertext{font-size:10px;}
.smallfootertext{font-size:10px;}

	.footerright {float:none; width:50%; margin:0 auto}
	
}

@media screen and (max-width: 890px){
	.homeinventory {
    width: 50%;
	}
}
@media screen and (max-width: 780px){
	
.grid{padding: 20px 0}
.grid figure {width: 48.5%;}		
.grid-clear{display: none;}	

figure.effect-julia #ref-units h2 {padding: 29% 0}
.grid-btns{margin: -50px auto 0 auto;}
.grid-btns #new,.grid-btns #used{padding: 5px 0; font-size: 14px; width: 75px;}

	
	
.store-feature{display: block; width: 90%; padding: 40px 0;}
.store-feature .left{justify-content: flex-end; width: 100%; text-align: center}
.store-feature .center{justify-content: flex-end; width: 100%; text-align: center; padding: 30px 0}
.store-feature .right{justify-content: flex-end; width: 100%; text-align: center; margin-top: 30px;}
.store-feature .right img{max-width: 300px;}	
	
	
	
	.hero-overlay{display: none;}
	
}

@media screen and (max-width: 550px) and (min-width:381px) {
h1 {font-size:18px; margin-bottom:5px;}
h2 {font-size:16px;}
h3 {font-size:16px; margin-bottom:2px;}
p {font-size:12px; line-height:20px;}
ol, ul, li {font-size:12px; line-height:20px;}

#pagetext {width:90%;}
#inventorywrap {width:90%;}
#address-star{width: 100%; max-width: 150px; margin: 10px auto; text-align: center}
	
	
#pagetext {width:90%; margin-top:20px;}
.homevideoswrap {display:block; width:100%;}
.homevideoswraptitle {display:none;}
.homevideos {display:block; width:100%;}

.homeinventory {width:100%; margin-top:20px;}
.hovereffect a.info {margin:4%; font-size:38px; line-height:42px; width:90%; height:75%; padding-top:28%;}
.btn {font-size:16px; margin-top:5px;}
#colorblock {padding:20px 0;}
#colorblock img {/*height:75px; width:auto;*/ width:30%; margin:5px 15px;}

.employeewrap {float:none; width:100%; margin:0 auto; border-top:none; border-right:none; border-left:none; padding:20px 0; height:auto;}

.pageleft {float:none; width:100%; margin-top:20px;}
.pageright {float:none; width:100%;}

.brochure {float:none; width:100%; margin:3% auto;}
.brochurebtn {font-size:12px; width:100%; margin:0 auto;}

.creditbtn {font-size:14px; width:100%;}

.partsmanu {text-align:center;}
.partsmanu img {height:50px; margin:5px;}

.captcha {width:90%; margin:0 auto;}
.CaptchaPanel {text-align: center !important;}
#formpage input.button,#formpage input.button:focus {width:100%;}

.location {float:none; width:100%;margin-bottom:10px;}
.location img {width:100%;}
.map {float:none; width:100%;}

#gal_container img {width:31%; height:auto; margin:0 auto 5px;}

.footerleft {float:none; width:100%; text-align:center;}
.bottomnav {font-size:12px;}
.bottomnav a {font-size:12px;}
a.footerlink:link, a.footerlink:visited, a.footerlink:active{font-size:10px;}
a.footerlink:hover {font-size:10px;}
.footertext{font-size:10px;}
.smallfootertext{font-size:10px;}

.footerright {float:none; width:50%; margin:0 auto;}
	
	
.grid figure {width: 95%; margin: 5px auto; display: block; float: none; text-align: center;}		
	

}



@media screen and (max-width:500px)  {
.phonewrap {width: 100%; margin: 0 auto; text-align: center; float: none; display: block}
.phone {width:45%;font-size:12px; text-align: center; float: none; display: inline-block; vertical-align: top}
	
	.phonewrap .clear{display: none}	
}
	
@media screen and (max-width:380px)  {
h1 {font-size:18px; margin-bottom:5px;}
h2 {font-size:16px;}
h3 {font-size:16px; margin-bottom:2px;}
p {font-size:12px; line-height:20px;}
ol, ul, li {font-size:12px; line-height:20px;}

#pagetext {width:90%;}
#inventorywrap {width:90%;}
	
.phone {width:100%;font-size:12px; text-align: center; float: none; display: block; margin: 10px auto}
.phonewrap h3{font-size: 14px;}	
	
.homevideoswrap {display:block; width:100%;}
.homevideoswraptitle {display:none;}	
.homevideos {display:block; width:100%;}
#pagetext {width:90%; margin-top:15px;}
.homeinventory {width:100%; margin-top:20px;}
.hovereffect a.info {margin:4%; font-size:25px; line-height:42px; width:90%; height:75%; padding-top:25%;}
.btn {font-size:16px; margin-top:5px;}
#colorblock {padding:20px 0;}
#colorblock img {height:75px; width:auto; margin:0 10px;}

.employeewrap {float:none; width:100%; margin:0 auto; border-top:none; border-right:none; border-left:none; padding:20px 0; height:auto;}

.pageleft {float:none; width:100%; margin-top:20px;}
.pageright {float:none; width:100%;}

.brochure {float:none; width:100%; margin:1% auto;}
.brochurebtn {font-size:12px; width:100%; margin:0 auto;}

.creditbtn {font-size:13px; width:100%;}

.partsmanu {text-align:center;}
.partsmanu img {height:40px; margin:5px;}

.captcha {width:90%; margin:0 auto;}
.CaptchaPanel {text-align: center !important;}
#formpage input.button,#formpage input.button:focus {width:100%;}

.location {float:none; width:100%;margin-bottom:10px;}
.location img {width:100%;}
.map {float:none; width:100%;}

#gal_container {padding:0; text-align:center;}
#gal_container img {width:100%; height:auto; margin:0 auto 5px;}

.footerleft {float:none; width:100%; text-align:center;}
.bottomnav {font-size:10px;}
.bottomnav a {font-size:10px;}
a.footerlink:link, a.footerlink:visited, a.footerlink:active{font-size:10px;}
a.footerlink:hover {font-size:10px;}
.footertext{font-size:10px;}
.smallfootertext{font-size:10px;}
.socialmedia {width:15%;}

.footerright {float:none; width:100%; margin:0 auto;}


	.grid figure {width: 95%; margin: 5px auto; display: block; float: none; text-align: center;}		
	
	
	
	
	
}
