/* CSS STRAUMANN CLINICO MOVIL */


/* HOJA DE ESTILOS CSS
para el desarrollo del proyecto WEB STRAUMANN CONECTATE-CLINICOS\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: 10px!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) {
 
       .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; }
    #contenedor {margin-bottom:50px; }
    #pie a.right, #pie p{width:100%!important; text-align:center!important; padding:0 0 5px!important; margin:0;    font-size: 11px; line-height: 15px;}
    #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; 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}

            .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{width:100%!important}
    .invitarClinica .parteIzq img, .invitarClinica .parteIzq{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;}

                .aceptarCanjeo p{font-size:0.9em}

                   .invitarClinica .parteIzq{display:none}

    .enlacesInteres .parteIzq, .enlacesInteres .parteDcha{width:100%; margin-top:0}
    .enlacesInteres .parteIzq img{    zoom: .6;overflow: hidden;clear: both;display: block;}
      .enlacesInteres{margin-top:30px}  
      redesociales{width: 100%!important;      }
          
     .paginacioncontainer{bottom: 50px; padding: 20px 5%;}
  .paginacion button span, .btnUltimo, .btnPrimero{display:none!important}
   .paginacion span{padding:6px 0!important;}
   .paginacion button{margin: -3px 3px;}
   .borde label {    width: calc(100% - 100px); border-radius: 0!important; box-shadow: none!important; border: 1px solid #a2bca2!important;}
   box .codigoClinico.cares, box .codigoClinico.createch, box .codigoClinico.caresStock{box-shadow: none!important;}
   .codigoClinico:not(.cares) row{ flex-direction: column; align-items: flex-start;}
   .codigoClinico:not(.cares) row label{border: none!important;;   }
   .codigoClinico:not(.cares) row input { width: 100%!important;margin:0;}
   }

@media only screen 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}
    
    #pie a.right, #pie p{width:100%!important; text-align:center!important; margin:0;    font-size: 11px; line-height: 15px;}
    #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}
        .saludoLogin line{border-bottom: none!important;}
   .cajaLogin, .cajaRepContra{ width:80%!important; padding:0 5%; margin-top:0; background:none; border:none; position:initial!important;}
   .cajaLogin > a{ width: 100%; text-align: right; bottom:10px; top: initial;}
    .cajaLogin small {vertical-align: 13px!important;font-size: 14px!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{ display:none}
    .codigoClinico .parteIzq, .codigoClinico .parteDcha{ width:100%!important}
    .imgMovil {display:block!important;}

    .invitarClinica .parteIzq img{display:none}
    .formInvitarClinica{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{width:100%; float:initial;}
        .aceptarCanjeo p{font-size:0.9em}
     
           .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{    zoom: .6;overflow: hidden;clear: both;display: block;}
      .enlacesInteres{margin-top:30px}
            redesociales{width: 100%!important;      }


   .paginacioncontainer{bottom: 50px; padding: 20px 5%;}
      
    .paginacion button span, .btnUltimo, .btnPrimero{display:none!important}
    .paginacion span{padding:6px 0!important;}
   .paginacion button{margin: -3px 0;width: 29px;}

   .saludoLogin img{display:none!important}

.saludoLogin img.logoMobilenegro{display:inline-block!important; margin-right: 7px; vertical-align: text-top;}
   .borde label {    width: calc(100% - 100px);  border-radius: 0!important; box-shadow: none!important; border: 1px solid #a2bca2!important;}
      box .codigoClinico.cares, box .codigoClinico.createch, box .codigoClinico.caresStock{box-shadow: none!important;}
         .codigoClinico:not(.cares) row{ flex-direction: column; align-items: flex-start;}
   .codigoClinico:not(.cares) row label{border: none!important;;   }
   .codigoClinico:not(.cares) row input { width: 100%!important; margin:0;}
   redesociales row column:nth-child(2) a{margin: 0;}
   redesociales row column:nth-child(2) a img{float: right;}


     }