﻿/***** BEGIN RESET *****/
@import url("https://use.typekit.net/edz0wnu.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;  
} 

/***** 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;
}

/*-------- BODY STYLES --------*/

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}

/*-------- Header STYLES ----------------*/

.my-site-header a, 
.my-site-header p  {
	font-family: 'dm-sans', sans-serif; 
	font-size: 14px; 
	font-weight: 500;
}

.my-site-header > .flex > .flex {align-items: center;}
.my-site-header .img-height {margin: 10px;}
.my-site-header .img-height img {width: 20px; height: 100%;}

.my-site-header > .flex {
	justify-content: space-around; 
	align-items: center; 
	gap: 20px; 
	background: #000; 
	padding-top: 5px!important; 
	padding-bottom: 5px!important;
}
.my-site-header a, .my-site-header p {color: #fff!important;transition:.2s ease-in;}

.my-site-header a:hover {color:#C62727!important;}

/*-------- FOOTER STYLES ----------------*/

.my-site-footer {background: #000;padding-top: 80px!important; padding-bottom: 80px!important;}

.my-site-footer .wrapper {justify-content: center; gap: 50px;}
.my-site-footer .wrapper .flex {gap: 100px;}

.my-site-footer .img-height {max-width: 350px; width: 100%; height: auto;}
.my-site-footer .img-height  img {width: 100%;}

.my-site-footer .footer-heading {font-size: 25px; color: #fff; font-weight: 700;font-family: 'rajdhani', sans-serif;text-transform: uppercase; margin-bottom: 30px;}
.my-site-footer li {margin-bottom: 2px;}
.my-site-footer li a, .my-site-footer li {font-size: 18px; color: #fff; font-weight: 400;font-family: 'rajdhani', sans-serif;transition: .4s ease-in; }
.my-site-footer li a:hover {color: #ff2d37;}

.my-site-footer .uppercase li a {text-transform: uppercase;}

/*-------- UNIVERSAL STYLES ----------------*/
.wrapper {
	padding: 0 15px; 
	margin: 0 auto;
	max-width: 1750px;
}

.flex {display: flex;}

/*---------- RESPONSIVE STYLES ----------*/

@media only screen and (max-width: 1100px) {
	.my-site-footer .wrapper {gap: 25px;}
	.my-site-footer .wrapper .flex {gap: 50px;}
}

@media only screen and (max-width: 990px) {
	.my-site-footer .wrapper {flex-direction: column;}
	.my-site-footer .wrapper {gap: 50px;}
	.my-site-footer .wrapper .flex {gap: 200px;}
	.my-site-footer .footer-heading {margin-bottom: 10px;}
	.my-site-footer .img-height {max-width: 730px}
}

@media only screen and (max-width: 800px) {
	.my-site-header {display: none;}
}

@media only screen and (max-width: 480px) {
	.my-site-footer .wrapper .flex {gap: 100px;}
}

@media only screen and (max-width: 375px) {
	.my-site-footer .wrapper .flex {gap: 47px;}
}
