@import "reset.css";

body {
  font:normal 11px/14px "Lucida Grande", "Lucida Sans Unicode", Arial,sans-serif;
  margin:0;
  background:#e0e0e0 url('/app_ui/common/imgs/layout/backsite.jpg') top center no-repeat;
  color:#666;
}

a, a:hover, a:visited {text-decoration:none;color:#d00707;;}
a:hover {text-decoration:underline;}
button {font:bold 11px/15px Arial,sans-serif;color:#d00707;}
.left {float:left;}
.right {float:right;}
.mensaje {background:#FCFBE5;border:1px solid #F5F4DD;margin:15px 0;padding:10px;color:#666;}
.gris {color:#bbb;}
select {font:normal 11px/13px Arial,sans-serif;}


#container {width:996px;margin:auto;position:relative;}

.contenido {width:712px;float:left;margin-top:62px;}
.contenido .modulo {background:url("/app_ui/common/imgs/layout/cajagrandetop1.gif") no-repeat;padding-top:12px;}
.contenido .padding {padding:5px 15px 15px;background:#fff;;border:1px solid #dedede;border-top:0;border-bottom:0;overflow:hidden;}
.contenido .bottom {background:url("/app_ui/common/imgs/layout/cajagrandebottom.gif") no-repeat;height:12px;width:712px;overflow:hidden;_margin-left:2px;line-height:12px;margin-bottom:15px;}
.contenido .moduloGris {background:url("/app_ui/common/imgs/layout/cajaGrisTop.gif") no-repeat;padding-top:12px;}
.contenido .moduloGris .padding {background:#666666;padding:5px 15px 15px;border:0;color:#fff;}
.contenido .moduloGris .bottom {background:url("/app_ui/common/imgs/layout/cajaGrisBottom.gif") no-repeat;height:12px;width:712px;overflow:hidden;_margin-left:2px;line-height:12px;margin-bottom:15px;}

.sidebar {float:right;width:270px;margin-top:62px;}
.sidebar .modulo {background:url("/app_ui/common/imgs/layout/cajachicatop.gif") no-repeat;padding-top:12px;}
.sidebar .modulo .padding {background:#fff;border:1px solid #cfcfcf;border-top:0;border-bottom:0;padding:0 15px;}
.sidebar .bottom {background:url("/app_ui/common/imgs/layout/cajachicabottom.gif") no-repeat;height:12px;width:270px;overflow:hidden;line-height:12px;margin-bottom:10px;}

/* Solapas top */

.solapas {position:absolute;top:35px;left:470px;width:214px;}
.solapas a, .solapas span {display:block;width:107px;height:28px;float:left;overflow:hidden;line-height:85px;}
.solapas a.fotos {background:url("/app_ui/common/imgs/layout/solapafotos.gif") no-repeat;}
.solapas span.fotos {background:url("/app_ui/common/imgs/layout/solapafotos1.gif") no-repeat;}
.solapas a.fotos:hover {background-position:0 -28px;}

.solapas a.invitacion {background:url("/app_ui/common/imgs/layout/solapavideos.gif") no-repeat;}
.solapas span.invitacion {background:url("/app_ui/common/imgs/layout/solapavideos1.gif") no-repeat;}
.solapas a.invitacion:hover {background-position:0 -28px;}

.solapas a.on {cursor:default;}


/* Invitacion */

h3.personas {width:165px;height:17px;background:url("/app_ui/common/imgs/layout/tituloPersonasInvitadas.gif") no-repeat;overflow:hidden;line-height:90px;margin:15px 0 10px 0;}
ul.personas {margin-top:10px;}
ul.personas li {position:relative;background:#f0f0f0 url("/app_ui/common/imgs/layout/fondolistapersonas1.gif") no-repeat;padding:20px 15px 25px 20px;overflow:hidden;_margin-top:-3px;}
ul.personas li.alt {background:#f9f9f9 url("/app_ui/common/imgs/layout/fondolistapersonas2.gif") no-repeat;}
ul.personas li label.nombre {font:normal 18px/20px Arial,sans-serif;margin:0;padding:0;}
ul.personas li label.nombre.editado {display:block;margin-bottom:5px;}
ul.personas li .estado {margin:15px 0;}
ul.personas li .estado label, ul.personas li .menor label{color:#ea252d;}
ul.personas li .plato {margin:10px 0 0 5px;}
ul.personas li .menor {position:absolute;right:15px;top:20px;text-align:right;}
ul.personas li .email {position:absolute;right:15px;top:55px;text-align:right;}
ul.personas li .apodo {position:absolute;right:15px;top:85px;text-align:right;}
ul.personas li input, ul.personas li select {font:normal 11px Arial,sans-serif;}
ul.personas li .email input, ul.personas li .apodo input {border:1px solid #c0c0c0;padding:3px;font:normal 13px Georgia,serif;margin-left:5px;vertical-align:middle}
ul.personas li select {width:140px;}


.invitadomensaje {margin:20px 0;}
.invitadomensaje h3 {background:url("/app_ui/common/imgs/layout/titulomensaje.gif") no-repeat;width:114px;height:17px;overflow:hidden;line-height:90px;}
.invitadomensaje p {font:normal 11px "Lucida Grande", "Lucida Sans Unicode", arial,sans-serif;margin:4px 0 10px;}
.invitadomensaje textarea {width:670px;_width:640px;border:1px solid #c0c0c0;height:60px;font:normal 13px/17px "Lucida Grande", "Lucida Sans Unicode", arial, sans-serif;padding:5px;}

.comentarioInvitado {border:1px solid #e2e2e2;padding:10px;margin-top:15px;}

.botones {text-align:center;}
.edit.right {display:block;padding:10px 5px 0;}
.logout.right {display:block;padding:5px 5px 0;}

.agregarAlbum {background:url("/app_ui/common/imgs/layout/fondoAgregarAlbum.gif") no-repeat;padding:10px 10px 10px 10px;line-height:25px;margin-bottom:5px;height:30px;letter-spacing:-1px;}
.agregarAlbum b {display:block;margin:0 10px 0 0;padding:0 10px 0 0;float:left;border-right:1px solid #eee;}
.agregarAlbum input {border:1px solid #eee;margin:0 5px;padding:3px 2px;height:14px;font:normal 11px/14px "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif;vertical-align:middle;width:170px;}
.agregarAlbum button {float:right;margin-top:5px;letter-spacing:0;}







/* Fotos */

ul.navegadorFotos {background:url("/app_ui/common/imgs/layout/fondoNavegador.gif") bottom left no-repeat;padding:3px 0 0 5px;margin-bottom:10px;}
ul.navegadorFotos li {float:left;padding:3px 10px 10px;}

ul.navegadorFotos li a {display:block;height:12px;overflow:hidden;text-indent:-1000px;;}
ul.navegadorFotos li.fotosnav a {width:33px;background:url("/app_ui/common/imgs/layout/navegador-fotos.gif") 0 0 no-repeat;height:12px;}
ul.navegadorFotos li.fotosnav.on a {background-position:0 -15px;}
ul.navegadorFotos li.fotosnav a:hover {background-position:0 -30px;}
ul.navegadorFotos li.albums a {width:67px;background:url("/app_ui/common/imgs/layout/navegador-misalbums.gif") 0 0 no-repeat;}
ul.navegadorFotos li.albums.on a {background-position:0 -15px;}
ul.navegadorFotos li.albums a:hover {background-position:0 -30px;}
ul.navegadorFotos li.misfotos a {width:53px;background:url("/app_ui/common/imgs/layout/navegador-misfotos.gif") 0 0 no-repeat;}
ul.navegadorFotos li.misfotos.on a {background-position:0 -15px;}
ul.navegadorFotos li.misfotos a:hover {background-position:0 -30px;}
ul.navegadorFotos li.miscomentarios a {width:96px;background:url("/app_ui/common/imgs/layout/navegador-miscomentarios.gif") 0 0 no-repeat;}
ul.navegadorFotos li.miscomentarios.on a {background-position:0 -15px;}
ul.navegadorFotos li.miscomentarios a:hover {background-position:0 -30px;}

ul.navegadorFotos li.upload {float:right;position:relative;padding-right:40px;}
ul.navegadorFotos li.upload a.icon {width:33px;height:33px;text-indent:0;position:absolute;top:1px;right:0;} 
ul.navegadorFotos li.upload a {width:86px;height:17px;background:url("/app_ui/common/imgs/layout/navegador-upload.gif") 0 0 no-repeat;margin-top:-5px;}
ul.navegadorFotos li.upload a.on {background-position:0 -21px;}
ul.navegadorFotos li.upload a:hover {background-position:0 -21px;}

.navegadorContainer {position:relative;margin-bottom:15px;}
.navegadorContainer #flecha {position:absolute;top:22px;_top:16px;left:0;display:none;}
*+html .navegadorContainer #flecha {top:16px;}



/* Todas las fotos */

.listadoAlbums {margin-top:15px;}
.listadoAlbums li {float:left;background:url("/app_ui/common/imgs/layout/fondoAlbum2.gif") no-repeat;width:202px;height:197px;padding:6px;margin:0 16px 15px 0;font:normal 11px/15px "Lucida Grande", "Lucida Sans Unicode", Arial,sans-serif;position:relative;}
.listadoAlbums li.last {margin-right:0;}
.listadoAlbums li a.title {font-weight:bold;padding-left:3px;display:block;font-family:"trebuchet ms",sans-serif;}
.listadoAlbums li a.vermas {position:absolute;bottom:6px;right:6px;width:12px;height:12px;overflow:hidden;line-height:50px;background:url("/app_ui/common/imgs/layout/vermas.gif") 0 0 no-repeat;}
.listadoAlbums li a.vermas:hover {background-position:0 -12px;}
.listadoAlbums li span {color:#a9a9a9;display:block;padding-left:3px;}
.listadoAlbums li b.nuevas {font-weight:normal;color:#444;font-size:11px;font-family:"trebuchet ms",sans-serif;}
.listadoAlbums li img {border:1px solid #e5e5e5;margin-bottom:2px;}


.listadoFotos li h1 {color:#777;font:bold 13px "Lucida Grande", "Lucida Sans Unicode", Arial,sans-serif;padding:7px 10px 5px;margin-bottom:2px;}
.listadoFotos li img {padding:3px;width:100px;height:75px;background:url('/app_ui/common/imgs/spinner.gif') center center no-repeat;}
.listadoFotos li h1 a {}
.listadoFotos li h1 span {font:normal 11px "Lucida Grande", "Lucida Sans Unicode", Arial,sans-serif;padding:0 0 0 10px;}
.listadoFotos li .verUserFotos {display:block;clear:both;padding:5px;}


.fotosInvitados h3 {background:url("/app_ui/common/imgs/layout/tituloFotosInvitacion.gif") no-repeat;width:200px;height:21px;text-indent:-10000px;}
.fotosInvitados div {margin:15px 0 0;}
.fotosInvitados div a, .fotosInvitados div a:visited {display:block;color:#fff;background:#858585 url("/app_ui/common/imgs/layout/bulletInvitadosOff.gif") 7px 9px no-repeat;width:200px;line-height:22px;height:24px;margin:0 7px 7px 0;float:left;padding-left:20px;}

.fotosInvitados div a:hover {color:#fff;text-decoration:none;background:#959595 url("/app_ui/common/imgs/layout/bulletInvitados.gif") 7px 9px no-repeat;;}


/* Editar album y listar album */
.fotosAlbumEdit {margin-right:-20px;}
.fotosAlbumEdit li {width:200px;float:left;margin:10px 10px 10px 0;padding:0 10px;display:inline;}
.fotosAlbumEdit li div {text-align:center;margin-bottom:2px;} 
.fotosAlbumEdit li span {display:block;padding:3px 5px;border-bottom:1px solid #e2e2e2;}


.albumList {margin:20px 0 0;margin-right:-20px;}
.albumList ul {margin-bottom:10px;}
.albumList li {float:left;width:200px;margin-bottom:10px;padding:0 13px 10px;}
.albumList li div {text-align:center;min-height:130px;_height:130px;margin-bottom:5px;}
.albumList li span {display:block;padding:3px 5px;}
.albumList li span.fecha {color:#bbb;font-size:10px;padding-top:0;}
.albumList li span.editTitle {padding:3px 0 5px;}
.albumList li span.editTitle input {margin-right:3px;border:1px solid #e2e2e2;font-size:11px;width:150px;padding:2px;}
.albumList li span.editTitle img {vertical-align:middle;margin:0 2px;}
.albumList li span.title {margin-bottom:10px;}
.albumList li span.delete input {vertical-align:middle;}
.albumList li span.delete label {cursor:pointer;}
.albumList li span img {vertical-align:middle;margin-right:5px;}

.bulkDelete {border:1px solid #e2e2e2;padding:10px;line-height:20px;}
.bulkDelete button {float:right;margin:0;}
/* Editar foto */

.editarFotoImg {width:200px;float:right;}
.editarFotoImg #photoEdit {margin-bottom:10px;}
.editarFotoImg a {display:block;margin-bottom:4px;}
.editarFotoImg a:hover {text-decoration:none;background:#fae4e4;}
.editarFotoImg img {vertical-align:middle;margin-right:3px;}
.editarFotoImg a.foto:hover {background:#fff;}
.editarFotoImg .gris {display:block;padding:5px;}

.editarFotoForm ul {width:460px;float:left;}
.editarFotoForm ul li {border-bottom:1px solid #e2e2e2;padding:10px 0;}
.editarFotoForm ul li label {display:block;width:140px;float:left;;}
.editarFotoForm ul li input.titulo {border:1px solid #E2E2E2;font:normal 19px Georgia,serif;padding:3px;width:300px;}
.editarFotoForm ul li div {width:380px;float:left;}
.editarFotoForm ul li.botones {border:0;text-align:center;}


/* Viewitem */

.viewitem .herramientas {float:right;text-align:right;line-height:17px;color:#c9c9c9;}
.viewitem .herramientas .editar {float:left;}

.viewitem .herramientas .editar:hover {text-decoration:none;}
.viewitem .herramientas img {vertical-align:middle;margin:0 5px 0 0;}
.viewitem .herramientas span {display:block;clear:both;padding-top:5px;}
.viewitem .herramientas .sig {padding-left:5px;}
.viewitem h3 {font:normal 18px/22px "Lucida Grande", "Lucida Sans Unicode", Arial,sans-serif;color:#666;padding-bottom:7px;}
.viewitem h3 span {display:block;font:normal 12px "Lucida Grande", "Lucida Sans Unicode", Arial,sans-serif;padding-top:4px;}
.viewitem .foto, .viewitem h3{background:url("/app_ui/common/imgs/layout/linedashed.gif") bottom left repeat-x;}
.viewitem .foto {text-align:center;margin:10px 0;padding:5px 0 10px;min-height:390px;_height:390px;}
.viewitem .epigrafe {color:#555;font:normal 13px/17px "Lucida Grande", "Lucida Sans Unicode", Arial,sans-serif;}
.viewitem .epigrafe .right {font-size:11px;margin:0 0 10px 10px;}
.viewitem .epigrafe .right img {margin-right:6px;}
.viewitem .epigrafe .right .email {margin-right:15px;}
.viewitem p {margin-top:2px;}


.albumSidebar h3 {font:bold 14px/17px Arial,sans-serif;margin-bottom:10px;}
.albumSidebar .navegacion {padding-left:5px;margin-bottom:10px;}
.albumSidebar .navegacion div {width:110px;height:106px;float:left;border:1px solid #eaeaea;margin-right:5px;}
.albumSidebar .navegacion div a {display:block;width:110px;height:106px;}
.albumSidebar .navegacion .ant {background:url("/app_ui/common/imgs/layout/sidebarAnterior.gif") bottom left no-repeat;}
.albumSidebar .navegacion .sig {background:url("/app_ui/common/imgs/layout/sidebarSiguiente.gif") bottom left no-repeat;margin-right:0;}

.slideyotros a {display:block;padding-left:21px;line-height:17px;padding-bottom:5px;}
.slideyotros a.slide {background:url("/app_ui/common/imgs/layout/iconSlideshow.gif") no-repeat;}
.slideyotros a.todos {background:url("/app_ui/common/imgs/layout/iconVerTodas.gif") no-repeat;}


/* Mas fotos */
.masFotos h3 {background:url("/app_ui/common/imgs/layout/tituloMasFotos.gif") no-repeat;width:87px;height:17px;text-indent:-10000px;margin-bottom:5px;}
.masFotos li, .masFotosUser li, .masvistas li, .masvistasmias li  {padding:10px 0;background:url("/app_ui/common/imgs/layout/linedashed.gif") bottom left repeat-x;line-height:16px;}
.masFotos li img, .masFotosUser li img, .masvistas li img, .masvistasmias li img {float:left;margin-right:10px;border:1px solid #bfbfbf;}
.masvistas h3 {background:url("/app_ui/common/imgs/layout/tituloTop5.gif") no-repeat;width:143px;height:19px;text-indent:-10000px;margin-bottom:5px;}
.masvistasmias h3 {background:url("/app_ui/common/imgs/layout/tituloTop5Mias.gif") no-repeat;width:160px;height:19px;text-indent:-10000px;margin-bottom:5px;}
.masvistas li span, .masvistasmias li span {display:block;}




/* Comentarios */

.comentarios ol li {margin-bottom:15px;background:url("/app_ui/common/imgs/layout/comentarioTop.gif") 0 20px no-repeat;_background-position:0 32px;}
.comentarios li p, .comentarios li div.cajita {background:#f5f5f5 url("/app_ui/common/imgs/layout/comentarioBottom.gif") bottom left no-repeat;padding:7px 10px 10px;margin:0;}
.comentarios li div.cajita big {font-size:16px;line-height:19px;}
.comentarios li div.cajita big big {font-size:18px;line-height:21px;}
.comentarios li div.cajita big big big {font-size:20px;line-height:23px;}
.comentarios li div.cajita small {font-size:9px;line-height:12px;}
.comentarios li div.cajita small small {font-size:7px;line-height:11px;}

.comentarios li .right {font-size:11px;color:#cbcbcb;}
.comentarios li b.nombre {color:#aaa;display:block;padding:5px 5px;margin-bottom:10px;_padding:3px 5px;}
.comentarios h3 {background:url("/app_ui/common/imgs/layout/tituloComentarios.gif") no-repeat;width:229px;height:19px;text-indent:-10000px;margin-bottom:15px;}

.sidebar .comentarios .padding {padding:5px 15px 15px;}
.sidebar .comentarios h3 {background:url("/app_ui/common/imgs/layout/tituloComentariosSidebar.gif") no-repeat;width:137px;height:19px;text-indent:-10000px;margin-bottom:15px;}
.sidebar .comentarios h3.user {background:none;width:auto;height:auto;text-indent:0;}
.sidebar .comentarios li {margin-bottom:15px;background:url("/app_ui/common/imgs/layout/comentarioTopSidebar.gif") 0 20px no-repeat;width:237px;overflow:hidden;}
.sidebar .comentarios li b.nombre {color:#aaa;display:block;padding:3px 5px 0 15px;margin-bottom:20px;}
.sidebar .comentarios li p {background:#f3f3f3 url("/app_ui/common/imgs/layout/comentarioBottomSidebar.gif") bottom left no-repeat;padding:2px 10px 10px;margin:0;font:normal 11px/13px "Lucida Grande", "Lucida Sans Unicode", Arial,sans-serif;}
.sidebar .comentarios li.last {margin-bottom:0;}

.sidebar .ruleta h3 {background:url("/app_ui/common/imgs/layout/tituloRuleta.gif") no-repeat;width:130px;height:16px;text-indent:-10000px;margin-bottom:12px;}
.sidebar .ruleta .padding {padding:5px 15px 12px;}
.sidebar #ruleta {width:230px;height:175px;margin:auto;position:relative;}
.sidebar #ruleta div {position:absolute;top:0;left:0;}
.sidebar #ruleta div.show {display:block;}
.sidebar #ruleta div.hide {display:none;}

.dejarcomentarios h3 {background:url("/app_ui/common/imgs/layout/tituloDejarComentario.gif") no-repeat;width:157px;height:19px;text-indent:-10000px;}
.dejarcomentarios ul li {padding:10px 0;}
.dejarcomentarios ul li label {color:#aaa;}
.dejarcomentarios ul li select {width:200px;margin-left:10px;}
.dejarcomentarios ul li textarea {border:1px solid #e2e2e2;width:675px;height:100px;font:normal 11px/16px Tahoma,sans-serif;margin-bottom:10px;}
.dejarcomentarios ul li span {}
.dejarcomentarios ul li.botones {text-align:center;padding:0;}


/* mis comentarios */

ul.lista li {background:url("/app_ui/common/imgs/layout/linedashed.gif") bottom left repeat-x;padding:10px 0;font-size:11px;}
ul.lista li img {float:left;margin-right:10px;}
ul.lista li p {font:normal 13px/17px "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif;margin:5px 0 0 0;}
ul.lista li p b, ul.lista li span {font-size:11px;}

/* upload */

.cajaUpload {border:1px solid #9c9c9c;background:#bbb;padding:10px;margin-top:15px;color:#fff;}
.cajaUpload span {float:right;}

form.uploader {margin-top:15px;}
form.uploader .uploadTop {}
form.uploader span.boton {display:block;width:156px;height:32px;background:url("/app_ui/common/imgs/upload_on.png") 0 0 no-repeat;}
span.button {}


/* Mis Fotos */
.misfotos li {padding:10px 5px 20px 5px;margin-bottom:10px;_padding-left:0;background:url("/app_ui/common/imgs/layout/separadorAlbums.gif") bottom left no-repeat;}
.misfotos li h3 {padding:0 0 5px 10px;margin:0 0 10px 0;}
.misfotos li h3 span {font-weight:normal;font-size:11px;display:block;}
.misfotos li div {float:left;width:110px;padding:0 0 0 9px;margin:0 6px 10px;display:inline;}
.misfotos li div a,.misfotos li div span {display:block;}
.misfotos li div a {}
.misfotos li div img {margin:5px 0;background:url('/app_ui/common/imgs/spinner.gif') center center no-repeat;border:1px solid #e2e2e2;}
.misfotos li div .editar {display:block;padding:3px 3px 5px;height:auto;}
.misfotos li div .editar img {vertical-align:middle;margin:0 5px 0 0;border:0;}



/* Videos */
.videos {padding-top:15px;}
.videos ul.previews {float:left;width:180px;}
.videos ul.previews {border-top:1px solid #ccc;}
.videos ul.previews li {border-bottom:1px solid #ccc;padding:10px;}
.videos ul.previews li.active {background:#f0f0f0;}
.videos .player {float:left;border-left:1px solid #ccc;padding-left:15px;}






















/* Titulos */

h1 {font:normal 19px/23px "Lucida Grande", Arial, sans-serif;}
h3 {font:bold 14px/18px "Lucida Grande", Arial, sans-serif;}

p {margin:10px 0;font-size:13px;line-height:19px;}


.module span.tabs {width:100px;}
.path {color:#999;margin:10px 0;}



/* Albums */

.milistalbums li {float:left;width:280px;border:1px solid #e2e2e2;margin:0 15px 15px 0;padding:10px;}
.milistalbums li h3 {margin-top:10px;}
.milistalbums li p {font-size:11px;line-height:14px;margin-top:3px;}
.milistalbums li img {float:left;margin:0 10px 0 0;}

.albums li {float:left;width:300px;border:1px solid #e2e2e2;margin:0 15px 15px 0;}
.albums li h3 {margin-top:10px;}
.albums li p {font-size:11px;line-height:14px;margin-top:3px;}
.albums li img {float:left;margin:10px;}

.misAlbums {position:relative;}

.albumsPorInvitacion {margin:10px 0 0;padding-bottom:10px;}
.albumsPorInvitacion li {padding:5px 0;;}






/*Debug*/



.debug {background:#fff;position:fixed;bottom:0;left:0;width:100%;height:25px;z-index:99000!important;}
.debug .techoDebug {background:#1799d5;height:25px;color:#fff;line-height:25px;padding:0 10px;}
.debug .techoDebug a {float:right;color:#fff!important;}
.xmlContent {width:95%;height:90%;margin:15px;overflow:auto;border:1px solid #e2e2e2;float:left;}
.xmlContent textarea {border:1px solid #e2e2e2;width:100%;height:90%;font:normal 13px/15px "Courier New",sans-serif;background:#f0f0f0;color:#444;}
.xmlContent .codigo {margin-left:12px;font:normal 13px/15px "Courier New",sans-serif;}
.xslVariables {float:right;margin:15px 15px 0 0;width:32%;border:1px solid #e2e2e2;padding:10px;}
.xslVariables h4 {font:bold 14px/16px Arial,sans-serif;margin:5px 0;}


