﻿/***** 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;  
} 
h1, h2, h3, h4, h5, h6 {font-family: "Barlow", sans-serif;}
/*-------- 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;
}


* {
	 margin: 0;
     padding: 0;
     box-sizing: border-box;
}
/*-------- BODY STYLES --------*/

.content-relative {position:relative;}

body {
  font-family: "Pathway Extreme", sans-serif;
  overflow-x: hidden;
  box-sizing: border-box;
}

p {line-height:1.8;}

a:link, a:visited, a:active {text-decoration:none;color:inherit;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}

a,button {cursor:pointer;}

.red-button button{background: #CD0000;outline: none;border: 0;width: 100%;max-width: 400px;padding: 19px 0;border-radius: 0 30px 0 30px;font-size: 30px;color: #fff;text-transform: uppercase;font-family: "Barlow", sans-serif;font-weight:600;margin-right:30px;box-shadow: 3px 8px 15px rgba(0,0,0,0.5);}

.red-button button:hover,a.hero.red-button:hover {background:#ff0000;border-radius:0;transition:ease-in-out .5s;color:#fff;}
.gray-button button:hover {background:#AAAAAA;border-radius:0;transition:ease-in-out .5s;}

input[type="submit"]:hover {background:#ff0000;transition:ease-in-out .5s;border-radius:0;}

.gray-button button{background: #727272;outline: none;border: 0;width: 100%;max-width: 400px;padding: 19px 0;border-radius: 0 30px 0 30px;font-size: 30px;color: #fff;text-transform: uppercase;font-family: "Barlow", sans-serif;font-weight:600;box-shadow: 3px 8px 15px rgba(0,0,0,0.5);}

.rental-button button:hover {background:#ff0000;transition:ease-in-out .3s;}
/*--- HEADER STYLES ---------------------*/
header {}
a.hero.red-button {padding: 15px 36px;width: 100%;background: #CD0000;border-radius: 0 10px;}
.main-site-header {display: flex;justify-content:space-between;width: 100%;margin: 0 auto;background:#000;height: 170px;box-shadow: 3px 8px 15px rgba(0,0,0,0.2);}


i.fa-brands.fa-square-facebook {color:#CD0000;font-size:40px;}
i.fa-brands.fa-square-facebook:hover {color:#ff0000; transition:ease-in-out .3s;}

.search-wrapper {display: flex;}
input#keyword {width: 100%;max-width: 90%;padding: 10px;}
.search-wrapper {display: flex;width: 100%;margin-bottom: 10px;gap: 38px;align-items: center;justify-content: flex-end;}
form.search{width: 100%;text-align: right;}
button#Submit {padding: 10px 19px;border: none;margin-left: -4px;color: #fff;background: #CD0000;font-size: 18px;top: 1px;position: relative;}
.header-phone {color:#fff !important;font-size: clamp(1rem, 0.9255rem + 0.3723vw, 1.4375rem);font-weight:500;}
.mobile-buttons {display:none;}
a.header-phone {width: 21%;}
/*---BODY--------------------------------*/

/*---HERO------------------*/
.hero-background {position: relative;background-color: #727272;}
.hero-image img{width: 100%;position: relative;top: 0px;height: 95%;object-fit: cover;object-position: 0 -80px;}
.hero-buttons {margin-top: 50px;}
.hero-image{position:relative;}
.hero-content h1 {color:#fff;font-size:68px;font-weight:400;text-transform:uppercase;text-shadow: 4px 4px 4px rgba(0,0,0,.6);}
.hero-content {position:absolute;z-index:99999;max-width: 990px;width: 100%;left: 6%;top: 160px;}
.bold {font-weight:800;}
.overlay {background: rgba(0,0,0,0.2);width: 100%;height: 92%;position: absolute;z-index: 9999;}
.large-buttons {}
/*---CATGORIES------------------*/
.shop-by-category {width: 100%;background:#CD0000;padding: 36px 0;text-align: center;max-width: 66%;border-radius: 0 30px 30px 0;position: absolute;bottom: 40px;font-size: 26px;color: #fff;z-index:9999;}
.shop-by-category h2{font-weight:500;text-transform:uppercase;}
.category-flex {display: flex;justify-content: center;gap: 20px;padding: 33px 0 39px;}
section.categories {position: relative;}
.gray-stripe {width: 100%;height: 190px;background: #DFDFDF;position: absolute;z-index: -1;bottom: 27%;}
.category-content {margin-top: -5px;background: #000;padding: 25px 0;border-top: solid #CD0000 10px;color: #fff;text-align: center;border-radius: 0 0 26px 0;box-shadow: 3px 8px 15px rgba(0,0,0,0.5);}
.category-content p {text-transform:uppercase;font-size:25px;font-weight:700;font-family: "Barlow", sans-serif;}
a.category {width: 100%;max-width: 430px;}
a.category img{width:100%;border-radius: 24px 0 0 0;}

.category {position:relative; transition: transform .2s;}
.category:hover{transform: scale(.9);}
/*--About Us Section------------------*/
section.about-us {display: flex;gap: 30px;padding:80px 0;height: 710px;}
.about-content {background: #000;border-left: solid 26px #CD0000;color: #fff;display: flex;justify-content: center;align-items: center;width: 100%;}
.about-content .wrapper {width: 100%;max-width: 700px;}
.about-content h2 {margin-bottom:20px;font-size:55px;font-weight:400;text-transform:uppercase;}

/*---Contact Us-----------------*/
section.contact-us {display: flex;gap: 30px;}
.about-content {background: #000;border-left: solid 20px #CD0000;color: #fff;display: flex;justify-content: center;align-items: center;width: 100%;flex-direction: column;}
.contact-form h1 {margin-bottom:20px;font-size:55px;font-weight:400;text-transform:uppercase;}
.contact-form {width: 100%;max-width: 720px;}
.contact-form form {display: flex;flex-direction: column;gap: 16px;}

/*---About Us Page-----------------*/
section.about-header {background: #000;}
.about-us img {width:100%;}
section.about-us-page {display: flex;gap: 30px;padding-bottom: 90px;width: 90%;margin: 0 auto;padding: 178px 0;}
.about-content {background: #000;border-left: solid 26px #CD0000;color: #fff;display: flex;justify-content: center;align-items: center;width: 100%;flex-direction: column;}
.about-content .wrapper {width: 100%;max-width: 630px;}
.about-text h2 {margin-bottom:20px;font-size:55px;font-weight:400;text-transform:uppercase;}

.about-buttons {margin-top: 50px;display: flex;gap: 30px;}
.about-buttons .red-button button{padding: 19px 20px;font-size: 20px;}
.about-text {width: 100%;max-width: 570px;flex-direction: column;justify-content: center;margin: 0 auto;}
.about-page-flex {background:#000;color:#fff;padding: 80px 70px;max-width: 991px;width: 100%;border-right: solid 20px #CD0000;display: flex;align-items: center;}
.fb-page {width: 300px;}

.about-content {background: #000;border-left: solid 20px #CD0000;color: #fff;display: flex;justify-content: center;align-items: center;width: 100%;flex-direction: column;}
.about-flex h1 {margin-bottom:20px;font-size:55px;font-weight:400;text-transform:uppercase;}
.about-flex h2{font-size:40px;margin-bottom:20px;text-transform:uppercase;}
.about-flex {width: 100%;max-width: 720px;}
.about-image img{width: 100%;height: 100%;object-fit: cover;}
.about-image {width:100%;}
/*---RENTAL SECTION-----------------*/
.last-section {display: flex;padding: 20px 0 100px;justify-content: center;gap: 70px;align-items: center;}

.rentals-category {background: url("../siteart/rentals.png?v=1");background-repeat: no-repeat;background-position: 1px 30%;background-size: 100%;width: 100%;position: relative;height: 354px;display: flex;justify-content: flex-start;align-items: center;border-radius: 26px 26px 0 0;}

.rentals-category .overlay {border-radius: 30px  30px 0 0;background: rgba(0,0,0,0.5);height: 100%;}

.rental-content {color: #fff;z-index: 9999999999;position: relative;width: 100%;max-width: 760px;margin-left: 60px;}

.rental-content h2{font-size: 50px;text-transform:uppercase;font-family: "Barlow", sans-serif;font-weight:500;text-shadow: 4px 4px 4px rgba(0,0,0,.6);}
.section-flex {width: 56%;background-color: #000; border-radius: 30px;}

.rental-button button {width: 100%;padding: 27px 0;border-radius: 0 0 30px 30px;border: none;background:#CD0000;color:#fff !important;font-size: 22px;text-transform: uppercase;margin-top:-3px;}
i.fa-solid.fa-circle-chevron-right {margin-left: 60px;font-size:25px;}

/*--------FORM STYLES--------------------*/

input#Primary_Name,input#Phone,input#Email,textarea#Message {padding:10px 20px;width: 90%;margin: 0 auto;}
input[type="submit"]{width: 90%;margin: 0 auto;padding: 14px 0;background:#CD0000;border:none !important;border-radius:10px;color:#fff;font-weight:700;font-size:18px;}


/*---CONTACT PAGE-----------------*/
section.contact-header {display: flex;justify-content: space-between;padding: 0 0 26px;flex-direction: column;background:#000;}

.content-bar {padding: 36px 40px;width: 100%;background: #CD0000;max-width: 1320px;border-radius: 0 40px 40px 0;color: #ffff;position: absolute;right: auto;left: 0%;top: 430px;z-index: 99999;}

.content-category {display: flex;align-items: center;gap: 10px;font-size: 21px;font-family: "Barlow", sans-serif;font-weight: 600;}
.content-category i {font-size:20px;}

.contact-wrapper {display: flex;justify-content: space-evenly;}
.content-info {margin: 0 auto;color: #fff;z-index: 99999999;font-size: 170px;position: absolute;top: 90px;left: 110px;}
section.contact-us {display: flex;gap: 30px;padding-bottom: 90px;width: 90%;margin: 0 auto;padding: 178px 0;}
.content-info h1 {font-size: 65px;text-transform: uppercase;font-weight:400;text-shadow: 4px 4px 4px rgba(0,0,0,.6);}
.contact-image img {object-fit: cover;width: 100%;height: 283px;object-position: 0 36%;}
.contact-image {position:relative;background: #000;}
.contact-image .overlay {background: rgba(0,0,0,0.6);height: 99%;}

/*-------- FOOTER STYLES ----------------*/
footer{display: flex;width: 100%;}
.footer {width: 100%;display: flex;flex-direction: row;}
.footer-logo {background:#fff;padding: 90px 50px;display: flex;align-items: center;}
.footer-logo img {max-width: 442px;width:100%;}
.footer-links {width: 100%;display: flex;justify-content: flex-start;gap: 70px;padding: 50px 6%;background:#000;}
.footer a {color:#fff;text-transform:uppercase;display: flex;gap: 9px;}
.footer li {padding-bottom: 10px;display: flex;gap:10px;}
.footer-title {color:#fff;text-transform:uppercase;font-size:30px;font-weight:700;font-family: "Barlow", sans-serif;margin-bottom:15px;}
.footer-sections.social {display:flex;flex-direction:column;align-items:center;}
.contact-flex {display:flex;}
.footer i.fa-brands.fa-square-facebook {font-size:30px;}
.footer i.fa-solid.fa-location-dot,.footer i.fa-solid.fa-envelope,.footer i.fa-solid.fa-phone {font-size:18px;color:#CD0000;}


/*------ MOBILE BUTTON VERSION ----*/
a.large-buttons {width: 100%;}
a.large-buttons button {padding: 17.5px;background:#CD0000;outline:none;width: 100%;border:unset;}

.dropbtn {
  background-color: #D9D9D9;
  color: #000;
  padding: 17px;
  font-size: 16px;
  border: none;
  cursor: pointer;
	width: 100%;
}

.mobile-buttons i {font-size:20px;}

.dropbtn:hover, .dropbtn:focus {
  background-color:#000;color:#fff;
}

.large-buttons.red i {color:#fff;}

#myInput {
  box-sizing: border-box;
  background-image: url('searchicon.png');
  background: #000;
  background-position: 14px 12px;
  background-repeat: no-repeat;
  font-size: 16px;
  padding: 14px 20px 12px 45px;
  margin: 0 auto;
}

#myInput:focus {outline: 3px solid #ddd;}

.dropdown {
  position: relative;
  display: inline-block;
	width:100%;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f6f6f6;
  width: 100%;
  top: 224px;
  overflow: auto;
  z-index: 99999999999;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown a:hover {background-color: #ddd;}

.show {display: block;}


/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/

input[type="text"]:not([class^="Mui"]) {height: 40px !important;}

.list-listings-count {color: #c40000 !important;}
span.rent-lease-price {color: #000 !important;}





/*---------- RESPONSIVE STYLES ----------*/

@media only screen and (max-width: 1726px) {
	a.header-phone {width: 20%;text-align: right;}
	input#keyword{max-width: 89%;}
	.header-phone {font-size: 18px;}
}

@media only screen and (max-width: 1600px) {
	a.hero.red-button {margin-left: 16px;padding: 11px 30px;width: 100%;background: #CD0000;border-radius: 0 10px;}
	a.header-phone {width: 23%;}
	input#keyword {max-width: 88%;}
}
@media only screen and (max-width: 1500px) {
	.category-flex {flex-wrap:wrap;}
	.about-content {padding: 0 50px;}
	.about-content h2 {font-size: 40px;}
	.about-buttons .red-button button {font-size:16px;}
	a.header-phone {width: 23%;}
}

@media only screen and (max-width: 1400px) {
	.hero-content {top: 120px;}
	.hero-content h1 {font-size: 55px;}
	.about-content h2 {font-size: 33px;}
	.content-bar {max-width: 1089px;}
	.content-category {font-size: 18px;}
	input#keyword {max-width: 83%;}
	.rental-content h2 {font-size: 40px;}
	.rental-content {max-width: 540px;margin: 0 auto;}
}


@media only screen and (max-width: 1329px) {
	a.category {max-width: 300px;}
	.category-content p {font-size: 17px;}
	.gray-stripe {height: 150px;}
}


@media only screen and (max-width: 1318px) {
	.about-buttons .red-button button {padding: 19px 8px;}
	.about-content {padding: 10px 57px;}
	.mobile-visable,.mobile-buttons {display: flex;}
	.content-bar {top: 490px;max-width: 940px;}
	a.hero.red-button { margin-left: 0;padding: 11px 40px;width: 100%;background: #CD0000;border-radius: 0;}
	.content-info {top: 33%;}
	.about-us img {max-width: 500px;width: 100%;}
	
}


@media only screen and (max-width: 1316px) {
	input#keyword {max-width: 86%;}

}


@media only screen and (max-width: 1200px) {
	.hero-content {top: 70px;}
	.red-button button,.gray-button button {max-width: 310px;font-size: 25px;}
	.hero-image img {height: 100%;object-position: 0;}
	.shop-by-category {position:relative;max-width: 100%;border-radius: 0;}
	.about-page-flex {border-right: unset;border-bottom: solid 20px #CD0000;}
	.shop-by-category {bottom: 5px;}
	a.category {padding: 60px 0 0;}
	.overlay {height: 100%;}
	.rental-content h2 {font-size: 36px;}
	.about-text h2 {font-size: 35px;}
}


@media only screen and (max-width:1100px) {
	a.category {max-width: 273px;}
	.hero-content {max-width:unset;right:0;width: 90%;}
	
}


@media only screen and (max-width:1068px) {
	section.about-us {flex-direction: column;height: unset;padding: 40px 0;}
	.about-us img {display:none;}
	.about-content {padding: 90px 0px;border-left: unset;
    border-bottom: solid 20px #CD0000;}
}

@media only screen and (max-width: 1000px) {
	.last-section {flex-direction: column;}
	.section-flex {width: 90%;}
	.footer {flex-direction: column;}
	.footer-logo {justify-content: center;padding: 40px 50px;}
	.footer-links {width: 100%;gap: 30px;}
	.footer li {justify-content: flex-start;padding-bottom: 18px;}
	.footer-title {text-align:center;}
	.hero-content {max-width: 80%;}
	.rental-content {margin: 0 auto;}
	.content-bar {top: -4px;position: relative;border-radius:0;width:100%;max-width:unset;}
	section.contact-us {flex-direction: column-reverse;}
	.content-category {font-size: 16px;}
	section.contact-us {padding: 29px 0;}
	input#Primary_Name, input#Phone, input#Email, textarea#Message {padding: 10px 20px;width: 100%;margin: unset;}
	.contact-info {top: 34%;left: 18%;}
	.footer-links {justify-content: space-between;}
	section.about-us-page {padding: 60px 0;width: 90%;flex-direction:column;}
	
}


@media only screen and (max-width: 900px) {
	.category-flex {flex-direction: column;align-items: center;}
	.gray-stripe {display:none;}
	a.category {max-width: 80%;padding: 30px 0 0;}
	.category-content {padding: 37px 0;}
	.category-flex {gap: 0px;}
	.category-content p {font-size: clamp(1.125rem, 1.0612rem + 0.3191vw, 1.5rem);}
	.content-category {flex-direction: column;text-align: center;}
	.hero-content h1 {font-size: 40px;}
	.red-button button, .gray-button button {max-width: 246px;font-size: 20px;font-weight: 800;}
	.hero-buttons {margin-top: 30px;}

}


@media only screen and (max-width: 800px) {
	.about-content {border-left:none;}
	.about-content .wrapper{max-width: 90%;}
	.footer-links {flex-direction: column;align-items: center;}
	.footer li {justify-content: center;}
	.hero-content {max-width: 90%;}
	.rental-content {text-align: center;}
	.rental-content h2 {font-size: 41px;font-size: 27px;max-width: 360px;margin: 0 auto;}
	.rental-button button {margin-top: -8px;font-size: 16px;}
	.about-page-flex {padding: 80px 30px;max-width: unset;}
	section.about-us-page{width:100%;}
	.contact-wrapper {flex-direction: column;gap: 40px;max-width: 190px;margin: 0 auto;}
	.content-category i {font-size: 30px;}
	section.about-us-page {padding: 0px 0 60px;}
	.category-content {padding: 22px 0;}
	.category-flex {padding: 0 0 0;}
	.rentals-category {height: 214px;}
	.about-buttons .red-button button {margin-right:0;}
}

@media only screen and (max-width: 700px) {
	a.category {padding: 60px 0 0;max-width: 90%;}
	.about-text h2 {font-size: 35px;}
.content-info {top: 37%;left: 10%;}
	.content-info h1 {font-size: 32px;}
	.contact-image img {height: 153px;}
}

@media only screen and (max-width: 600px) {
	.hero-content {max-width: 80%;}
	input#keyword {max-width: 81%;}
	section.about-us-page {width: 100%;}
	section.categories {padding: 30px 0;}
	.shop-by-category {bottom: 122px;}
	.hero-content h1 {font-size: 43px;}
	.hero-buttons {display: flex;margin-top: 20px;flex-direction: column;gap:20px;}
	.shop-by-category {bottom: 5px;}
	.hero-content {top: 190px;}
	.last-section {gap: 41px;padding: 20px 0 53px;}
	.shop-by-category {bottom: 122px;}
	.hero-image img {height: 930px;object-position: 100% -117px;}
	.overlay {height: 100%;}
	.hero-background {height: 880px;}
	section.about-us {height: unset;padding: 20px 0;}
}



@media only screen and (max-width: 500px) {
	.about-buttons {flex-direction: column;gap: 20px;}
	.red-button button, .gray-button button {max-width: 100%;}
	.about-content .wrapper {max-width: 90%;margin: 0 auto;}
	.about-content h2 {font-size: 33px;}
	.hero-image img {height: 838px;object-position: 98% -77px;}
	.hero-content {top: 150px;}
	.hero-content h1 {font-size: 38px;}
	.red-button button, .gray-button button {font-size: 20px;max-width: 100%;border-radius: 0;}
	.category-flex {padding: 0px 0 0;gap: 44px;}
	.logo img {max-width: 191px;}
	.logo {max-width: 230px;}
	.rental-content h2 {font-size: 31px;}
	.shop-by-category h2 {font-size: 25px;}
	input#keyword {max-width: 78%;}
	.shop-by-category {bottom: 82px;}
	.hero-background {height: 784px;}
	.category-flex {gap: 0;}
    .rental-content h2 {font-size: 25px;}
	.rentals-category {height: 150px;}
	.rental-content h2 {font-size: 21px;}
	section.categories {padding: 70px 0 30px;}
	a.category {padding: 20px 0 0;}
}

@media only screen and (max-width: 400px) {
	.hero-content h1 {font-size: 30px;}
	.hero-image img {height: 646px;object-position: 100% -76px;}
	.hero-background {height: 624px;}
	.red-button button, .gray-button button {font-size: 16px;max-width: 80%;padding: 15px 0;}
	.hero-buttons {gap: 12px;}
}


@media only screen and (max-width: 400px) {
	.contact-image img {    object-fit: cover;
    width: 100%;
    height: 143px;
    object-position: 0 36%;}
	
	.content-info {top: 32%;left: 6%;}
}

@media only screen and (max-width: 350px) {
	input#keyword {max-width: 68%;padding: 19px 20px 19px 45px;}
	.search-content button#Submit {margin-left: -9px;}
}



