.rompefloat:after{ content: " \A "; display: block; clear: both; height: 0; }
a{ color: black; outline: none; color: #777777; }
a:hover{ color: black;}
a[rel="external"]{ background: transparent url(../img/external.gif) no-repeat right center; padding: 0 15px 0 0; text-decoration: none; }
a[rel="external"]:hover{ text-decoration: underline; }

body{ margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #777777; background: white url(../img/body.gif) repeat-x top; }

#lienzo{ width: 951px; margin: 0 auto; padding: 30px 0; background: transparent url(../img/lienzo.jpg) no-repeat top; min-height: 550px; }
#lienzo.musica{ background-image: url(../img/lienzo_musica.jpg); }

#logo{ display: block; margin: 0 auto 30px auto; }

#menu{ margin: 0 0 19px 0; padding: 0 0 0 30px; height: 45px; list-style: none; }
#menu li{ width: 285px; height: 45px; float: left; margin: 0 0 0 22px; }
#menu li:first-child{ margin: 0; }
#menu li a{ display: block; margin: 0; width: 263px; height: 45px; line-height: 35px; padding: 0 11px; background: transparent url(../img/menu_item.png) no-repeat left top; font-weight: bold; text-decoration: none; color: #b2b2b2; }
#menu li a:hover,
#menu.portada li a#mportada,
#menu.portfolio li a#mportfolio,
#menu.publicaciones li a#mpublicaciones,
#menu.generativo li a#mgenerativo,
#menu.contacto li a#mcontacto{ background-position: left bottom; color: #777777; }

h1{ margin: 0; font-size: 1em; display: none; }

#contenido{ padding: 30px 0 30px 30px; }

#contenido #ultimos{ border: 1px solid #e7e7e7; width: 275px; height: 172px; overflow: hidden; position: relative; background-color: white; float: left; }
#contenido #ultimos img{ display: block; margin: 0; border: 0; position: absolute; }
#contenido #ultimos img.vista{ z-index: 10; }
#contenido #ultimos img.ultima{ z-index: 1; }

#contenido #info{ float: right; width: 584px; margin: 0 30px 30px 30px; }
#contenido #info p{ margin: 0 0 20px 0; }
#contenido #info ul{ margin: 0 0 20px 13px; padding: 0 0 0 0; list-style: square; color: #777777; }
#contenido #info ul li{ margin: 0 0 17px 0; }

#contenido #mosaico{ margin: 0; padding: 0; list-style: none; }
#contenido #mosaico li{ width: 277px; height: 174px; float: left; margin: 0 30px 30px 0; position: relative; overflow: hidden; }
#contenido #mosaico li a img{ border: 1px solid #e8e8e8; display: block; margin: 0; position: absolute; }
#contenido #mosaico li a:hover img{ border: 1px solid #cfcfcf; }
#contenido #mosaico ul.portfolio_tecnica{ position: absolute; z-index: 9; margin: 0; padding: 2px; top: 0; right: 0; width: 22px; }
#contenido #mosaico ul.portfolio_tecnica li{ display: block; height: 20px; width: 20px; margin: 0 0 1px 0; float: right; text-indent: -9999px; line-height: 20px; background-position: right top; background-repeat: no-repeat; background-color: #f0f0f0; border: 1px solid #d2d2d2; cursor: pointer; font-size: .9em; }
#contenido #mosaico ul.portfolio_tecnica li.dis{ background-image: url(../img/icon_dis.gif); }
#contenido #mosaico ul.portfolio_tecnica li.maq{ background-image: url(../img/icon_maq.gif); }
#contenido #mosaico ul.portfolio_tecnica li.scr{ background-image: url(../img/icon_scr.gif); }
#contenido #mosaico ul.portfolio_tecnica li.php{ background-image: url(../img/icon_php.gif); }
#contenido #mosaico ul.portfolio_tecnica li.otr{ background-image: url(../img/icon_otr.gif); }
#contenido #mosaico ul.portfolio_tecnica li.seo{ background-image: url(../img/icon_seo.gif); }

#ficha{ height: 364px; width: 889px; padding: 0; margin: 0 30px 10px 0; border: 1px solid #d2d2d2; background-color: #fbfbfb; }
#ficha img.foto{ border-right: 1px solid #d2d2d2; display: block; margin: 0; float: left; }
#ficha #datos{ float: right; width: 246px; padding: 30px; }
#ficha #datos h2{ font-size: 1.3em; margin: 0 0 30px 0; padding: 0; color: #777777; }
#ficha #datos dl.info{ margin: 0 0 30px 0; padding: 0; }
#ficha #datos dl.info dt{ float: left; width: 40px; text-align: right; margin: 0 5px 5px 0; color: #b2b2b2; }
#ficha #datos dl.info dd{ margin: 0 0 5px 0; padding: 0; }

#ficha #datos ul.tecnica{ margin: 0 0 30px 0; padding: 0 0 0 30px; list-style: none; }
#ficha #datos ul.tecnica li{ color: #b2b2b2; background: transparent url(../img/icon_infooff.gif) no-repeat left center; padding: 0 0 0 13px; margin: 0 0 5px 0; }
#ficha #datos ul.tecnica li del{ text-decoration: none; }
#ficha #datos ul.tecnica li.ok{ background-image: url(../img/icon_infoon.gif); color: #777777; }

#ficha #datos dl.seo{ margin: 0; padding: 0; }
#ficha #datos dl.seo dt{ margin: 0 5px 5px 0; color: #b2b2b2; }
#ficha #datos dl.seo dd{ margin: 0 0 5px 30px; padding: 0; }

ul#paginacion{ margin: 0 30px 0 0; padding: 0; list-style: none; height: 30px; line-height: 30px; position: relative; border: 1px solid #d2d2d2; background-color: #fbfbfb; }
ul#paginacion li{ width: 100px; position: absolute; padding: 0 5px; }
ul#paginacion li#pag_siguiente{ left: 0; text-align: left; }
ul#paginacion li#pag_portfolio{ float: none; margin: 0 auto; position: relative; text-align: center; }
ul#paginacion li#pag_generativo{ float: none; margin: 0 auto; position: relative; text-align: center; width: 160px; }
ul#paginacion li#pag_anterior{ right: 0; top: 0; text-align: right; }
ul#paginacion li a{ text-decoration: none; }

#contactoform{ border: 1px solid #d2d2d2; background-color: #fbfbfb; margin: 0 30px 0 305px; width: 524px; padding: 30px 30px 15px 30px; color: #777777; }
#contactoform p{ margin: 0 0 15px 0; text-align: center; }
#contactoform p#alerta{ color: #b74666; }
#contactoform p.error input, #contactoform p.error textarea{ border-color: #b74666 !important; }
#contactoform form{ margin: 0; padding: 0 45px; }
#contactoform form p{ height: 20px; line-height: 20px; }
#contactoform form p label{ display: block; float: left; text-align: right; padding: 0 5px; width: 100px; }
#contactoform form p input{ border: 1px solid #d2d2d2; display: block; width: 190px; padding: 1px 5px; font-family: Arial, Helvetica, sans-serif; color: #777777; }
#contactoform form p.comentarios{ height: 102px; }
#contactoform form p.comentarios textarea{ border: 1px solid #d2d2d2; display: block; width: 295px; height: 96px; padding: 2px 0 2px 5px; font-family: Arial, Helvetica, sans-serif; font-size: 1em; overflow: auto; }
#contactoform form p.submit{ height: 28px; }
#contactoform form p.submit input{ width: 100px; display: block; margin: 0 0 0 110px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: .9em; padding: 5px 10px; border: 1px solid #d2d2d2; background-color: white; color: #777777; cursor: pointer; }
#contactoform form p.submit input:hover, #contactoform form p input:focus{ color: black; border-color: #777777; }

a#paged{ display: block; margin: 0; padding: 0; text-indent: -9999px; width: 50px; height: 60px; background: transparent url(../img/page_d.jpg) no-repeat top; position: absolute; top: 0; right: 0; }
a#pagei{ display: block; margin: 0; padding: 0; text-indent: -9999px; width: 50px; height: 60px; background: transparent url(../img/page_i.jpg) no-repeat top; position: absolute; top: 0; left: 0; }

.publicacion{ background-color: #fbfbfb; height: 275px; border: 1px solid #e7e7e7; margin: 0 30px 30px 0; }
.publicacion img.cover{ border-right: 1px solid #e7e7e7; border-left: 1px solid #e7e7e7; display: block; margin: 0; float: left; }
.publicacion .col1{ background-color: white; width: 215px; height: 215px; border-right: 1px solid #e7e7e7; float: left; margin: 0 30px 0 0; padding: 30px; text-align: justify; }
.publicacion .col1 h2{ font-size: 1.3em; color: #777777; margin: 0 0 30px 0; }
.publicacion .col1 p{ margin: 0 0 10px 0; }
.publicacion .col2{ width: 215px; float: right; padding: 60px 30px 30px 30px; }
.publicacion .col2 ol{ margin: 0; padding: 0; font-weight: bold; }
.publicacion .col2 ol li{ margin: 0 0 5px 0; }
.publicacion .col2 ol li small{ font-size: .8em; font-weight: normal; color: #b2b2b2; padding: 0 0 0 5px; }


