/* ============================== */
/* ! Layout for desktop version   */
/* ============================== */

/*HEADER*/
div.header{background-image: url(../homepageimages/newheaderimage.png);}
div.header a {display:block; margin-top:60px; font-family: "futura-pt-bold", sans-serif;font-weight: 700;font-style: normal; text-align: center; color:#9FAFCE; text-decoration: none; font-size: 23px;}
div.header a.logo{margin-top:8px;}
div.header a:hover {color:white;}

/*CONTENT*/
div.content {background:url( "../aboutmeimages/newbackground-for-site2.jpg");}
div.content.home {background:url(../homepageimages/coverphoto-02.png) top center no-repeat;background-size: 100%; padding-bottom:60px;clear:both;}
div.home p { font-family: "futura-pt-bold", sans-serif;font-weight: 700;font-style: normal; color:#9FAFCE; font-size:80px; text-align: center; margin-top:70px;text-shadow: 0 0 10px #000;}
a.CTA {background:rgba(159,175,206);font-family: "futura-pt", sans-serif;font-weight: 500;font-style: normal; padding: 10px 12px; border-radius: 12px; color:#233D78; display:block; width:325px; margin:0 auto; text-align: center; font-size: 30px; text-decoration: none;}
a.CTA:hover{color:white;}

/***ABOUTME***/
#about {font-family:"futura-pt-bold", sans-serif;font-style: normal;color:#9FAFCE; font-size:25px;margin-top:90px; margin-bottom: 90px}
#TristansHistory {font-family: "futura-pt medium", sans-serif;font-weight: 500;font-style: normal;color:#9FAFCE; font-size:25px; margin-top:250px;}
#tristanslonacher {}

/***MYWORK***/
#gallerytext {font-family: "futura-pt medium", sans-serif;font-weight: 500;font-style: normal;;color:#9FAFCE;font-size:25px;margin-top: 20px;}
h2 {margin-top:50px; margin-bottom:50px; color:#9FAFCE;font-family: "futura-pt-bold", sans-serif;font-weight: 700;font-style: normal;}




/****CONTACTME***/
#contactmeinfo {font-family: "futura-pt medium", sans-serif;font-weight: 700;font-style: normal;color:#9FAFCE; font-size:30px;margin-top:180px;}
#tristans {width: 30%; height: 30%; margin-bottom:50px; float: left}
#workavil {font-family: "futura-pt-medium", sans-serif;font-weight: 700;font-style: normal;color:#9FAFCE; font-size:30px;margin-top:20px}
#reasontocontact {font-family: "futura-pt-medium", sans-serif;font-weight: 700;font-style: normal;color:#9FAFCE; font-size:30px;margin-top:20px;;}


/***OFF-Canvas Nav***/
div.mobile {display:none;}
div.mobile span {color:black;}
.overlay {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(242,234,227);
  overflow-x: hidden;
  transition: 0.5s;
}

.overlay-content {
  position: relative;
  top: 25%;
  width: 100%;
  text-align: center;
  margin-top: 30px;
}

.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 36px;
  color: black;
  display: block;
  transition: 0.3s;
}

.overlay a:hover, .overlay a:focus {
  color: white;
}

.overlay .closebtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 60px;
}

@media screen and (max-height: 450px) {
  .overlay a {font-size: 20px}
  .overlay .closebtn {
  font-size: 40px;
  top: 15px;
  right: 35px;
  }
}
	

/*FOOTER*/
div.footer{background-image: url(../homepageimages/newfooterimage.png);height:270px; }
div.footer div.fourcol {font-family: "futura-pt-bold", sans-serif;font-weight: 700; font-style: normal; color:#9FAFCE; margin-top:-70px; margin-left:500px; font-size:25px; }
div.footer div.onecol {margin-top:90px;}
div.footer  {white-space: nowrap;}


/* ============================= */
/* ! Layout for mobile version   */
/* ============================= */

@media handheld, only screen and (max-width: 767px) {
	
div.mobile {display:block; text-align: center;margin-top: 20px;}
div.desktop {display:none;}	
	p.content {line-height:80px;}
	div.content.home {background-size:cover;}
	div.footer div.onecol {float:left; margin :0; width:25%;text-align: center; margin-top: 5px;}
	div.content {background-size:cover;}
	#tristanslonacher {width: 90%; height: 90%;}
	#TristansHistory {margin-top:40px;margin-bottom:50px;}
	#contactmeinfo {margin-bottom:100px;line-height:40px; font-size:20px;}
	#about {margin-top:20px;}
	#tristans {height:350px;width:250px;}

}

/* ========================================== */
/* ! Provide higher res assets for iPhone 4   */
/* ========================================== */

@media only screen and (-webkit-min-device-pixel-ratio: 2) { 

/*	.logo {
		background: url(logo2x.jpg) no-repeat;
		background-size: 212px 303px;
	}*/

}