﻿/* 3ColFullNavAbsPos.css */

/* Kill all default margins and padding */
* {
  margin:0;
  padding:0;
}

body{
  /* Required to center wrapper in old browsers */
  text-align:center; 
  /* The rest is optional, style to taste */
  background-color:#fff;
  font-family: Verdana, Geneva, Sans-Serif;
  font-size: 100%;
}

/* commented backslash hack v2 \*/ 
html, body { 
	height:100%; 
} 
* html #wrapper { 
	height:100%; 
}
/* end hack */
/* Note that position:relative; was added to make sure
 * elements stay within the wrapper when absolute positioned
 */

/* Wrapper sizes the layout */
#wrapper{
	/* Sets the width of the layout */
	width:45em;
	/* Centers the layout (newer browsers) */
	margin: auto;
	/* Wrapper must have a border */
	border: solid 1px #91ADCA;
	/* Required so absolute mesaurement are in wrapper */
	position:relative;
  /* The rest is optional, style to taste */
  background-color:#fff;  
  margin-top:40px;
  
}

/* ---------------------- Start layout division styles ---------------------- */
/* Branding division */
#branding{
   /* Style to taste */
  height:12em;  
  background-image: url(backgrounds/td.jpg);
  background-repeat: repeat-x;
  background-color: #fff;
}

#branding img {
  float: left;
  height: 100%;
  
}

#branding h1 {
  font-size: 150%;
  padding-top: 3em;
}

/* Navbar division */
#navbar{
  position:absolute;
  /* Top = branding height */
  top:12em;
  left:0em;
  /* Full wrapper width */
  width:100%;
  height:2em; /* Content top padding must match this height */
  background-image: url(backgrounds/td.jpg);
  background-repeat: repeat-x;
  
  
}

#navbar a{
  font-weight: bold;
  font-size: .75em;
  padding: .5em;
  padding-top: .50em;
  text-decoration: none;
  text-align: center;
  float: right;
  width: 8.25em;
  height: 2em;
  border-right: 1px solid white;
  color: #003366;
}

#navbar a:visited {
  color: purple;
}

#navbar a:hover {
  background-color: #fff;
  font-weight: bold;
}



/* Left column */
#leftcolumn{
  position:absolute;    
   /* Under branding and navbar */
   top:14em;
   left:0;   
   width:10em;
   
}

#leftcolumn a {
  display: block;
  text-decoration: none;
  font-weight: bold;
  font-size: .85em;
  width: 8.25em;
  text-align: left;
  margin-left: 1.125em;
  margin-top: .75em;
  padding-left: .325em;
  
}

#leftcolumn a:hover {
  font-weight: bold;
  background-color: #fff;
}

#leftcolumn div.centering a{
   text-align: left;
   
 }



/* Content division */
#content{
  padding-top:2em; /* Same as navbar height */
  /* Leave room for sidebar columns */
  margin-left:10em;
  padding-bottom:0.5em;
  /* Optional, style to taste */
  background-color:#fff;
  color:#000;
  font-family: Verdana, Geneva, Sans-Serif;
  text-align:left;
  border-left: solid 1px #91ADCA;
  border-bottom: solid 1px #91ADCA;
 }
 
 .smthm {
   font-size: 70%;
   
 }
  
 #content img {
   float: left;
 }
 
 /* Center image between margins */
 #content div.centering img{
   text-align: left;
   padding-right: 1em;
 }
 
 div.info {
   text-align: left;
 
 }
 
   
/* Footer division */
#footer{
  /* Leave room for sidebar columns */
  margin-left:10em;
  margin-right:10em;
  /* Optional, style to taste */
  background-color:#fff;
  color:#000;
  border-top:solid 1px #B0C4D0;
  min-height:2em;
} 
/* ---------------------- End layout division styles ---------------------- */


/* Heading 1 tags in content division */
#content h1{
  margin-left:10px;
  font-size: 150%;
  Text-align: center;
  
}

/* Paragraphs in content division */
#content p{
  font-size:0.85em;
  line-height:1.5em; 
  margin:1em 12px;
  text-align: left;
}

#content h2, h3, h4, h5, h6 {
  font-size: 120%;
  text-align: left;
  padding-left: .225em;
}

/* Bulleted lists in content division */
#content ul{
  font-size:0.85em;
  margin:1em 20px 1em 40px;  
}

#content ul li{
  margin-bottom:0.5em;
}

#content .title {
   text-align: center;
 }
 
#petmed {
  height: 3em;
  text-align: left;
  
}

#creations {
  height: 7em;
  text-align: left;
}

#personal {
  float: left;
  text-align: left;
}

#content hr {
  color: red;
}


 