/*custom font*/
@import url(import url here);

body {
  color: #353535;
  font-family: 'PT Serif', sans-serif;
  height: 100%;
}

.invalid {
  background-color: #ffdddd;
}

/* Mark input boxes that get errors during validation: */
input.invalid {
  background-color: #ffdddd;
}

select.invalid {
  background-color: #ffdddd;
}

/* Landing */
header{
  height: auto;
  background: #FFF;
}

input[type="radio"] {
    padding: 0;
    z-index: -9999;
    position: absolute;
   display: none;
}

#formulario{
  max-width: 420px;
  width: 100%;
}


input:valid{
  color: #71192E;
  background: #FFF;
}

.form-control::placeholder{
  color: #353535;
}

.form-control{
  color: #353535;
  font-size: 0.85rem;
}


.btn-custom {
  color: #FFF;
  background-color: #71192E;
  border-color: #71192E;
  font-size: 1rem;
  font-weight: 700;
  border-radius: 1.5rem !important;
}

.btn-custom:hover {
  color: #FFF;
  background-color: #4D7B6A;
  border-color: #71192E;
}

.btn-custom-2 {
  color: #FFF;
  background-color: #71192E;
  border-color: #FFF;
  border: 2px solid #FFF !important;
  font-size: 1rem;
  font-weight: 700;
  border-radius: 1.5rem !important;
}

.btn-custom-2:hover {
  color: #FFF;
  background-color: #71192E;
  border-color: #71192E;
}

@media (min-width: 576px){
  .btn-custom-2 {
    font-size: 1.25rem;
    border-radius: 1.75rem !important;
  }
}

.btn-custom:focus, .btn-custom.focus {
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}

.btn-custom.disabled, .btn-custom:disabled {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}

.btn-custom:not(:disabled):not(.disabled):active, .btn-custom:not(:disabled):not(.disabled).active,
.show > .btn-custom.dropdown-toggle {
  color: #cecece;
  background-color: #FFF;
  border-color: #cecece;
}

.btn-custom:not(:disabled):not(.disabled):active:focus, .btn-custom:not(:disabled):not(.disabled).active:focus,
.show > .btn-custom.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}

.bootstrap-select{
  color: #000!important;
}

.bootstrap-select > .dropdown-toggle.bs-placeholder, .bootstrap-select > .dropdown-toggle.bs-placeholder:active, .bootstrap-select > .dropdown-toggle.bs-placeholder:focus, .bootstrap-select > .dropdown-toggle.bs-placeholder:hover{
  color: #c3c3c3;
}

.dropdown-item.active, .dropdown-item:active{
  background-color: #28a745 !important;
  color: #FFF !important;
}

.btn-lg{
  font-size: 1rem;
}

select:valid{
  color: #71192E;
  background: #FFF;
}

input#termin, input#otros{
  width: 1rem;
  height: 1rem;
}

.selectpicker{
  color: #28a745 !important;
}


label.custom{
  background: rgba(256, 256, 256, 1);

border-radius: 0.2rem;

padding: 2px 5px;

font-size: 0.75rem;

color: #232323;
}

.font-weight-black{
  font-weight: 900 !important;
}

.font-weight-extrabold{
  font-weight: 800 !important;
}

.font-weight-bold{
  font-weight: 700 !important;
}

.font-weight-medium{
  font-weight: 600 !important;
}

.bg-white-opacity{
  background: rgba(256,256,256,0.75)
}

.text-primary{
  color: #71192E !important;
}

.text-secondary{
  color: #BEBEBE !important;
}

.bg-primary{
  background: #71192E!important;
}

.bg-secondary{
  background: #e8e8e8 !important;
}

.badge-primary{
  background: #009ee0 !important;
}

.btn{
  -moz-box-shadow: inset 0px -1px 0px 0px rgba(256,256,256,0.25);

  -webkit-box-shadow: inset 0px -1px 0px 0px rgba(256,256,256,0.25);

  box-shadow: inset 0px -1px 0px 0px rgba(256,256,256,0.25);
}


.btn-outline-secondary {
    color: #fff !important;
    border-color: #fff !important;
}


.badge-custom {
  color: #fff;
  background-color: #DB0080;
}

.icon{
  width: 20px;
   color: #009ee0 !important;
}

footer{
  height: 82px;
}

@media (min-width: 576px){
  footer{
    height: 104px;
  }
}

#formulario-modal{
  max-width: 320px;
}



#logo{
  width: 190px;
}

.xs{
  font-size: 14px;
}

@media (min-width: 576px) {
  .xs{
    font-size: 1rem;
  }
}

@media (min-width: 992px){
  .xs{
    font-size: 1.15rem;
  }
}

h1, .h1{
  font-size: 1.15rem;
}

@media (min-width: 576px) {
  h1, .h1 {
    font-size: 1.5rem;
  }
}

@media (min-width: 768px) {
  h1, .h1 {
    font-size: 1.75rem;
  }
}

@media (min-width: 992px) {
  h1, .h1 {
    
  }
}

@media (min-width: 1200px) {
  h1, .h1 {
    
  }
}

h3, .h3{
  font-size: 1rem;
}

@media (min-width: 576px) {
  h3, .h3 {
    font-size: 1.25rem;
  }
}

@media (min-width: 768px) {
  h3, .h3 {
    font-size: 1.5rem;
  }
}

@media (min-width: 992px) {
  h3, .h3 {
    font-size: 1.25rem;
  }
}

@media (min-width: 1200px) {
  h3, .h3 {
    
  }
}

h5, .h5{
  font-size: 1rem;
}

@media (min-width: 576px) {
  h5, .h5 {
    font-size: 1.15rem;
  }
}

@media (min-width: 768px) {
  h5, .h5 {
    
  }
}

@media (min-width: 992px) {
  h5, .h5 {
    font-size: 1.25rem;
  }
}

@media (min-width: 1200px) {
  h5, .h5 {
    
  }
}

#background{
  background: url('../img/tarjeta-credito-revolving.jpg') no-repeat center center;
  background-size: cover;
  height: 150px;
}

@media (min-width: 576px){
  #background{
  background: url('../img/tarjeta-credito-revolving.jpg') no-repeat center center;
  background-size: cover;
  height: 240px;
  }
}

#paddingFooter{
  padding-bottom: 82px;
}

@media (min-width: 576px){
  #paddingFooter{
    padding-bottom: 104px;
  }
}

@media (min-width: 992px){
  #paddingFooter{
    padding-bottom: 0px;
  }
}

.container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container {
    max-width: 100%;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 100%;
  }
}

@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .container {
    max-width: 960px;
  }
}

#menu{
  font-size: 10px;
}

@media (min-width: 768px){
  #menu{
    font-size: 14px;
  }
}

.termin{
  color: #353535 !important;
}