@charset "utf-8";
/* CSS Document */

@media (max-height: 1350px) {
  	#splash-container {
		height:1350px;
	}

	#splash h1 {
		padding-top:550px;
	}

}

@media (max-height: 1080px) {
  	#splash-container {
		height:1080px;
	}

	#splash h1 {
		padding-top:500px;
	}
}

@media (max-height: 1050px) {
  	#splash-container {
		height:1050px;
	}

	#splash h1 {
		padding-top:450px;
	}
}

@media (max-height: 850px) {
  	#splash-container {
		height:850px;
	}

	#splash h1 {
		padding-top:400px;
	}
}


@media (max-height: 768px) {
  	#splash-container {
		height:768px;
	}

	#splash h1 {
		padding-top:350px;
	}
}

* {
	margin:0;padding:0;
}

h1 {
	font-family:Montserrat;
	text-transform: uppercase;
	font-size:60px;
}

h2 {
	font-family:Montserrat;
	font-size:24px;
}

p {
	font-family: Esteban;
	font-size:28px;
}

a {
	text-decoration: none;
	color:inherit;
	border-bottom: dotted 1px #2b4733;
}

html, body {
	height: 100%;
}

#bar {
	width:100%;
	height:80px;
	position:fixed;
	background-color:white;
	opacity:0.75;
	z-index:2;
	min-width:960px;
	border-bottom:#eee 1px solid;
}

#bar ul {
	text-align: center;
	list-style: none;
	padding-left: 50px;
}

#bar ul li {
	display:inline-block;
	vertical-align: middle;
	font-size:18px;
	padding-top: 15px;
}

#bar a {
	border-bottom: none;
}

#bar ul .logo {
	display:inline-block;
	vertical-align: middle;
	font-size:18px;
	padding-top:17px;
	padding-left:30px;
	padding-right:30px;
}

#bar ul li a {
	font-family:'Montserrat';
	text-decoration:none;
	color:inherit;
	text-transform:uppercase;
	padding-left:30px;
	padding-right:30px;
}

#wrap {
	min-height: 100%;
}

#main {
	overflow:auto;
	padding-bottom: 50px; /* must be same height as the footer */
}

/* Top Splash */

#splash-container {
	background-image: url(../img/splash.png);
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	color: white;
}

#splash {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
}

#splash h1 {
	text-align: center;
	font-family:esteban;
	text-transform: none;
	font-size: 32px;
	font-weight: 300;
}

#learn {
	width:259px;
	height:59px;
	background-image: url(../img/learn.png);
	margin-top:15px;
	margin-left:auto;
	margin-right: auto;
}

#learn:hover {
	background-image: url(../img/more.png);
}

#about-container {
	background-color:#2b4733;
	height:100%;
}

#about {
	width: 960px;
	padding-top:200px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom:200px;
}

#about p {
	color:white;
	font-size:24px;
	text-align: justify;
	width:593px;
	font-weight:300;
}

#left-header {
	float:left;
	width:367px;
	text-align:left;it might b
}

#right-content {
	float:right;
	width:593ya
	px;
}

#gallery-container {
	background-image: url(../img/gallery-bg.png);
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	height:100%;
}

#gallery {
	width: 960px;
	padding-top:200px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom:200px;
}

#gallery img {
	opacity:0.8;
	 -webkit-transition: opacity .5s ease-in-out;
        -moz-transition: opacity .5s ease-in-out;
        -ms-transition: opacity .5s ease-in-out;
        -o-transition: opacity .5s ease-in-out;
        transition: opacity .5s ease-in-out;
}

#gallery img:hover {
	opacity:1;
}

#gallery a {
	border:none;
}

#three-col {
	padding-top:50px;
	width:100%;
}

#left {
	float:left;
	width:320px;
}

#right {
	float:right;
	width:320px;
}

#center {
	margin:0 auto;
	width:320px;
}

#contact-container {
	height:100%;
}

#contact {
	width: 960px;
	padding-top:100px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom:100px;
}

#contact h2 {
	color:#2b4733;
}

.contact-text {
	font-family:esteban;
	color:black;
	padding-left:15px;
	font-weight:300;
}

#footer {
	position: relative;
	margin-top: -50px; /* negative value of footer height */
	height: 50px;
	clear:both;
	color:#9b9b9b;
  padding-bottom: 90px;
}

#footer p {
	font-family: montserrat;
	font-size:14px;
}

#footer a {
	color:#2b4733;
}


#footer-width {
	width:960px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding-top:20px;
}

/*Opera Fix*/

body:before {
	content:"";
	height:100%;
	float:left;
	width:0;
	margin-top:-32767px;
}
