html {
  font-size: 100%;
}

body {
  background-image: url('../img/fondo.png');
  background-repeat: no-repeat;
  background-size: cover;
}

footer {
  background-color: rgb(09, 36, 51);
  bottom: 0;
}

@font-face {
  font-family: Raleway-Black;
  src: url('raleway/Raleway-Black.ttf');
}

@font-face {
  font-family: Raleway-Bold;
  src: url('raleway/Raleway-Bold.ttf');
}

@font-face {
  font-family: Raleway-SemiBold;
  src: url('raleway/Raleway-SemiBold.ttf');
}

@font-face {
  font-family: Raleway-Medium;
  src: url('raleway/Raleway-Medium.ttf');
}

@font-face {
  font-family: Raleway-Light;
  src: url('raleway/Raleway-Light.ttf');
}

@font-face {
  font-family: Raleway-ExtraLight;
  src: url('raleway/Raleway-ExtraLight.ttf');
}

@font-face {
  font-family: Raleway-Regular;
  src: url('raleway/Raleway-Regular.ttf');
}

.titulo {
  font-family: Raleway-ExtraLight;
  font-size: 4vw;
  color: #FFFFFF;
}

.subtitulo {
  font-family: Raleway-Black;
  font-size: 4.6vw;
  color: #FFFFFF;
}

.covid {
  font-family: Raleway-Black;
  font-size: 3.8vw;
  color: #FFFFFF;
}

.chueco {
  transform: rotate(15deg);
}

.chico {
  font-size: .6rem;
}

.separacion {
  letter-spacing: .1rem;
}

.nubes {
  background: url('../img/Nubes.png') no-repeat;
  background-size: contain;
  position: relative;
  background-position: center;
}

.texto-naranjo-bold {
  font-family: Raleway-Bold;
  color: #F08813
}

.texto-naranjo-medium {
  font-family: Raleway-Medium;
  color: #F08813
}

.texto-blanco-bold {
  font-family: Raleway-Bold;
  color: #FFFFFF;
  font-size: calc(.7vw + 0.3em);
}

.texto-blanco-medium {
  font-family: Raleway-Medium;
  color: #FFFFFF;
  font-size: 1.5vw;
}

.texto-blanco-extralight {
  font-family: Raleway-ExtraLight;
  color: #FFFFFF;
}

.raleway-regular {
  font-family: Raleway-Regular;
}

.raleway-black {
  font-family: Raleway-Black;
}

.raleway-medium {
  font-family: Raleway-Medium;
}

.raleway-semibold {
  font-family: Raleway-SemiBold;
}

.raleway-light {
  font-family: Raleway-Light;
}

.texto-blanco-regular {
  font-family: Raleway-Regular;
  color: #FFFFFF;
  font-size: calc(1vw + 0.5rem);
}

.texto-blanco-black {
  font-family: Raleway-Black;
  color: #FFFFFF;
}

.texto-azul-bold {
  font-family: Raleway-Bold;
  color: #0B3752;
  font-size: calc(.8vw + 0.5rem);
}

.texto-azul-extralight {
  font-family: Raleway-ExtraLight;
  color: #0B3752;
  font-size: calc(.8vw + 0.4rem);
}

.texto-azul-regular {
  font-family: Raleway-Regular;
  color: #0B3752 !important;
  font-size: calc(.8vw + 0.3rem);
}

.texto-azul-medium {
  font-family: Raleway-Medium;
  color: #0B3752;
  font-size: calc(.8vw + 0.4rem);
}

.texto-azul-upgrade {
  color: #234069;
}

.bg-azul-upgrade {
  background-color: #234069;
}

.bg-naranjo {
  background-color: #fd7e14;
}

.cuerpo {
  background-color: rgba(255, 255, 255, 0.3);
}

.cabecera {
  background-color: #fff;
}

.btn-volver {
  color: #0B3752;
  border: 1px solid #0B3752 !important;
  font-family: Raleway-Bold;
  font-size: calc(.5vw + 0.4rem);
}

.btn-continuar {
  color: #FFFFFF;
  border-color: #fd7e14;
  background-color: #fd7e14;
  font-family: Raleway-Bold;
  font-size: calc(.5vw + 0.3rem);
}

.ml-n7 {
  margin-left: -7rem;
}

.redondoest {
  border-radius: 1.25rem !important;
}

.redondo {
  border-radius: .6rem !important;
}

.redondo-bottom {
  border-bottom-left-radius: .6rem !important;
  border-bottom-right-radius: .6rem !important;
}

.redondoest-top {
  border-top-left-radius: 1.25rem !important;
  border-top-right-radius: 1.25rem !important;
}

/* ribbon */

.ribbon {
  width: 150px;
  height: 120px;
  overflow: hidden;
  position: absolute;
}

.ribbon::before,
.ribbon::after {
  position: absolute;
  z-index: -1;
  content: '';
  display: block;
  border: 9px solid #0B3752;
}

.ribbon span {
  position: absolute;
  display: block;
  width: 175px;
  padding: 12px 0;
  background-color: #0B3752;
  box-shadow: 0 5px 10px rgba(0, 0, 0, .1);
  color: #fff;
  font: 700 13px 'Lato', sans-serif;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .2);
  text-transform: uppercase;
  text-align: center;
}

/* top left*/
.ribbon-top-left {
  top: -19px;
  left: -18px;
}

.ribbon-top-left::before,
.ribbon-top-left::after {
  border-top-color: transparent;
  border-left-color: transparent;
}

.ribbon-top-left::before {
  top: 0;
  right: 29px;
}

.ribbon-top-left::after {
  bottom: 0;
  left: 0;
}

.ribbon-top-left span {
  right: 17px;
  top: 30px;
  transform: rotate(-45deg);
}

/* collapse */

.icon-default {
  -moz-transition: all 0.5s linear;
  -webkit-transition: all 0.5s linear;
  transition: all 0.5s linear;
}

.icon-collapsed {
  -moz-transition: all 0.5s linear;
  -webkit-transition: all 0.5s linear;
  transition: all 0.5s linear;
  -ms-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.icon-uncollapsed {
  -moz-transition: all 0.5s linear;
  -webkit-transition: all 0.5s linear;
  transition: all 0.5s linear;
  -ms-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -webkit-transform: rotate(360deg);
  transform: rotate(360deg);
}

/* placeholder */

::-webkit-input-placeholder {
  /* Edge */
  font-family: Raleway-Light;
  color: #808181 !important;
  font-size: calc(.7vw + 0.3em);
}

:-ms-input-placeholder {
  /* Internet Explorer */
  font-family: Raleway-Light;
  color: #808181 !important;
  font-size: calc(.7vw + 0.3em);
}

::placeholder {
  font-family: Raleway-Light;
  color: #808181 !important;
  font-size: calc(.7vw + 0.3em);
}

.icono {
  font-size: calc(2vw + 0.3rem);
}

input {
  font-family: Raleway-Medium;
}

.md-form>label {
  font-family: Raleway-Light;
  font-size: calc(.7vw + 0.3em);
}

/* select2 */

.select2 {
  width: 100% !important;
  font-family: Raleway-Medium;
  margin-right: -.5rem !important
}

.select2-selection {
  border-radius: .6rem !important;
  height: calc(1.5em + .75rem + 2px) !important;
}

.select2-selection__rendered {
  padding-top: .3rem !important;
}

.select2-selection__placeholder {
  color: #808181 !important;
  font-size: calc(.7vw + 0.3em);
  font-family: Raleway-Light;
}

.input-group>.select2 {
  position: relative;
  flex: 1 1 0%;
  min-width: 0;
  margin-bottom: 0;
}

.select2-container--default .select2-selection--single {
  border-color: white;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  background-image: url(https://cdn4.iconfinder.com/data/icons/user-interface-174/32/UIF-76-512.png);
  background-color: transparent;
  background-size: contain;
  border: none !important;
  height: 20px !important;
  width: 20px !important;
  margin-left: -1rem;
  margin-top: -.3rem;
}

.bust-out {
  margin-left: calc(50% - 50vw)
}

/* Rules for sizing material icon. */
.material-icons.md-18 {
  font-size: 18px;
}

.material-icons.md-24 {
  font-size: 24px;
}

.material-icons.md-36 {
  font-size: 36px;
}

.material-icons.md-48 {
  font-size: 48px;
}

.icono-hamburguesa {
  display: inline-block;
  width: 1.5rem;
  height: 1rem;
  background: linear-gradient(to bottom,
      white, white 20%,
      #244069 20%, #244069 40%,
      white 40%, white 60%,
      #244069 60%, #244069 80%,
      white 80%, white 100%);
  cursor: pointer;
}

.bg-azul-oscuro {
  background-color: #122840;
}