/* Structure CSS Document Table of Contents:
	Reset
	IDs
	Classes

==================================
	 Reset 
================================== */
.grid, .grid li, 
#nav, #nav ul, #nav li  {
margin:0px;
padding:0px;
list-style-type:none;
list-style-image:none;
}

/* ================================== 
	HTML (in Alphabetical order)
================================== */
label  {float:left; clear:left;}
label  small {display:block; color:pink; font-weight:normal;} 

input {}

/* ================================== 
	IDs (in Alphabetical order)
================================== */
/* ========== B  ==========  */
#banner, #nav, #contentWrapper, #footer{
position:absolute;
left:0;
z-index:10;
}

#banner {
top:0px;
height:5em;
width: 100%;
}

#bkgrd { text-align:right;
right:0;
}
/* ========== C  ==========  */
#content, #footer  {

}
#contentWrapper, #nav {
top:5.25em;}

#contentWrapper {
margin-left:26%;
}
/*#content {position:relative;
left:-75px;}*/
#home #contentWrapper {display:none;}
/* ========== F  ==========  */
#footer, #bkgrd {
width: 100%;
clear:both;
position:fixed;
bottom:0px;
}


/* ========== N  ==========  */
#nav  {
width: 25%;
}
#nav li  li, #home #nav  li li {
margin-left:1.5em;
padding-left:.5em;
}

#home #nav { width:100%;}
#home #nav  li {width: 30%; float:left;  margin:1em 1%;
}
#home #nav  li li {width:auto; float:none; margin-top: .25em; margin-bottom: .25em; }
/* ================================== 
	Classes (in Alphabetical order)
================================== */
/* ========== A  ==========  */
.accessibility {
position:absolute; 
top:-10000px;
z-index:1;
}

.aside {
float: right;
width: 28.5%;
padding: 1em .5%; /* almost same as fieldset*/
margin-right: 0em;
margin-left: 1%
margin-bottom:1.2em; /*same as fieldset*/

overflow:hidden; /*find better solution*/
}

/* ========== E  ==========  */
.embed{
min-width:700px;
height:500px;
}

/* ========== G  ==========  */
.grid.gallery li {margin:2%; width:28%; text-align:center; }
.gallery a {position:relative; display:block; }
.gallery b img {width:100px; height:100px; margin-left:auto; margin-right:auto; display:block;}
.gallery span{display:none;}
.gallery a:hover b, .gallery a b:hover  {visibility:hidden;}
.gallery a:hover span, .gallery a span:hover{display:block; position: absolute; bottom:0%; left:0%; z-index:20;}
.gallery span img {width:175px;}


/*.grid lvl 1*/
.grid {
overflow:visbale;}

/*.grid lvl 2*/
.grid li { 
display:block;
width:30%;
height:14%;
margin:.5% 1%;
padding:0 0 .5% .5%;
 
float:left;
}

/*gird lvl 3+*/
.grid li li, div.grid div div, #info .grid div li, #info .grid li li {
width:auto;
height:auto;
list-style-type:circle;
float:none;
border-style:none;
padding:0px;
margin-bottom:.5em;
}
.grid li ul {padding-left:1em; border-style:none;}
.grid li li {display:list-item;}


/* ========== L  ==========  */
img.left {
float:left;
margin-right: 1em;
margin-bottom: .75em;
}


/* ========== R  ==========  */
img.right {
float: right;
margin-left: 1em;
margin-bottom: .75em;
}

/* ========== S  ==========  */