/* 
    Created on : 27/04/2015
    Author     : El Puente Publicidad SLU
*/

/**FUENTES*/
@font-face {
	font-family: 'trajan';
	src: url('fonts/TrajanProRegular.eot');
	src: local('TrajanProRegular'), url('fonts/TrajanProRegular.woff') format('woff'), url('fonts/TrajanProRegular.ttf') format('truetype');
}
@font-face {
    font-family:'lucida';
    src: url('fonts/lucida_grande-webfont.eot');
    src: url('fonts/lucida_grande-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/lucida_grande-webfont.woff') format('woff'),
         url('fonts/lucida_grande-webfont.ttf') format('truetype'),
         url('fonts/lucida_grande-webfont.svg#lucida') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family:'novenormal';
    src: url('fonts/novecentowide-normal-webfont.eot');
    src: url('fonts/novecentowide-normal-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/novecentowide-normal-webfont.woff') format('woff'),
         url('fonts/novecentowide-normal-webfont.ttf') format('truetype'),
         url('fonts/novecentowide-normal-webfont.svg#novenormal') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family:'demibold';
    src: url('fonts/novecentowide-demibold-webfont.eot');
    src: url('fonts/novecentowide-demibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/novecentowide-demibold-webfont.woff') format('woff'),
         url('fonts/novecentowide-demibold-webfont.ttf') format('truetype'),
         url('fonts/novecentowide-demibold-webfont.svg#demibold') format('svg');
    font-weight: normal;
    font-style: normal;
}

/**BASIC*/	
html body{margin: 0px; padding:0px; width: 100%; position:relative;} 
input{margin: 0px;padding:0px;} 
h1, h2, h3, h4, p{margin:0px; padding:0px;} 
a{text-decoration:none; margin:0px; padding:0px;}
ul{margin:0px; padding: 0px;}
.limpieza{clear:both;}
.negrita{font-weight:bold;}
.relative{position:relative;}
.capaizq{float:left;}.capader{float:right;} 
.txcent{text-align:center;}
.none{display:none;}
.hidden{visibility: hidden;}
.imgresponsive{max-width: 100%; height: auto;}
img{border: 0;}
iframe{width: 100%;}
body{background:#fff;}
.listascertificado{margin: 10px 0px;}
/**ALTURAS*/
	
	
	
/**INDEX*/
/*ALERTAS*/
#errorprevio{ display:none;}
.alert{ position:fixed !important; width:100%; z-index:100; font-size:20px !important;}
.close{margin:0px 50px 0px 0px;}
.close2{margin:0px !important;} 
/**FIN ALERTAS*/
.pagina{width:100%; margin: 0px auto; position: relative; background: #fff;}
.contenido{width:100%; max-width: 980px; margin: 0px auto; position: relative;}
header{width:100%; text-align:center; position: relative; padding: 240px 0px 300px; background: url(images/banner.jpg) no-repeat top center; background-size: cover; -webkit-background-size:cover; -moz-background-size:cover;}
header h1{font-size:70px; color:#000; font-family: trajan; text-transform: uppercase;}
#linbanner{width:26px; height: 2px; margin:0px auto; background:#0072b1;}
header h2{font-size:17px; color:#000; font-family: trajan; text-transform: uppercase;}
#caract{width:100%;position: relative; padding: 220px 0px 217px; background: url(images/bgiconos.jpg) no-repeat top center; background-size: cover; -webkit-background-size:cover; -moz-background-size:cover;}
#caract ul{list-style: none;}
#caract ul li{width:29.89%; float:left; margin-right: 5%; text-align: center;}
#caract ul li:last-child{margin:0px !important; float:right;}
#complementos{width:100%;position: relative; padding: 144px 0px; background: url(images/bgpulseras.jpg) no-repeat top center; background-size: cover; -webkit-background-size:cover; -moz-background-size:cover;}
#complementos h3{text-align: center; font-size:34px; font-family: trajan; color:#fff; text-transform: uppercase; text-shadow: 0 0 20px rgba(0,0,0,1);}
#arcli{width:100%;position: relative; padding: 224px 0px 230px; background: url(images/bgarcli.jpg) no-repeat top center; background-size: cover; -webkit-background-size:cover; -moz-background-size:cover;}
#col1cli{float:left; width:42%; padding-right: 8%; border-right: 2px solid #0072b1;}
#col2cli{float:right; width:38%;}
#icocli{float:left;} 
#colclie{float:right; width:77%;}
#colclie h3{font-size:32px; color:#191312; font-family: demibold;}
#colclie p{font-size:12px; color:#9f9f9f; font-family: lucida; line-height: 19px; text-transform: uppercase; }
.labelacceso{font-size: 13px; color:#0072b1; font-family:demibold; text-transform: uppercase; }
.botonregistrar{width:121px; background:#0f85c6; text-transform:uppercase; border-radius: 3px; color:#fff; font-size:15px; font-family:lucida; border:1px solid #5d85bf; font-weight:bold; text-align: center; cursor: pointer;  padding:10px 0px; float: right;}
.inputregistro{width:100%; background:#f1f1f1; height:37px; color:#000; border:1px solid #d0d0d0; font-family: Arial, Helvetica, sans-serif; border-radius:0px;}
#exp{width:100%; position: relative; background:#fff; padding:58px 0px;}
#col1exp{width:50%; float: left; text-align: center;}
#col2exp{width:50%; float: right; text-align: center;}
#exp img{border:1px solid #177fb8;} 
#llamada{width:100%;position: relative; padding: 132px 0px 132px; background: url(images/bgllamada.jpg) no-repeat top center; background-size: cover; -webkit-background-size:cover; -moz-background-size:cover; text-align: center;}
#llamada i{font-size: 70px; color:#0072b1; text-align: center;}
.texto1llamada{width:100%; position: relative; text-align: center; font-family: trajan; font-size: 21px; text-transform: uppercase; color:#fff;} 
.texto2llamada{width:100%;position: relative; text-align: center; font-family: demibold; font-size: 38px; text-transform: uppercase; color:#f28e00;} 
.formcapallamada{width:100%; max-width:310px; margin: 0px auto; position: relative; z-index: 2; text-align: center; } 
.formcapallamada h3{font-size: 15px; font-family: lucida; color:#fff; text-transform: uppercase;}
.inputllamada{width:100%; height: 35px; background: #fcfcfc; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border: 1px solid #cfcfcf;}
.inputcondi{float: left;}
.parrafocondicionesllamada{float: left; margin-left: 16px; font-family: lucida; font-size: 12px; color: #000;margin-top: 2px;}
.parrafocondicionesllamada a{ color: #fff;}
.btenviarllamada{transition: background-color 300ms ease-out;cursor: pointer; width: 100%; background:#3ca2da; border: 1px solid #5d85bf; padding-top: 6px; padding-bottom:6px; color:#fff; font-size: 15px; font-family: lucida;}
.btenviarllamada:hover{background: #1f82b8;}
.texto3llamada{width:100%;margin: 0px auto; position: relative; z-index: 2; text-align: center; font-family: demibold; font-size: 38px; text-transform: uppercase; color:#0072b1;}
.mailllamada{font-size:32px; font-family: demibold; color:#acacac; text-decoration: none;}

footer{font-size:10px; font-family: lucida; text-transform: uppercase; color:#fff;width:100%; padding:14px 0px; background:#0072b1;}
footer a{font-size:10px; font-family: lucida; text-transform: uppercase; color:#fff; }
#izqfooter{width:50%; text-align: left; float:left;}
#derfooter{width:50%; text-align: right; float:right;}
.tabladelegaciones{display:table; width:100%;}
.tablafiladelegaciones{display:table-row;}
.tablacoldelegaciones{display:table-cell; width:50%; padding:5%; text-align:left; vertical-align:middle;}
.tablacoldelegaciones img{width:100%; height:auto;}

/* ----------- REGLAS RESPONSIVE ----------- */
@media only screen and (max-width: 1024px) {
  header h1 {font-size: 50px;}
  #caract ul li{width: 100%;float: none; margin:0px auto !important; margin-bottom:10px !important;}
  #complementos h3 {text-align: center;font-size: 19px;}
  #col1cli {width: 95%;float: none; margin: 0px auto; text-align: center; padding:0; border:0;}
  #icocli {display: none;}
  #colclie {float: none;width: 100%; margin-bottom:20px;}
  #col2cli {float: none; width: 90%; margin: 0px auto;}
  .botonregistrar {float: none;margin: 0px auto;}
  #col1exp {width: 96%;float: none; margin:0px auto !important; margin-bottom:10px !important;}
  #col2exp {width: 96%;float: none; margin:0px auto !important; margin-bottom:10px !important;}
  #llamada i {font-size: 40px;}
  .texto1llamada {font-size: 14px;}
  .texto3llamada {font-size: 24px;}
  .formcapallamada {width: 96%;}
  .formcapallamada h3 {font-size: 12px;}
  .mailllamada {font-size: 14px;}
  #izqfooter { width: 100%; text-align: center;float:none; margin-bottom:10px;}
  #derfooter { width: 100%; text-align: center;float:none;}
  #arcli{background:#fff;}
}

@media only screen and (max-width: 768px) {
    header h1 {font-size: 50px;}
  #caract ul li{width: 100%;float: none; margin:0px auto !important; margin-bottom:10px !important;}
  #complementos h3 {text-align: center;font-size: 19px;}
  #col1cli {width: 95%;float: none; margin: 0px auto; text-align: center; padding:0; border:0;}
  #icocli {display: none;}
  #colclie {float: none;width: 100%; margin-bottom:20px;}
  #col2cli {float: none; width: 90%; margin: 0px auto;}
  .botonregistrar {float: none;margin: 0px auto;}
  #col1exp {width: 96%;float: none; margin:0px auto !important; margin-bottom:10px !important;}
  #col2exp {width: 96%;float: none; margin:0px auto !important; margin-bottom:10px !important;}
  #llamada i {font-size: 40px;}
  .texto1llamada {font-size: 14px;}
  .texto3llamada {font-size: 24px;}
  .formcapallamada {width: 96%;}
  .formcapallamada h3 {font-size: 12px;}
  .mailllamada {font-size: 14px;}
  #izqfooter { width: 100%; text-align: center;float:none; margin-bottom:10px;}
  #derfooter { width: 100%; text-align: center;float:none;}
  #arcli{background:#fff;}
} 
@media only screen and (max-width: 480px) {
    header h1 {font-size: 50px;}
  #caract ul li{width: 100%;float: none; margin:0px auto !important; margin-bottom:10px !important;}
  #complementos h3 {text-align: center;font-size: 19px;}
  #col1cli {width: 95%;float: none; margin: 0px auto; text-align: center; padding:0; border:0;}
  #icocli {display: none;}
  #colclie {float: none;width: 100%; margin-bottom:20px;}
  #col2cli {float: none; width: 90%; margin: 0px auto;}
  .botonregistrar {float: none;margin: 0px auto;}
  #col1exp {width: 96%;float: none; margin:0px auto !important; margin-bottom:10px !important;}
  #col2exp {width: 96%;float: none; margin:0px auto !important; margin-bottom:10px !important;}
  #llamada i {font-size: 40px;}
  .texto1llamada {font-size: 14px;}
  .texto3llamada {font-size: 24px;}
  .formcapallamada {width: 96%;}
  .formcapallamada h3 {font-size: 12px;}
  .mailllamada {font-size: 14px;}
  #izqfooter { width: 100%; text-align: center;float:none; margin-bottom:10px;}
  #derfooter { width: 100%; text-align: center;float:none;}
  #arcli{background:#fff;}
}

@media only screen and (max-width: 320px) {
  header h1 {font-size: 50px;}
  #caract ul li{width: 100%;float: none; margin:0px auto !important; margin-bottom:10px !important;}
  #complementos h3 {text-align: center;font-size: 19px;}
  #col1cli {width: 95%;float: none; margin: 0px auto; text-align: center; padding:0; border:0;}
  #icocli {display: none;}
  #colclie {float: none;width: 100%; margin-bottom:20px;}
  #col2cli {float: none; width: 90%; margin: 0px auto;}
  .botonregistrar {float: none;margin: 0px auto;}
  #col1exp {width: 96%;float: none; margin:0px auto !important; margin-bottom:10px !important;}
  #col2exp {width: 96%;float: none; margin:0px auto !important; margin-bottom:10px !important;}
  #llamada i {font-size: 40px;}
  .texto1llamada {font-size: 14px;}
  .texto3llamada {font-size: 24px;}
  .formcapallamada {width: 96%;}
  .formcapallamada h3 {font-size: 12px;}
  .mailllamada {font-size: 14px;}
  #izqfooter { width: 100%; text-align: center;float:none; margin-bottom:10px;}
  #derfooter { width: 100%; text-align: center;float:none;}
  #arcli{background:#fff;}
}  