/*
Website designed by Hartmann House
*/

body
{
	margin: 0px;
	padding: 0px;
	background-color: #fff;
	color: #333;
	font-family: 'Open Sans', sans-serif;
}

a
{
	color:#333;
	text-decoration: none;
}

a:hover
{
	color: #FF1B00;
}

div.largecontents
{
	width: 90%;
	margin: auto;
	padding: 0px;
}

div#topfix
{
	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
}
img
{
	border: 0px;
}
h1#title
{
	text-align: center;
	line-height: 100%;
	z-index: 999;
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	font-family: 'Josefin Sans', sans-serif;
}

#title a
{
	color: #333;
	text-decoration: none;
	font-weight: 300;
	font-size: 32px;
}

#title img
{
	width: 150px;
}

div#leftlinks
{
	position: absolute;
	top: 30px;
	left: 0px;
	margin: 0px;
	padding: 0px;
	line-height: 100%;
}

#leftlinks p
{
	margin: 0px;
	padding: 0px;
	line-height: 100%;
}

#leftlinks a
{
	margin-right: 6px;
}

#leftlinks img
{
	height: 30px;
}

div#rightlinks
{
	position: absolute;
	top: 36px;
	right: 0px;
	margin: 0px;
	padding: 0px;
	line-height: 100%;
}

#rightlinks p
{
	margin: 0px;
	padding: 0px;
	line-height: 100%;
	font-size: 15px;
}

#rightlinks img
{
	height: 55px;
}

#rightlinks a
{
	padding: 15px;
	background-color: #333;
	color: #fff;
	text-decoration: none;
	float: left;
	margin-left: 8px;
	display: block;
}

#rightlinks a:hover
{
	color: #ccc;
}

div#mainmenu
{
	float: left;
	width: 100%;
	text-align: center;
	border-top: 1px solid #666;
	border-bottom: 1px solid #666;
	padding-top: 5px;
	padding-bottom: 5px;
}

#mainmenu p
{
	display: inline-block;
	margin-left: 11px;
	margin-right: 11px;
	font-size: 16px;
	padding: 0px;
	line-height: 100%;
	font-family: 'Josefin Sans', sans-serif;
}

#mainmenu a
{
	color: #333;
	text-decoration: none;
	font-weight: 300;
}

#mainmenu a:hover
{
	color: #FF1B00;
}

a#chosenmenu
{
	color: #FF1B00;
}

div#menuboxlocation
{
	display: none;
}

div#fullcontents
{
	float: left;
	width: 100%;
	margin-top: 30px;
}
#fullcontents img
{
	width: 100%;
	display: block;
}

#fullcontents p
{
	text-align: justify;
	font-size: 14px;
	font-weight: 200;
	line-height: 150%;
	margin: 0px;
	padding: 0px;
	padding-bottom: 12px;
}

#fullcontents ul
{
	margin: 0px;
	padding: 0px;
	margin-left: 13px;
}

#fullcontents li
{
	text-align: justify;
	font-size: 14px;
	font-weight: 200;
	line-height: 150%;
	margin: 0px;
	padding: 0px;
	padding-bottom: 12px;
}

div.leftcontents
{
	float: left;
	width: 50%;
}

div.rightcontents
{
	float: right;
	width: 48%;
	padding-left: 2%;
}

div.leftmediumcontents
{
	float: left;
	width: 48%;
	padding-right: 2%;
}

div.largeleftcontents
{
	float: left;
	width: 70%;
}

div.logoleft
{
	float: left;
	width: 40%;
	padding-left: 5%;
}

div.logoright
{
	float: right;
	width: 40%;
	padding-right: 5%;
}

div.smallcolumnslogos
{
	display: inline-block;
	width: 23%;
	padding-right: 1%;
	padding-bottom: 30px;
}

div.smallcolumns
{
	float: left;
	width: 24%;
	padding-right: 1%;
	padding-bottom: 30px;
}

div.mediumcolumns
{
	float: left;
	width: 33.33%;
	padding-right: 0%;
	padding-bottom: 30px;
}

div.smallrightcontents
{
	float: right;
	width: 25%;
}

div.alternativecontents
{
	float: left;
	width: 100%;
	padding-top: 30px;
	padding-bottom: 30px;
	background-color: #ddd;
}

div.alternativecontents2
{
	float: left;
	width: 100%;
	padding-top: 30px;
	padding-bottom: 30px;
	background-color: #eee;
}

div.maincontents
{
	float: left;
	width: 100%;
	padding-top: 30px;
	padding-bottom: 30px;
}

h2
{
	text-align: left;
	font-weight: 200;
	margin: 0px;
	padding: 0px;
	font-size: 28px;
	padding-bottom: 15px;
}

h3
{
	text-align: left;
	font-weight: 200;
	margin: 0px;
	padding: 0px;
	font-size: 22px;
	padding-bottom: 15px;
}

span.imagecontainer
{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	display: block;
	opacity: 0;
	background-color: rgba(0, 0, 0, 0.6);
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-ms-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
	overflow: hidden;
}

div.imagefix
{
	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
}

.imagefix a
{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	display: block;
}

span.imagetext
{
	position: absolute;
	top: 50%;
	left: 5%;
	width: 90%;
	margin-left: 0px;
	display: block;
	text-align: center;
	color: #fff;
}

.imagetext p
{
	font-size: 14px;
	padding-top: 5px;
	padding-bottom: 5px;
}

div#base
{
	float: left;
	width: 100%;
	background-color: #111;
}
div#basefix
{
	position: relative;
	top: 0px;
	left: 0px;
	width: 90%;
	padding-left: 5%;
}
div#baseleft
{
	float: left;
	margin: 0px;
	padding-top: 40px;
	padding-bottom: 40px;
	padding-left: 0px;
}

#baseleft p
{
	font-size: 11px;
	color: #fff;
	margin: 0px;
	padding: 0px;
}

#baseleft a
{
	margin-right: 7px;
}

#baseleft img
{
	height: 30px;
}

p#privacylink
{
	font-size: 14px;
	margin-top: 40px;
}

#baseleft a
{
	color: #fff;
	text-decoration: none;
}
#baseleft a:hover
{
	color: #ccc;
}

div#baseright
{
	float: right;
	margin: 0px;
	padding-top: 40px;
	padding-bottom: 40px;
	padding-right: 0px;
}

#baseright p
{
	font-size: 16px;
	color: #fff;
	margin: 0px;
	padding: 0px;
}

#baseright a
{
	background-color: #fff;
	color: #333;
	padding: 10px;
	text-decoration: none;
}
#baseright a:hover
{
	color: #000;
}

p#sitedesign
{
	font-size: 14px;
	margin-top: 40px;
}

p#baseimage
{
	position: absolute;
	top: 0px;
	left: 50%;
	width: 148px;
	margin: 0px;
	padding: 0px;
	margin-left: -74px;
	margin-top: 72px;
}

#baseimage img
{
	display: block;
	width: 100%;
}



/*----------------------------------------
 1154px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:1154px)
{
	div#baseleft
	{
		padding-left: 20px;
	}
	#baseleft p
	{
		font-size: 17px;
	}
	p#privacylink
	{
		font-size: 15px;
	}
	
	div#baseright
	{
		padding-right: 20px;
	}
	
	#baseright p
	{
		font-size: 17px;
	}
	p#sitedesign
	{
		font-size: 15px;
	}
}

/*----------------------------------------
 1085px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:1085px)
{
	div.smallcolumns
	{
		float: left;
		width: 49%;
		padding-right: 1%;
		padding-bottom: 30px;
	}
	div.mediumcolumns
	{
		float: left;
		width: 49%;
		padding-right: 1%;
		padding-bottom: 30px;
	}
}

/*----------------------------------------
 1052px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:1052px)
{
	div#leftlinks
	{
		left: auto;
		right: 355px;
		top: 45px;
	}
	
	h1#title
	{
		text-align: left;
		line-height: 100%;
		z-index: 999;
		margin: 0px;
		
		font-family: 'Josefin Sans', sans-serif;
	}
}

/*----------------------------------------
 1022px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:1022px)
{
	div.largeleftcontents
	{
		float: left;
		width: 55%;
	}
	
	div.smallrightcontents
	{
		float: right;
		width: 40%;
	}
}

/*----------------------------------------
 900px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:900px)
{
	div.largeleftcontents
	{
		float: left;
		width: 100%;
	}
	
	div.smallrightcontents
	{
		float: right;
		width: 100%;
	}
}

/*----------------------------------------
 836px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:836px)
{
	h1#title
	{
		text-align: center;
		line-height: 100%;
		z-index: 999;
		margin: 0px;
		
	}
	
	div#mainmenu
	{
		display: none;
	}
	
	div#menuboxlocation
	{
		position: absolute;
		top: 0px;
		left: -200px;
		margin: 0px;
		padding: 0px;
		height: 100%;
		z-index: 1002;
		width: 200px;
		-webkit-transition: all 1s ease;
		-moz-transition: all 1s ease;
		-ms-transition: all 1s ease;
		-o-transition: all 1s ease;
		transition: all 1s ease;
		z-index: 9999;
		display: block;
	}
	
	div#menubox
	{
		position: relative;
		top: 0px;
		left: 0px;
		margin: 0px;
		padding: 0px;
		height: 100%;
		width: 100%;
		background-color: rgba(0, 0, 0, 0.7);
	}
	
	div#menutab
	{
		float: right;
		width: 42px;
		height: 18px;
		margin-right: -55px;
		margin-top: 16px;
	}
	
	#menutab img
	{
		width: 100%;
	}
	
	div#menucontents
	{
		float: left;
		width: 100%;
		text-align: center;
		padding-top: 20px;
	}
	#menucontents p
	{
		margin: 0px;
		padding: 0px;
		color: #fff;
		font-size: 20px;
		padding-left: 20px;
		padding-right: 0px;
		padding-bottom: 15px;
		line-height: 100%;
		font-weight: normal;
		text-align: left;
	}
	
	#menucontents a
	{
		color: #fff;
		text-decoration: none;
	}
	#menucontents a#chosenpage
	{
		color: #ccc;
	}
	#menucontents a:hover
	{
		color: #ccc;
	}
	
	div#leftlinks
	{
		position: static;
		top: auto;
		left: auto;
		margin: 0px;
		padding: 0px;
		line-height: 100%;
		float: left;
		padding-top: 10px;
	}
	
	div#rightlinks
	{
		position: static;
		top: auto;
		right: auto;
		margin: 0px;
		padding: 0px;
		line-height: 100%;
		float: right;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	div#toplinks
	{
		float: left;
		width: 100%;
		border-top: 1px solid #666;
		border-bottom: 1px solid #666;
		padding-top: 0px;
		padding-bottom: 0px;
	}
}

/*----------------------------------------
 750px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:750px)
{
	#mainmenu p
	{
		font-size: 14px;
	}
}
/*----------------------------------------
 688px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:688px)
{
	#mainmenu p
	{
		font-size: 12px;
	}
}

/*----------------------------------------
 497px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:497px)
{
	div#leftlinks
	{
		width: 100%;
	}
	div#rightlinks
	{
		width: 100%;
	}
	#rightlinks a
	{
		margin-left: 0px;
		margin-right: 10px;
	}
}

/*----------------------------------------
 400px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:400px)
{
	div#baseleft
	{
		float: left;
		margin: 0px;
		padding-left: 2%;
		padding-right: 2%;
		width: 96%;
		padding-top: 40px;
		padding-bottom: 20px;
	}
	
	#baseleft p
	{
		text-align: center;
	}

	div#baseright
	{
		float: left;
		margin: 0px;
		padding-left: 2%;
		padding-right: 2%;
		width: 96%;
		padding-top: 20px;
		padding-bottom: 40px;
	}
	#baseright p
	{
		text-align: center;
	}

	p#baseimage
	{
		position: static;
		top: auto;
		left: auto;
		width: auto;
		margin: 0px;
		padding: 0px;
		float: left;
		padding-left: 50%;
		margin-left: -74px;
	}
	
	#baseimage img
	{
		width: 148px;
		text-align: center;
	}
}

/*----------------------------------------
 672px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:672px)
{
	#title a
	{
		font-size: 27px;
	}
}

/*----------------------------------------
 612px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:612px)
{
	h1#title
	{
		text-align: center;
		line-height: 100%;
		z-index: 999;
		margin: 0px;
		
	}
	div.largecontents
	{
		padding-left: 14px;
		padding-right: 14px;
		width: auto;
	}
	
	div.logoleft
	{
		float: left;
		width: 90%;
		padding-left: 5%;
	}
	
	div.logoright
	{
		float: right;
		width: 90%;
		padding-right: 5%;
	}
	
	div#mainmenu
	{
		display: none;
	}
	
	div#menuboxlocation
	{
		position: absolute;
		top: 0px;
		left: -200px;
		margin: 0px;
		padding: 0px;
		height: 100%;
		z-index: 1002;
		width: 200px;
		-webkit-transition: all 1s ease;
		-moz-transition: all 1s ease;
		-ms-transition: all 1s ease;
		-o-transition: all 1s ease;
		transition: all 1s ease;
		z-index: 9999;
		display: block;
	}
	
	div#menubox
	{
		position: relative;
		top: 0px;
		left: 0px;
		margin: 0px;
		padding: 0px;
		height: 100%;
		width: 100%;
		background-color: rgba(0, 0, 0, 0.7);
	}
	
	div#menutab
	{
		float: right;
		width: 42px;
		height: 18px;
		margin-right: -55px;
		margin-top: 16px;
	}
	
	#menutab img
	{
		width: 100%;
	}
	
	div#menucontents
	{
		float: left;
		width: 100%;
		text-align: center;
		padding-top: 20px;
	}
	#menucontents p
	{
		margin: 0px;
		padding: 0px;
		color: #fff;
		font-size: 20px;
		padding-left: 20px;
		padding-right: 0px;
		padding-bottom: 15px;
		line-height: 100%;
		font-weight: normal;
		text-align: left;
	}
	
	#menucontents a
	{
		color: #fff;
		text-decoration: none;
	}
	#menucontents a#chosenpage
	{
		color: #ccc;
	}
	#menucontents a:hover
	{
		color: #ccc;
	}
	
	div#leftlinks
	{
		position: static;
		top: auto;
		left: auto;
		margin: 0px;
		padding: 0px;
		line-height: 100%;
		float: left;
		padding-top: 10px;
	}
	
	div#rightlinks
	{
		position: static;
		top: auto;
		right: auto;
		margin: 0px;
		padding: 0px;
		line-height: 100%;
		float: right;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	div#toplinks
	{
		float: left;
		width: 100%;
		border-top: 1px solid #666;
		border-bottom: 1px solid #666;
		padding-top: 0px;
		padding-bottom: 0px;
	}
}

/*----------------------------------------
 606px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:606px)
{
	div.leftcontents
	{
		width: 100%;
	}
	div.rightcontents
	{
		width: 100%;
		padding-left: 0px;
		margin-bottom: 30px;
	}
	div.leftmediumcontents
	{
		width: 100%;
		padding-right: 0px;
		margin-bottom: 30px;
	}
}

/*----------------------------------------
 533px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:533px)
{
	div.smallcolumnslogos
	{
		width: 48%;
		padding-right: 1%;
		padding-bottom: 30px;
	}
	div.smallcolumns
	{
		float: left;
		width: 100%;
		padding-right: 0%;
		padding-bottom: 30px;
	}
	div.mediumcolumns
	{
		float: left;
		width: 100%;
		padding-right: 0%;
		padding-bottom: 30px;
	}
}


/*----------------------------------------
 434px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:434px)
{
	h1#title
	{
		text-align: right;
		
	}
	#title a
	{
		font-size: 23px;
	}
	#fullcontents p
	{
		text-align: left;
	}
}

/*----------------------------------------
 420px breakpoint (smaller desktop / laptops)
----------------------------------------*/
@media screen and (max-width:420px)
{
	#leftlinks p
	{
		text-align: center;
	}
	div#rightlinks
	{
		width: 100%;
	}
	#rightlinks p
	{
		text-align: center;
	}
	#rightlinks a
	{
		float: none;
		display: inline-block;
	}
}