@charset "utf-8";
/* CSS Document
 * Nombre del Tema: Bizarre Scarlet
 * Autor: dnzl - Bizarre Design [ http://www.bizarredesign.com.ar ]
 * Este documento CSS y las imágenes utilizadas se encuentran bajo licencia Creative Commons 2.5 Argentina
 * [Visite http://creativecommons.org/licenses/by-nc-sa/2.5/ar/ para verla.]
 * Ud. es libre de: Guardar, Copiar, Distribuir, Exhibir, Modificar, Ejecutar la Obra, y Hacer Obras Derivadas,
 * Bajo las siguientes condiciones:
 * Incluya mi nombre (Mara Greco), o mi seudónimo (Denzel), o mi seudónimo abreviado (dnzl) como autora original.
 * Incluya la dirección de nuestro sitio web (http://www.bizarredesign.com.ar), 
 * Ud. no puede utilizar este documento con fines comerciales sin mi consentimiento expreso.
 * Cualquier alteración, transformación u obra derivada que haga de éste documento, sólo podrá ser distribuido bajo una licencia identica a ésta.
 * Ante cualquier duda, lo invitamos a ponerse en contacto con nosotros: http://www.bizarredesign.com.ar/contacto.php
 */

/* --------- *** GENERALES *** ---------- */
body{
	background:#000 url(img/bg.jpg) repeat-x;
	font-family:"Trebuchet MS", Tahoma, Verdana, Arial, sans-serif;
	font-size:12px;
	color:#bbb;
	margin:0;
	cursor:default;
	}
*{ margin:0; padding:0;}
a{
	color:#fff;
	text-decoration:none;
	font-weight:bold;
}
a:hover{ text-decoration:underline;}

.clear{ height:20px;}
.clearg{ height:50px;}
.clearb{
	width:500px;
	border-bottom:#666 solid 1px;
	margin:40px auto;
}
.cleardiv{
	margin:0 auto;
	width:770px;
	height:20px;
	border-bottom:#111 solid 1px;
}

img{
	border:none;
}

/* ---------- *** HEAD Y MENU *** ---------- */

#head{ 
	background:url(img/logo.jpg) no-repeat;
	height:250px;
}
#head h1, #head h2{
	text-indent:-9999px;
	float:left;
	clear:right;
}

#menu{
	float:right;
	clear:right;
}

#menu li{
	list-style:none;
	display:inline;
}

#menu a{
	display:inline-block;
	height:33px;
	background:url(img/menubg.jpg) repeat-x top;
	text-align:center;
	line-height:33px;
	font-weight:normal;
	}

#news{width:90px;}
#about{width:110px;}
#work{ width:80px; }
#portfolio{width:75px;}
#contact{width:85px;}

#menu a:hover{ background-position:bottom left; text-decoration:none;}

#titulo{
	width:280px;
	position:absolute;
	margin-top:33px;
	right:0;
	background-repeat:no-repeat;
}

#titulo h1{ 
	width:250px;
}

div.news{ background:url(img/titulonews.jpg); height:160px; }
div.about{ background:url(img/tituloabout.jpg); height:200px; }
div.work{ background:url(img/titulowork.jpg); height:200px; }
div.portfolio{ background:url(img/tituloportfolio.jpg); height:160px;}
div.contacto{ background:url(img/titulocontacto.jpg); height:160px;}
div.grax{ background:url(img/titulograx.jpg); height:160px;}
div.legal{ background:url(img/titulolegal.jpg); height:160px;}

/* --------- *** CONTENIDO *** ---------- */

#formato{
	width:770px;
	margin:0 auto;
	margin-top:-40px;
	min-height:300px;
}

#cont1{
	line-height:20px;
	text-align:justify;
}

.cols{
	width:200px;
	padding:0 25px;
	height:360px;
}

#col1, #footcol1{ float:left;}
#col2 { 
	margin:0 auto;
	border-right:#622 solid 1px;
	border-left:#622 solid 1px;
}
#col3, #footcol3{ float:right;}

#cont1 h2{
	font-size:18px;
	color:#966;
	margin-bottom:20px;
}

#cont1 ul{ padding:10px;}
#cont1 li{ margin:10px 0;}

/* --------- *** FOOTER *** ---------- */

#foot{ clear:both;}
#foot p.linksFoot{
	text-align:center;
}

#foot p.linksFoot a{
	font-weight:normal;
	letter-spacing:2px;
}

#foot p.linksFoot a:hover{ text-decoration:underline; }

#foot p.textoFoot{
	text-align:center;
	font-size:10px;
	clear:both;
}

#foot h1{
	font-size:18px;
	color:#666;
}

#foot h1 a{
	font-size:18px;
	color:#666;
	text-decoration:underline;
}
#foot h1 a:hover{
	color:#fff;
	text-decoration:underline;
}
#foot a:visited{ text-decoration:none;}
.footcols{
	width:26%;
	text-align:justify;
	padding:5px 30px;
}

/* CLIENTES */

#footcol2{ margin:0 auto;}
#footcol2 h1{text-align:center;}
#footcol2 h2{ margin:10px; font-size:16px;}
#footcol2 h3{ font-size:16px; text-align:center;}

/* login form */
#loginform{ width:210px;}
.login{
	text-align:center;
	margin-top:5px;
}
.loginformtext{
	width:80px;
	float:left;
	text-align:right;
	padding-top:2px;
}
.logintextfield{
	width:120px;
	border:#622 1px solid;
	background:#fee;
	margin-left:5px;
	color:#600;
	font-weight:bold;
}
.logintextfield:focus{background:#fff;}

#ingresar{
	margin-left:80px;
	margin-top:10px;
	padding:2px 5px;
}

/* opciones para usuarios */
#userops p{ line-height:20px; font-weight:bold;}
#userops li{
	font-size:14px;
	line-height:20px;
	list-style:none;
}


#legal{ text-align:right; }
#legal p{ font-weight:normal; margin:5px 0; }
#legal a{ font-weight:normal;}

/* ---------- ***** Formulario de Contacto ***** ---------- */

#contactof{ float:left; width:460px; padding:0 20px;}
#contacto{ float:right; width:240px;}

.textform{
	width:450px;
	text-align:left;
	padding:5px 0;
	line-height:20px;
}

.formtext{width:150px; float:left; text-align:right;}

.textfield{
	margin-left:10px;
	width:255px;
	border:#600 thin solid;
	background:#fdd;
	font-family:Arial, Helvetica, sans-serif;
	color:#600;
}
.textfield:focus{ background:#fff;}

#enviar{text-align:center;}
#formrequerido{text-align:left; margin-top:10px;}
#formsubmit{width:100px;}

/* ---------- *** ICONOS CONTACTO *** ---------- */
p.contacto{ padding-left:30px; margin:6px 0;}
#msn{ background:url(img/icons/msn.gif) no-repeat;}
#gtalk{ background:url(img/icons/gtalk.gif) no-repeat;}
#yim{ background:url(img/icons/yim.gif) no-repeat;}
#mail{ background:url(img/icons/mail.gif) no-repeat;}
#skype{ background:url(img/icons/skype.gif) no-repeat;}
#bookmark{ background:url(img/icons/bookmark.gif) no-repeat;}
#delicious{ background:url(img/icons/delicious.gif) no-repeat;}
#rss{ background:url(img/icons/rss.gif) no-repeat;}

div#contacto h1{
	font-size:16px;
}

div#grx{
	width:300px;
	margin:0 auto;
	padding:20px;
	text-align:center;
}

div#grx p{
	margin:5px 0;
}

div#grx strong{
	font-size:16px;
	font-weight:bold;
}

/* ---------- ***** PORTFOLIO ***** ---------- */

h3.portfolio{
	text-align:center;
	font-size:18px;
	margin:10px;
	color:#933;
}

table.portfolio{
	margin:0 auto;
}

table.portfolio td{
	text-align:center;
	padding:20px;
	border:#333 solid 1px;
}

table.portfolio td h4{
	font-size:14px;
	color:#fff;
	margin:5px;
}

table.portfolio td img{
	margin:5px 0;
	border:0;
}

table.portfolio p{
	text-align:left;
	margin:3px;
	line-height:16px;
	font-size:11px;
	color:#999;
}
table.portfolio p strong{
	color:#666;
}

div.portFlash{
	text-align:center;
}