@charset "utf-8";

body {
	font-size:100%;
	font-family: Helvetica,sans-serif;
	background-color:#fff;
	color:#333333;
	line-height:140%;
	margin:0;
	}

article { position:relative; }

h1, h2, h3, h4, h5 {
	color:#333333;
	font-weight:normal;
	}

h1 {
	margin-top:1em;
	margin-bottom:.5em;
	font-size:130%;
	line-height:110%;
	}
	
h2 {
	font-size:120%;
	margin-top:1.2em;
	margin-bottom:.5em;
	}

h3 {
	font-size:115%;
	margin-top:1.2em;
	margin-bottom:.5em;
	}	

p {
	font-size:100%;
	margin-top:1em;
	margin-bottom:.5em;
	}

a {
	text-decoration: none;
	color:#999999;
	font-weight:normal;
	}

img, a img { 
	border:none;
	outline:none;
	max-width:100%;
	}

/* Begin Friday Photo Section */

.social-media-buttons {
    margin:18px auto 0 auto;
    display:table;
    }
a.friday-photo-link {
	text-decoration:none;
	boder:none;
	outline:none;
	color:#336699;
	font-weight:bold;
	}

.friday-photo-image-container {
	height:135px;
    background-color:transparent;
	}

.friday-photo-index-content {
	text-align:center;
	max-width:900px;
	margin-left:auto;
	margin-right:auto;
	background-color:transparent;
	}

.friday-photo-index-info-box {
	display:inline-block;
    width:200px;
	height:300px;
	border:1px solid #ccc; /* For no border, change color to transparent so content dimensions don't shift. */
	border-radius: .5em;
	padding:1em;
	margin:1em;
	background-color:white;
	overflow:auto;
	vertical-align:top;
	}

.next-previous-container {
    margin-top:1em;
	margin-bottom:.5em;
    max-width:420px;
    position:relative;
    margin-left:auto;
    margin-right:auto;
    font-size:130%; 
	line-height:110%;
}
.next-previous-container .link-container {
    position:absolute; 
    font-size:1.5em; 
    top:-3px;
}
.next-previous-container .left { left:0; }
.next-previous-container .right { right:0; }
.next-previous-container .link-characters { color:#cccccc; }

/* End Friday Photo Section */


select, textarea, input[type="submit"], input[type="button"], input[type="text"], input[type="password"] {
	box-sizing:border-box;
	width:100%;
	}

select, textarea, input[type="text"], input[type="password"] {
	border:1px solid #999;
	border-radius:3pt;
	padding:3pt;
	font-size:1em;
	font-family:sans-serif;
	}

.nowrap { white-space:nowrap; }
.bold { font-weight:bold; }
.italic { font-style:italic; }
.underline { text-decoration:underline; }
.normal { font-weight:normal; font-style:normal; text-decoration:none; }
.center { text-align:center }
.small {font-size:70%;}

#header {
	height:67px;
	width:100%;
	background-color:#ffffff;
	box-sizing:border-box;
	}
#header #logoimagediv {
	padding-left:20px;
	padding-top:16px;
	box-sizing:border-box;
	font-family:Helvetica,sans-serif; 
	font-size:160%; 
	font-weight:normal;
	color:#999999;
	border-bottom:1px solid #efefef; 
	padding-bottom:8px;
	}
/*
#header .logoimage {
	width:475px;
	height:auto;
	}
*/
#header #burgerimagediv {
	position:absolute;
	right:20px;
	top:10px;
	}
#header .burgerimage {
	width:42px;
	height:auto;
	}
#burger-menu {
	position:absolute;
	font-size:85%;
	top:4px;
	right:4px;
/*	background-color:#87ceeb; /* skyblue */
	background-color:#fff;
	border:1px solid #999999;
	padding:.8em 0 .8em 0;
	z-index:99;
	}
#burger-menu .burger-link-div { margin-bottom:.25em; padding:0 1em 0 1em; white-space:nowrap; }
#burger-menu .burger-link-level1 { border-left:3px solid #999999; margin:0 0 0 1em; padding:.25em 1em .25em .25em; line-height:140%; white-space:nowrap; }
#burger-menu .burger-link-level2 { margin:.25em 0 .25em 0; padding:0 1em 0 2em; white-space:nowrap; }
#burger-menu .burger-link-text { color:#999999; }
#burger-menu hr { border-color:initial; }

#footer { 
	margin:1em auto 2em auto;
	text-align:center;
	font-size:70%;
	}
#footer-copyright { 
	margin:.25em auto .25em auto;
	text-align:left;
	
	line-height:105%;
	display:table;
	}



/* Index page */
.index-content-section {
	max-width:900px;
	margin:0 auto;
	text-align:center;
	vertical-align:top;
	background-color:transparent;
	}

.index-content-box {
	background-color:transparent;
	width:150px;
	height:240px;
	margin:10px;
	text-align:center;
	vertical-align:top;
	display:inline-block;
	}
.index-content-box .thumbnail-image {
	width:150px;
	height:200px;
	border-radius: 6px;	
	}
.index-content-box .under-album-image-title {
	font-size:.9em;
	font-weight:bold;
	line-height:110%;
	}





/* Photos in photo albums */
/* Centered-images template */
.album-photo {
	max-width:100%;
	height:auto;
	border-radius: 6px;
	}
/* Float left-images template */
.album-float-photo {
	max-width:100%;
	height:auto;
	border-radius: 6px;
	}




/* Album pages with centered images */
.album-content-section {
	text-align:center;
	background-color:transparent;
	}

.album-introduction {
	max-width:500px;
	padding:10px;
	text-align:left;
	margin:0 auto;
	background-color:transparent;
	}

.album-photo-with-caption {
	background-color:transparent;
	margin:15px;
	text-align:center;
	display:inline-block;
	vertical-align:top;
	}

/* Text div that may have float:left images */
.text-content-within-album {
	max-width:600px;
	margin:0 auto;
	padding:0 1em 0 1em;
	text-align:left;
	}

/* Float:left image */
.float-left-image {
	float:left;
	width:50%;
	margin-right:10px;
	margin-bottom:5px;
	min-width:50px;
	max-width:250px;
	}

/* Float:right image */
.float-right-image {
	float:right;
	width:50%;
	margin-left:10px;
	margin-bottom:5px;
	min-width:50px;
	max-width:250px;
	}
	
	
	
	

.album-photo-with-caption p {
	margin:0;
	line-height:120%;
	}


/* Album pages with float:left images */
.album-image-float-with-caption { 
	text-align:center; 
	padding:9pt; 
	margin:12pt; 
	box-sizing:border-box; 
	float:left; 
 }
.album-image-float-with-caption p {
	margin:0;
	line-height:120%;
	}


/* For pull quotes */

.pq {
	max-width:400px;
	margin:5px auto 10px auto; 
	padding:7px 10px 2px 10px;
	background:#efefef;
	border:none;
	border-radius:10px;
/* 	box-shadow:0px 0px 2px 1px #ddd;  */
	text-align:center;
	}

.pq-text {

	}

.pq-image {
	margin:3px 0px 3px 0px;
	white-space:nowrap;
	}


/* For mouseover of "From a Distance" */
#mouseover_message_box {
   display:none;
   position:absolute;
   left:25%;
   top:35%;
   background-color:#fff;
   border:1px solid #999;
   color:#000;
   padding:10px;
   max-width:200px;
   opacity:0.5;
   }



/* For responsive */

@media screen and ( max-width:870px )
{
	.album-photo-with-caption
	{
		display:block;
		margin-left:auto; 
		margin-right:auto;
	}
}

@media screen and ( max-width:570px )
{
	h1 {
		font-size:160%;
		}
} /* 570px */


@media screen and ( max-width:480px )
{
	h1 {
		font-size:140%;
		}
} /* 480px */


@media screen and ( max-width:420px )
{
	h1 {
		font-size:120%;
		}
	#header #logoimagediv {
		padding-top:10px;
		font-size:120%;
		}
	#header #burgerimagediv {
		right:12px;
		top:11px;
		}
	#header .burgerimage {
		width:27px;
		}
} /* 420px */