/* CSS for Fred Stoll - Perspectives site */

p { font-size: 85%; 
	color: navy; }

h3 {font-family: "Trebuchet MS", Ariel, Helvetica, sans-serif; }

.sub {padding-top: 15px;} /* h3 */
.subp {padding-top: 15px;}  /* p */

h1 { font-family: "Trebuchet MS", Ariel, Helvetica, sans-serif; 
    font-size: x-large;
	background-color: navy;
	color: white; 
	padding-top: 1.1em;
	padding-bottom: 1.1em;
	padding-left: .4em; 
	margin:0; 
	background: DarkGrey url(backgrounds/header-bg.jpg) repeat-y right;  }

h2 { 	font-family: "Trebuchet MS", Ariel, Helvetica, sans-serif;
    font-size: 140%; 
	font-weight: normal; 
	color: navy; 
	padding-top: 10px; 
	margin-top: 0;  }

.subh { margin-left: 5em; 
	font-size: 130%; 
	font-weight: normal; 
	color: brown; 
	padding-top: 15px;}

/* h2, ul { margin-top: 15px; } */ /* Spaces link list from top of cell  */


.fmta { list-style-type: none;  /* ul */
  margin: 0;
  padding: 0;
  overflow: hidden;
  border-bottom: 1px solid #7da5d8 ; 
  background-color: AliceBlue; } 

.fmt1 { float: left;   /* makes the line items lign up left to right */  /* li */
	font-size: small; 
	list-style-type: none; }  /* or bullet (default), circle, square, disk, none  */

.fmt1b { font-size: small; 
	list-style-type: none; }

.fmtb { list-style-type: none;   /* ul */
  margin: 0;
  padding: 0;
  overflow: hidden;
  border-bottom: 1px white ; 
  background-color: white;  }

.fmt2 { float: none;  /* li */
	font-size: 85%; 
	/* color: blue; */
	color: #0000FF;
	list-style-type: none; }

.fmtc { list-style-type: none;  /* ul */
  margin: 6px;
  /*overflow: hidden; */
  border-bottom: 1px white ; 
  background-color: white;  }

.fmt3 { float: none;  /* li */
	font-size: 85%; 
	list-style-type: none;	
	padding: 4px 16px;	
	}

.datelable {  font-weight: normal;  color: grey;  }

li a {   display: inline-block;
	/* color: white; */
	text-align: center;
	padding: 8px 16px;
	text-decoration: none;  }

li a:hover { background-color: LightSkyBlue; 
	color: blue;  }

body { font-family: Verdana, Helvetica, Arial, sans-serif; 
	background-color: WhiteSmoke; 
	line-height: 125%; /* increase line spacing */
	padding: 0;
	margin: 0; }

/* em { text-transform: uppercase;  } */ /*  to modify the defauly emphasis style */  

#tagline p { font-size: 100%; 
	font-style: italic;
	font-family: Georgia, Times, serif;
	/* background-color: #bed8f3; */
	border-top: 1px solid #7da5d8 ;
	border-bottom: 1px solid #7da5d8 ; 
	padding-top: .6em;
	padding-bottom: .6em;
	padding-left: .8em; 
	margin: 0;
	background: WhiteSmoke url(backgrounds/tagline-fade.jpg) repeat-y right
	 } 

a {  /*font-weight: bold; */
	color: black; }  /* Format embedded links */

/* #navigation { width: 192px;
	height: 484px;
	background: #7da5d8 url(backgrounds/joshua.jpg) no-repeat;  } */ 
/* applies to navigation links */

a:link { color: blue;  /* color: black; */ }

a:visited { color: purple; /* color: navy; */}

a:hover { color: white;
	text-decoration: none;
	background-color: navy;  }
a:active {color: aqua;
	background-color: navy;  }

#header { border-top: 2px solid #7da5d8; }

/* CLASS STYLE RULE for class callse "fun"  */
.fun { color: #339999;
	font-family: Georgia, Times, serif;
	letter-spacing: 0.05em;  }
.fun p { color: #339999; }  /* to override the earlier "p" color when using a class rule */

.subhead { padding-left: 1em; 
	font-size: 140%; 
	font-weight: normal; 
	color: navy; 
	padding-top: 20px;}

.subhead p { padding-left: 1em; 
	font-size: 140%; 
	font-weight: normal; 
	color: navy; 
	padding-top: 20px;}

/*#header, #sitebranding, #tagline, #navigation, #bodycontent  {
	border: 1px solid red;
	padding: 2px;
	margin-bottom: 2px;  } */  /* Temporary block borders for composing */

/* #header, #navigation, #bodycontent { position: absolute; }  */

#header { width: 100%; } /* (Includes sitebranding and tagline) */

/* #navigation, #bodycontent { top: 125px; } */

#bodycontent { position: absolute; left: 2px; } 
#bodycontent2 { position: absolute; left: 0; } 

#bodycontent { top: 150px; }
#bodycontent2 { top: 0; left: 0; }

#navigation { left: 2px; }

.feature { float: right; margin-right: 10px; margin-left: 10px; margin-bottom: 10px; margin-top: 50px; }   /* applies to picture */

.feature2 {float: left; margin-right: 10px; margin-left: 10px; margin-bottom: 10px; margin-top: 10px; }   

.feature3 { float: right; margin-right: 10px; margin-left: 10px; margin-bottom: 10px; margin-top: 10px; }

.borderleft { float: left; margin-right: 20px; margin-bottom: 10px; margin-top: -23px; padding-top: 0;}

.borderright { float: right; margin-left: 20px; margin-bottom: 10px; margin-top: -21px; }

.frameinset { float: right; margin-right: 10px; margin-left: 10px; margin-bottom: 10px; margin-top: 10px; }

.frameinset2 { float: left; margin-right: 10px; margin-left: 10px; margin-bottom: 10px; margin-top: 10px; }

.galleryphoto {
	padding-bottom: 20px;
	border-bottom: 1px solid navy;
	margin-bottom: 10px; }

.galleryphoto img { border: 15px solid white ; }

.galleryphoto p {
	font-size: 65%;
	font-weight: bold;
	margin-top: 0;
	width: 612px;
	line-height: 1.4em;  }

.photocredit {  font-weight: normal;  color: grey;  }

/* #repeatedclouds {
	border: 1px solid black;
	padding: 20px;
	background-color: #aebbdb;
	background-image: url(clouds.jpg);  }    example to use repeated tiling for a background */

table.events { border-collapse: collapse; }

table.events th, table.events td {
	padding: 4px;
	border: 1px solid #000066; }

table.events th { 
	font-size: x-small; 
	text-align: left; 
	background: #241374 url(backgrounds/header-bg-2.jpg);
	color: #ffffff;	
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 2px;
	padding-right: 2px;  }

table.events td { font-size: small; 
	background:#e2edff url(backgrounds/td.jpg) repeat-x top; }

table.events caption { 
	color: #000066;	
	font-size: small; 
	text-align: left; 
	padding-bottom: 5px;
	font-weight: bold; }