@charset "UTF-8";
/* CSS Document */

@font-face {
    font-family: "BuiltTiling";
	src: url("Resources/fonts/built titling el.ttf") format("truetype");
}

@font-face {
    font-family: "BuiltTilingBold";
    src: url("Resources/fonts/built titling lt.ttf") format("truetype");
}


header {
	padding: 8px 16px 8px 16px;
}

footer {
	width: 100%;
	height: 54px;
	background-color: #202020;
	text-align: center;
	position: fixed;
   	left: 0;
   	bottom: 0;
}
 
body {
	padding: 0;
    margin: 0;
    font-family: "BuiltTiling";
	font-size: 18px;
	background-color: #121212;
}
 
nav {
	height: 100%;
    float: right;
	padding: 40px 0px 0px 0px;
	text-align: center;
	align-content: center;
	display: flex;
}

nav a {
    text-decoration: none;
	color: #FFFFFF;	
	padding: 0px 0px 0px 24px;
}

.active {
	color: #a7a509;
	font-family: "BuiltTilingBold";
	letter-spacing: 0.065em !important;
	font-size: 32px;
	font-weight: 900;
}

.hero {
    height: 300px;
	width: 100%;
    background-color: #000000;
	display: block;
	padding: 0;
	margin: 0;
}

.hero-logo {
    height:300px;
	width: 100%;
    background-image: url("Resources/Images/BanditLogo-NoText.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-clip: content-box;
	background-position: 0% 25%;
	position: absolute;
	visibility: hidden;
}

.hero-text {
    height: 300px;
	width: 100%;    
	background-image: url("Resources/Images/BanditLogo-NoLogo.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	position:absolute;
	
}

h1 {
	color: #FFFFFF;
	font-size: 50px;
	font-family: "BuiltTilingBold";
	letter-spacing: 0.065em !important;
	text-align: center;
}

h2 {
	color: #FFFFFF;	
	font-family: "BuiltTiling";
	letter-spacing: 0.065em !important;
	font-size: 32px;
}

h5 {
	color: #7d7d7d;
	font-size: 24px;
	letter-spacing: 0.065em !important;
	text-align: center;
	margin: 16px;
}

.social {
	text-align: center;
	align-content: center;
	padding: 64px 0px 64px 0px;
	background-color: #121212;
	border: #121212;
}

.social a {
	text-decoration: none;
	margin: 8px;
}

.social img {
	width: 32px;
	height: 32px;
}

.social img:hover {
	opacity: 0.7;
}

 
/*TABLET*/
@media (max-width:768px){
    h1 {
        font-size: 40px;
    }
	
	h2 {
        font-size: 32px;
    }
	
	h5 {
        font-size: 24px;
    }
 	
	.active {
		color: #a7a509;
		font-family: "BuiltTilingBold";
		letter-spacing: 0.065em !important;
		font-size: 32px;
		font-weight: 900;
	}
	
	.social {
		padding: 48px 0px 48px 0px;
	}
	
	.social img {
		width: 32px;
		height: 32px;
	}
}
 
 
/*MOBILE*/
@media (max-width:440px){
    h1 {
        font-size: 32px;
    }
	
	h2 {
        font-size: 24px;
    }
	
	h5 {
        font-size: 20px;
    }
	
	.active {
		color: #a7a509;
		font-family: "BuiltTilingBold";
		letter-spacing: 0.065em !important;
		font-size: 24px;
		font-weight: 900;
	}
	
	.social {
		padding: 48px 0px 32px 0px;
	}
    
	.social img {
		width: 32px;
		height: 32px;
	}
	
    .hidden-xs {
        display: none;
    }
}