/* 
    AUTHOR: YOUR NAME HERE
            you@domain.com
*/

/* ------------------------------------------ */
/* RESETS, BASIC PAGE SETUP, BASIC TYPOGRAPHY */
/* ------------------------------------------ */
* { margin: 0; padding: 0; }
html {
	background: #ADEEFC;
}
body {
	padding: 0;
	margin: 0;
	background: transparent url('images/bg_clouds.png') no-repeat center top;
	color: #666;
	width: 100%;
	display: table;
}
ul { list-style: none inside; }

a { outline: none; }
a img { border: none; }
h1{
	background: transparent url('images/logo.jpg') no-repeat scroll 0 0;
	text-indent:-9999px; 
	width:303px;
	height:93px;
}
h2{
	font:40px Arial,sans-serif;
	letter-spacing:-2px;
	color:#0098DF;
}
h3{
	font:24px Arial,sans-serif;
	color:#0098DF;
	letter-spacing:-1px;
	padding:5px 0px 10px 15px;
	line-height:.9em;
}
h4{
	font:24px Arial,sans-serif;
	color:#EDC83C;
	letter-spacing:-2px;
	padding:15px;
}
a.link{
	font:14px arial,sans-serif;
	color:#0098df;
	padding:0px 0px 0px 15px;
	cursor: pointer;
	text-decoration:underline;
	line-height:1.6em;
}
a.link:hover{
	color:#edc83c;
	text-decoration:none;
	padding:0px 0px 0px 15px;
}
a:visited{
	color:#edc83c;
}
a.cv{
	border-bottom:1px dotted #EDC83C;
	color:#0098DF;
	text-decoration:none;
}
p { font: 14px arial,sans-serif; 
	color:#666666;
	padding:5px 0px 0px 15px;
}
p.yellow{
	font:16px arial,sans-serif;
	letter-spacing:-1px;
	color:#edc83c;
	padding:5px 0px 0px 15px;
}
span.white{
	color:#fff;
}
/* ------------------------------------------ */
/* TOOLBOX CSS */
/* ------------------------------------------ */
.floatleft { float: left; }
.floatright { float: right; }
.clear { clear: both; }
.transpblack { background: url(transpblack.png); }

/* END TOOLBOX */
/* ------------------------------------------ */
/* PAGE STRUCTURE */
/* ------------------------------------------ */
#content {
	width: 100%;
	margin: 255px auto 0;
	background: #ADEEFC;
	border: none;
	padding: 20px 0px 0px;
}
#header{
	width:720px;
	height:200px;
	margin:0 auto;
	padding-bottom:250px;
}
#logo{
	width:303px;
	height:93px; 
	margin:0px auto;
	padding-bottom:10px;
}
#birds{
	background:transparent url('images/birds.png') no-repeat scroll top left;
	width:372px;
	height:81px;
	position:absolute;
	top:140px;
	right:190px;
}	
#nav{
	width:720px;
	margin:0 auto;
}
#menu {
    overflow: hidden;
	text-align: right;
	height:60px;
	width:635px;
	background: transparent url('images/bg_menu.jpg') no-repeat scroll top left;
	margin:0 auto;
}

#menu li span{
	display:none;
}
#menu li {  
	display:inline;
	float:left;
}
#menu li, #menu a{
	height:60px;
	display:block;
}	
#menu-01{width:157px;}
#menu-02{width:163px;}
#menu-03{width:179px;}
#menu-04{width:130px;}
#menu-01 a:hover{background: transparent url('images/bg_menu.jpg') 0px -60px no-repeat;}
#menu-02 a:hover{background: transparent url('images/bg_menu.jpg') -157px -60px no-repeat;}
#menu-03 a:hover{background: transparent url('images/bg_menu.jpg') -320px -60px no-repeat;}
#menu-04 a:hover{background: transparent url('images/bg_menu.jpg') -499px -60px no-repeat;  }

#brown{
	width:100%;
	height:28px;
	background:#fff url('images/bg_brown.jpg') repeat-x scroll top left;	
}

#green{
	width:100%;
	height:622px;
	background:#A6D433;
}
.wrap {
	width: 720px;
	margin: 0 auto;
}
#slider{
	margin:0 auto;
	height:400px;
	width:720px;
	background:transparent url('images/bg_slider.png') no-repeat scroll top left;
	z-index:20;
	position:absolute;
	top:500px;
}


#slider-bottom{
	background:#C9FF30 url('images/bg_sliderbottom.jpg') no-repeat scroll center bottom;
	width:720px;
	height:47px;
	position:absolute;
	top:860px;
	z-index:20;
}
.scrollButtons {
  position: absolute;
  top: 150px;
  cursor: pointer;
  z-index:30;
}

.scrollButtons.left {
  left: 5px;
}

.scrollButtons.right {
  right: 5px;
}
.work{
		width:320px;
		padding:20px 0px 0px 0px;
		float:left; 
}
.img-works{
	border:7px solid #BADDF1;
	width:320px; 
	height:210px;
}
.description{
	width:268px;
	height:auto;
	float:right;
}
#white{
	width:100%;
	background:#fff url('images/bg_white.jpg') repeat-x scroll top left;
	height:670px;
}

.about{
	height:570px;
	background:transparent url('images/pestana.jpg') no-repeat scroll center top;
}
#about-left{
	border-right:1px dashed #D0D7D0;
	width:360px;
	float:left;
	margin:90px 0px 0px;
	text-align:right;
	height:400px;
}
#about-left h2, h4{
	padding-right:30px;
}
#me{
	padding:5px 15px 5px 10px;
}
#me p{
	font-size:15px;
}
#about-right{
	width:359px;
	float:right;
	margin:90px 0px 0px;
	text-align: left;
	height:400px;

}
#about-right h2, h4{
	padding-left:30px;
}
#abilities{
	margin:10px 0px 0px 30px;
}
#abilities td{
	padding:0px 3px 5px 0px;
}
#footer{
	background: #182842 url('images/bg_footer.jpg') repeat-x scroll center top;
	width:100%;
	/*--height:585px;--*/
	height:auto;
}
/*--anclas--*/
.top1{
	margin:0 auto;
	width:80px;
	padding:220px 25px 25px;
}
.top2{
	margin:0 auto;
	width:80px;
	padding:5px 25px 25px;
}
.top3{
	margin:0 auto;
	width:80px;
	padding:25px 25px;
	float:left;
}
/*--formulario
.message-box { text-align: center; padding: 5px; color:#545454; width:80%;  margin:5px auto; }  

.clean { background-color: #efefef; border-top: 2px solid #dedede; border-bottom: 2px solid #dedede; } 
.info  { background-color: #f7fafd; border-top: 2px solid #b5d3ff; border-bottom: 2px solid #b5d3ff; } 
.ok    { background-color: #d7f7c4; border-top: 2px solid #82cb2f; border-bottom: 2px solid #82cb2f; } 
.alert { background-color: #fef5be; border-top: 2px solid #fdd425; border-bottom: 2px solid #fdd425; } 
.error { background-color: #ffcdd1; border-top: 2px solid #e10c0c; border-bottom: 2px solid #e10c0c; }
 
form .error { border: 2px solid #e10c0c; } /* js error class */
/*--.contact{
	padding-top:65px;
}
#contact-top{
	float:left;
	width:720px;
	height:180px !important;
}
.datos{
	float:right;
	padding-left:10px;
}
.datos h3{
	padding:10px 3px 0px 5px;
	text-align: right;
}
.datos td{
	padding-bottom:9px;
}
#contact-top h2{
	float:left;
}
#contact_form{
	padding:20px 10px 5px 10px;
	clear:both;
	height:220px;
	color:#fff;
	font-size:22px;
	letter-spacing:-1px;
	border-bottom:4px solid #0098DF;
}
#first{
	width:250px;
	float:left;
}
#second{
	width:400px;
	float:right;
}
#contact_form form label{
	margin-bottom:3px;
}
#contact_form form input, #contact_form form label{
	margin:0px;
}
#contact_form form input#name, #contact_form form input#email{
	margin-bottom:16px;
}
#contact_form form input#name, #contact_form form input#email, #contact_form form textarea{
	color:#333333;
	font-size:16px;
	border:4px solid #0098DF;
	padding:5px;
	background:#E6E6E6;
}
#contact_form form textarea{
	height:100px;
	margin-bottom:16px;
	width:98%;
}
form fieldset	{ 
	border:0;
	}
#email_label{
	padding-top:10px;
	display:block;
}
form .required {
	color:#ff3838;
	font-weight:bold;
	font-size:0.8em
}
estilos validacion msj
label.error   { 
	font-weight:normal;
	font-size:14px;
	letter-spacing:normal;
	color:red;text-align:left;width:120px; padding-left:25px;
	background: transparent url("images/cancel.png") no-repeat scroll left; 
	}
#message { width:400px;margin:60px 0 0 230px; }
#message h2	{ font-size:150%;color:#0098DF; }
#message p	{ color:white;font-weight:bold;margin:6px 0px; font-size:100%; padding:0px;}
#checkmark	{ position:relative;top:-60px;left:-60px; }
#end{
	width:720px;
	padding-top:5px;
	margin:0px auto;
}--*/
/*--lifestream--*/
#end{clear:both; padding:20px 0px 10px;}
.social{
	width:290px;
	height:65px;
	float:left;
	padding-top:15px;
}
.social img{
	padding:5px;
}
#date{
	float:right;
}
#date h2{
	padding-top:0px;
	font-size:80px;
}
/*fancy*/
div#fancy_overlay {
	position:absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	background-color: #333;
}

div#fancy_loading {
	position: absolute;
	height: 40px;
	width: 40px;
	cursor: pointer;
	display: none;
	overflow: hidden;
	background: transparent;
	z-index: 100;
}

div#fancy_loading div {
	position: absolute;
	top: 0;
	left: 0;
	width: 40px;
	height: 480px;
	background: transparent url(images/fancy_progress.png) no-repeat;
}

div#fancy_close {
	position: absolute;
	top: -12px;
	right: -12px;
	height: 30px;
	width: 30px;
	background: transparent url(images/fancy_closebox.png) ;
	cursor: pointer;
	z-index: 100;
	display: none;
}

div#fancy_content {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 0; 
	margin: 0;
	z-index: 96;
}

#fancy_frame {
	position: relative;
	width: 100%;
	height: 100%;
	display: none;
}

img#fancy_img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border:0; 
	padding: 0; 
	margin: 0;
	z-index: 92;
}

div#fancy_title {
	position: absolute;
	bottom: -35px;
	left: 0;
	width: 100%;
	z-index: 100;
	display: none;
}

div#fancy_title table {
	margin: 0 auto;
}

div#fancy_title div {
	color: #FFF;
	font: bold 12px Arial;
	padding-bottom: 2px;
}

td#fancy_title_left {
	height: 32px;
	width: 15px;
	background: transparent url(images/fancy_title_left.png) repeat-x;
}

td#fancy_title_main {
	height: 32px;
	background: transparent url(images/fancy_title_main.png) repeat-x;
}

td#fancy_title_right {
	height: 32px;
	width: 15px;
	background: transparent url(images/fancy_title_right.png) repeat-x;
}

div#fancy_outer {
	position: absolute;
    top: 0;
    left: 0;
    z-index: 90;
    padding: 18px 18px 58px 18px;
    margin: 0;
    overflow: hidden;
    background: transparent;
    display: none;
}

div#fancy_inner {
	position: relative;
	width:100%;
	height:100%;
	border: 1px solid #444;
	background: #FFF;
}

a#fancy_left, a#fancy_right {
	position: absolute; 
	bottom: 10px; 
	height: 100%; 
	width: 35%; 
	cursor: pointer;
	background-image: url(data:image/gif;base64,AAAA);
	z-index: 100; 
}

a#fancy_left {
	left: 0px; 
}

a#fancy_right {
	right: 0px; 
}

a#fancy_left:hover {
	background: transparent url(images/fancy_left.gif) no-repeat 0% 100%;
}

a#fancy_right:hover {
	background: transparent url(images/fancy_right.gif) no-repeat 100% 100%;
}

#fancy_bigIframe, #fancy_freeIframe {
	position:absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 10;
}

div#fancy_bg {
	display: none;
}
	
div.fancy_bg {
	position: absolute;
	display: block;
	z-index: 70;
}

div.fancy_bg_n {
	top: -18px;
	width: 100%;
	height: 18px;
	background: transparent url(images/fancy_shadow_n.png) repeat-x;
}

div.fancy_bg_ne {
	top: -18px;
	right: -13px;
	width: 13px;
	height: 18px;
	background: transparent url(images/fancy_shadow_ne.png) no-repeat;
}

div.fancy_bg_e {
	right: -13px;
	height: 100%;
	width: 13px;
	background: transparent url(images/fancy_shadow_e.png) repeat-y;
}

div.fancy_bg_se {
	bottom: -18px;
	right: -13px;
	width: 13px;
	height: 18px;
	background: transparent url(images/fancy_shadow_se.png) no-repeat;
}

div.fancy_bg_s {
	bottom: -18px;
	width: 100%;
	height: 18px;
	background: transparent url(images/fancy_shadow_s.png) repeat-x;
}

div.fancy_bg_sw {
	bottom: -18px;
	left: -13px;
	width: 13px;
	height: 18px;
	background: transparent url(images/fancy_shadow_sw.png) no-repeat;
}

div.fancy_bg_w {
	left: -13px;
	height: 100%;
	width: 13px;
	background: transparent url(images/fancy_shadow_w.png) repeat-y;
}

div.fancy_bg_nw {
	top: -18px;
	left: -13px;
	width: 13px;
	height: 18px;
	background: transparent url(images/fancy_shadow_nw.png) no-repeat;
}
/* END PAGE STRUCTURE */

#pronto{
	margin:0px auto;
	width:500px;
}

/* Formulario */
/*--CONTACT--*/

#contact{min-height:550px; height:100%; position:relative; padding:120px 0; color:#fff;}

#contact_form_holder {
    /*font-family: 'Verdana';  this is a nice font-family, at least i think, if you don't like it change it <IMG src="http://web.enavu.com/wp-includes/images/smilies/icon_smile.gif" alt=":)" class="wp-smiley">  */
    /*font-variant: small-caps;  making the small letter looks like capital but keeping the size of it to smaller, looks cool */
    width:380px; /* setting a fixed width of the contact form holder will make things easier later (like aligning and such) */
}
#contact_form_holder p{
   margin:6px 0px;
   font-size:20px;
   color:#EDC83C;
   padding-left:10px;
} 
#contact_form_holder input, #contact_form_holder textarea {
    width:100%; /* make all the inputs and the textarea same size (100% of the div they are into) */
    font-family: inherit ; /* we must set this, so it inherits the font-family */
    padding:5px; /* and make a custom padding, you can set whatever you like */
	border:none;
	background:#E6E6E6 none repeat scroll 0 0;
	border:4px solid #0098DF;
	color:#333333;
	font-size:16px;
}
#contact_form_holder textarea {
    height:100px; /* i never liked small textareas, so make it 100px in height */
}
#send_message {
    width:160px !important; /* the width of the submit button  */
    font-variant: small-caps; /* nicer font-variant (like explained before) */
    /*border:2px solid #EED423;  remove the default border and put a normal black one */
    cursor:pointer;
    cursor:hand;
    font-size:25px;
    color:#EED423;
    /*background: #DDD url('images/btn_enviar.gif') no-repeat;*/
   height:45px;

}
#cf_submit_p { text-align:right; } /* show the submit button aligned with the right side */
#cf_submit_p input{border:none; background-color:#EED423; color:#000; font-size:20px; font-weight:800;}
/* styling */

.error {
    display: none; /* hide the errors */
    /* add some styling */
    padding:10px 5px;
    color: #fff;
    font-size:16px;  
	width:100%;
}
.success {
    display: none; /* hide the sucess div */
    /* add some styling */
    padding:10px 5px;
    color: #000;
   	color: #fff;
    font-size:16px;   
    width:100%;
}

#contact_logo { vertical-align: middle; }
.error img { vertical-align:top; position:relative; }
.success img { vertical-align:top; position:relative; }
#datos_contacto{
 	padding:90px 0px 0px 10px;
	width:300px;
}
#datos_contacto span {
background-position:left center;
background-repeat:no-repeat;
display:inline-block;
padding:28px 0 22px 60px;
font-size:19px;
}
.movil{ background: transparent url('images/icon_ipod.png') no-repeat;
}
.mail{background: transparent url('images/icon_mail.png') no-repeat;
}
#datos_contacto h3, #datos_contacto h4{padding:5px 0px;}