/* global css styles */
* { margin:0; padding:0;}
body {background-color:#000; color: #fff; text-align: center; font: 14px arial; line-height: 24px;}
h1 {-x-system-font:none; color:#FF6600; font-family:arial,verdana,sans-serif; font-size:20px; font-size-adjust:none; font-stretch:normal; font-style:normal; font-variant:normal; font-weight:normal; line-height:1.1; margin:0 0 5px; padding:0;}
h1 span {color:#FFFFFF;}
h1.margin-top { padding-top:13px;}
h1.margin-top2 { padding-top:7px;}
h2 {-x-system-font:none; font-family:arial,verdana,sans-serif; font-size:14px; font-size-adjust:none; font-stretch:normal; font-style:normal; font-variant:normal; font-weight:normal; line-height:1.1; margin:0 0 20px; padding:0;}
h3 {-x-system-font:none; font-family:arial,verdana,sans-serif; font-size:11px; font-size-adjust:none; font-stretch:normal; font-style:normal; font-variant:normal; font-weight:normal; line-height:1.1; margin:0 0 5px; padding:0;}
h3 span {color: #FFFFFF;}
a {color:#ff6600;}
a:link {text-decoration:none;}
a:hover {text-decoration:underline;}
a:visited{text-decoration:none;}
p {text-align: center; color: #FFFFFF; margin: 5px 0px;}
a img {border: none;}
ul {list-style-image:none; list-style-position:outside; list-style-type:none; margin:0; padding:0;}

/*Global elements */
#wrapper{ border:1px solid #666666; height:544px; margin:0 auto; padding:0; position:relative; width:816px;}
#content {clear:both; margin:0px 20px 0;}
#logout {float:left; margin:13px;}
#logo {position:absolute; right:30px; top:30px;}
.pic {height: 95px;}

/* Main page elements */
.quien {left:210px; position:absolute; top:213px;}
.quien li {float:left; margin:0 20px 0 0; width:190px;}
.quien li p {margin:0 0 5px;}
.quien li a {background:transparent url(../img/bg_boton_quien.gif) no-repeat scroll 0 0; color:#FFFFFF; display:block; font-family:verdana,arial,sans-serif; font-size:12px; font-weight:bold; height:25px; line-height:1.9; margin:0 auto; width:188px;}
.quien li a {background:transparent url(../img/bg_boton_quien.gif) no-repeat scroll 0 0; color:#FFFFFF; display:block; font-family:verdana,arial,sans-serif; font-size:12px; font-weight:bold; height:25px; line-height:1.9; margin:0 auto; width:188px;}

/* Recorte Page */
div.imagen {height: 450px; overflow: hidden;}
div.bar{width: 200px; margin: 15px auto;}
#back {z-index: 1; position: relative;}
div#moveMe {cursor: move; z-index: 10; width: 196px; height: 196px; border: 5px dashed #FFFFFF; float: left; position: relative; background: transparent url('../img/oval.png') no-repeat top left; display: block;}
#controls {padding: 5px;}
#botones {text-align: center;}

/* Arq selector page */
.choice {border: 1px solid red; margin:0 auto; width:401px;}
.choice div.sel {float: left; width: 188px; height: 250px; border: 1px solid yellow;}
.choice div.left { margin-right: 20px;}
.char {width: 230px; float: left;}


/* Friends page */
.personajes { margin:0 auto; width:445px;}
.personajes ul {overflow:hidden;}
.personajes ul li {background:transparent url(../img/bg_personajes.gif) no-repeat scroll 0 0; float:left; height:165px; margin:0 10px 10px 0; text-align:center; width:138px;}
.personajes ul li h3 {color:#FFFFFF; font-size:11px; font-weight:normal; padding:8px 10px 10px;}
.personajes ul li input.boton { background:transparent url(../img/bg_boton_elegir_actor.gif) no-repeat scroll 0 0; color:#FFFFFF; display:block; font-family:verdana,arial,sans-serif; font-size:12px; font-weight:bold; height:25px; line-height:1.9; margin:0 auto; width:118px; border: none; cursor:pointer;}

/* Friend Selector Page */
.select-amigo {padding-left:41px; padding-top:44px; width:755px;}
.select-amigo .listado {float:left; height:220px; overflow-y:scroll; position:relative; width:285px;}
.select-amigo .listado ul li {border-bottom:1px solid #FF6600; margin:0 0 2px; overflow:hidden; position:relative; text-align:left; cursor: pointer;}
.select-amigo .listado ul li div { clear:left; float:left; margin:0 0 2px; width:50px;}
.select-amigo .listado ul li div img { display:block; margin:0 auto;}
.select-amigo .listado ul li h3 {color:#FF6600; font-size:12px; padding:15px 0 0 60px;}
.select-amigo .foto-recortable {float:right;width:460px; background: transparent url(../img/foto_recortable_bg_el_regreso.gif) no-repeat scroll left top; height:245px;}
.select-amigo .foto-recortable img.prev {height:175px; margin-top:25px;}
.select-amigo .foto-recortable2 {float:right;width:460px; background: transparent url('../img/foto_recortable_bg_el_regreso.gif') no-repeat top left; height:245px;}
.select-amigo .foto-recortable2 img.prev {height:235px; margin-top:25px;}
.amigo-footer {margin-top:30px; padding-left:40px; width:713px;}
.amigo-footer .volver { bottom:auto; clear:left; float:left; left:auto; margin:30px 0 0; position:relative;}
.select-amigo form#friend_rad_form {width: 285px; float: left; margin: 0px;}
.lienzo { margin: 10px 5px; height: 290px; text-align:left; margin: 0 auto; width: 814px; overflow:hidden;}
.mini_lienzo {height:210px; margin: 5px; overflow:hidden; text-align:left; width:446px;}

/* Resumen page */
.mascaras { margin:0 0 0 32px; padding:2px 0 0;}
.mascaras ul {overflow:hidden;}
.mascaras ul li {float:left; height:96px; margin:0 0 4px; position:relative; text-align:left; width:369px;}
.mascaras ul li div {left:0; position:absolute; top:0; width:74px;}
.mascaras ul li h3 {color:#FF6600; font-size:14px; font-weight:normal; margin:34px 0 13px 85px;}
.mascaras ul li a.boton { background:transparent url(../img/bg_boton_publicar.gif) no-repeat scroll 0 0; color:#FFFFFF; display:block; font-family:verdana,arial,sans-serif; font-size:12px; font-weight:bold; height:25px; line-height:1.9; margin:0 0 0 85px; text-align:center; width:270px; overflow: hidden; cursor:pointer;}
.mascaras ul li span.boton { background:transparent url(../img/bg_boton_publicar_done.gif) no-repeat scroll 0 0; color:#FFFFFF; display:block; font-family:verdana,arial,sans-serif; font-size:12px; font-weight:bold; height:25px; line-height:1.9; margin:0 0 0 85px; text-align:center; width:270px; overflow: hidden;}

/* Botones */
.volver {bottom:48px; left:61px; position:absolute;}
.volver a {background:transparent url(../img/ico_volver.gif) no-repeat scroll 0 2px; color:#FFFFFF; font-family:verdana,arial,sans-serif; font-size:12px; padding:0 0 0 17px;}
.boton-siguiente {clear:right; float:right; height:25px; padding:26px 0 0; width:100px;}
.boton-siguiente input { background:transparent url(../img/bg_boton_siguiente.gif) no-repeat scroll 0 0; color:#666666; display:block; float:right; font-family:verdana,arial,sans-serif; font-size:12px; font-weight:bold; height:25px; margin:0 auto; width:96px; border: none; cursor: pointer;}
.boton-terminar {height:25px; margin:0 0 0 465px; padding:10px 0 0;}
.boton-terminar a { background:transparent url(../img/bg_boton_terminar.gif) no-repeat scroll 0 0; color:#000000; display:block; font-family:verdana,arial,sans-serif; font-size:12px; font-weight:bold; height:25px; line-height:1.9; margin:0 auto; width:270px;}
.boton-terminado {height:25px; padding:10px 10px 0 0;}
.boton-terminado input { background:transparent url(../img/bg_boton_terminar_casting.gif) no-repeat scroll 0 0; color:#000000; display:block; float:right; font-family:verdana,arial,sans-serif; font-size:12px; font-weight:bold; height:25px; margin:0 auto; width:286px; border: none; padding-bottom:3px; cursor: pointer;}
a.boton2 { background:transparent url(../img/bg_boton_publicar.gif) no-repeat scroll 0 0; color:#FFFFFF; display:block; font-family:verdana,arial,sans-serif; font-size:12px; font-weight:bold; height:25px; line-height:1.9; margin:0 auto; text-align:center; width:270px; overflow: hidden; cursor:pointer;}