@charset "UTF-8";

/****************** 	
	Michelle Rajunov
	September 2008
	Portfolio beta version
	index_style.css

****************/

/* changed class to id main */
/* removed #about */	

/*********** Globals **************/

body{
	width: 900px;
	background: #990000;
	font-size: 10pt; 
	font-family: "Gill Sans","Trebuchet MS", Helvetica, Arial, sans-serif;
	text-align: left;
	margin: 0 auto;
	height: 80%;
	padding: 0;
} 

h1, h3{ font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;}
h1{		margin: 0;		font-size: 30pt; 	letter-spacing: 10px;	}
h3{		font-size: 18pt;	border-bottom: 1px solid #999999; 	font-weight: 100;
		padding: 0;			margin: 10px 0 10px 0;				text-align: left;	}
		
a,a:visited{text-decoration: none; border: none;	}
a{ 			color: #990000; }
a:hover{ 	color: #000066; 	background-color: #DDDDDD; }

ul{ margin: 0; 	padding: 0; }
li{ display: inline; }

.shadow{	background: #999999;}
.collapse {	display:none;}
.expand {	display:inline;}
.small{ font-size: 10pt; margin: -10px; letter-spacing: 10pt;}

/************ Sidebar ************/

.sidebar_left{	float: left;	padding: 0;	width: 300px;	height: 100%;	}
.sidebar_right{	float: right;	padding: 0;	width: 600px;	height: 100%;	}

.left{ 	display: inline;	float: left;	}
.right{	display: inline;	float: right;	clear: right;	}
.noborder{	border: 0;}
  
/**************** Main and Header with Tabs *******************/

#main{
	background: #FFFFFF;			border: 0px solid #990000;
	padding: 10px 10px 0px 10px;	margin: 0 auto;
	width: 100%;	height: 100%;	min-height: 450px; }

#header{	background:#990000;		margin: 0;		height: 50px;
			padding: 15px 0;		color: #CCCCCC;		text-align:right; }
#header h1{	text-align: right; margin-right: -20px;}
#header a{	background: #ffffff;	padding: 2px 10px 5px;	font-size: 10pt;	
			color: #666666;			font-weight: normal;    }
#header a.on, #header a:hover{ color: #990000; }
#header ul{	text-align: left;	margin: 3px 0 0 10px;	}
#header li{	margin: 0 0 0 5px;	}
   
/*************** Screenshots and Thumbnails **************/

#photos{		float: right;	height: 100%;		width: 500px; 			padding: 0 40px;	}
#photos img{		padding: 5px;	margin:  0 auto;		max-width: 500px;		max-height: 320px; 	border: 0;}
#photos p.caption{	margin: 5px auto; font-weight: lighter;	color: #333333;		text-align: right;	
					border-top: 1px solid #999999;	}
#photos h3{		border: 0;	padding-bottom: 0;	display: inline;	}
#photos ul{		text-align: left; margin: 10px 0 10px 0;	}
#photos li{		margin-right: 15px;}
#photos a{		border-bottom: 1px dashed #333333; }
#photos a.nodecoration{	border-bottom: 0px;		background: transparent; }
#photos div{	text-align: center; margin: 0 auto;}
    
.thumbnails{	border-top: 1px solid #999999;	margin: 20px auto;	text-align: center;	padding: 0;	}
.thumbnails li{	width: 120px;			margin: 5px;	}
.thumbnails img{vertical-align: top;	padding: 1px;	
				max-width: 80px; 		max-height: 80px;	border: 1px solid #cccccc;	}
.thumbnails img:hover{	 max-width: 100px;	}
.thumbnails ul{	padding: 10px 0 0 0;	}
    
    
/********* Side section with text ***********/

#info{		float: left;			margin: 0 10px;	}
#info p{	font-size: 10pt;		line-height: 10pt;	
			text-align: justify;	margin: 20px 0px 0px 0px;	}
#info p.pinfo{margin: 5px 0 0px 0;	text-align: right;	color: #666666;
			font-size: 10pt;		font-style:italic;	}

/*********** sub Menu *****************/

#menu{		float: left;				text-align: left;	margin: 5px 10px;
			font-size: 10pt;			clear: both;		width: 100%;	}
#menu li{	margin: 8px 10px 5px 0;	}
#menu li a{ padding: 3px 5px; 		border: 1px solid #cccccc;} 
#menu li:hover{ 	background-color: #DDDDDD; }
/*******************************************/