﻿/* CSS STRAUMANN DELEGADO MOVIL */


/* HOJA DE ESTILOS CSS
para el desarrollo del proyecto WEB STRAUMANN CONECTATE-DELEGADOS\MOVIL
desarrollado por:	ADDENTRA INTERNET
Fecha inicio (VERSION RESPONSIVE): 11/12/2014

*/


html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, 
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup, 
menu, footer, header, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
}

article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {
	display: block;
}

a img {border: 0;}
img {max-width:100%;}

/*		Default Layout: 992px. 
		Gutters: 24px.
		Outer margins: 48px.
		Leftover space for scrollbars @1024px: 32px.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */

body {
	-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
}


/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 768px) and (max-width: 991px) {
    
    
       .contacto h3 { margin-top: 100px!important; font-size: 26px!important;    }
       ul.menuHome li a{font-size:.7em}
}



    /*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252    */

    @media only screen and (max-width: 767px) {

       /* #cuerpo {
            width: 319px;
        }*/
 
       .contacto h3 { margin-top: 100px!important; font-size: 26px!important;    }
    }


/*		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436    */

@media only screen and (min-width: 480px) and (max-width: 767px) {
         #cuerpo {
            width: 470px;
            display:inline;
        }
    #pie a, #pie a.right{margin:0!important; height:auto!important; padding-top:20px!important; font-size:.8em; }
    #pie a.right, #pie p{width:100%!important; text-align:center!important; padding:0 0 5px!important}
    #cabecera img, a.enlacesInteres, .cerrarSesion, .menuHome, .flex-caption { display:none!important; }
    #cabecera {background:url(../img/movilCabecera.jpg) center top no-repeat; height:90px; margin:0 auto; background-size:70%; max-width:450px;  }
     .cabeceraHome{ width:95%!important; height:85px; margin-top:-30px }
     #cabecera span{width:100%; height:auto}
     #cabecera span a{display:block; height:60px}
        #mobile-nav-holder #nav-open { display:block!important; }
        #mobile-nav-holder {display: block;}
        .pieFijo{position:fixed; bottom:0}
    .puntosZona li{font-size:11px;}
        .saludoLogin{color:#000!important; font-weight:normal}
            .rellene span, .rellene small{top:152px}

    .codigoClinico{width:70%; margin: auto;}
    .codigoClinico img{ display:none}
    .codigoClinico .parteIzq, .codigoClinico .parteDcha{ width:100%!important}
    .formInvitarClinica{font-size:1.5em; font-weight:lighter;}
    .formInvitarClinica input{margin:5px; font-size:1.2em; height: auto; font-weight: lighter; font-family:sans-serif;}
    .imgMovil {display:block!important;}

    .formInvitarClinica, .invitarClinica{width:100%!important}
    .invitarClinica .parteIzq img, .enlacesInteres .parteIzq img, .miPerfil .parteIzq img{display:none}
    .formInvitarClinica .unirCampos{width:90%;}

    .contacto{box-shadow:none;}
    .contacto h3{ margin-top:60px!important; font-size: 26px!important; }
    .contacto .parteDcha, .contacto .parteIzq{width:100%; padding:0}
        .contacto img{ display:none}
        .contacto .parteIzq{background:url(../img/contactanosMovil.jpg) center top no-repeat; height:200px; margin-top:20px; background-size: 100%;}
        .contacto .masInfoContacto{position:initial!important;}

        .puntosObten button{width:100%}
        .canjeoPuntos button.botonredondo span{display:none;}
        .canjeoPuntos button.botonredondo{background:url(../img/btnCanjeoPtos.png) no-repeat; height: 28px; width: 28px; padding: 0!important;}

        .canjeoPuntos{overflow-y:scroll; height:270px}
                   .invitarClinica .parteIzq {display:none}

    .enlacesInteres .parteIzq, .enlacesInteres .parteDcha{width:100%; margin-top:0}
      .enlacesInteres{margin-top:30px}  

    .filtro, .miPerfil .parteDcha{width:100%;} 
    .cabVerClinica a.lupa{background-size:32px; margin-top:19px}   
    ul.cablistado .ancho35, ul.cablistado .ancho15, .listadoClinicas .titulo .ancho35, .listadoClinicas .titulo .ancho15 {display:none}
    ul.cablistado .ancho30, .listadoClinicas .titulo .ancho30{width:55%!important;   }
    ul.cablistado .ancho5, .listadoClinicas .titulo .ancho5{width:17%;   }

    .detalleClinica .listadoClinicas li ul li span{padding: 0 1%; border:none}
     .listadoClinicas .titulo .ancho30{width:100%!important; text-align:left}
     .detalleClinica .listadoClinicas li ul li{width: auto;padding: 5px 5px;}
     .cablistDetalleDatos{display:none}
     .detalleDatos ul li.ancho50, .parteIzq{float:left; width:100%;}
     .detalleDatos ul li.ancho25{width:48%; border: none!important;}
     .detalleDatos ul li i{display:inline-block; padding:0 5px; color: #9f9e9e;}
     ul.cablistado{font-size: 12px;}

    .paginacion button span, .btnUltimo, .btnPrimero{display:none!important}
    .paginacion span{padding:6px 0!important;}
   .paginacion button{margin: -3px 0;width: 29px;}
        .miPerfil .parteIzq{background:url(../img/imgMiPerfil.jpg) center top no-repeat; height:200px; margin-top:20px; background-size: 100%;}
       
        .histPuntos .listaPuntos{font-size:0.9em; font-weight:lighter}
        .histPuntos .listaPuntos .ancho40{display:none}
        .histPuntos .listaPuntos .ancho10, .histPuntos .listaPuntos .ancho15{width:20%!important}
        .histPuntos .listaPuntos .ancho35{width:60%!important; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}

    }

@media only screen and (min-width: 300px) and (max-width: 479px) {

    #cabecera img, a.enlacesInteres, .cerrarSesion, .menuHome, .flex-caption { display:none!important; }
    .cabeceraHome{ width:95%!important; margin-top:-30px }
    #cabecera {background:url(../img/movilCabecera.jpg) center top no-repeat; height:85px; margin:0 auto; background-size:70%; max-width:450px;  }
     #cabecera span{width:100%; height:auto}
     #cabecera span a{display:block; height:60px}
    .puntosZona li{font-size:11px;}

    .pieFijo{position:fixed; bottom:0}
    #pie a.right, #pie p{width:100%!important; text-align:center!important; padding:0 0 5px!important}
    #pie{height:auto!important}
    
   .contedidoLogin{ background-position: center center!important;
    background: radial-gradient(circle, #fff, #d9d9d9)!important; min-height:540px; position:initial;}  
        .saludoLogin{color:#000!important;  font-weight:normal}
   .cajaLogin, .cajaRepContra{ width:80%!important; padding:0 5%; margin-top:0; background:none; border:none; position:initial!important;}
   .saludoLogin{ margin:10px auto 20px auto; text-align:center!important; color:#4b4444; font-size:1.4em;text-shadow:none}
   .cajaLogin input, .cajaRepContra input{font-size:1.7em}
        #mobile-nav-holder #nav-open { display:block!important; }
    .rellene span, .rellene small{top:152px}
    .canjeoPuntosCab{height:auto!important}
    .canjeoPuntosCab p{display:block; text-align:right; color:#000; width:100%; margin-top:10px;}
    .canjeoPuntosCab b{font-size:2em;}
    ul.listaPuntos li ul li.ancho60{width: 40%;text-overflow: ellipsis;overflow: hidden;white-space:nowrap;font-size:.9em;}
    ul.listaPuntos li ul li.ancho15{display: inline-block;overflow: hidden; width:24%; font-size:.9em;}
    ul.listaPuntos li ul li.botonredondo{padding:5px;}
    #mobile-nav-holder { display: block;}

    .codigoClinico{width:70%; margin: auto;}
    .codigoClinico img, .miPerfil .parteIzq img{ display:none}
    .codigoClinico .parteIzq, .codigoClinico .parteDcha{ width:100%!important}
    .imgMovil {display:block!important;}

    .invitarClinica .parteIzq img, .invitarClinica .parteIzq img{display:none}
    .formInvitarClinica, .invitarClinica{width:100%!important}
    .formInvitarClinica .unirCampos{width:90%;}


    .contacto{box-shadow:none;}
    .contacto h3 { margin-top:60px!important; font-size: 26px!important;    }
    .contacto .parteDcha, .contacto .parteIzq{width:100%; padding:0}
        .contacto img{ display:none}
        .contacto .parteIzq{background:url(../img/contactanosMovil.jpg) center top no-repeat; height:200px;  margin-top:20px; background-size: 100%; }
        .contacto .masInfoContacto{position:initial!important;}

                .puntosObten button{width:100%}
        .canjeoPuntos button.botonredondo span{display:none;}
        .canjeoPuntos button.botonredondo{background:url(../img/btnCanjeoPtos.png) no-repeat; height: 28px; width: 28px; padding: 0!important;}
   
        .aceptarCanjeo button, .miPerfil .parteDcha, .miPerfil .parteIzq{width:100%; float:initial;}
     
           .canjeoPuntos{overflow-y:scroll; height:350px}
           .invitarClinica .parteIzq{display:none}

    .contedidoAvisoLegal h1{font-size:20px; font-weight:normal; margin-bottom:10px; color:#4b4444}
    .contedidoAvisoLegal h2{font-size:18px; font-weight:lighter}

    .enlacesInteres .parteIzq, .enlacesInteres .parteDcha{width:100%; margin-top:0}
    .enlacesInteres .parteIzq img{display:none;}
      .enlacesInteres{margin-top:30px}  
    
    .filtro{width:100%;}
        .cabVerClinica a.lupa{width: 9%; background-size:24px; margin-top:19px}   
    ul.cablistado .ancho35, ul.cablistado .ancho15, .listadoClinicas .titulo .ancho35, .listadoClinicas .titulo .ancho15 {display:none}
    ul.cablistado .ancho30, .listadoClinicas .titulo .ancho30{width:55%!important;   }
    ul.cablistado .ancho5, .listadoClinicas .titulo .ancho5{width:14%;   }
    .paginacion span{padding:6px 0!important;}
   .paginacion button{margin: -3px 0;width: 29px;}

    .detalleClinica .listadoClinicas li ul li span{padding: 0 1%; border:none}
     .detalleClinica .listadoClinicas .titulo .ancho25S{width:100%!important; text-align:left}
     /*.detalleClinica .listadoClinicas li ul li.ancho20, .detalleClinica .listadoClinicas li ul li.ancho25{width:50%!important}*/
     .detalleClinica .listadoClinicas li ul li{width: auto;padding: 5px 5px;}
     .cablistDetalleDatos{display:none}
     .detalleDatos ul li.ancho50{float:left; width:100%;}
     .detalleDatos ul li.ancho25{width:48%; border: none!important;}
     .detalleDatos ul li i{display:inline-block; padding:0 5px; color: #9f9e9e;}
     ul.cablistado{font-size: 12px;}
             
     .miPerfil .parteIzq{background:url(../img/imgMiPerfil.jpg) center top no-repeat; height:200px; margin-top:20px; background-size: 100%;}

        .histPuntos .listaPuntos{font-size:0.9em; font-weight:lighter}
        .histPuntos .listaPuntos .ancho40{display:none}
        .histPuntos .listaPuntos .ancho10, .histPuntos .listaPuntos .ancho15{width:25%!important}
        .histPuntos .listaPuntos .ancho35{width:50%!important; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}

}
