@charset "UTF-8";
/* CSS Document */
      /* these are the positioning rules */

		
		
		#allbody { position: fixed; width:980px; height:600px; left:50%; top:40%; margin-left:-475px; margin-top:-300px; }
		#banner { position:fixed; float:right; right:0em; top:0%; z-index:1 } 
        
		#mainWindow { position: relative; width:100%; height:100%; top:25%; float:right; z-index:3;}
		#menu { position: relative; width: 8%; float:left; } 
		#worksList { position: relative; left:35px; width: 80px; height:80%; float:left; z-index:2  }
		
		#wrapper { position: relative; height:90%; right:5%; width:60%; float:right;  z-index:4 }
		#captionContainer { position:relative; width:100%; float:right; top:-20px; right:0%; margin-bottom:0px; }
		#navigation { position: relative; margin-top:25px;}		
		#mainWindowTextContainer { position:relative; height:100%; width:auto; float:left; top:-10%; left:2%; margin-top:0%;}
	/* these are cosmetic rules to make the various sections stand out */
	 #allbody {background-color:#eef4f2;}
     /* these fix a real annoying problem:  header tags force extra margins
        which you didn't really plan for */
     #banner h1, #banner h2 { margin-top: 0em; margin-bottom: 0em; }
     #main h3, #nav h3, #side h3 { margin-top: 0em; }


body
{
	margin: 0;
	text-align: left;
	font-family:Arial;
	font-size: 13px;
	color: #666666;
	font-weight: 75;
	background-color:#eef4f2;
	letter-spacing:0.4em;
}


a
{
	color: #666666;
    text-decoration: none;
	outline: 0px;
	border:0px solid white;
	cursor: pointer;
}
a:hover, a.active
{
	background-color:#FFFFFF;
}
em
{
    font-style: italic;
}
small
{
    font-size: 80%;
}
b, strong
{
    font-weight: bold;
}
a:focus
{
    outline-style: none;
}

.menuButton
{
	font-size: 80%;
	font-family:Arial;
	color: #666666;
	text-decoration: none;
	font-weight:300;
	border: 0px solid white;
	cursor: pointer;
	letter-spacing: .5em;
	text-align: left;
	text-indent: 8px;
	padding-top: 7px;
	padding-bottom: 7px;
	background-color:#eef4f2;
	margin-left:4px;
	margin-right:1px;
}

.menuButton:hover
{
	background-color:#FFFFFF;
}


.workslist
{
	/*border-right-style:groove;*/
}


.mainWindowText
{
	padding: 45px;
	text-align: left;
	font-family:Arial;
	font-size: 82%;
	font-weight:200;
	background-color:#ffffff;
	position:relative;
	width:auto;
	height:auto;
	max-width:600px;
	min-width:150px;
	line-height: 1.5em;
}

.mainWindowText ul
{
	list-style:none;
	list-style-position:inside;
	font-weight: 200;
}
.mainWindowText a
{
	font-size:90%;
	list-style:none;
	list-style-position:inside;
	font-weight: 100;
}
.caption{
	font-size:95%;
	letter-spacing:.2em;
}

.navigation, .navigation a
{
	font-size: 80%;
	color: #666666;
	text-decoration: none;
	cursor: pointer;
	width: auto;
	padding-top: 2px;
	padding-bottom: 2px;
	background-color:#eef4f2;
	margin-left:2px;
	margin-right:2px;
	text-align: center;
}

.navigation:hover
{
	/*background-color:#FFFFFF;*/
}


/*......................*/

.image_info {
    /*display:block;
    font-size:10px;
    color:#999;
    border:0px;*/
	font-size: 90%;
	font-family:Arial;
	color: #666666;
	text-decoration: none;
	font-weight:100;
	border: 0px solid white;
	cursor: pointer;
	width: 2em;
	text-align: center;
	padding-top: 2px;
	padding-bottom: 2px;
	background-color:#eef4f2;
	margin-left:2px;
	margin-right:2px;
	vertical-align:top;
    }

.show_title a {
    font-size:12px;
    text-decoration:none;
    color:#999;
}
.image_info a {
    text-decoration:none;
    color:#fff;
}
img {
	border-width: 0;
	vertical-align:middle;
}
.image {
    margin-bottom:5px;
}
.image img {
	padding:6px;
	border: 1px solid #bbb;
	display:block;
	background-color: #fff;
	margin-top: 5px;
}

#thumbnail_row{
position: relative; top:20%; /*left:1em; width: 55px; */height:auto; float:left;
}
.thumbnail_row {
    margin-top: 0px;
}
.thumbnail_row img {
	border:0px solid #aaa;
	margin-bottom:3px;
	width: 55px;
}
.thumbnail_center {
    padding:1px;
    border:1px solid #bbb !important;
}
