/* IMPORT GOOGLE FONTS */
@import url(https://fonts.googleapis.com/css?family=Titillium+Web:400,600,300|Rajdhani:700);
html			{ font-family: 'Titillium Web', sans, sans-serif, serif; font-weight: 300; font-size: 16px; line-height: 1.1; }
body			{ background-color: rgb(255, 245, 235); }
h1, h2, h3, h4	{ font-family: 'Rajdhani'; font-weight: 700; color: rgb(179, 136, 8); }
h1				{ text-transform: uppercase; }
a,
a:link,
a:visited,
a:hover,
a:active		{ text-decoration: none; }
@media screen and (min-width: 20em) { body { font-size: 1em; } }		/* Screen - Mobile Phone Portrait	*/
@media screen and (min-width: 45em) { body { font-size: 1em; } }		/* Screen - Tablet Portrait			*/
@media screen and (min-width: 64em) { body { font-size: 1.2em; } }		/* Screen - Desktop & Laptop		*/

/*	=========================
	Jackpot RGB Color Values
	
	Logo:
	Pantone 1255 C Gold			179, 136, 8
	Pantone 4625 C Dark Brown	87, 39, 0
	
	Light Brown					115, 50, 0
	Metal Gold					180, 151, 90
	Background Dark Yellow		245, 235, 225
	Background Light Yellow		255, 245, 235
	
	Dark Grey					64, 64, 64
	Light Grey					204, 204, 204
	Extra Light Grey			238, 238, 238
	
	=========================	*/

/*	=========================
	Container
	=========================	*/
*, *:before, *:after { box-sizing: border-box; }

.container {
	width: 100%;
	text-align: center;
}

.primary-header {
	position: relative;
	background-color: rgb(87, 39, 0);
	color: rgb(255, 255, 255);
	border-bottom: 0.2em solid rgb(179, 136, 8);
} @media screen and (min-width: 64em) { .primary-header { border-bottom: 3px solid rgb(179, 136, 8); } }

.primary-content {
	position: relative;
	font-size: 1em;
	color: rgb(32, 32, 32);
	max-height: 1000000px;
}

.primary-footer {
	position: relative;
	background-color: rgb(87, 39, 0);
	color: rgb(255, 255, 255);
	border-top: 0.2em solid rgb(179, 136, 8);
	margin-top: 1em;
} @media screen and (min-width: 64em) { .primary-footer { border-top: 3px solid rgb(179, 136, 8); } }

/*	=========================
	Clearfix
	=========================	*/
.group:before, .group:after	{ content: ""; display: table; }
.group:after				{ clear: both; }
.group						{ clear: both; *zoom: 1; }

/*	=========================
	Wrapper
	=========================	*/

nav {
	margin: 0 auto;
	width: 100%;
	padding: 1em 1em;
	font-size: 0.66em;
} @media screen and (min-width: 64em) { nav { width: 960px; padding: 2em 0; } }
	img.logo {
		width: 12em; 
		float: right;
	}	@media screen and (min-width: 64em) { img.logo { width: 240px; } }

.feature-wrapper {
	position: relative;
	margin: 0 auto;
	width: 100%;
	height: 12em;
	background-image: url("../img/feature.jpg");
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: center center;
} @media screen and (min-width: 64em) { .feature-wrapper { height: 640px; } }
	.feature-btn-wrapper {
		position: relative;
		margin: 0 auto;
		width: 100%;
		height: 100%;
	} @media screen and (min-width: 64em) { .feature-btn-wrapper { width: 960px; } }
	.feature-btn {
		position: absolute;
		right: 0.75em;
		bottom: 0.75em;
		padding: 1em;
		border: 0.2em solid rgb(180, 151, 90);
		border-radius: 0.5em;
		background: rgba(0, 0, 0, 0.7);
		color: rgb(255, 255, 255);
		font-size: 0.66em;
		line-height: 1.5em;
	} @media screen and (min-width: 64em) { .feature-btn { border: 3px solid rgb(180, 151, 90); right: 2.66em; bottom: 2.66em; } }
	.feature-btn h4 { color: rgb(255, 255, 255); text-transform: uppercase; font-size: 1.51em; margin: 0.2em 0; }
	.feature-btn:hover, .feature-btn:active { background: rgba(0, 0, 0, 0.85); box-shadow: 0 0 0.5em rgb(0, 0, 0); }
	.feature-btn a:link, .feature-btn a:visited, .feature-btn a:hover, .feature-btn a:active { color: rgb(255, 255, 255); }
	.feature-btn a:hover, .feature-btn a:active { text-decoration: underline; }

.brands-wrapper {
	margin: 0 auto;
	width: 100%;
	text-align: center;
} @media screen and (min-width: 64em) { .brands-wrapper { width: 960px; } }
	.brand {
		display: inline-block;
		vertical-align: middle;
	}
	.brand img  {
		width: 7em;
		padding: 0.33em 1em;
	} @media screen and (min-width: 64em) { .brand img { width: 180px; } }

.contact-us { float: right; }

/*	=========================
	Row
	=========================	*/
.row	{ width: 100%;		}

/*	=========================
	Grids
	=========================	*/
.col-1	{ width: 8.33%;		}
.col-2	{ width: 16.66%;	}
.col-3	{ width: 25.00%;	}
.col-4	{ width: 33.33%;	}
.col-5	{ width: 41.66%;	}
.col-6	{ width: 50.00%;	}
.col-7	{ width: 58.33%;	}
.col-8	{ width: 66.66%;	}
.col-9	{ width: 75.00%;	}
.col-10	{ width: 83.33%;	}
.col-11	{ width: 91.66%;	}
.col-12	{ width: 100%;		}

/*	=========================
	Navigation
	=========================	*/

/*	=========================
	Typography
	=========================	*/
p {
	font-size: 1em;
	margin-top: 0.25em;
	max-height: 1000000px;
}
h1 {
	font-size: 1.4em;
	margin-top: 0.7em;
	margin-bottom: 0.35em;
}
h2 {
	font-size: 1.2em;
	margin-top: 0.6em;
	margin-bottom: 0.3em;
}
h3 {
	font-size: 1.1em;
	margin-top: 0.55em;
	margin-bottom: 0.275em;
}
/*	=========================
	Colour
	=========================	*/
	
/*	=========================
	Image
	=========================	*/