@font-face {
	font-family: "texgyreheros";
	src: url(http://www.castroferro.com/fonts/TeX-Gyre-Heros/texgyreheros-regular.otf);
}

@font-face {
	font-family: "texgyreheros-bold";
	src: url(http://www.castroferro.com/fonts/TeX-Gyre-Heros/texgyreheros-bold.otf);}




/*
@font-face {
	font-family: "Cantarell";
	src: url(http://www.castroferro.com/fonts/cantarell/Cantarell-Regular.ttf);
}

@font-face {
	font-family: "Cantarell";
	src: url(http://www.castroferro.com/fonts/cantarell/Cantarell-Regular.eot);
}

@font-face {
	font-family: "Cantarell Bold";
	src: url(http://www.castroferro.com/fonts/cantarell/Cantarell-Bold.ttf);
}

@font-face {
	font-family: "Cantarell Bold";
	src: url(http://www.castroferro.com/fonts/cantarell/Cantarell-Bold.eot);
}
 */
 
html {background-color: #fafafa;}
 
body {color: #333;background-color: #fafafa;text-shadow:	rgba(255, 255, 255, .01) 0px -1px 1px; margin-top:10em;margin-bottom: 20em;

}

#logo h1 {visibility: hidden;}

p, li {font-family: "texgyreheros", sans-serif;}

p.right {text-align: right;}

#estudio #contenido p {font-size: 1em;color:#bbb;}

#accessibility
{
	visibility: hidden;
	display: none;
}


#menu ul, #menu ul li {list-style-type: none;margin:0; margin-right:30px;display: inline;text-transform: lowercase;}
#submenu {z-index: 1;}
#submenu ul, #submenu ul li {list-style-type: none;margin:0;padding-right:0px;}




#submenu {display:none;}


ul li {list-style-image: url(/images/arrow.gif);list-style-position: outside;}

#estudio #contenido li {color:#bbb;}

#estudio #contenido a {color:#666;}


/*#contenido {height:378px;overflow: hidden;}
#texto_proyecto {height: 306px;overflow: hidden;}*/

#copyright p, #twitter p {color: #bbb;text-transform: lowercase;}
#copyright p a, #twitter p a {color: #666;text-transform: lowercase;}


div.resumen p {color:#bbb;}
div.resumen a {color:#666;}


div.article-image {height:324px;}

a
{
	text-decoration: none;

}

a:link, a:visited { color: #000;font-weight: bold;}

a:hover
{
	color: #999482;
		/*font-family: "Cantarell Bold", sans-serif*/

	/*border-bottom: 1px solid #e5e5e5;*/
}

a.actual {	font-weight: normal;}








/* Encabezados
-------------------------------------------------------------- */


h1 {font-size: 1.2em; line-height: 1.1;font-weight: bold; margin-bottom: 0.5em;  font-family: "texgyreheros-bold", sans-serif; text-transform: lowercase;
}

h1 span {font-weight:normal;font-family: "texgyreheros", sans-serif;}

h2 {font-size: 1em; line-height: 1.1;font-weight: bold; margin-bottom: 0.5em;  font-family: "texgyreheros-bold", sans-serif; text-transform: lowercase;
}

#blog h2 p {font-size: 1.2em; line-height: 1.1;font-weight: normal; margin-bottom: 0.5em;  font-family: "texgyreheros", sans-serif; text-transform: lowercase;color:#bbb;}

#blog h3 {font-size: 1.2em; line-height: 1.1;font-weight: normal; margin-bottom: 0.5em;  font-family: "texgyreheros", sans-serif; text-transform: lowercase;}


h3,h4,h5,h6, p {font-size: 1em; line-height: 1.1;font-weight: normal; }




/* Color */

h3 p {color:#333;}
p {color: #555;}
.fecha {color: #999482;}
strong {color: #333;}






/* Use this to create a horizontal ruler across a column. */
hr {
  background:  #e8e8e3; 
  color:  #e8e8e3;
  clear: both; 
  float: none; 
  width: 100%; 
  height: 1px;
  margin: 0 0 1.4em;
  border: none; 
}

hr.space {
  background:  #fafafa;
  color:  #fafafa;
  height: 1em;
}

hr.space2 {
  background:  #fafafa;
  color:  #fafafa;
  height: 0.5em;
}

hr.lineasuave
{background: #e8e8e3;
color:#e8e8e3;}

hr.lineadura {height:2px;}

table {width:100%;}




ul.thumbs, ul.thumbs li {list-style-type: none; display: inline; margin:0;padding-right:10px;padding-bottom: 18px;}



ul#paginacion, ul#paginacion li {list-style-type: none; display: inline;margin:0;margin-right: 10px}


#pag ul, #pag li {list-style-type: none; display: inline;margin:0;margin-right: 10px}
li.pgNum {list-style-type: none; display: inline;margin:0;margin-right: 10px}


ul#paginacion li:hover {
  

  color: #999482;
}
ul#paginacion li.pgCurrent{
  color:#333;
  font-weight: bold;
}


#paginacion {vertical-align: bottom;}

#pag button {}




/* Forms */

fieldset    { padding:0em; margin: 0 0 1.5em 0; border: 0; }
legend      { font-weight: bold; font-size:1.2em; }
label {text-transform: lowercase;}

input, textarea {border-style: solid; border-width: 1px; border-color:#ddd; background-color: #fff;text-transform: lowercase;}

input {margin-left: 0; margin-bottom: 1em; margin-right: 0em; margin-top: 0em; width: 190px;}
input:focus, textarea:focus         { border:0; background:#202020; color:#fff;}


textarea {width: 310px;height: 90px;}
INPUT[type="radio"] {  }
INPUT[type="checkbox"] {  }
INPUT[type="submit"] { width: 110px;}

input.text, input.title   { width: 300px; margin:0.5em 0.5em 0.5em 0; }
input.text, input.title   { border:0; background:#edede6; padding:5px; }
input.text:focus,
input.title:focus         { border:0; background:#202020; color:#fff;}
input.title               { font-size:1.5em; }


a.button, button {display:block; float:left;margin:0;padding-bottom: 1em;padding-left:0;padding-right:0;padding-top:1em;border:0;font-size: 1em;cursor:pointer;text-decoration: none;line-height: 130%;background-color: transparent;font-weight: bold;color:#333;text-transform: lowercase;}


.focusField{  
        border:solid 2px #73A6FF;  
        background:#EFF5FF;  
        color:#000;  
    }  
    .idleField{  
        background:#EEE;  
        color: #6F6F6F;  
        border: solid 2px #DFDFDF;  
    }  




.box {padding:0;margin:0;border:1px solid #ccc;}





div.scrollable { 
 
    position:relative; 
    overflow:hidden; 
    width: 550px; 
    height:108px;
    
} 

div.scrollable2 {
    position:relative; 
    overflow:hidden; 
    width: 950px; 
    height:108px;;}
 

div.scrollable div.items, div.scrollable2 div.items2 { 
    width:20000em; 
    position:absolute; 
} 
 



div.scrollable div.items div, div.scrollable2 div.items2 div { 
    
    float:left;
     
} 
 
div.items div.active, div.items2 div.active { 
    z-index:9999;
	position:relative;
}



div.scrollable img, div.scrollable2 img {
	margin-left: 0px;
	margin-bottom: 0px;
	margin-right: 10px;
	margin-top: 1em;
	float:left;
	background-color:#fff;
	cursor:pointer;
	width:70px;
	height:72px;
	
}

div.scrollable2 img {padding:2px;border:2px solid #fff;}



.scrollable, .scrollable2 {
	float:left;	
}



a.disabled {
	visibility:hidden !important;		
} 	




#image_wrap { 
float: left;
  margin-right: 0px;
    width:550px; 
    margin-bottom:1em;
     
 
 }
 
 
 #image_wrap2 { 
    width:950px; 
    margin-bottom:1em;
     
 
 }
 
 
 
 
 a.browse {font-weight:bold; }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 /* the overlayed element */ 
.simple_overlay { 
     
    /* must be initially hidden */ 
    display:none; 
     
    /* place overlay on top of other elements */ 
    z-index:10000; 
     
    /* styling */ 
    background-color: #fafafa;
    border:4px solid #fff;
     
    width:470px;     
    min-height:252px; 
     
    /* CSS3 styling for latest browsers */ 
    -moz-box-shadow:0 0 90px 5px #333; 
    -webkit-box-shadow: 0 0 90px #333;     
} 
 
/* close button positioned on upper right corner */ 
.simple_overlay .close { 
    background-image:url(http://flowplayer.org/tools/img/overlay/close.png); 
    position:absolute; 
    right:-15px; 
    top:-15px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
}



















#demotip { 
    display:none; 
    background-color: #333; 
    font-size:12px;
    text-align: center; 
    height:36px; 
    width:150px; 
    color:#fff; 
        z-index:10000; 

    /* CSS3 styling for latest browsers */ 
    -moz-box-shadow:0 0 90px 5px #333; 
    -webkit-box-shadow: 0 0 90px #333;      
    
    
    
  
}





/* Texto de enlace de proyectos y concursos
-------------------------------------------------------------- */


#image_wrap2 {
    position: relative;
  }
  .titulo_wrap2 {
    position: absolute;
    bottom: 18px;
    left: 10px;
  }
  .titulo_wrap2 h2 {
    font-size: 1em;
    background-color: #333;
    /*background-color: rgba(51,51,51, 0.8);*/
    padding: 5px;
  }
  .titulo_wrap2 h2 a {
    color: #fff;
  }
  .titulo_wrap2 span {
    background-color: #fff;
    /*background-color: rgba(51,51,51, 0.8);*/
    padding: 5px;
    color:#333;
    
  }
  .titulo_wrap2 span a {color:#333;font-weight: normal;}
  
  
  
  
  .browse {
    color: #333;
    cursor: pointer;
    font-size: 1.5em;
}