﻿/***** BEGIN RESET *****/
@import url("https://use.typekit.net/mur0tnx.css");
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 --------*/
:root {
  --red: #E71324;
}

/***** 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;
}

footer p, footer a, header a  {
	font-family: 'canada-type-gibson', sans-serif;
	font-size: 16px;
}

/*-------- BODY STYLES --------*/

body {}

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}

/*-------- FOOTER STYLES ----------------*/
.my-site-footer .footer-top img {max-width: 245px; width: 100%;}
.footer-top .wrapper > div:first-child {align-items: center; display: flex; flex-direction: column; gap: 40px;}
.footer-top .wrapper > div:first-child > div a {color: var(--red); padding: 10px 14px; background: #fff; border-radius: 40px; font-size: 20px;}
.my-site-footer .footer-top {background: url("/siteart/footer.jpg") no-repeat; padding-top: 60px; padding-bottom: 80px; border-top: #E71324 solid 10px; background-size: cover; background-position: center; background-color: #000;}
.my-site-footer .footer-top > .flex {justify-content: center; gap: 100px;}
.my-site-footer .footer-top > .flex .flex {gap: 70px;}

.my-site-footer .footer-top a, .my-site-footer .footer-top p {color: #fff; line-height: 20px;}
.my-site-footer .footer-heading {font-size: 24px!important; font-weight: 500; margin-bottom: 40px; text-transform: uppercase;}
.my-site-footer .footer-heading i {margin-right: 10px;}

.footer-top .wrapper .footer-links li {margin-bottom: 10px;}
.footer-top .wrapper .footer-links a {text-transform: uppercase; transition: all .4s ease-out;}
.footer-top .wrapper .footer-links a:hover {color: var(--red); text-decoration: underline;}

.my-site-footer .footer-contact .footer-sub-head {color: var(--red); margin-bottom: 15px; font-size: 24px; font-weight: 500; letter-spacing: .1px;}
.my-site-footer .footer-contact a {font-size: 24px; font-weight: 600; transition: all .4s ease-out;}
.my-site-footer .footer-contact a:hover {color: var(--red);}
.my-site-footer .footer-contact a i {margin-right: 10px;}
.my-site-footer .footer-contact .footer-location {margin-top: 24px; margin-bottom: 30px;}

.my-site-footer .footer-bottom {justify-content: center; gap: 20px; padding-top: 20px; padding-bottom: 20px;}
.my-site-footer .footer-bottom a {color: #000; transition: all .4s ease-out;}
.my-site-footer .footer-bottom a:hover {text-decoration: underline; color: var(--red);}

/*-------- UNIVERSAL STYLES ----------------*/
.wrapper {
	padding: 0 15px; 
	margin: 0 auto;
	max-width: 1570px;
}

.flex {display: flex;}

/*---Buttons---*/
.btn-red {
	display: inline-block;
	font-family: 'canada-type-gibson', sans-serif;
	width: 180px;
	font-weight: 600; 
	font-size: 18px;
	padding: 10px 0;
	border-radius: 5px;
	background: var(--red);
	color: #fff;
	border: none;
	transition: all .4s ease-out;
	text-align: center;
	letter-spacing: .1px;
}

.btn-red:hover {background: #b80f1c;}


/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/




/*---------- RESPONSIVE STYLES ----------*/

@media only screen and (max-width: 1600px) {
	.my-site-footer .footer-contact .footer-sub-head {font-size: 17px;}
	.my-site-footer .footer-contact a {font-size: 16px;}
	.my-site-footer .footer-contact p {font-size: 14px;}
	.my-site-footer .footer-top > .flex .flex {gap: 40px;}
	.my-site-footer .footer-top > .flex {gap: 70px;}
}

@media only screen and (max-width: 1200px) {
	.my-site-footer .footer-top > .flex, .my-site-footer .footer-top > .flex .flex {flex-direction: column; justify-content: center; text-align: center;}
	.my-site-footer .footer-top > .flex {gap: 40px;}
	.footer-top .wrapper > div:first-child {margin-bottom: 30px;}
	.my-site-footer .footer-contact p {margin-bottom: 20px;}
	.my-site-footer .footer-top > .flex .flex {gap: 10px;}
	.my-site-footer .footer-top {padding-bottom: 50px; padding-top: 50px;}
}

@media only screen and (max-width: 770px) {
	.my-site-footer .footer-bottom {flex-direction: column; justify-content: center; text-align: center; gap: 10px;}
	.my-site-footer .footer-bottom p,.my-site-footer .footer-bottom a {font-size: 14px;}
	.mobile-hidden {display: none;}
}
