/* 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{

}

#banner {
margin-bottom:.5em;
}


/* ========== C  ==========  */
#content  {
margin-right:1%;
margin-left:17%;
min-height: 20em;
}
#contentWrapper, #nav {
top:5.25em;}


/* ========== F  ==========  */
#footer{
width: 100%;
clear:both;

}


/* ========== N  ==========  */
#nav  {
width: 14 %;
position:absolute; top:8.5em; left:0px;
margin:.5em 15px .5em 0px;
}
#nav li  li{
margin-left:1.5em;
padding-left:.5em;
}

/* ================================== 
	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*/
}

/* ========== C ==========  */
.clearright{ clear: right;}
.clearleft{ clear: left;}
.clearboth{ clear: both;}

/* ========== 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  ==========  */