* { margin: 0; padding: 0;}

html, body { height: 100%; margin:0; padding:0; }


body { background: rgb(37, 37, 37) url(../img/bg.jpg) repeat; font-family: Tahoma, Geneva, sans-serif; font-size: 12px; color: #CCC; 
	   line-height: 200%;  }
	   
a { color: rgb(255, 204, 0); padding: 0; border: 0; display: inline; float: none;   }

a:hover {color: #CCC; border: 0; }	   

b {color: rgb(255, 204, 0)}
/*--ESTRUCTURALES--*/

#contenedor { width: 100%; height: 100%; min-height: 100% !important; position: absolute; margin: 0px; }

#wrap { width: 960px; height: 4500px; position: relative; margin-left: -480px; left: 50%; }

#header { width: 960px; height: 150px; position: relative; }

#LOGO { float: left; position: relative; width: 235px; margin-top: 5px;}

#idioma { float: right; position: relative; width: 80px; font-size: 18px; display: block; height: 20px; margin-top: 20px;}
#idioma a{ text-decoration: none;}


#twitter { background: url(../img/secciones/last_tweet2.png) no-repeat; overflow: hidden; position: relative; float: left; width: 478px; height: 110px; margin-left: 28px; margin-top: 10px;  }
#latest_tweet {width: 350px; padding-top: 10px; margin-left: 100px; height: 75px; overflow:hidden;  }

.SOCIALS { float: right; position: relative; width: 218px; margin-top: 10px; margin-right: 0px; }
#iconos li { float:right; position:relative; overflow: hidden; margin-right:0px; padding: 0px; }
#iconos a { text-decoration: none; outline: none; color:#ccc; display: block; width: 38px; padding: 0px; cursor:pointer; }
#iconos span { width: 100px; height: 38px; position: absolute; display: none; line-height:110%; color:#ccc; padding-left: 0px; }

/*--TIPOGRAFIA--*/

h2 { font-size: 18px; color: rgb(255, 204, 0); text-decoration: none; }

#WORKwrap h3 { font-size: 14px; color: rgb(255, 204, 0); margin-left: 10px; }
/*--NAVEGACION y LINKS--*/


.navegador {width: 950px; height: 35px !important; border-bottom: 1px solid rgb(255, 204, 0); margin-top: 0px; margin-left: 10px; 
			position: relative; margin-top: -42px; float: left;} 

ul li {float: right; padding-left: 30px;}
.menu { width: 715px;  float: right;  position: relative; padding-top: 10px; margin-right: 7px;  }
.menu a {color: #CCC; text-decoration: none; font-size: 18px;  }
.menu a:hover { color: rgb(255, 204, 0); }
.menu a.selected { color: rgb(255, 204, 0); }
.menu ul li { float: right; padding-left: 35px; }
/*---------------------------------------------------------------------*/

.sidebar {width: 265px; height: auto; position: relative; float: left; margin-left: 7px; margin-top: -15px; }
.sidebar div {padding-bottom: 20px; }

.linea {width: 400px; float: right; border-bottom: 1px solid rgb(81, 72, 30); padding-top: 0px; margin-right: 7px; }
.clear{clear:both; display:block; overflow:hidden; width:0; height:0}
.header-secc { width: 665px; height: 260px; }
.quote { position: relative; margin-top: 0px; float: right; width: 350px; clear:both; }
.quote2 { position: relative; margin-top: 0px; float: left; width: 350px; }
.frase { position: relative; width: 450px; height: 75px; float: left; margin-top: 20px; margin-left: 330px; }
/*---------------------------------------------------------------------*/

/*--HOME--*/

#HOME { width: 960px; position: relative; height: auto; margin-top: 20px; }
#HOMEwrap { width: 640px; position: relative; float: left; margin-left: 40px; margin-top: -10px; height: 430px; }
#sideplan { background: url(../img/secciones/planning.png) no-repeat; width: 275px; height: 315px; z-index: -1; }
#REEL {margin-top: 20px;}

/*--HOME WORKING ON--*/

#WORK-on { width: 640px; position: relative; float: right; margin-left: 0px; margin-top: 10px; height: 450px; margin-right: 7px; }

#WORK-img { position: relative; width: 640px; height: 380px; float: right; margin-top: 50px;  }

ul#slide_nav li,ul#wportfolio{ list-style:none; }
ul#wportfolio {position: relative; margin-left: -30px; }
ul#wportfolio img{ width: 640px; height: 360px; position: relative;  }

ul#slide-nav { margin-left: 575px; position: relative; width: 70px; }

ul#slide-nav li { background-image: url(../img/secciones/button.png); display: block; float: left; height: 11px; list-style: none; 		
				  padding: 0px; margin: 0px; width: 7px; background-repeat: no-repeat; padding-left: 10px; }
				  
ul#slide-nav li#button_selected { background-image: url(../img/secciones/button_selected.png); background-repeat: no-repeat; }


ul#wportfolio-desc{ color: #CCC; text-align: left; padding: 3px; list-style: none; margin-left: -330px; margin-top: 70px; 
					position: relative; }

ul#wportfolio-desc h3{ font-size:16px; margin-bottom:8px; color: rgb(255, 204, 0); }

#slide-nav li:hover{ cursor: pointer; z-index: 5000; }

p.txtwp { width: 200px; }
p.linkswp { font-size: 14px; font-weight: 600; margin-top: 30px; }

/*---------------------------------------------------------------------*/

/*--ABOUT--*/
#ABOUTL { width: 960px;  height: auto; position: relative; float: left; margin-top: 30px;}

#ABOUT { width: 960px;  height: auto; position: relative; float: left; margin-top: 40px;}

#ABOUTwrap { width: 640px; position: relative; float: left; margin-left: 27px; margin-top: 10px; height: 200px;  }

#txt_ABOUT {width: 640px; margin-left: 10px; height: 200px; margin-top: 20px; }

#txt_ABOUT_WHAT {width: 640px; margin-left: 10px; margin-top: 20px; margin-bottom: 0px; height: auto; }

#arbol { background: url(../img/secciones/arbol.png) no-repeat; overflow: hidden; width: 275px; height: 325px;}
/*---------------------------------------------------------------------*/

/*--SERVICES--*/
#SERVICESL { width: 960px;  height: auto; position: relative; float: left; margin-top: -30px;}

#SERVICES { width: 960px;  height: auto; position: relative; float: left; margin-top: 40px;  }

#SERVICESwrap { width: 640px; position: relative; float: left; margin-left: 27px; margin-top: 15px; height: 900px;}

#txt_SERVICES {width: 640px; margin-left: 10px; height: 850px; margin-top: 40px; position: relative; line-height: 200%; }

.acordeon {  padding: 0; width: 640px; }

/*.acordeon a, a:hover  {text-decoration: none; display: block;}*/

.titulo_ac {  width: 640px;}
.contenido_ac { margin-bottom: 20px; margin-top: 5px;}

.acordeon div.titulo_ac a{ display: block; position: relative; width: 640px; padding: 5px 0; padding-left: 8px;
						   text-decoration: none; }
.acordeon div.contenido_ac{ width: 640px;}
.separaservice { width: 640px; border-bottom: 1px solid rgb(81, 72, 30); height: 1px; position: relative;  }
/*---------------------------------------------------------------------*/

/*--WORK--*/
#WORKL { width: 960px;  height: auto; position: relative; float: left; margin-top: 50px;}

#WORK { width: 960px;  height: auto; position: relative; float: left; margin-top: 40px;  }

#WORKwrap { width: 640px; position: relative; float: left; margin-left: 27px; margin-top: 10px; height: auto; }

#txt_WORK {width: 640px; margin-left: 10px; height: 200px; margin-top: 25px;}

/*--PREVIEW SLIDER OF WORK--*/

#PRWork { width: 640px; position: relative; float: left; margin-top: -40px;  }

#PRWork div {margin-left: 13px; margin-bottom: 20px;}

.marco { width: 300px; height: 150px; float:left;  background:#161613;  border: solid 3px rgb(255, 204, 0); 
		 overflow: hidden; position: relative; }
		 
.marco img { position: absolute; top: 0; left: 0; border: 0; }

.captionfull .boxcaption {  top: 260px;  left: 0;  } 

.marco p{ padding: 0 10px; }

/*--VIEW MORE WORK--*/

#slide_panel {width: 640px; display: none; position: relative; float: right; margin-top: 10px; overflow: hidden; height: auto;}



.slide_button { background: url(../img/work/plus_minus_icon.png) no-repeat right 5px; text-align: center; height: 32px;
				padding: 2px 2px 0 0; display: block; color: #fff; text-decoration: none; position: relative; width: 200px }

.slide_div { margin: 0; padding: 0 15px 0 0; float:right; margin-top: 10px; }

.minus_icon { background-position: right -33px; position: relative; }



#mwork div {width: 300px; height: 150px; position: relative; float: left; margin-left: 13px; margin-bottom: 20px; }

/*---------------------------------------------------------------------*/

/*--CONTACT COOL MOOD--*/
#CONTACTL { width: 960px;  height: auto; position: relative; float: left; margin-top: 50px;}

#CONTACT {  width: 960px;  height: auto; position: relative; float: left; margin-top: 40px;  }

#CONTACTWrap { width: 640px; position: relative; float: left; margin-left: 25px; margin-top: 10px; height: 650px; }

#txt_CONTACT {width: 640px; margin-left: 10px; height: auto; padding: 10px;}


.SOCIALS_CT { float: left; position: relative; width: 260px; margin-top: 10px; }
#iconos2 li { float:left; position:relative; overflow: hidden; margin-right:0px; padding: 0px; }
#iconos2 a { text-decoration: none; outline: none; color:#ccc; display: block; width: 38px; padding: 0px; cursor:pointer; }
#iconos2 span { width: 100px; height: 38px; position: absolute; display: none; line-height:110%; color:#ccc; padding-left: 0px; }


/* FORM */
#formCT { width: 640px; height: auto; position: relative; float: left; margin-top: 40px; }
#form { width: 640px; height: auto; position: relative; float: left; padding-left: 10px; line-height: 250%;}
.fprimero { width: 640px; position: relative; float: left;  }
#touch { position: relative; float: left; width: 640px;  }
#touch ul li {float: left;  }



input { margin-bottom: 15px; display: inline; }
label  { width: 130px;  float: left; text-align: left; display: inline; }
.textbox { height: 15px; margin-top: 10px; }
.textarea { height: 80px; margin-top: 10px; overflow: auto; }
.txtform {margin-left: 15px;}

.botones {margin-left: 420px; margin-top: 10px;}
.button { text-align: center; float: left; margin-left: 10px; border: 0; width: 95px; height: 40px; cursor: pointer; font-family: Tahoma, Geneva, sans-serif; font-size: 18px; color: #ccc; background: none; display: inline; }
.button:hover { border: 0; width: 95px; height: 40px; color: #FF0 }

.notification_error { height: auto; width: 300px; padding: 8px; text-align: left; background: rgb(255, 204, 0); position: relative; color:#333  }

.notification_ok { height: auto; width: 300px; padding: 8px; text-align: left; position: relative; margin-top: 40px;   }

#note { margin-top: 0px; width: 300px; position: relative; padding: 5px; float: left;  }
#noteCT { margin-top: 0px; width: 300px; position: relative; padding: 5px; float: left; padding-top: 250px;   }


/*--REQUEST QUOTE BOX--*/

/* Base Superbox Styles */
#superbox-overlay{position:fixed;top:0;left:0;z-index:9998;width:100%;height:100%;}
#superbox-wrapper{position:fixed;z-index:9999;top:0;display:table;width:100%;height:100%;}
#superbox-container{position:relative;display:table-cell;width:100%;height:100%;margin:0;padding:0;vertical-align:middle;}
#superbox{margin:0 auto;padding:0;}
#superbox-container .loading{margin:0;text-align:center;}

/* IE7 */
*:first-child+html #superbox-container{position:absolute;top:50%;display:block;height:auto;}
*:first-child+html #superbox{position:relative;top:-50%;display:block;}
/* IE6 - Thanks to Thickbox for IE expressions */
* html #superbox-container{position:absolute;top:50%;display:block;height:auto;}
* html #superbox{position:relative;top:-50%;display:block;}
* html #superbox-overlay{position:absolute;height:expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight + 'px' : document.body.offsetHeight + 'px');}
* html #superbox-wrapper{position:absolute;margin-top:expression(0 - parseInt(this.offsetHeight / 2) + (document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');}

/* Default Theme */
#superbox-overlay{background:#000;}
#superbox-container .loading{text-align:center;font-size:18px;color:rgb(255, 204, 0);}
#superbox{padding:10px;background:#fff;}
#superbox-innerbox{padding:10px 0;}
#superbox.image{text-align:center;}
#superbox .close,
#superbox .nextprev{overflow:hidden;margin:0;}
#superbox .close a { cursor: pointer; float: right; color: #333 }

/*------------------------------------------------------------------------*/

.tooltipTitle { font-weight: bold; color:#CCC; }
#tooltip { position: absolute; padding: 4px; color: #FFF;  display: none; text-align: left; background-color: #000; }