
@font-face {
	font-family: 'Conv_GothamRnd-Bold';
	src: url('./fonts/gotham/GothamRnd-Bold.eot');
	src: local('☺'), url('./fonts/gotham/GothamRnd-Bold.woff') format('woff'), url('./fonts/gotham/GothamRnd-Bold.ttf') format('truetype'), url('./fonts/gotham/GothamRnd-Bold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face {
	font-family: 'Conv_GothamRnd-Book';
	src: url('./fonts/gotham/GothamRnd-Book.eot');
	src: local('☺'), url('./fonts/gotham/GothamRnd-Book.woff') format('woff'), url('./fonts/gotham/GothamRnd-Book.ttf') format('truetype'), url('./fonts/gotham/GothamRnd-Book.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}



@font-face {
	font-family: 'Conv_GothamRnd-Medium';
	src: url('./fonts/gotham/GothamRnd-Medium.eot');
	src: local('☺'), url('./fonts/gotham/GothamRnd-Medium.woff') format('woff'), url('./fonts/gotham/GothamRnd-Medium.ttf') format('truetype'), url('./fonts/gotham/GothamRnd-Medium.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap');

body{
    background-color: #EDEDED;
}

.btn-lealtad{
    background-color: #00AEEF;
    border-color: #00AEEF;
    color: white!important;
}

.btn-lealtad:hover{
    background-color: #00AEEF;
    border-color: #00AEEF;
    color: white!important;
}

.bg-lealtad{
    background-color: #00AEEF;
    font-family: "Quicksand", sans-serif;
    font-size: 23px;
    border-radius: 20px;
    height: 100%;
    appearance: none;
    border: none;
    width: 100%;
}

.bg-omnicanalidad{
    background-color: #00704A;
    font-family: "Quicksand", sans-serif;
    font-size: 23px;
    border-radius: 20px;
    height: 100%;
    appearance: none;
    border: none;
    width: 100%;
}

.bg-elearning{
    background-color: #2F368C;
    font-family: "Quicksand", sans-serif;
    font-size: 23px;
    border-radius: 20px;
    height: 100%;
    appearance: none;
    border: none;
    width: 100%;
}

.bg-premios{
    background-color: #F7941E;
    font-family: "Quicksand", sans-serif;
    font-size: 23px;
    border-radius: 20px;
    height: 100%;
    appearance: none;
    border: none;
    width: 100%;
}

.bg-alianzas{
    background-color: #EC008C;
    font-family: "Quicksand", sans-serif;
    font-size: 23px;
    border-radius: 20px;
    height: 100%;
    appearance: none;
    border: none;
    width: 100%;
}





.titulo{
    font-family: "Raleway", sans-serif;
    font-weight: 400;
    font-size: 70px;
}
.titulo-bold{
    font-family: "Raleway", sans-serif;
    font-weight: 900;
    font-size: 130px;
}

.icono{

    margin-bottom: -150px;
}
*{
    font-family: 'Conv_GothamRnd-Book';
}



 html {
     margin: 0;
     padding: 0;
     width: 100%;
     height: 100%;


 }

 body.intro {
     margin: 0;
     padding: 0;
     width: 100%;
     height: 100%;
     overflow: hidden;


     display: flex;
     justify-content: center;
     align-items: center;
 }


 .main-container {
     position: relative;
     width: 100%;
     height: 100%;
     display: flex;
     justify-content: center;
     align-items: center;
     background-color: #2F368C;





     margin: 0;
     padding: 0;
     width: 100%;
     height: 100%;
     overflow: hidden;


     display: flex;
     justify-content: center;
     align-items: center;




 }

 #loadingOverlay{
position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: #34303D;
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 9999;
            transition: opacity 0.5s ease-out;
            opacity: 1;
 }

 #loadingOverlay.hidden {
            opacity: 0;
            pointer-events: none;
        }


        #mainContent {
            opacity: 0;
            transition: opacity 0.5s ease-in;
        }

        #mainContent.visible {
            opacity: 1;
        }

 .svg-background-container {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     z-index: 1;
 }


 .svg-background-container svg {
     width: 100%;
     height: 100%;
 }


 #left-group,
 #right-group {
     visibility: hidden;
 }


 .logo-container {
     visibility: hidden;

     z-index: 10;

 }

 .logo-image {
     max-width: 95%;
     width: 350px;

     height: auto;
     margin: auto;
     display: block;
 }



 header {
     background-image: url(./img/home/img-header1366x115px.svg);
     background-size: cover;
     background-position: center;
     text-align: center;
     height: 115px;
     display: flex;
     justify-content: center;
     align-items: center;
     border-bottom: 5px solid #F7941E;
 }



 .carousel-caption {
     width: 100%;
     bottom: 0;
     top: 0;
     height: 100%;
     left: 0;
     right: 0;

     display: flex
;
    flex-direction: column;
    justify-content: center;
    align-items: center;
 }

  .carousel-caption1{
    left: 15%;
    width: 38%;
 }
 h1, h2, h3, h4, h5, h6, b, strong, .fw-bold{
    font-family: 'Conv_GothamRnd-Bold';
        font-smooth: auto;
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: grayscale;
    font-weight: 100;

 }
 b, strong {
    font-weight: 100;
}

 .carousel-item h5 {
     font-size: 60px;
     font-family: 'Conv_GothamRnd-Bold';
 }

  .carousel-item h1 {
     font-size: 193px;
     line-height: 1;
     font-family: 'Conv_GothamRnd-Bold';
 }
  .carousel-item p {
     font-size: 65px;
     line-height: 1;
     color: #00AEEF;
     font-family: 'Conv_GothamRnd-Bold';
 }


 .carousel-item h2 {
     font-size: 117px;
     color: #00AEEF;
     font-family: 'Conv_GothamRnd-Bold';
 }

 .card {
     background-color: #F0F0F0;
     color: #2F368C;
     border: none;
     border-radius: 10px;
 }

 .card a{
        font-size: 1.88rem;
 }
 .card-body {
     border: 1px solid #00000080;
     border-top: 0;
     border-radius: 0 0 10px 10px;
 }

 .card-footer {
     border-radius: 10px;
 }

 .card * {
     color: #2F368C;
 }
p.card-text.mt-2
 {
    margin-bottom: 0;
}

 .bg-1 {
     background-color: #EC008C;
     padding: 10px;
 }

 .bg-2 {
     background-color: #F7941E;
     padding: 10px;
 }

 .bg-3 {
     background-color: #00AEEF;
     padding: 10px;
 }

 .bg-4 {
     background-color: #00704A;
     padding: 10px;
 }

 .text-1 {
     color: #EC008C;
 }

 .text-2 {
    color: #F7941E;
 }

 .text-3 {
    color: #00AEEF;
 }

 .text-4 {
     color: #00704A;
 }

 .propuesta {
     background-color: #F7941E;
     height: 120px;
     color: white;
     display: flex;
     justify-content: center;
     align-items: center;
 }
 .propuesta *{
    margin: 0 10px;
 }
 .propuesta a{
    color: #2F368C;
 }


 .contacto {
     background-color: #EC008C;
     height: 120px;
     color: white;
     text-align: center;
     background-image: url(./img/footer.svg);
     background-size: cover;
     background-position: center;

 }


 footer{
    font-size: 2rem;
    font-family: 'Conv_GothamRnd-Bold';
 }

footer *{
    font-family: 'Conv_GothamRnd-Bold';
    text-decoration: none;
}

.beneficios{
    overflow-wrap: break-word;
}


.disfruta{
    font-size: 3rem;
}

a {
    text-decoration: none!important;

}
a:hover{
    text-decoration: underline!important;
}

.redes a {
    text-decoration: none!important;

}
.redes a:hover{
    text-decoration: none!important;
}
.scroll-arrow {
            width: 45px;
        }

 @media only screen and (max-width: 660px) {
    [class^="bg-"]{
        font-size: 15px;
    }
    .scroll-arrow {
            width: 25px;
        }
    .icono{

    margin-bottom: -75px;
}
    .titulo{
    font-size: 2rem;
}
.titulo-bold{
    font-size: 3rem;
}

     header {
         height: 65px;
     }

     header img {
         height: 40px;
     }

     footer{
    font-size: 1rem;
 }
  .contacto {
     height: auto;
     padding: 20px 0;
     background-position: 69%;

 }


 .carousel-item h5 {
     font-size: 1rem;
     font-family: 'Conv_GothamRnd-Bold';
 }

  .carousel-item h1 {
     font-size: 3rem;
     line-height: 1;
     font-family: 'Conv_GothamRnd-Bold';
 }
  .carousel-item p {
     font-size: 1rem;
     line-height: 1;
     color: #00AEEF;
     font-family: 'Conv_GothamRnd-Bold';
 }


 .carousel-item h2 {
     font-size: 2rem;
     color: #00AEEF;
     font-family: 'Conv_GothamRnd-Bold';
 }



 .carousel-caption1{
    left: 5%;
    width: 45%;
 }
 .disfruta{
    font-size: 1.5rem;
 }
 .card a{
    font-size: 1rem;
 }

 .propuesta{
    text-align: center;
    height: 75px;
 }

 }


 form .form-label, form .form-check-label{
    color: #515150;
 }