/*==========================================================================================

style.css
Layout and style rules for site.


1. Basic HTML elements
2. Template-specific CSS
	1. Header
	2. Content area
		1. Main content area
		2. Sidebar
	3. Footer
3. General column positioning


==========================================================================================*/


/* ------------------------------------------------------------ Basic HTML elements */

body
	{
	margin: 0;
	font-size: 12px;
	font-family: courier new, monospace;
	line-height: 16px;
	}

h1, h2, h3, h4, h5, h6, p
	{
	margin: 0;
	padding: 0;
	font-size: 13px;
	line-height: 18px;
	font-family: courier new, monospace;
	font-weight: normal;
	color: #000;
	}
	
h1, h2
	{
	text-transform: uppercase;
	margin: 0;
	}
	
h2
	{
	margin: 0 0 24px 0;
	}

h3
	{
	color: #0099cc;
	font-size: 13px;
	line-height: 18px;
	font-weight: bold;
	margin: 0 0 14px 0;
	}
	
p
	{
	font-size: 100%;
	margin: 0 0 .92em;
	}

ul
	{ 
	list-style-type: circle; 
	margin: 0;
	padding: 0;
	}

ul li
	{
	margin: 0.45em 15px;
	padding: 0;
	}

ol
	{ margin: 0 0 .45em 25px;
	}

ol li
	{
	}

table
	{ font-size: 100%;
	}

th
	{
	}

td
	{
	}

img
	{
	}

a img
	{
	border: none;
	}

a, a:visited
	{
	color: #000;
	text-decoration: none;
	overflow: hidden;
	}
	
a:hover
	{
	color: #0099cc;
	}
	
input
	{
	margin: 0 5px 5px 0;
	}

input[type=text]
	{
	width: 100px;
	}
	
hr
	{
	margin: 20px 0;
	}
	
span
	{
	cursor: pointer;
	}


/* ------------------------------------------------------------ Template-specific CSS */

#container /* add Faux Column background image here (see http://www.alistapart.com/articles/fauxcolumns/ for assistance) */
	{
	text-align: left;
	margin: 37px 40px;
	}
	
.button
	{
	display: inline;
	margin: 0 5px 7px 0;
	padding: 3px;
	font-size: 1.2em;
	background-color: #ddd;
	border: 1px solid black;
	cursor: pointer;
	}
	
.button:hover
	{
	background-color: #aaa;
	}
	
.button a
	{
	color: #000;
	}
	
.togglebutton
	{
	color: #bbb;
	}


/* ------------------------------------------------------------ Header */

#header
	{
	position: relative;
	margin: 0;
	width: 729px;
	}
	
#header h1 
	{
	width: 75px;
	height: 75px;
	margin: 0 0 7px 0;
	text-indent: -9999px;
	overflow: hidden;	
	}

#nav ul
	{
	padding: 0;
	}

#nav li, #secondnav li, #homenav li
	{
	margin: 0 0 6px 0;
	list-style: none;
	text-indent: -9999px;
	overflow: hidden;
	}
	
#homenav li
	{
	margin: 24px 0 0;
	}
	
#header h1 a
	{
	display: block;
	width: 100%;
	height: 100%;
	}

#nav li a, #secondnav li a, #hometext li a
	{
	display: block;
	width: 100%;
	height: 100%;
	text-indent: -9999px;
	overflow: hidden;
	}

#nav li.selected
	{
	color: #0099cc;
	}

#nav .portafolio, #hometext .portafolio:hover, #nav .currentitem .portafolio:hover
	{
	background: url(../images/nav/spanish/portafolioblack.jpg);
	width: 85px;
	height: 15px;
	}

#nav .portafolio:hover, #nav .portafolio.selected, #hometext .portafolio, #nav .currentitem .portafolio
	{
	background: url(../images/nav/spanish/portafoliocyan.jpg);
	width: 85px;
	height: 15px;
	}

#nav .actual, #hometext .actual:hover, #nav .currentitem .actual:hover
	{
	background: url(../images/nav/spanish/actualblack.jpg);
	width: 124px;
	height: 15px;
	}

#nav .actual:hover, #nav .actual.selected, #hometext .actual, #nav .currentitem .actual
	{
	background: url(../images/nav/spanish/actualcyan.jpg);
	width: 124px;
	height: 15px;
	}

#nav .elstudio, #hometext .elstudio:hover, #nav .currentitem .elstudio:hover
	{
	background: url(../images/nav/spanish/elstudioblack.jpg);
	width: 82px;
	height: 15px;
	}

#nav .elstudio:hover, #nav .elstudio.selected, #hometext .elstudio, #nav .currentitem .elstudio
	{
	background: url(../images/nav/spanish/elstudiocyan.jpg);
	width: 82px;
	height: 15px;
	}

#hometext .ademas:hover
	{
	background: url(../images/nav/spanish/ademasblack.jpg);
	width: 51px;
	height: 15px;
	}

#hometext .ademas
	{
	background: url(../images/nav/spanish/ademascyan.jpg);
	width: 51px;
	height: 15px;
	}

#nav .english, #hometext .english:hover, #nav .currentitem .english:hover
	{
	background: url(../images/nav/spanish/englishblack.jpg);
	width: 60px;
	height: 15px;
	}

#nav .english:hover, #nav .english.selected, #hometext .english, #nav .currentitem .english
	{
	background: url(../images/nav/spanish/englishcyan.jpg);
	width: 60px;
	height: 15px;
	}
	
/* english */


#nav .portfolio, #hometext .portfolio:hover, #nav .currentitem .portfolio:hover
	{
	background: url(../images/nav/english/portfolioblack.jpg);
	width: 77px;
	height: 15px;
	}

#nav .portfolio:hover, #nav .portfolio.selected, #hometext .portfolio, #nav .currentitem .portfolio
	{
	background: url(../images/nav/english/portfoliocyan.jpg);
	width: 77px;
	height: 15px;
	}

#nav .current, #hometext .current:hover, #nav .currentitem .current:hover
	{
	background: url(../images/nav/english/currentblack.jpg);
	width: 124px;
	height: 15px;
	}

#nav .current:hover, #nav .current.selected, #hometext .current, #nav .currentitem .current
	{
	background: url(../images/nav/english/currentcyan.jpg);
	width: 124px;
	height: 15px;
	}

#nav .studio, #hometext .studio:hover, #nav .currentitem .studio:hover
	{
	background: url(../images/nav/english/studioblack.jpg);
	width: 82px;
	height: 15px;
	}

#nav .studio:hover, #nav .studio.selected, #hometext .studio, #nav .currentitem .studio
	{
	background: url(../images/nav/english/studiocyan.jpg);
	width: 82px;
	height: 15px;
	}

#hometext .whatelse:hover
	{
	background: url(../images/nav/english/whatelseblack.jpg);
	width: 79px;
	height: 15px;
	}

#hometext .whatelse
	{
	background: url(../images/nav/english/whatelsecyan.jpg);
	width: 79px;
	height: 15px;
	}

#nav .espanol, #hometext .espanol:hover, #nav .currentitem .espanol:hover
	{
	background: url(../images/nav/english/espanolblack.jpg);
	width: 60px;
	height: 15px;
	}

#nav .espanol:hover, #nav .espanol.selected, #hometext .espanol, #nav .currentitem .espanol
	{
	background: url(../images/nav/english/espanolcyan.jpg);
	width: 60px;
	height: 15px;
	}



	
	
#secondnav
	{
	position: absolute;
	bottom: -6px;
	right: 0;
	}

#secondnav li.selected a
	{
	color: #0099cc;
	}

#secondnav .ademas
	{
	background: url(../images/nav/spanish/ademasblack.jpg);
	width: 51px;
	height: 15px;
	}

#secondnav .ademas:hover, #secondnav .ademas.selected
	{
	background: url(../images/nav/spanish/ademascyan.jpg);
	}

#secondnav .clientes
	{
	background: url(../images/nav/spanish/clientesblack.jpg);
	width: 142px;
	height: 15px;
	}

#secondnav .clientes:hover, #secondnav .clientes.selected
	{
	background: url(../images/nav/spanish/clientescyan.jpg);
	}

#secondnav .issuuportafolio
	{
	background: url(../images/nav/spanish/issuunegro.jpg);
	width: 253px;
	height: 15px;
	}

#secondnav .issuuportafolio:hover, #secondnav .issuuportafolio.selected
	{
	background: url(../images/nav/spanish/issuucian.jpg);
	}

#secondnav .descargue
	{
	background: url(../images/nav/spanish/descargueblack.jpg);
	width: 210px;
	height: 15px;
	}

#secondnav .descargue:hover, #secondnav .descargue.selected
	{
	background: url(../images/nav/spanish/descarguecyan.jpg);
	}
	
/* english */



#secondnav .whatelse
	{
	background: url(../images/nav/english/whatelseblack.jpg);
	width: 79px;
	height: 15px;
	}

#secondnav .whatelse:hover, #secondnav .whatelse.selected
	{
	background: url(../images/nav/english/whatelsecyan.jpg);
	}

#secondnav .clients
	{
	background: url(../images/nav/english/clientsblack.jpg);
	width: 91px;
	height: 15px;
	}

#secondnav .clients:hover, #secondnav .clients.selected
	{
	background: url(../images/nav/english/clientscyan.jpg);
	}

#secondnav .issuuportfolio
	{
	background: url(../images/nav/english/issuublack.jpg);
	width: 221px;
	height: 15px;
	}

#secondnav .issuuportfolio:hover, #secondnav .issuuportfolio.selected
	{
	background: url(../images/nav/english/issuucyan.jpg);
	}

#secondnav .download
	{
	background: url(../images/nav/english/downloadblack.jpg);
	width: 194px;
	height: 15px;
	}

#secondnav .download:hover, #secondnav .download.selected
	{
	background: url(../images/nav/english/downloadcyan.jpg);
	}

	
.editbox
	{
	padding: 10px 0;
	}





/* ------------------------------------------------------------ Content area */
		


/* ------------------------------------------------------------ Main content area */
#main
	{
	width: 600px;
	margin: 68px 0 0 129px;
	}
	


a.returnlink
	{
	float: right;
	color: #47b8f1;
	}	
	

/* PROJECTS */
.projectlist a
	{
	font-size: 13px;
	line-height: 18px;
	}

.projectlist a:hover
	{
	color: #0099cc;
	text-decoration: none;
	}

.projecttitleespanol
	{
	color: #999;
	}

.projecttitle
	{
	font-weight: normal;
	color: #000;
	}

.projecttitle i
	{
	font-weight: bold;
	color: #0099cc;
	}
	
#desc
	{
	margin: 0;
	font-size: 12px;
	line-height: 16px;
	}
	
.projectyear
	{
	float: left;
	}
	
#thumbs, #thumbsespanol
	{
	margin: 0 0 24px 0;
	}

.hidden
	{
	display: none;
	}
	
/* BIO */
#bio
	{
	margin: 0 0 36px 0;
	}
	
#pdf
	{
	margin: -24px 0 24px 0;
	}	




/* ------------------------------------------------------------ Home */

#inicio #main
	{
	margin: auto;
	width: 1024px;
	}

#homenav
	{
	margin-top: 20px;
	}

#homenav a
	{
	color: #0099cc;
	}

#homenav a:hover
	{
	color: #000;
	}	

#homeimage
	{
	float: left;
	margin: 0;
	}
	
#hometext
	{
	width: 380px;
	margin: 0 0 0 602px;
	}



/* ------------------------------------------------------------ Projects */
#sidebar
	{
	margin: 60px 0 0;
	float: left;
	}
	
#sidebar li
	{
	height: 37px;
	margin: 0;
	list-style: none;
	}
	
#sidebar .selected a
	{
	color: #0099cc;
	}
	
/*
#sidebar li a
	{
	width: 100%;
	height: 100%;
	}
*/

#adminbox
	{
	position: absolute;
	top: 120px;
	right: 15px;
	width: 200px;
	padding: 20px 10px;
	background-color: #999;
	}
