/* CSS Document */

	html {
		background:url(images/bg-3.jpg) no-repeat center center fixed;
		background-size:cover;
		-webkit-background-size: cover;
 		-moz-background-size: cover;
 		-o-background-size: cover;
		font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
		min-height:100%;
	}
	nav {
		position:absolute;
		right:10%;
		top:15%;
		width:36%;
		font-size:1.35em;
		text-align:right;
	}
	nav div {
		float:left;
		margin-right:30px;	
	}
	nav div.last {
		margin-right:0;
	}
	nav a {
		color:#ffd5ac;	
		text-decoration:none;
	}
	nav a:hover {
		color:#d86a00;
	}
	li { margin:0.75em 0 }
	#blackcover {
		position:fixed;
		top:0px;
		left:0px	;
		width:100%;
		height:100%;
		background:rgba(0,0,0,0.5);	
		z-index:2;
		display:none;
	}
	section {
		position:absolute;
		background:rgba(255,255,215,0.8);
		border-radius:16px;
		border: 1px solid rgba(255,120,50,0.5);
		padding:4%;
		width:56%;
		left:16%;
		height:56%;
		top:16%;
		z-index:3;
		overflow:auto;
		display:none;
	}
	.closeBtn {
		position:absolute;
		top:16px;
		right:16px;
		cursor:pointer;
		font-size:1.5em;
		color:#666;
	}
	h1 {
		margin:0;
		padding:0;	
		color:#4700DD;
	}
	h3 { 
		color:#4700DD; 
	}
	p {
		color:333;
	}
	audio {
		width:100%;	
	}
	
	#photos a {
		float:left;
		width:33%;
		text-align:center;
		margin-top: 1.25em;
	}
	
	#photos img {
		width:94%;
		border-radius:4px;
		border:1px solid #999;
	}
	
	.message { font-size:1em; font-style:italic; margin-bottom:2em; }
	.messageName { color:#900000; text-align:left; margin-bottom:0.5em; }
	#output { margin-top:1.5em; }
	#guestbookForm { display:none; }
	
	.textField { 
		margin-bottom:1em; 
		float:left;
		width:33%;
	}
	.textField input {
		padding: 0.25em;
		font-size: 1.0em;
		border-radius:4px;
		border:2px solid #ccc;
		width:85%;
	}
	.security input {
		padding: 0.25em;
		font-size: 1.0em;
		border-radius:4px;
		border:2px solid #ccc;
		width:33%;
	}
	.textArea textarea {
		padding: 0.5em;
		font-size: 1.0em;
		width:94%;
		height: 6em;
		border-radius:4px;
		border:2px solid #ccc;
		margin-bottom:1em;
	}
	.clear { clear:both; }
	
	.leftPane { width:74%; float:left; }
	.rightPane { float:left; width:20%; margin-left:5%; }
	
@media screen and (max-width: 480px) {
	html {
		background:url(images/bg-3-sm.jpg) no-repeat center center fixed;
		background-size:cover;
		-webkit-background-size: cover;
 		-moz-background-size: cover;
 		-o-background-size: cover;
		font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
		min-height:100%;
	}
	section {
		padding:4%;
		width:88%;
		left:2%;
		height:88%;
		top:2%;
	}
	.textField {
		width:100%;
	}
	.textField input {
		width:92%;
	}
	
	.leftPane { width:100%; }
	.rightPane { width:100%; margin-left:0%; }
}