/**
*	Stylesheet for J.J. Jelincic for CalPERS Board
*	© Ramil Nobleza 2009
*	You're free to change this, and use it however you want (although if
*	you want to take over the world, I'd rather not be involved, thanks)
*
*	Version 0.1c - Solved a couple cross-compatibility issues (had borders around some links)
*
*	Version 0.1b - I'll try and comment the best I can. I'm also arranging
*	items by their appearance in the code (I hope)
*/

/*
	General preferences (for things that aren't otherwise listed, aka "defaults")
*/
*{
	color:#FFFFFF;
	background-image:url(../img/bg.jpg);
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:12pt;
	background-repeat:repeat;
}
body{
	margin:0px;
}
div.hr{

	width:100%;
	background-image:url("../img/hr.jpg");
	background-repeat:repeat-x;
}
/*
	Preferences for things inside the 'column' aka the setup
*/
#column{
	width:800px;
	margin-left:auto;
	margin-right:auto;
	height:100%;
}
/*
	No text-decoration for boxless linking on images
*/
img{
	text-decoration:none;
	border:none;
}

/*
	Banner properties
*/
#banner{
	display:block;
	padding:0px;
	margin-top:0;
	margin-left:auto;
	margin-right:auto;
	width:900px;
	text-decoration:none;
}

/*
	Menu properties (do I really have to comment these? they're pretty self-explanitory)
*/
#menu{
	margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	width:900px;

	text-align:center;
	vertical-align:middle;
	padding-top:0px;
	padding-bottom:0px;
}

/*	
	Fonts that I want red... for some reason, it resets the font-size
	so I have to specify it here too
*/
span.red{
	font-size:18px;
	color:#F00;
}

/*
	The table inside of the "content" div
*/
#info{
	width:100%;
}

/*
	Only made this a class so I could change its width w/o html
*/
td.left{
	width:30%;
}


/*
	The left-side of the info table... a table in the <td>. This table houses the 
	summary of qualifications for Mr. Jelincic
*/
#resume{
	width:100%;
}

/*
	Headers for qualifications. would use a <th> but it only- Oh. I suppose I could've done that.
	Oh well.
*/
td.category_head{
	background-image:url("../img/header.jpg");
	background-repeat:repeat-x;
	color:#000000;
	padding-left:1em;
}

/*
	Formatting actually for the contacts page, but it's universal anyway
*/
td{
	vertical-align:text-top;
}

/*
	Specs for right-side of "content" table. Used to modify content
*/
td.right{
	vertical-align:top;
	font-size: 18px;	
}

/*
	Borders and such for the content. Top borders help serve as page dividers
*/
#content{
	padding:1em;
	width:900px;
	margin-left:auto;
	margin-right:auto;

}

/*
	image specs for Mr. Jelincic's picture
*/
#portrait{
	margin-right:1em;
	margin-top:1em;
	float:right;
}

/*
	Since I specified font-size in *, must re-specify here for different sizes
*/
li.right_list{
	font-size:18px;
}


/*
	More borders for the footer, and some cleaning up
*/
#footer{
	text-align:center;
	padding-top:10px;
	padding-bottom:10px;
}


/************************
*	Contact-Specific	*
************************/
/*
	Ways to contact (a table)
*/
#contacts{
	margin-right:auto;
	margin-left:auto;
	width:400px;
	padding:1em;
}
span.error{
	color:red;
	border:thin dashed #FF0000;
	margin-bottom:2em;
}
span.success{
	margin-bottom:2em;
	padding:10px;
	border:thin dashed #FFFFFF;
}
#contactbox{
	margin-left:auto;
	margin-right:auto;
	width:450px;
	padding:1em;
	border:solid thin dashed#FFFFFF;

}
input.contact{
	width:400px;
	color:#000000;
	background-color:#FFFFFF;
	margin-top:3px;
	background-image:none;
}
textarea.contact{
	margin-top:3px;
	width:400px;
	height:150px;
	overflow:hidden;
	background-color:#FFFFFF;
	color:#000000;
	background-image:none;
}
input.submit{
	margin-top:1em;
	margin-left:300px;
	width:100px;
	background-image:none;
	}
	

/****************************
*	Endorsement-Specifics	*
****************************/

/********************
*	Goals-Specific	*
********************/
#goals{
	
	padding:1em;
}
span.announcement{
	padding-left:4em;
	font-size:22px;
}