/* --COLOR GUIDE:
--BODY LIGHT PINK: #d9d0d8
--BODY DARK PINK: #691473
--CONTENT BACKGROUND, NAV HOVER LIGHT BLUE: #c4cbda
--NAVBAR YOUAREHERE MED BLUE: #aab6d0
--CONTAINER BACKGROUND DARK BLUE: #2e3e58
--CONTAINER BORDER VERY DARK BLUE: #0d1934
--H2 FUSCHIA: #691473
--CAPTION GREY: #666666
*/

/*this makes the center column go top to bottom no matter 
what browser window size is. Theoretically.*/
html{
	height: 100%;}
body {
	height: 100%;}

body
{
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	background: #d9d0d8 url(images/tile2.gif) repeat;
	color: #691473;
	margin: 0px;
	padding: 0px;
	text-align: center;
}

/*following rules will create a "youarehere" 
   effect courtesy of Sonal Patel*/
body#one #navbar li#home a,
body#two #navbar li#about a,
body#three #navbar li#services a,
body#four #navbar li#portfolio a, 
body#five #navbar li#resume a, 
body#six #navbar li#experiments a, 
body#seven #navbar li#contact a
{
font-weight: bold;
color: #aab6d0;
background-color: #2e3e58;
cursor:default;
}

/*---------CENTER WELL W/JELLO---------*/
#container {
	position: relative;
	padding: 25px 25px 15px 25px;
	width: 580px;
	margin: 0px auto;
	border-left: solid 2px #0d1934;
	border-right: solid 2px #0d1934;
	color: inherit;
	background: #2e3e58 url(images/flowers.jpg) left bottom no-repeat fixed;
	height: auto;
	min-height: 880px;
	text-align: left;
	}
	
#container h1
{
	font-family: "Ashley Script", times, serif;
	font-style: italic;
	color: #c7aec4; 
	background: #2e3e58;
	margin: 10px 0 10px 0;
	padding: 0px;
	background-image: url(images/name-trans.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 48px;
}


/*courtesy of zen garden, for hiding text for only IE to see if it ignores the png*/
#container h1>span {display: none;}

/*footer copyright etc*/
#container h6
{
	font-size: 60%;
	font-weight: normal;
	color: white;
	background-color: inherit;
	text-align: center;
	padding: 5px;
	margin: 10px 180px 5px 180px;
	position: static;
	bottom: 5px;
}

/*---------NAVBAR----------*/
	
#navbar {text-align: right; margin: 0 0 0 100px; padding: 0 0 5px 0;}
#navbar ul, #navbar a, #navbar a:visited {
	font-size: 85%;
	color: white; 
	background-color: #2e3e58;
	text-decoration: none;
	vertical-align: top;}

#navbar li {
	padding: 0px 5px 0px 8px; 
	border-left: 1px groove white;
	text-decoration: none;
	display: inline;}

#navbar ul li#home { 
	border: none; }

#navbar li a:hover {color:#c4cbda; background-color: #2e3e58; 
	text-decoration: none;}

/*---------MAIN TEXT AREA--------*/
#content {
	width: 400px;
	margin: 10px auto 0 auto;
	padding: 10px 15px 5px 15px; 
	border: 1px solid white;
	color: inherit;
	background: #c4cbda;
	text-align: center;
	}

/*section heads*/	
#content h2 {
	font-size: 88%;
	font-weight: bold; 
	margin: 5px 0 0 0;
	padding: 0px; 	
	text-align: left;}

/*the following two sets of styles are the same, 
but IE ignores them when listed together. */
#content p {
	font-size: 80%;
	font-weight: normal;
	color: #2e3e58;
	background-color: inherit;
	text-align: left;
	margin: 4px 0 8px 0;
	padding: 0;
	line-height: 125%;}

#content ul {
	font-size: 80%;
	font-weight: normal;
	color: #2e3e58;
	background-color: inherit;
	text-align: left;
	margin: 4px 0 8px 0;
	padding: 0;
	line-height: 125%;}
	
#content ul {
	margin: 4px 15px 8px 15px;}

#content p>img {
	text-align: center; padding: 0; margin: 0;}
	
/*the following four sets of styles are the same, 
but IE ignores them when listed together. */
#content p a:link, #content p a:hover {
	font-size: 100%;
	color: inherit;
	background-color: #c4cbda;
	text-decoration: none;
	border-bottom: 1px dotted #0d1934;}
	
#content p a:visited {
	font-size: 100%;
	color: inherit;
	background-color: #c4cbda;
	text-decoration: none;
	border-bottom: 1px dotted #0d1934;}
	
#content ul li a:link, #content ul li a:hover {
	font-size: 100%;
	color: inherit;
	background-color: #c4cbda;
	text-decoration: none;
	border-bottom: 1px dotted #0d1934;}

#content ul li a:visited  {
	font-size: 100%;
	color: inherit;
	background-color: #c4cbda;
	text-decoration: none;
	border-bottom: 1px dotted #0d1934;}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#content h3, #content h4 {
	text-align: left;
	padding: 0;
	}

#content h3 {
	font-size: 73%;
	margin: 12px 0 6px 0;
	}
	
#content h4 {
	font-size: 68%;
	font-style: italic;
	font-weight: normal;
	color: #2e3e58;
	background-color: inherit;
	margin: 0}
	
/* use for captions?*/
#content h5 {
	font-size: 70%;
	font-weight: normal;
	font-style: italic;
	color: #666666;	
	background-color: inherit;
	text-align: center;
	padding: 0px;
	margin: 5px 15px;}
	
/*this removes the border off images that are links. 
Thanks to google.*/
a img{ text-align: left; border: 0; }
img{ padding: 5px 1px; border: 0;}  
b {text-align: left;}

/*-- For Forms --*/
table {
	color: #2e3e58; 
	background-color: white;
	font: 75% Arial,Helvetica, sans-serif;
	font-weight: bold;
	margin: 2px 2px; padding: 10px; 
	border: 1px dotted #0d1934;}
	
th{text-align: right; padding: 5px 5px; vertical-align: top;}
td {text-align: left; padding: 5px 5px; vertical-align: middle;}

input, select, textarea {color: #2e3e58; background-color: #c4cbda;}

table table {
	color: #2e3e58; 
	background-color: #c4cbda;
	margin: 2px 0px; padding: 0px; }
	
table table td { vertical-align: text-top; }