@font-face {
  font-family: "VarialRounded-ExtracondensedMed";
  src: url("../../fonts/VarialRounded-ExtracondensedMed.eot"); /* IE9 Compat Modes */
  src: url("../../fonts/VarialRounded-ExtracondensedMed.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("../../fonts/VarialRounded-ExtracondensedMed.otf") format("opentype"), /* Open Type Font */
    url("../../fonts/VarialRounded-ExtracondensedMed.svg") format("svg"), /* Legacy iOS */
    url("../../fonts/VarialRounded-ExtracondensedMed.ttf") format("truetype"), /* Safari, Android, iOS */
    url("../../fonts/VarialRounded-ExtracondensedMed.woff") format("woff"), /* Modern Browsers */
    url("../../fonts/VarialRounded-ExtracondensedMed.woff2") format("woff2"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
}

html {
  min-height: 100%;
  position: relative;
}

footer {
  position: absolute;
  bottom: 0;
  width: 100%; 
}

body{
  font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin-bottom: 100px;
}

header{
  background-color: #ffffff;
  border-bottom: #f75c48 2px solid; 
}
header .hd{
  min-height: 100px;
  position: relative;
}
header .hd img{
    position: absolute;
}
header .hd .left{
   top: 50%;   
   left: 0px;   
   margin-top: -41px;
}
header .hd .right{
   top: 50%;   
   right: 0px;
   margin-top: -29.5px;
}

.title{
  color: #18557d;
  border-bottom: #18557d 1px solid;
  padding-bottom: 8px;
  margin-bottom: 12px;
  font-weight: bold;
}

.h33{
  height: 33px;
  line-height: 33px;
}

.bk_header{
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: top center;
  padding: 50px 0px;
  margin-bottom: 15px;
}
.bk_footer{
  background-color: #18557d;
  background-repeat: no-repeat;
  background-position: top center;
  color: #fff;
  height: 100px;
  padding-top: 15px;  
}

.lv{
  vertical-align: middle !important;
}

.m15{ margin: 15px; }

.p15{ padding: 15px; }

#result{
   position: absolute;
   z-index: 5;
   width: 99%;
   left: 2px;
}

.bd-danger{
   border:#721c24 5px solid;
}

.bd-info{
   border:#0c5460 5px solid;
}

.closei{
   color: #0c5460;   
}
.closei:hover{
   color: #0c5460;
   text-decoration: none;
}

.closed{
   color: #721c24;   
}
.closed:hover{
   color: #721c24;
   text-decoration: none;
}

select{ cursor:pointer; }
.custom-control-label,input[type="radio"],input[type="checkbox"]{ cursor:pointer; }

fieldset{
  border: 1px solid #ddd !important;
  margin: 0;
  xmin-width: 0;
  padding: 10px;
  position: relative;
  border-radius:4px;
  background-color:#f5f5f5;
  padding-left:10px!important;
}

legend{
  font-size:14px;
  font-weight:bold;
  margin-bottom: 0px;
  width: 36%;
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 5px 5px 5px 10px;
  background-color: #ffffff;
  text-align: center;
}

iframe{
  overflow:hidden;
  overflow-x:hidden;
  overflow-Y:hidden;
}


.box {
    border-radius: 3px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    padding: 10px 25px;
    display: block;
    margin-top: 60px;
}
.box-icon {
    background-color: #57a544;
    border-radius: 50%;
    display: table;
    height: 100px;
    margin: 0 auto;
    width: 100px;
    margin-top: -61px;
}
.box-icon span {
    color: #fff;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}
.info h4 {
    font-size: 26px;
    letter-spacing: 2px;
    text-transform: uppercase;
}
.info > p {
    color: #717171;
    font-size: 16px;
    padding-top: 10px;
    text-align: justify;
}

.info a.boton {
    background-color: #337ab7;
    border-radius: 2px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    color: #fff;
    transition: all 0.5s ease 0s;
}
.info a.boton:hover {
    background-color: #0288d1;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.16), 0 2px 5px 0 rgba(0, 0, 0, 0.12);
    color: #fff;
    transition: all 0.5s ease 0s;
}

.p-10-0{ padding: 10px 0px; }
.p-20-0{ padding: 20px 0px; }

.lh50{
  line-height: 50px;
}

.g1_30{font-size: 30px;}
.gi_120{font-size: 120px;}

.preview{
  background-color: #fefefe;
  display: inline-block;
  padding: 10px 10px;
  color:#333333;
  font-weight:bold;
}
.preview:hover{ text-decoration: none; color:#333333; }
.preview:active{ text-decoration: none; }

.help-block{ font-size: 12px; }

#caja{
  width: 1000px;
  height: 410px;
  overflow: auto;
  overflow-y: hidden;
  margin: 0 auto;
  white-space: nowrap;
  border:#000 1px solid;
}

.codigo{
  font-weight: 900;
  font-size: 48px;
  color:#57a544;
}

.punto{
  font-weight: bold;
  color:#337ab7;
}

.error{
  border:#a94442 1px solid;
  color: #a94442;
  padding: 8px;
  margin: 15px 0px 5px 0px;
}

.bk1{
  background-color: #fff;
}

.mtb30{
  margin: 30px 0px;
}

.form-group.is-invalid {
    .invalid-feedback {
        display: block;
    }
}

.none{
  display: none;
}


.span_pseudo, .chiller_cb span:before, .chiller_cb span:after {
  content: "";
  display: inline-block;
  background: #fff;
  width: 0;
  height: 0.2rem;
  position: absolute;
  transform-origin: 0% 0%;
}

.chiller_cb {
  position: relative;
  height: 2rem;
  display: flex;
  align-items: center;
}
.chiller_cb input {
  display: none;
}
.chiller_cb input:checked ~ span {
  background: #18557d;
  border-color: #18557d;
}
.chiller_cb input:checked ~ span:before {
  width: 1rem;
  height: 0.15rem;
  transition: width 0.1s;
  transition-delay: 0.3s;
}
.chiller_cb input:checked ~ span:after {
  width: 0.4rem;
  height: 0.15rem;
  transition: width 0.1s;
  transition-delay: 0.2s;
}
.chiller_cb input:disabled ~ span {
  background: #ececec;
  border-color: #dcdcdc;
}
.chiller_cb input:disabled ~ label {
  color: #dcdcdc;
}
.chiller_cb input:disabled ~ label:hover {
  cursor: default;
}
.chiller_cb label.txt {
  padding-left: 2rem;
  position: relative;
  z-index: 2;
  cursor: pointer;
  margin-bottom:0;
  width: 100%;
}
.chiller_cb span {
  display: inline-block;
  width: 1.2rem;
  height: 1.2rem;
  border: 2px solid #ccc;
  position: absolute;
  left: 16px;
  transition: all 0.2s;
  z-index: 1;
  box-sizing: content-box;
}
.chiller_cb span:before {
  transform: rotate(-55deg);
  top: 1rem;
  left: 0.37rem;
}
.chiller_cb span:after {
  transform: rotate(35deg);
  bottom: 0.35rem;
  left: 0.2rem;
}

.custom-radios div {
  display: inline-block;
}
.custom-radios input[type="radio"] {
  display: none;
}
.custom-radios input[type="radio"] + label {
  color: #fff;
  font-weight: bold;
  font-size: 14px;
}
.custom-radios input[type="radio"] + label span {
  display: inline-block;
  width: 40px;
  height: 40px;
  margin: -1px 4px 0 0;
  vertical-align: middle;
  cursor: pointer;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
  background-repeat: no-repeat;
  background-position: center;
  text-align: center;
  line-height: 44px;
}
.custom-radios input[type="radio"] + label span img {
  opacity: 0;
  transition: all .3s ease;
}
.custom-radios input[type="radio"]#color-1 + label span {
  background-color: #2ecc71;
}
.custom-radios input[type="radio"]#color-2 + label span {
  background-color: #3498db;
}
.custom-radios input[type="radio"]#color-3 + label span {
  background-color: #f1c40f;
}
.custom-radios input[type="radio"]#color-4 + label span {
  background-color: #e74c3c;
}
.custom-radios input[type="radio"]:checked + label span {
  opacity: 1;
  background: url('../images/check-icn.svg') center center no-repeat;
  width: 40px;
  height: 40px;
  display: inline-block;
}

#imgdiv{
  display: inline-block;
}
