﻿    .fondo { position: absolute; width: 100%; height: 92px; left: 0px; top: 45%; z-index: 1; background-color: #EFEFEF; padding: 0px; margin: 0px; text-align: center; border:0px solid yellow; }
    /*.centrar { position: absolute; width: 580px; height: 330px; top: 50%; left: 50%; margin-top: -200px; margin-left: -290px; z-index: 2; bottom: 139px; }*/
    /*.campos { position: absolute; width: 262px; height: 190px; left: 304px; top: 144px; z-index: 3; }*/
    .usuario { border: 1px solid #c4c4c4; width: 200px; font-size: 13px; padding: 4px 4px 4px 20px; border-radius: 4px;
               -moz-border-radius: 4px; -webkit-border-radius: 4px; box-shadow: 0px 0px 2px #d9d9d9; -moz-box-shadow: 0px 0px 2px #d9d9d9; -webkit-box-shadow: 0px 0px 2px #d9d9d9;
               position: absolute; height: 20px; top: 20px; left: 22px; z-index: 4; 
               background: transparent url(Imagenes/icono_usuario.png) 3px 50% no-repeat; opacity: 0.8; filter: alpha(opacity=50); /* For IE8 and earlier */ background-color: #eeeeee; }
    .usuario:focus { outline: none; border: 1px solid #104a99; 
                     -moz-box-shadow: 0px 0px 5px #106a85; -webkit-box-shadow: 0px 0px 5px #106a85; box-shadow: 0px 0px 5px #106a85; opacity: 5; 
                     background-color: white; }
    .usuarioError { border: 1px solid #f00; width: 200px; font-size: 13px; padding: 4px 4px 4px 20px; border-radius: 4px; 
                    -moz-border-radius: 4px; -webkit-border-radius: 4px; box-shadow: 0px 0px 2px #d9d9d9; -moz-box-shadow: 0px 0px 2px #d9d9d9; -webkit-box-shadow: 0px 0px 2px #d9d9d9;
                    position: absolute; height: 20px; top: 20px; left: 22px; z-index: 4; 
                    background: transparent url(Imagenes/Alerta.gif) 3px 50% no-repeat; background-color: white; }
    .contrasena { border: 1px solid #c4c4c4; width: 200px; font-size: 13px; padding: 4px 4px 4px 20px; border-radius: 4px;
                  -moz-border-radius: 4px; -webkit-border-radius: 4px; box-shadow: 0px 0px 2px #d9d9d9; -moz-box-shadow: 0px 0px 2px #d9d9d9; -webkit-box-shadow: 0px 0px 2px #d9d9d9;
                  position: absolute; height: 20px; top: 70px; left: 22px; z-index: 5; 
                  background: transparent url(Imagenes/icono_contraseña.png) 3px 50% no-repeat; opacity: 0.8; filter: alpha(opacity=50); /* For IE8 and earlier */ background-color: #eeeeee; }
    .contrasena:focus { outline: none; border: 1px solid #104a99; -moz-box-shadow: 0px 0px 5px #106a85; -webkit-box-shadow: 0px 0px 5px #106a85; 
                        box-shadow: 0px 0px 5px #106a85; opacity: 5; background-color: white; }
    .contrasenaError { border: 1px solid #f00; width: 200px; font-size: 13px; padding: 4px 4px 4px 20px; border-radius: 4px;
                       -moz-border-radius: 4px; -webkit-border-radius: 4px; box-shadow: 0px 0px 2px #d9d9d9; -moz-box-shadow: 0px 0px 2px #d9d9d9; -webkit-box-shadow: 0px 0px 2px #d9d9d9;
                       position: absolute; height: 20px; top: 70px; left: 22px; z-index: 5; 
                       background: transparent url(Imagenes/Alerta.gif) 3px 50% no-repeat; background-color: white; }
    .recordar { position: absolute; width: 240px; top: 109px; left: 15px; font-size: 12px; font-family: Arial, sans-serif; color: #4D4D4D; vertical-align: middle; z-index: 6; border:0px solid blue; }

    .boton_ingresar { position: absolute; width: 160px; top: 150px; left: 59px; height: 26px; z-index: 8; border:0px solid red; }
    .textoUsuario { position: absolute; width: 220px; height: 20px; top: 0px; left: 22px; text-transform: uppercase; font: normal 12px/1 Verdana, Helvetica; color: #4D4D4D; z-index: 9; border:0px solid green; }
    .textoContrasena { position: absolute; width: 220px; height: 15px; top: 55px; left: 22px; text-transform: uppercase; font: normal 12px/1 Verdana, Helvetica; color: #4D4D4D; z-index: 8; border:0px solid yellow; }
    #LoginButton:hover { -moz-box-shadow: 10px 10px 5px #000000; -webkit-box-shadow: 10px 10px 5px #000000; box-shadow: 10px 10px 5px #000000; }

	/* CODIGO ADD: JHRODRIGUEZ 
		FECHA: 24.11.2014
		MEJORA VISTA AL CLIENTE - COD 1
	--- */
        .containerLogin { position: absolute; width: 610px; height: 330px; top: 50%; left: 49%; margin-top: -200px; margin-left: -290px; z-index: 2; bottom: 139px; border:0px solid blue; }
        .containerLeftLogin { float: left; width:295px; height:330px; background:url('Imagenes/fondo_login.png') 0 0 no-repeat; border:0px solid red; }
        .containerRightLogin { float: left; width:305px; height:330px; background:url('Imagenes/fondo_login.png') -305px 0 no-repeat; border:0px solid green; }

        /*MOBILE*/
        .headerLogin {  width:100%; height:77px; background: #FAFAFA; border-bottom: #0097CD 4px solid; padding:10px 0 0; display:none; 
                        background: -webkit-linear-gradient(#FFF, #F4F4F4);
                        background: -moz-linear-gradient(#FFF, #F4F4F4);
                        background: -o-linear-gradient(#FFF, #F4F4F4); }
            .imgHeaderLogin { background:url('images/logoSoulLogin.png') no-repeat; width:250px; height:67px; margin: 0 auto; border:0px solid blue; }
        .bienvenidaLogin { width:auto; padding:15px 0; color:#808080; font-family: Arial,sans-serif; font-size: 1.35em; text-align:center; margin: 4px 0 0 0; display:none; border:0px solid red; }            

        .centrarLogin { position: relative; width: 270px; height: 130px; top: 124px; bottom: 139px; margin: 0 0 0 -20px; border:0px solid green; }
        .recordLogin {  text-align:center; padding-top:35px; font-size:12px; font-family: Arial,sans-serif; border:0px solid yellow; }
            .recordLogin a { color: #000; font-weight:700; }

        /*DEFINICION DE ESTILOS DE ALINEAMIENTOS*/
           .align-right { text-align: right !important; }
           .align-left { text-align: left !important; }
           .align-center { text-align:center !important; }

           .valign-middle { vertical-align:middle; }
        /*LIMPIAMIENTO DIVS*/
            .cleanMP { clear:both; }

        /*SCREEN LOGIN OBLIGATORIO*/
            @media only screen and (max-width : 1024px) {
                /*OCULTAMOS EL FONDO DEGRADE*/
                .fondo { display:none; }
                /*ESTABLECEMOS POSICION RELATIVA, AMPLIAMOS AL 100%, QUITAMOS EL TOP Y EL LEFT A 0, CENTRAMOS*/
                .containerLogin { position: relative !important; width: 100% !important; top: 0 !important; left:0 !important; margin:0 auto !important; }
                /*QUITAMOS PADDING, QUITAMOS BACKGROUND, AMPLIAMOS AL 100%, CENTRAMOS, ESTABLECEMOS UN TAMAÑO FIJO DE 350PX*/
                .containerRightLogin { background: #FFF !important; padding:0 !important; width:100% !important; margin:0 auto !important; height:350px !important; }
                /*SUBMOS EL TOP A 10PX, ASIGNAMOS TAMAÑO DEL WIDTH A 300PX, CENTRAMOS*/
                .centrarLogin { top: -10px !important; width:300px !important; margin: 0 auto !important; }
                /*ESTABLECEMOS MARGIN POR DEBAJO DE 10PX*/
                .recordar { margin-top:10px; }
                /*ESTABLECEMOS QUE SE MUESTREN ESTAS DOS CLASES*/
                .headerLogin, .bienvenidaLogin { display:block; }
                /*ESTABLECEMOS EL TOP POR DEBAJO DE 120PX*/
                .camposLogin { top:120px; }
                /*LINKS EN LA CLASE APLICA: TEXTO CENTRADO, TAMAÑO DE FUENTE 16PX, ASIGNAMOS EL COLOR A UN GRIS CLARO, QUITAMOS NEGRITA*/
                .recordLogin a { text-align:center; font-size: 16px; color:#808080; font-weight: normal; }
                /*AUMENTO TAMAÑO DE LA FUENTE, PADDING ANCHO Y ALTO, ESTILO DE FUENTE, BACKGROUND BLANCO, TOD PARA LAS DOS CLASES*/
                .usuario, .contrasena { font-size: 16px !important; padding: 9px 9px 9px 38px !important; font-family: Arial,sans-serif !important;  background-color: #FFF !important; }
                /*ASIGNAMOS EL ICONO DE USUARIO, TAMAÑO DEL ICONO,*/
                .usuario { background: transparent url(images/iconUser.svg) no-repeat !important; background-size:35px 35px !important; }
                /*MANEJO DEL ERROR USUARIO, CONTRASEÑA, MODIFICACION DEL PADDING, BACKGROUND CAMBIO, TAMAÑO DEL ICON*/
                .usuarioError { padding: 9px 9px 9px 38px !important; font-size: 16px; background: transparent url(images/warning.png) 3px 50% no-repeat !important; background-size:35px 35px !important; }
                .contrasenaError { padding: 9px 9px 9px 38px !important; font-size: 16px; background: transparent url(images/warning.png) 3px 50% no-repeat !important; background-size:35px 35px !important; }
                /*ASIGNAMOS EL ICONO DE USUARIO, TAMAÑO DEL ICONO,*/
                .contrasena { background: transparent url(images/iconPass.svg) no-repeat !important; background-size:35px 35px !important;}
                /*AUMENTO FUENTE, LEFT DE 25PX*/
                .recordar { font-size:16px; left: 25px; }
                /*POSICION RELATIVA, LEFT ASIGNADO EN 0, CENTRAMOS, ALTO DE 26PX, SUPERPOSICION DE 8*/
                .boton_ingresar { position: relative; left: 0px; margin:0 auto; height: 26px; z-index: 8; }


                /*LADO DEL SERVIDOR*/
                .textoUsuario { display: none; }
                .textoContrasena { display: none; }
            }
    /* ---- */
	/*FIN ADD JHRODRIGUEZ*/
