/**
* main.css
* Para Chekuerai-vacunas
* Sistema para pago y transferencia de dinero
* Feb-20-2021
* Mdlothian VA
**/
/*input[type="search"]{width: 100%;-webkit-box-sizing:border-box;-moz-box-sizing: border-box;-webkit-appearance: none;}*/
.inputError{background-color: #fe6965;color:white}
/*  ===  Menu =====*/
nav{float:right;}
nav a{color:white;text-decoration: none;}/* color #35b92b */
nav a:hover{text-decoration: underline;}
nav ul{padding: 0;margin: 0;list-style: none;}
nav li{padding: 15px;margin: 0;display: inline-block;}
.mobile-nav{display:none}
#mobile-menu{display: none;}
.divnav ul{list-style: none;}
.divnav li{display: inline-block;float: left;padding: 15px;}
.divnav a:link{color:white;text-decoration: none;}/* color #35b92b */
.divnav a:visited{color:white}
.divnav a:active{color:white}
.divnav a:hover{color:white;text-decoration: underline;}
/*******Para background images*********************/
.bkgtransp{background-color: rgba(0,0,0,.7);}
.bkgimage{background-image: url("/images/plata.png");background-size: cover;background-repeat: no-repeat;background-position:center center center center;opacity: 0.7;background-color: black}
.img{max-width: 70%;}
/*=== DIV'S ====*/
.container{width:100%;max-width:100%;margin-left: auto;margin-right: auto;}
.row{display:-ms-flexbox;display:flex;flex-wrap:wrap;width:97.7%;max-width:97.7%;margin-left: 1.2%;}
.main-body{position: relative;overflow: hidden;width: 100%}
.col-left{position: relative;overflow: hidden;width: 20%;display: inline-block;}
.col-center{position: relative;overflow: hidden;width: 58%;display: inline-block;}
.col-right{position: relative;overflow: hidden;width: 18%;display: inline-block;}

.div1col{display: inline-block;width: 100%;max-width: 100%}
.div2col{width: 49.5%;max-width: 49.5%;display: inline-block}
.div3col{display: inline-block;width: 33%;max-width: 33%}
.div4col{display: inline-block;width: 24%;max-width: 24%}
.div5col{display: inline-block;width: 18.72%;}
.infocol{display: inline-block;width: 24%;max-width: 24%}
.divlogoletra{width:100%;max-width:100%;color:#4ab54a;font-size:5em;font-weight: bold;text-align: center;margin: 0 0 .5em 0;padding:.5em 0 .5em 0}
 /* Div's de tamano fijo, no cambian de tamaņo' */
.col2fix{display: inline-block;width: 49.5%;max-width: 49.5%}
.col3fix{display: inline-block;width: 32.26%;}
.col4fix{display: inline-block;width: 23.8%;}
.divuser{width:5%;max-width: 5%;margin-left: 2em;cursor: pointer;}
/************IMG**********************/
.showimg{display: inline-block;width:98%;max-width:98%;height: auto;margin: auto}
.showimg img{width: 100%}
 /********** Botones y Divs para botones **************/
.btncontainer{width:99%;max-width:99%;text-align:center;position:relative;padding:2em 0 2em 0;}
.div1boton{width:100%;max-width:100%;display:inline-block;position:relative;margin-top:1em;}
.div2boton{width:49.5%;max-width:49.5%;display:inline-block;position:relative;margin-top:1em;}
.div3boton{width:32%;max-width:32%;display: inline-block;margin-top: 1em;position: relative;}
.boton{color:#48d1cc;height:2.5em;font-size:1.3em;background-color:white;border:3px solid #48d1cc;cursor:pointer;border-radius:4px;text-align: center;width:99%;letter-spacing: 0.05em}
.boton:hover{cursor:pointer;border:1px solid #48d1cc;color: #48d1cc;font-weight: bold;transition: .5s}
.boton2{height:2.5em;font-size:1.3em;border:0px solid #48d1cc;border-radius:4px;text-align: center;background-color: #48d1cc;color:white;width:99%;letter-spacing: 0.05em}
.boton2:hover{cursor:pointer;color:#2ecdd1;font-weight: bold;background-color:white;transition:.5s;border:2px solid #48d1cc}
.boton3{height:2.5em;font-size:1.3em;border:0px solid #62c554;border-radius:4px;text-align: center;background-color: #62c554;color:white;width:95%;letter-spacing: .08em}
.boton3:hover{cursor:pointer;color:#62c554;font-weight: bold;background-color:white;transition:.5s;border:2px solid #62c554}
/************ERROR MESSAGES********************/
.mensaje_error{padding:20px;background-color:#f44336;color: white;;margin:0 0 10px 0px;width: 100%;display: none;}
.mensaje_error::before{font-family: FontAwesome;content: "\f057"}
.mensaje_ok::before{font-family: FontAwesome;content: "\f00c"}
.mensaje_ok{padding: 20px;background-color: #41af34;color: white;position: relative;margin-bottom: 10px;width: 99%;box-sizing: border-box;display: none;}
.error_msg{padding:20px;background-color:#f44336;color:white;position: relative;margin-bottom: 10px;width: 99%;text-align:center;}
.error_msg::before{font-family: FontAwesome;content: "\f057"}
.ok_msg2{padding: 20px;background-color: #41af34;color: white;position: relative;margin-bottom: 10px;width: 99%;box-sizing: border-box;}
.ok_msg2::before{font-family: FontAwesome;content: "\f00c"}
.closebtn{margin-left:15px;color:white;font-weight:bold;float:right;font-size:22px;line-height:20px;cursor:pointer;transition:0.3s;}
.closebtn:hover{color:black;}
#errorContainer{display:none;overflow:auto;background-color:#FFDDDD;border:1px solid #FF2323;padding-top:0;margin-top:1%;padding-left:1%;width: 99.6%;margin: 0 0 15px 1px}
#errorContainer li{list-style:none;}
#errorContainer label{float: none;width:auto;}
/****************************/
.cabecera{width:100%;max-width:100%;font-size:2.5em;margin: 1em 0 2em 0;color: #c0bcbe;text-align: center;line-height: 1em;letter-spacing: .1em}
.bigHeader{width:100%;max-width:100%;font-size:2.5em;margin: .5em 0 .5em 0;color: #c0bcbe1;text-align: center;line-height: 1em;letter-spacing: .1em;font-weight: 700}
.mediumHeader{width:100%;max-width:100%;font-size:2em;margin: .5em 0 .5em 0;color: #c0bcbe1;text-align: center;line-height: 1em;letter-spacing: .1em}
.smallHeader{width:100%;max-width:100%;font-size:1.5em;margin: .5em 0 .5em 0;color: #c0bcbe1;text-align: center;line-height: 1em;letter-spacing: .1em}
.smallBody{width:94%;max-width:94%;font-size:1.2em;color: #7a7477;text-align: justify;line-height: 1.2em;letter-spacing: .1em;font-weight: 400;margin-top:.5em;margin-left:3%;margin-bottom: .5em}
.mediumBody{}

.bigBodyExplain{width:100%;max-width:100%;font-size:2.5em;letter-spacing:.05em;line-height:1em;padding:15% 0;text-align: center;float: left;}
.bigBodyExplain2{width:73%;max-width:73%;font-size: 2.5em;letter-spacing:.05em;line-height:1em;padding:15% 0;text-align: center;float: left;}
.imgExplain{width: 25%;max-width: 25%;float: left;padding: 2%}
.imgExplain img{width: 100%}
.imgExplain2{width: 25%;max-width: 25%;float: left;padding-top: 17%}
.imgExplain2 img{width: 100%}
.mainExplain{width:100%;max-width:100%;margin:1em 0 1em 0;padding:0px;opacity:0;font-family:'Roboto', sans-serif;display:inline-block;}
/**************FOOTER***********************/
.foot{width: 100%;max-width: 100%;margin-top: 2em;background-color: #5f6b60;color: #54ba45}
.divfooter{width: 32.8%;max-width: 32.8%;}
@media screen and (max-width: 22em){
  .bigHeader{font-size: 1.9em !important;}
  .divlogoletra{font-size:2.2em !important;}
  .mediumHeader{font-size:1em !important;}
  .bigBodyExplain,.bigBodyExplain2{font-size:1.5em !important;}
}

@media screen and (max-width: 30em){
 .col{margin: 1% 0 1% 0%;}
 .div2col{display: inline-block;width: 100%;max-width: 100%}
 .col-left{width: 100%;}
 .div2boton{width:99.8%;max-width:99.8%;}
 .saldocontainer{width:100%;max-width:100% }
 .col-center{width: 100%}
 .row{width:95%;max-width: 95%;margin-left: 2.4%;}
 .bkgimage{background-size: cover !important;background-repeat: no-repeat;background-position: center center center center;opacity: .5}
 .img{max-width: 100%;height: auto;}
 .bkgimage{background-position: center center;}
  /*=========M e n u ========*/
  /*.mobile-nav{display: inline-block;margin-right: 10px}
  nav ul, nav:active ul{display: none;}
  nav li{background-color:white;text-align:center;width:100%;padding:10px 0;margin:0;display:inline-block;float:left;padding:10px;font-weight:bold;color:#7e7a69;overflow: auto;}
  nav a:link{color:#7e7a69;text-decoration: none;}
  nav a:visited{color: #7e7a69}
  nav a:active{color: #7e7a69}
  /*========FONTS===============*/
  .fontsmall{font-size:70%}
  .fontnormal{font-size:90%}
  .fontmedium{font-size:140%}
  .fontlarge{font-size:200%}
  /*==========================*/
  .cabecera1{font-size: 1.6em}
  input, select, .boton, .boton-clear{font-size: 1.3em}
  .bigBodyExplain,.bigBodyExplain2{font-size: 1.6em;line-height: 1.2em;width:100%;max-width:100%;letter-spacing: .05em;line-height: 1.1em;padding:25% 0;text-align: center;}
  .imgExplain,.imgExplain2{width:50%;max-width: 50%;padding: 2%;margin-left: 25%;text-align: center;}
  .bigHeader{font-size:2.2em}
  .divlogoletra{font-size:3.5em;}
}/* end media 480*/

@media screen and (min-width: 30em) and (max-width : 53em){
	.col-left{width: 7%;}
	.col-center{width: 85%;max-width: 85%}
	.div2col{width: 100%;max-width: 100%}
  .saldocontainer{width:100%;max-width:100% }
  .div2boton{width:99.8%;max-width:99.8%;}
  .cabecera1{font-size: 1.9em}
  .bigHeader{font-size: 2.2em}
  .divlogoletra{font-size:4.2em;}
  .bigBodyExplain,.bigBodyExplain2{font-size: 1.8em}
	
} /* end min width 30em  and max 53*/

@media only screen and (min-width:53em) and ( max-width:70em){
	.col-left{width: 10%;}
	.col-center{width: 80%;max-width: 80%}
  .cabecera1{font-size: 2em}
  .bigBodyExplain,.bigBodyExplain2{font-size: 2.1em}
} /* end min 53 and max 70 */