/*
 * [LorenHa.com]
 * CSS Styles
 * Questions? Email contact@lorenha.com
 * Grid layout (1140.css & ie.css) based on Andy Taylor's 1140px Grid @ http://cssgrid.net
 *
 */

/* ===============================================================================================
	TAGS
=================================================================================================*/
	
	body {
		font-family: 'Noto Sans', "Helvetica Neue", sans-serif;
		font-weight: 300;
		font-size: 16px;
		background-color: #FFFFFF;
		color: #FFFFFF;
	}

	header {
		text-align: center;
	}

	a, a:visited {
		text-transform: none;
		text-decoration: none;
		color: #a01e21;
		transition: color 0.1s linear;
		-webkit-transition: color 0.1s linear;
		-moz-transition: color 0.1s linear;
		-o-transition: color 0.1s linear;
	}

		a:hover {
			color: #FFF;
		}

	footer {
		font-family: 'Noto Sans', "Helvetica Neue", sans-serif;
		font-size: 12px;
		color: #858889;
		text-align: center;
		margin: 0px;
		padding: 0px 0px 0px 0px;	
	}

/* ===============================================================================================
	CLASSES
=================================================================================================*/

	.empty {
		text-align: right;
		padding: 20px;
		margin-left: 100px;
		font-family: 'Istok Web', sans-serif;
		font-weight: 400;
		color: #FFFFFF;
	}

	.homecontent {
		text-align: center;
		margin: 200px 100px 200px 0px;
	}

	.contactcontent {
		text-align: left;
		margin: 50px 50px 250px 0px;
	}

	.contactme p {
		font-family: 'Noto Sans', "Helvetica Neue", sans-serif;
		font-weight: 700;
		font-size: 60px;
		color: #000;
	}

	.undercontactme p {
		font-family: 'Istok Web', sans-serif;
		font-weight: 400;
		font-size: 30px;
		color: #a01e21;
	}

	.homecontent p, .contactcontent p {
		padding: 10px;
	}
	
	.home {
		transition: background 0.5s ease-in-out;
		-webkit-transition: background 0.5s ease-in-out;
		-moz-transition: background 0.5s ease-in-out;
		-o-transition: background 0.5s ease-in-out;
		background-image: url("../assets/home-gray.jpg");
		background-repeat: no-repeat;
		background-position: center;
		background-color: #BBBBBB;
		margin: 0px;
		padding: 20px;
		width: auto;
	}

	.home:hover {
		background-image: url("../assets/home.jpg");
		background-repeat: no-repeat;
		background-position: center;
	}

	.contact {
		transition: background 0.5s ease-in-out;
		-webkit-transition: background 0.5s ease-in-out;
		-moz-transition: background 0.5s ease-in-out;
		-o-transition: background 0.5s ease-in-out;
		background-image: url("../assets/contact.jpg");
		background-repeat: no-repeat;
		background-position: center;
		background-color: #BBBBBB;
		margin: 0px;
		padding: 20px;
		width: auto;
	}

	.contact:hover {
		background-image: url("../assets/contact.jpg");
		background-repeat: no-repeat;
		background-position: center;
	}

	.about {
		transition: background 0.7s ease-in-out;
		-webkit-transition: background 0.7s ease-in-out;
		-moz-transition: background 0.7s ease-in-out;
		-o-transition: background 0.7s ease-in-out;
		background-image: url("../assets/mountain-gray.jpg");
		background-repeat: no-repeat;
		background-position: bottom;
		background-color: #BBBBBB;
		margin: 0px;
		padding-top: 80px;
		padding-bottom: 80px;
	}

	.about:hover {
		background-image: url("../assets/mountain.jpg");
		background-repeat: no-repeat;
		background-position: top;
	}

	.photoright p {
		font-family: 'Noto Sans', "Helvetica Neue", sans-serif;
		font-weight: 700;
		font-size: 60px;
		padding: 200px;
	}

	.photo1, .photo2, .photo3, .photo4, .photo5, .photo6 {
		transition: background 1s ease-in-out;
		-webkit-transition: background 1s ease-in-out;
		-moz-transition: background 1s ease-in-out;
		-o-transition: background 1s ease-in-out;
		background-repeat: no-repeat;
		background-position: center;
		background-color: #BBBBBB;
		margin-left: 0px;
		padding: 40px 0px 40px 0px;
	}

	.photo1:hover, .photo2:hover, .photo3:hover, .photo4:hover, .photo5:hover, .photo6:hover {
		background-repeat: no-repeat;
		background-position: center;
	}

	.photo1 {
		background-image: url("../assets/golf-gray.jpg");
	}

	.photo1:hover {
		background-image: url("../assets/golf.jpg");
	}

	.photo2 {
		background-image: url("../assets/night-gray.jpg");
	}

	.photo2:hover {
		background-image: url("../assets/night.jpg");
	}

	.photo3 {
		background-image: url("../assets/sports-gray.jpg");
	}

	.photo3:hover {
		background-image: url("../assets/sports.jpg");
	}

	.photo4 {
		background-image: url("../assets/wildlife-gray.jpg");
	}

	.photo4:hover {
		background-image: url("../assets/wildlife.jpg");
	}

	.photo5 {
		background-image: url("../assets/airport-gray.jpg");
	}

	.photo5:hover {
		background-image: url("../assets/airport.jpg");
	}

	.photo6 {
		background-image: url("../assets/scenic-gray.jpg");
	}

	.photo6:hover {
		background-image: url("../assets/scenic.jpg");
	}

	.white {
		background-color: #FFF;
		margin: 0px;
		padding: 20px;
		width: auto;
	}

	.nav {
		background-color: #a01e21;
	}

	.nav p, .nav a {
		line-height: 40px;
		text-align: center;
		font-size: 18px;
		color: #FFF;
		font-family: 'Istok Web', sans-serif;
		font-weight: 300;
	}

		.nav a:hover {
			color: #CCCCCC;
			transition: color 0.1s linear;
			-webkit-transition: color 0.1s linear;
			-moz-transition: color 0.1s linear;
			-o-transition: color 0.1s linear;
		}

	.aboutright {
		margin-top: 50px;
		color: #FFFFFF;
	}

	.photo1right {
		margin-top: 10px;
	}

	.errorcontent {
		text-align: center;
		margin: 100px 100px 100px 0px;
	}

/* ===============================================================================================
	IDs
=================================================================================================*/

	#greeting {
		display: block;
		text-align: center;
		color: #BBBBBB;
		margin: 0px;
		padding: 60px 0px 0px 0px;
	}

	#banner {
		margin: 20px 50px 0px 50px;
		position: center;
	}

	#hello {
		font-family: 'Noto Sans', "Helvetica Neue", sans-serif;
		font-weight: 700;
		font-size: 60px;
	}

	#underhello {
		font-family: 'Istok Web', sans-serif;
		font-weight: 400;
		font-size: 30px;
	}

/* ===============================================================================================
	Mobile
=================================================================================================*/

@media handheld, only screen and (max-width: 767px) {

	.home {
		background-image: url("../assets/home.jpg");
		background-repeat: no-repeat;
		background-position: center;
		background-color: #BBBBBB;
	}

	.about {
		background-image: url("../assets/mountain.jpg");
		background-repeat: no-repeat;
		background-position: top;
		background-color: #BBBBBB;
		margin: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
	}

		.about p {
			color: #FFFFFF;
			text-align: left;
			padding: 0px;
			margin: 0px;
		}

	.aboutright {
		display: none;
	}

	.photoright {
		margin: -150px;
	}

		.photoright p {
		font-size: 40px;
		}

	.photo1 {
		background-image: url("../assets/golf.jpg");
	}

	.photo2 {
		background-image: url("../assets/night.jpg");
	}

	.photo3 {
		background-image: url("../assets/sports.jpg");
	}

	.photo4 {
		background-image: url("../assets/wildlife.jpg");
	}

	.photo5 {
		background-image: url("../assets/airport.jpg");
	}

	.photo6 {
		background-image: url("../assets/scenic.jpg");
	}

	.contactcontent {
		padding: 0px;
		margin: 20px;
	}

	.contactcontent p {
		font-size: 30px
	}

	.contactme p {
		color: #EEEEEE;
	}

	.undercontactme p {
		font-size: 20px;
	}

	.empty {
		padding: 50px 10px 50px 10px;
		margin-left: 0px;
	}

	#underhello {
		visibility: hidden;
	}

}

/* ===============================================================================================
	RESERVED
=================================================================================================*/

/*
	.transparency {  
		color: #fff;
	    opacity:0.5;  
	     filter:alpha(opacity=50);  
	     -moz-opacity:0.5;  
	    background-color: #000;   
	}

*/