/*Reset CSS
Copyright (c) 2008, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.6.0
*/
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{font-size:100%;}legend{color:#000;}del,ins{text-decoration:none;}
html {background-color: #E5E5E5;
}
body {
font-family: Trebuchet, Arial, Helvetica,sans-serif;
background-color: #E5E5E5;
padding-left: 50px;
color: #696969;


}
#container {
width: 900px;
margin: 0 auto 0px auto;
position: relative;
background-color:#E5E5E5;	 
}
#navigation {
position: absolute;
top: 0;
width: 900px;
}
/* navigation link style here -- type is white*/
#navigation a {
color: white;
font-weight: bold;
text-decoration: none;
display: block;
padding-top: 1em;
padding-bottom: 1em;
padding-left: 1em;
font-size: .75em;
}
/* navigation hover background is white with grey type*/
#navigation a:hover {
background-color: white;
color: #B0B0B0;
}
/* now I am coloring my navigation link backgrounds*/
#navigation li {
background-color: #62B1F6;	
width: 225px;
height: 2em;
position: absolute;
}
#navigation li+li{
background-color:#00EE76;
}
#navigation li+li+li{
background-color:   #FF6EB4;	
	
}
#navigation li+li+li+li {
background-color: #FFE303;
}	
/*now I am sizing my navigation bar links*/
#navigation li { left: 0px; }
#navigation li + li { left: 225px; }
#navigation li + li + li { left: 450px; }
#navigation li + li + li + li { left: 675px;}

#container { padding-top: 4em; }
.accessibility {
position: absolute;
left: -10000px;
}
/*now I am starting to size the main divs of these pages*/
#header {
height: 4em;
}
#content{
position: relative;
}
#main { margin-top: 1em;
width: 570px;
position: relative;
}

#supporting {
width: 280px;
position: absolute;
margin-left: 600px;
margin-top: 1em;
border: 2px solid #828282;
right: 0px;
top: 0px;
padding-left: 7px;
}
/*this div is only used on the resume page*/
#resume-supporting {
width:280px;
position: absolute;
margin-left: 600px;
margin-top: 1em;
right: 0px;
top: 0px;
padding-left: 10px;
}

#footer {
padding-top: 7px;
height: 8em;
font-size: .75em;
clear:both;
/* these divs are so that I can match the type on the supporting page to its corresponding navigation link color*/
}
#instructional-design h4 {color:  #62B1F6;
}

#marketing h4 {color:#00EE76;
} 
#corporate h3 {color:  #FF6EB4;	
}
#corporate li {list-style-type: disc;
padding-left: 20px;
padding-bottom: 4px;
}
/*this styling is for the resume page only*/
#instructional-design li li{list-style-type: disc;
padding-left: 20px;
padding-bottom: 4px;
font-weight: normal;
}
#instructional-design li {list-style-type: none;
font-weight: bold;
}
#marketing li {list-style-type: disc;
padding-left: 20px;
padding-bottom: 4px;
font-weight: normal
}
#other h2 h4 {color: #FF6347;
}
#other li {list-style-type: disc;
padding-left: 20px;
padding-bottom: 4px;
font-weight: normal
}
#education li {list-style-type: disc;
padding-left: 20px;
padding-bottom: 4px;
font-weight: normal;
}
/* this is to size and position the header*/
#header h1 {
font-size: 2em;
position: absolute;
padding-left: 10px;
}
/*this is to make the paragraphs in content to look better*/
#content p {
padding-top: 1em;
line-height: 1.25;
text-align: left;
padding-right: 10px;
padding-bottom: 15px;
}	
/*general block level headings stylings*/	
 	h1 {
font-weight: bold;
font-size: 2em;
text-align: center;
}
	h2 {
font-weight: bold;
font-size: 1.75em;

}
	h3 {
font-weight: bold;
font-size: 1.25em;
}
        h4 {
font-weight: bold;
padding: 10px 0px 10px 0px;
}
/*this is to style the images and copy for my portfolio samples on each sample page*/
   div.img{
 
  height: auto;
  width: 525px;
  float: left;
  text-align: center;
  padding-top: 10px;
  }
div.desc
{
  text-align: center;
  padding: 15px;
  font-weight: normal;
  width: 500px;
  }
/*this is to style the id and marketing overview pages with images and titles/links*/
#imagelist li{
float: left;
}

#imagelist img {
display: block;
}
#imagelist li {
float: left;
padding-right: 6px;
padding-bottom: 10px;
font-weight: bold;
font-size: 0.8em;
}
#imagelist img {
border: 1px solid #828282;
}

.hasjs h4 { cursor: pointer; }
.hasjs ul.highlights  { display: none; }
.hasjs ul.highlights.showme { display: block; }