@charset "utf-8";
/* CSS Document */

/* ---------- Basic Elements ---------- */
html,
body {
	margin:0;
	padding:0;
	height: 100%; /* this attribute required for sticky footer - ryan fait */
	text-align:center;
	font-family: Arial, Helvetica, sans-serif;
	background-image: url(../Images/site_wide/background_gingham.png);
	background-repeat: repeat;
}
.wrapper { /* wrapper contains everything EXCEPT THE FOOTER - ryan fait */
	height: auto !important;
	height: 100%;
	margin: 0 auto -100px; /* the bottom margin is the negative value of the footer's height */
	min-height: 100%;
}
#container { /* -- contains top horiz nav bar, right & left vert nav columns and content. Keeps it all smushed together. DOES NOT CONTAIN HEADER OR FOOTER ELEMENTS -- */
	margin: auto;
	width: 900px;
}
#content { /* -- contains all the page content inside the box with the white background -- */
	background-image: url(../Images/site_wide/background_content.png);
	background-repeat: repeat;
	border: medium solid #6D7783;
	border-radius: 100px;
	color: #000;
	margin: auto;
	padding-top: 20px;
	padding-right: 30px;
	padding-bottom: 30px;
	padding-left: 30px;
	text-align: left;
	width: 575px;
}	
/* ---------- Header ---------- */
#header {
	background-image: url(../Images/site_wide/header_background.png);
	background-repeat: repeat;
}
#logo 	{
	height: 228px;
	margin: auto;
	width: 575px;
}
#header_print {
	display: none;	
}
/* ----------- Footer ---------- */
p.last{ /* -- footer text -- */
	font-size: 80%;
	line-height: 1.5em;
	padding-top: 20px;
}
.push {
	height: 100px; /* .push must be the same height as .footer */
}
.footer {
	background-image: url(../Images/site_wide/fixed_footer_background.png);
	background-repeat: repeat;
	height: 100px; /* .push must be the same height as .footer */
}
/* also used in footer: .clearboth - to align totop graphic under content */ 


/* ---------- Text Formatting ---------- */	
p {
	font-size: 93%;
	color: #000;
}
h1 {  /* -- Page headers -- */
	color: #751318;
	font-size: 125%;
	text-align: center;
}
h2 {  /* -- top of sophie slide sets and all sub-titles -- */
	color: #360;
	font-size: 95%;
	text-align: center;
}
h3 {  /* -- bottom of sophie allergy pics -- */
	color: #751318;
	font-size: 95%;
	text-align: center;
}
h4 {  /* -- article identifiers in V.Press pages -- */
	color: #751318;
	font-size: 75%;
	text-align: center;
}
h5 {  /* -- header text in print file -- */
	color:#F60;
	font-size: 250%;
	text-align: left;
}
h6 {  /* --  -- */
	font-size: 100%;
}
/* ol {
	color: #000;
	font-size: 80%;
}
ol ol {
	font-size: 100%;
}
/* ----------------- custom classes -------------------*/
.center {
	text-align:center;
	width: auto;
}
.left {
	text-align:left;	
}
.flickr_links {
	color: #900;
	font-size: 75%;
}
.highlight {
	color:#900
}
.totop,
.slide_text {  /* -- to top links & inserted into pictobrowser Flash stmt --*/
	font-size: 70%;
	font-weight: bold;
	text-align:center;
}
.cited_text,
.caption,
.zip {
	font-size: 85%;
	font-style: italic;
}
.cite_author {
	font-size: 75%;
	font-style: italic;
	color: #333;
	float: right;
	text-align: center;
}
.underline {
	text-decoration: underline;
}

.cite_left {
	font-size: 65%;
	font-style: italic;
	color: #333;
	float: left;
	text-align: left;
}

.cite_right {
	font-size: 65%;
	font-style: italic;
	color: #333;
	float: right;
	text-align: right;
}


/* ------------ horizontal lines ------------- */
hr { /*bg-color & color need to be the same for browser compatibility issues*/
	background-color: #b9c7da;
	border: none;
	color: #b9c7da;
	display: block;
	margin: auto;
	text-align:center;
}
.row_a {  /* -- dividers inside white boxes -- */
	width: 85%;
	height:2px;	
}
.row_b {  /* -- color blocks above slide sets -- */
	width: 550px;
	height: 25px;
}
 /* ---------- default link behavior --------------- */
a:link, a:visited {
	color: #900;
	text-decoration: underline;
}
a:hover {
	color: #F00;
	text-decoration: underline;
}
/* ----------------- background blocks -------------------*/
.background_box_a { /* light blue b/g  */
					/* ---- use for text block backgrounds ---- */
	background-color:#E3E9EE;
	border: thin solid #000;
	border-radius: 15px;
	box-shadow: 3px 2px 5px #888;
	padding: 20px;
}
.background_box_b { /* solid white b/g - centered content */
					/* ---- use for image backgrounds ---- */
	background-color:#FFF;
	border: thin solid #000;
	border-radius: 25px;
	margin: auto;
	text-align: center;
	padding: 10px;
}
.background_box_c { /* patterned b/g */
					/* ---- use for misc backgrounds ---- */
	background-image:url(../Images/site_wide/background_navVertical.png);
	background-repeat: repeat;
	border: thin solid #ddd;
	border-radius: 25px;
}
.navigationVertical div { /* r/l vertical navigation headers */
	background-color: #CCD8E3; /* lt. blue */
	border: 2px solid #000;
	border-radius: 10px;
	font-size: 95%;
	margin: auto;
	padding: 7px;
	text-align: center;
}
/* --liquid column backgrounds -- */
.row1col_full {
	background-color: #E3E9EE;
	border-top: 1px solid #999;
	border-bottom: 1px solid #666;
	float: left;
	font-size: 90%;
	margin-top: 10px;
	margin-left: 2%;
	padding: 0 2% 0;
	width: 90%;
}

.row1col1,
.row1col2 {
	background-color: #E3E9EE;
	border-top: 1px solid #999;
	border-bottom: 1px solid #666;
	float: left;
	font-size: 90%;
	margin-top: 10px;
	margin-left: 2%;
	padding: 0 2% 0;
	width: 43%;
}
.row2col1 {
	background-color: #E3E9EE;
	border-top: 1px solid #999;
	border-bottom: 1px solid #666;
	float: left;
	font-size: 90%;
	margin-top: 10px;
	padding: 0 2% 0;
	width: 60%;
}

.row2col2 {
	background-color: #E3E9EE;
	border-top: 1px solid #999;
	border-bottom: 1px solid #666;
	float: left;
	font-size: 90%;
	margin-top: 10px;
	margin-left: 2%;
	padding: 0 2% 0;
	width: 30%;
}

.row3col1 {
	background-color: #E3E9EE;
	border-top: 1px solid #999;
	border-bottom: 1px solid #666;
	float: left;
	font-size: 90%;
	margin-top: 10px;
	padding: 0 2% 0;
	width: 30%;	
}

.row3col2 {
	background-color: #E3E9EE;
	border-top: 1px solid #999;
	border-bottom: 1px solid #666;
	float: left;
	font-size: 90%;
	margin-top: 10px;
	margin-left: 2%;
	padding: 0 2% 0;
	width: 60%;
}

/* ------------ placement & link handling of images ----------- */
img { /* keeps image links from defaulting to having a border - don't add anything else... */
	/* ...to this tag because it messes with the icons on the Monument Press page */
	border:none;
}
img.monument {
	border: 4px dotted #7A94AC;
}
img.monument:hover {
	border: 4px solid #C00;
}
img.sophie {
	border: 3px dotted #7A94AC;
}
img.sophie:hover {
	border: 3px solid #C00;
}
img.left {
	float: left;
	margin-right: 10px;
}
img.right {
	border: 1px solid #000;
	float: right;
}

/* ------------ top horizontal navigation (home/about/projects/contact)----------- */
#navigationHorizontal {
	margin: auto;
	padding-bottom: 10px;
	padding-top: 10px;
}
#navigationHorizontal ul {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
#navigationHorizontal ul li {
	display: inline;
}
#navigationHorizontal ul li a {
	background-color: #A4B6C6;
	border: 2px solid #2d2d2d;
	border-radius: 5px;
	font-size: 95%;
	margin: 5px;
	padding-top: 5px;
	padding-right: 20px;
	padding-bottom: 5px;
	padding-left: 20px;
	text-decoration: none;
	width: 100px; /*trying to set width but not working....*/
}
#navigationHorizontal ul li a:hover {
	background-color: #CCD8E3;
}
#navigationHorizontal ul li a:link, #navigationHorizontal ul li a:visited {
	color: #000;
}
#navigationHorizontal ul li a.current {
	background-color: #FFF;
}
/* -------------- vertical navigation ------------- */
#NavLeft {
	float: left;
	text-align: left;
}	
#NavRight {
	float: right;
	text-align: right;
}	
.navigationVertical {
	background-image:url(../Images/site_wide/background_navVertical.png);
	border: 2px solid #6D7783;
	border-radius: 20px;
	padding: 15px;
	width: 105px; /* Adjust navVert "ul li a" width: 20 px less than this value... */
}
.navigationVertical ul {
	margin-top: 15px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding: 0px;
}
.navigationVertical ul li {
	list-style-type: none;
}
.navigationVertical ul li a {
	background-color: #A4B6C6;
	border: 1px solid #000;
	border-radius: 8px;
	display: block;
	font-size: 85%;
	margin: 5px;
	padding: 5px;
	text-decoration: none;
	width: 85px;
}
.navigationVertical ul li a:hover {
	background-color: #CCD8E3;
	box-shadow: 0 0 10px 5px #ccd8e3;
}
.navigationVertical ul li a:link, .navigationVertical ul li a:visited {
	color: #000;
}
.navigationVertical ul li a.current {
	background-color: #FFF;
	color: #000;
}

/* -------------- Sophie Thumbnails ------------- */
#SophieThumbs {
	margin: auto;
	width: 900px;
}
.float {
	float: left;
	padding: 10px;
	width: 120px;
}
.float p {
	color: #4F677D;
	font-size: 75%;
	font-weight: bolder;
	text-align: center;
}
.clearboth { /* ryan fait */
	clear: both;
	height: 1px;
	margin: 0 0 -1px;
	width: 100%;	
} 

/* -------------- Monument Press links ------------- */
/* --- need to be specific because all article links are formatted in CSS & HTML --- */
#monumentPress {
	width: 550px; /* monumentPress ul li a{} needs width:20 px LESS than this value... */
	margin:auto;
}
#monumentPress img {
	padding: 2px;
	vertical-align: middle;
}
#monumentPress ul {
	padding: 0px;
}
#monumentPress ul li {
	list-style-type: none;
}
#monumentPress ul li a:hover { /* unvisited - hover */
	background-color: #E3EAF0;
	border: 1px solid #000;
	box-shadow: 3px 3px 5px #000;
}
#monumentPress ul li a { /* unvisited */
	background-color: #CCD8E3;
	box-shadow: 3px 2px 5px #888;
	border: 1px solid #000;
	border-radius: 8px;
	display: block;
	font-size: 70%;
	margin: 5px;
	padding: 5px;
	text-decoration: none;
	width: 530px; /* monumentPress{} needs width: 20px MORE than this value... */
}
#monumentPress ul li a:link {
	color: #000;
}
#monumentPress ul li a:visited:hover { /* visited - hover */
	background-color: #E3EAF0;
	color: #000;
}
#monumentPress ul li a:visited { /* visited */
	background-color: #E3EAF0; 
	color: #333;
}

/* -------------- Monument Photo List link formatting ------------- */
#photoList ul {
	font-size: 85%;
}

#photoList ul li {
	
}


/* -----------Additional Notes--------------- */
/* Sophie's slide shows were generated from https://flickrit.com/index.php  */