/* For use in vaihtokaarafi only */
/* Media Queries */

@media (min-width: 1500px) {
	.container, .slider-inner {width: 1470px;}
	.Auto-Image {height: 800px;}
	.cover-block-search {padding-top: 14% !important; padding-bottom: 14% !important;}
}

@media (min-width: 1300px) and (max-width: 1499px) {
	.container, .slider-inner {width: 1270px;}
}

@media screen and (max-width: 1300px) {
	.grid-search .search-form .form-group label {
		font-size: 13px;
	}
}

@media screen and (max-width: 1200px) {
	.container, .slider-inner {width: 100%;}
}

@media (min-width: 768px) {

	.hide-dt {display: none !important;}
   
   .car-container {
		grid-template-columns: 0 1.3fr 1.3fr 1fr 0;
		grid-template-areas: 
		". Auto-Header Auto-Header Auto-Header ."
		". Auto-Image Auto-Image Auto-Price ."
		". Auto-Description Auto-Description Auto-Description ."
		". Auto-Technical Auto-Contact-Info Auto-Contact ."
		;
	}

	.car-container.v2022 {
		grid-template-columns: 0 1.2fr 1.2fr 1fr 0;
		grid-template-areas: 
		  ". Auto-Header Auto-Header Auto-Header ."
		  ". Auto-Image Auto-Image Auto-Price ."
		  ". Auto-Description Auto-Description Auto-Contact ."
		  ". Auto-Technical Auto-Accessories Auto-Contact-Info ."
		  ;
		margin: 0 auto 0 auto !important;
	}

	.Landing-Container {
		grid-template-columns: 5fr 2fr;
		gap: 3em 1em;
		grid-template-areas: 
		  "Landing-Description Landing-Description"
		  "Landing-Contact Landing-Image"
		  "Landing-Cars Landing-Personnel"
		  ;
	  }
}

@media (min-width: 768px) and (max-width: 1600px) {
   .auto-grid > div {flex-basis: 33.3%;}
}

@media (max-width: 1099px) {
	.ast-header-break-point .main-navigation {background: #242424;}

	.grid-search {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto auto;
		grid-template-areas: "search-form search-form"
									"search-results search-results";
	}

	.tags {flex-wrap: wrap;}
}

@media (min-width: 768px) and (max-width: 1099px) {

	.car-container > div {
		padding: 0.5em 0.8em;
	}

	.car-container .table {font-size: 14px;}
	.car-container .table td, .car-container .table th {padding: 5px;}
	.Auto-Description ul {font-size: 14px;}
   
   h1.page-title {font-size: 32px;}
	p.page-title-description, p.fp-slider-caption {font-size: 20px;}
}

@media screen and (max-width: 767px) {
	.tm5 {margin-top: 2.5px;}
	.tm10 {margin-top: 5px;}
	.tm15 {margin-top: 7.5px;}
	.tm20 {margin-top: 10px;}
	.tm30 {margin-top: 15px;}
	.tm40 {margin-top: 20px;}
	.tm50 {margin-top: 25px;}
	.tm60 {margin-top: 15px;}
	.tm70 {margin-top: 35px;}
	.tm80 {margin-top: 40px;}
	.tm90 {margin-top: 45px;}
	.tm100 {margin-top: 50px;}
	.bm5 {margin-bottom: 2.5px;}
	.bm10 {margin-bottom: 5px;}
	.bm15 {margin-bottom: 7.5px;}
	.bm20 {margin-bottom: 10px;}
	.bm30 {margin-bottom: 15px;}
	.bm40 {margin-bottom: 20px;}
	.bm50 {margin-bottom: 25px;}
	.bm60 {margin-bottom: 30px;}
	.bm70 {margin-bottom: 35px;}
	.bm80 {margin-bottom: 40px;}
	.bm90 {margin-bottom: 45px;}
	.bm100 {margin-bottom: 50px;}
	.tp5 {padding-top: 2.5px;}
	.tp10 {padding-top: 5px;}
	.tp15 {padding-top: 7.5px;}
	.tp20 {padding-top: 10px;}
	.tp30 {padding-top: 15px;}
	.tp40 {padding-top: 20px;}
	.tp50 {padding-top: 25px;}
	.tp60 {padding-top: 30px;}
	.tp70 {padding-top: 35px;}
	.tp80 {padding-top: 40px;}
	.tp90 {padding-top: 45px;}
	.tp100 {padding-top: 50px;}
	.bp5 {padding-bottom: 2.5px;}
	.bp10 {padding-bottom: 5px;}
	.bp15 {padding-bottom: 7.5px;}
	.bp20 {padding-bottom: 10px;}
	.bp30 {padding-bottom: 15px;}
	.bp40 {padding-bottom: 20px;}
	.bp50 {padding-bottom: 25px;}
	.bp60 {padding-bottom: 30px;}
	.bp70 {padding-bottom: 35px;}
	.bp80 {padding-bottom: 40px;}
	.bp90 {padding-bottom: 45px;}
	.bp100 {padding-bottom: 50px;}
	.hide-mb {display: none;}
	.double-gutter {padding-left: 15px; padding-right: 15px;}
	/*.pagination {display: block;}*/
	.tm20-mb {margin-top: 20px;}
	.bm20-mb {margin-bottom: 20px;}
	.bm0-mb {margin-bottom: 0;}
	.tm0-mb {margin-top: 0;}
	.bp0-mb {padding-bottom: 0;}
	.tp0-mb {padding-top: 0;}
	.fp-slider-container {height: 300px;}
	.page-title-container {height: 250px !important;}
	h1.page-title {font-size: 26px;}
	p.page-title-description {font-size: 18px;}
	.single-line {white-space: inherit;}
	.auto-listing .image {height: 120px;}
	.auto-listing .price {font-size: 14px;}
	.auto-listing .else {font-size: 12px;}
	.auto-listing .make-model {font-size: 16px; height: 50px;}
	.auto-listing .trim {display: none !important;}
	.auto-listing .year-mileage {font-size: 10px;}
	.auto-listing .tags span {font-size: 10px;}
	.pagination>li>a, .pagination>li>span {padding: 8px 10px 4px 10px;}
	.pagination-container div a {height: 40px; line-height: 40px; padding-left: 8px; padding-right: 8px;}
	.box-rounded {border-radius: 0;}
	.bs-no-gutter {padding-left: 0; padding-right: 0;}
	.bs-no-gutter .row {margin-left: 0; margin-right: 0;}
	.bs-no-gutter .row [class^="col-sm-"] {padding-left: 0; padding-right: 0;}
	.top-left {top: -8px; left: -8px;}
	.bottom-right {bottom: -8px; right: -8px;}
	.car-container {gap: 0.1% 0%;}
	.car-container > div {padding: 1em 1em;}
	.car-container h2 {font-size: 22px;}
	.auto-grid > div {flex-basis: 50% !important;}
	.grid-search .search-results {padding-left: 0; padding-right: 0;}
	.service-point-item > div {flex-basis: 100%;}
	.content-bg {max-width: 100%;}
	.car-search-form .search-form form > div {flex-basis: 50%;}
	.Auto-Description ul {column-count: 2; font-size: 13px;}
	.Auto-Image {height: max-content;}
	.car-container .gallery-top {height: 420px;}
	.car-container .gallery-thumbs {height: 60px;}
	.employee-container {width: 100%;}
	.employee-inner h4 {font-size: 18px;}
	.employee-inner p {font-size: 13px;}
	a.whatsapp-link.button {font-size: 11px; padding: 6px 8px;}
	.ast-advanced-headers-title {font-size: 22px;}
	.car-container .table {font-size: 14px;}
	.car-container .table td, .car-container .table th {padding: 5px;}
	.list-item {flex-basis: 100%;}
	.car-title h1 {padding: 140px 3% 3% 3%;
}

@media screen and (max-width: 599px) {
	.text-large {font-size: 18px;}
	.car-container .gallery-top {height: 300px;}
	.car-container .gallery-thumbs {height: 40px;}
	input[type=text], select, textarea {padding: 0.25em 0.75em !important;}
}

@media screen and (max-width: 420px) {
	.auto-listing .price {font-size: 12px;}
}