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

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

.pagewrap{
  display: flex;
  flex-direction: column;
  min-height: 100vh; 
} 

.main-header{
  position: relative;
  z-index: 10;
  height: 150px;
}

.menu-active span {
    color: #fff;
    padding-bottom: 10px;
    font-weight: bold;
    border-bottom: 3px solid #fff;
}

.navbar-brand img {
    width: 100px;
}

.brand-image {
    float: left;
    line-height: .8;
    /* margin-left: 0.8rem; */
    margin-right: 0.5rem;
    margin-top: -35px;
    max-height: 65px;
    width: auto;
}


/* Botón WhatsApp */

.floating-whatsapp{
	position:fixed;
	width:60px;
	height:60px;
	bottom:80px;
	right:40px;
	background-color:#25d366;
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:40px;
	box-shadow: 0px 0px 4px #999;
  z-index:100;
}

.floating-whatsapp:hover{
	color:#FFF;
}

.my-floating-whatsapp{
	margin-top:10px;
}

/* Fin Botón WhatsApp */

/* Animación botón de WhatsApp */
.scale-in-center {
	-webkit-animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 500ms both;
	        animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 500ms both;
}

 @-webkit-keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}

/* Fin Animación botón de WhatsApp */


/* Animación y configuración de Tipos de Visa */

.text-content-tipos-visa {
  text-align: center;
  font-size: 18px;
  line-height: 1.8;
  margin-bottom: 20px;
  font-family: 'Ubuntu-Regular',sans-serif;
  color: #FFF;
}

.text-content-tipos-visa-small {
  font-size: 14px;
}

.visa{
  text-align: center;
}

.imagen-visa{
  width: 100%;
  max-width: 270px;
  height: auto;
  border-radius: 10px;
  cursor: pointer;
}

.animacion-visa {
	-webkit-animation: jello-horizontal 1.2s 700ms both;
	        animation: jello-horizontal 1.2s 700ms both;
}

@-webkit-keyframes jello-horizontal {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
            transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
            transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}
@keyframes jello-horizontal {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
            transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
            transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

/* Fin Animación y configuración de Tipos de Visa */

.header-options-color{
  color: #FFF;
}

.brand-text{
  color: #FFF;
  text-shadow: 1px 1px 4px black;
}

html,body{
  height:100%;
  min-height: 100%;
  scroll-behavior: smooth;
}


/* Diseño de Banners */
.banner-home{
  background: url('../src/img/home-background.webp') fixed center no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.banner-about{
  background: url('../src/img/about-background.jpg') fixed center no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.banner-services{
  background: url('../src/img/services-background.jpg') fixed center no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.banner-contact{
  background: url('../src/img/contact-background.jpg') fixed center no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
/* FinDiseño de Banners */

.white-line{
  display: block;
  width: 70px;
  height: 6px;
  background: #fff;
  margin-bottom: 30px;
}

.menu-links{
  font-family: 'Ubuntu-Bold',sans-serif;
}

.title-lg{
  font-size: 45px;
  line-height: 1;
  color: #FFF;
  font-family: 'Ubuntu-Bold',sans-serif;
  text-transform: uppercase;
  margin-bottom: 40px;
}

.text-content {
  text-align: justify;
  font-size: 18px;
  line-height: 1.8;
  margin-bottom: 40px;
  font-family: 'Ubuntu-Regular',sans-serif;
  color: #FFF;
}

.text-services-content {
  text-align: justify;
  font-family: 'Ubuntu-Regular',sans-serif;
}

.text-services-content-item-title {
  font-family: 'Ubuntu-Bold',sans-serif;
  font-size: 18px;
}

.text-services-content-title {
  font-family: 'Ubuntu-Bold',sans-serif;
  font-size: 16px;
}

/*Formulario de Contacto. */
.edg-footer {
  background: #f4f4f4;
  width: 100%;
}

.text-content-footer {
  text-align: center;
  font-size: 12px;
  font-family: 'Ubuntu-Regular',sans-serif;
  color: #000;
}
/*Fin Formulario de Contacto. */


/*Formulario de Contacto. */
.contact-input-checkbox {
  background: transparent;
  color: white;
  font-weight: 500;
  cursor: pointer !important;
  font-family: 'Ubuntu-Regular',sans-serif;
}

.contact-input {
  background: transparent;
  border: white solid 1px;
  color: white;
  font-weight: 500;
  font-size: 20px;
  font-family: 'Ubuntu-Regular',sans-serif;
}

.contact-input:focus {
  background: transparent;
  color: white;
  border: white solid 1px;
  font-weight: 500;
  font-size: 20px;
  font-family: 'Ubuntu-Regular',sans-serif;
}

.contact-input::placeholder {
  background: transparent;
  color: white !important;
  font-weight: 500;
  font-size: 20px;
  font-family: 'Ubuntu-Regular',sans-serif;
}

.btn-contact {
  color: white;
  width: 100%;
  background: transparent;
  border: white solid 1px;
  font-family: 'Ubuntu-Regular',sans-serif;
}

.btn-contact:hover {
  color: white;
  background: transparent;
  font-family: 'Ubuntu-Bold',sans-serif;
}
/*Fin Formulario de Contacto. */


@media (max-width: 991px) {
  .navbar-collapse {
    background: #8e9090;
    position: relative;
    z-index: 100;
    padding-left: 20px;
  }
}

@media screen and (max-width: 767px){
  .viewport {
      position:absolute;
      right:0;
      left:0;
      top:0;
      bottom:0;
      overflow-x:hidden;
      overflow-y:scroll;
  }

  .banner{
      height:auto;
  }

  .banner .banner-container {
      position:relative;
      overflow:hidden;
  }
  
}

@media (min-width: 1px) and (max-width: 460px){
  
  .title-lg{
    font-size: 36px;
  }

  .text-content {
    font-size: 16px;
  }
}

@media (min-width: 461px) and (max-width: 600px){
  
  .title-lg{
    font-size: 40px;
  }

  .text-content {
    font-size: 17px;
  }

}