/*------------------------------------------------------------------
[Layout Stylesheet]

Project:		Gladys Diaz Web Design Portfolio
Primary use:	Web site - Screen
CSS Author:		Gladys Diaz
-------------------------------------------------------------------
[Table of Contents]

[1]	Body
[2]	Text & Links
[3] Header, Footer
[4] Content
/*------------------------------------------------------------------
[1] Body
*/

@import "reset.css";

html
{
	width: 100%;
	height: 100%
}
body
{
	width: 100%;
	height: 100%;
	color: #666;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 70%;
	background: #fff
}
/*------------------------------------------------------------------
[2] Text & Links
*/
h1
{
	margin: 0;
	font: normal 4.6em 'Nobile', Arial, Helvetica, sans-serif
}
h2
{
	margin: 0;
	font: bold 2.2em Arial, Helvetica, sans-serif;
	color: #CACACA
}
h3
{
	margin: 0;
	font: bold 2em Arial, Helvetica, sans-serif;
	color: #666
}
h4
{
	margin: 0 0 15px 0;
	font: bold 1.8em Arial, Helvetica, sans-serif;
	color: #666
}
h5
{
	margin: 0 0 10px 0;
	font: bold 1.6em Arial, Helvetica, sans-serif;
	color: #666
}
h6
{
	margin: 0;
	font: bold 1.4em Arial, Helvetica, sans-serif;
	color: #CACACA
}
p
{
	margin: 0 0 20px 0;
	line-height: 1.8em
}
ul
{
	margin: 0 0 20px 0
}
	li
	{
		margin: 5px 0 0 10px;
		padding-left: 8px;
		line-height: 1.4em;
		list-style-type: none;
		background: url(../images/_layout/headers.gif) no-repeat -173px -91px
	}
a, a:active, a:visited
{
	font-weight: bold;
	color: #D38E4A;
	text-decoration: none;
	outline: none;
}
	a:focus, a:hover
	{
		color: #E25B09
	}
a.btn, a.btn:active, a.btn:visited
{
	padding: 5px 10px;
	line-height: 22px;
	color: #fff;
	font-weight: bold;
	cursor: pointer;
	border: none;
	background: #D38E4A;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px
}
	a.btn:focus, a.btn:hover
	{
		color: #fff;
		background: #E25B09
	}
.floatL
{
	display: inline;
	float: left;
	padding: 10px 20px 0 20px
}
.floatR
{
	display: inline;
	float: right
}
/*------------------------------------------------------------------
[3] Header, Footer
*/
#header
{
	display: block;
	margin-bottom: 20px;
	padding: 30px 0 20px 0;
	border-bottom: solid 1px #cacaca
}
#headName
{
	float: left;
	width: 40%
}
	#headName h1 a, #headName h1 a:active, #headName h1 a:visited, #headName h1 a:focus, #headName h1 a:hover
	{
		font-weight: normal;
		color: #666
	}
#nav
{
	float: left;
	width: 60%;
	margin-top: 85px;
	text-align: right
}
	#nav a, #nav a:active, #nav a:visited
	{
		margin-left: 20px;
		font: normal 1.6em Arial, Helvetica, sans-serif;
		color: #cacaca
	}
	#nav a:focus, #nav a:hover
	{
		color: #D38E4A
	}
	#nav a.selected, #nav a.selected:active, #nav a.selected:visited, #nav a.selected:focus
	{
		color: #666
	}
	#nav #divider
	{
		padding-left: 20px;
		border-left: solid 1px #cacaca
	}
	
#footer
{
	display: block;
	margin: 40px 0;
	padding-bottom: 30px;
	text-align: center
}
/*------------------------------------------------------------------
[4] Content
*/
#container
{
	width: 990px;
	margin: 0 auto
}
#bio
{
	float: left;
	width: 380px;
	padding-right: 30px
}
#featWork
{
	float: left;	
	width: 580px
}
#featThumbs img
{
	float: left;
	margin: 20px 10px 0 0;
	width: 186px
}
	#featThumbs img.last
	{
		float: left;
		margin: 20px 0 0 0;
		width: 186px
	}
.col
{
	float: left;
	width: 200px
}
/* Project Thumb Item */
.project
{
	display: inline;
	float: left;
	width: 318px;
	height: 445px;
	margin: 0 9px 30px 0;
	font-size: .9em;
	border: solid 1px #e0e0e0;
	background: #f3f3f3
}
	.project a, .project a:active, .project a:visited
	{
		display: block;
		margin-bottom: 10px;
		padding: 5px;
		background: #fff
	}
		.project a:focus, .project a:hover
		{
			background: #e0e0e0
		}
	.project h4
	{
		display: inline;
		float: left;
		width: 54px;
		margin: 0 0 5px 10px;
		padding: 4px 2px 0 0;
		font-size: 1em;
		color: #cacaca;
		text-align: right
	}
	.project div
	{
		display: inline;
		float: left;
		width: 230px;
		color: #666;
		padding: 4px 0 0 10px
	}
		.project div a, .project div a:active, .project div a:visited
		{
			display: inline;
			margin: 0;
			padding: 0 13px 0 0;		
			background: #F1F1F1
		}
		.project div a:focus, .project div a:hover
		{
			color: #E25B09;
			background: #F1F1F1 url(../images/_layout/arrow.gif) no-repeat right 1px
		}
	.project .last
		{
			height: 35px;
		}
	.project br, .clearFloat
	{
		clear: both;
		height: 0;
		font-size: 0;
		line-height: 0
	}
/* Project Detail */
.detailCol
{
	float: left;
	margin: 0 20px 20px 0;
	width: 470px	
}
.right
{
	margin: 0 0 20px 0 !important;
	width: 490px !important
}
.detailCol h4
	{
		display: inline;
		float: left;
		margin: 0;
		width: 54px;
		font-size: 1em;
		color: #cacaca;
		line-height: 1.8em
	}
	.detailCol div
	{
		display: inline;
		float: left;
		width: 416px;
		line-height: 1.8em
	}
		.detailCol div a, .detailCol div a:active, .detailCol div a:visited
		{
			display: inline;
			margin: 0;
			padding: 0 13px 0 0
		}
		.detailCol div a:focus, .detailCol div a:hover
		{
			color: #E25B09;
			background: url(../images/_layout/arrow.gif) no-repeat right 1px
		}
	.detailCol br
	{
		clear: both
	}
