/* Fonts--------------------- */

@font-face {

    font-family: 'Gracial-Bold';

    src: url('./fonts/Museo700-Regular.otf');

    font-style: normal;

    font-weight: bold;

  }

  @font-face {

    font-family: 'Gracial-Regular';

    src: url('./fonts/Museo300-Regular.otf');

    font-style: normal;

    font-weight: normal;

  }

  @font-face {

    font-family: 'Archivo-light';

    src: url('./fonts/MuseoSans_0.otf');

    font-style: normal;

    font-weight: light;

  }




  html, body {
    max-width: 100%;
    overflow-x: hidden;
}



  h1,h2,h3,h4{

    font-family: 'Gracial-Regular';



  }

  a{

    font-family: 'Gracial-Regular';

  }

  p{

    font-family: 'Archivo-light';



  }

button{

    font-family: 'Gracial-Bold';

}

a{

    text-decoration: none!important;

    

}

li{

    font-family: 'Archivo-light';

}



h1{

  font-size: 4rem!important;

}

h2{

  font-size: 3rem!important;

}

h3{

  font-size: 2.4rem!important;

}



h4{

  font-size: 1.8rem!important;

}

.ww{

  max-width: 75%!important;

}

.text-darkblue{

  color: #0c2340;

}



/* ----------------------IMG--------------------- */



img{

    width: 100%;

}







/* ----------------------header--------------------- */



/* Color of the links BEFORE scroll */

.navbar-brand img {

  width: 80px;

}

.navbar-nav {

  align-items: center;

}

.navbar .navbar-nav .nav-link {

  color: #000;

  font-size: .9rem;

  padding: 0.5rem 2rem!important;

  transition: 1s all;

}

.navbar .navbar-nav .nav-link:hover {

  border-bottom: 1px solid #000;

  transition: 1s all;

}



@media screen and (min-width: 768px) {

  .navbar-brand img {

    width: 200px;

  }

  .navbar-brand {

    margin-right: 0;

    padding: 0 1em;

  }

}
.boton-c{
  color: #fff!important;
  background-color: #0078B9;
  padding: 1rem 2rem;
  border: none!important;
  border-radius: 1rem 5rem 5rem 5rem;
  transition: all 1s;
}
.boton-c:hover{
  font-size: 1.2rem;
  padding: .5rem 1.5rem;
  border-radius: 0rem;
}
.s-2{

  background-image: url(./img/fotos-04.png);

  background-position: center;

  background-size: contain;

  background-repeat: no-repeat;

}


.whatsapp {
  position:fixed;
  width:60px;
  padding: .5rem .5rem;
  bottom:40px;
  right:40px;
  background-color:#25d366;
  color:#FFF;
  border-radius:50px;
  text-align:center;
  font-size:30px;
  z-index:100;
}

.whatsapp-icon {
  margin-top:13px;
}


.s-1 h1 span{

color: #6DB459;

}

.b-blue{

  background-image: url(./img/fondo-azul.png);

  background-position: center;

  background-size: cover;

  background-repeat: no-repeat;

  color: #fff;

}



.bg-b{

  height: auto;

  background-color: #00A6D4;

  border-radius: 0rem 5rem 0rem 5rem;

}

.t-green{

  color:#8ED980;

}

.bg-pat{

  background-image: url(./img/imagen-03.png);

  background-position: center;

  background-size: cover;

  background-repeat: no-repeat;

  color: #fff;

}

.bg-blue{

  background-color: #0078B9;

}

.bg-green{

  background-color: #6DB459;

}

.bg-blue span{

  font-weight: 900;

}



/* Core functionality */

#animated-text-strip{

  display: flex;

  flex-flow: row nowrap;

  align-items: center;

  overflow: hidden;

}

#animated-text-strip .marquee {

  white-space: nowrap;

  animation: marquee 10s linear infinite;

  max-width: none;

}



@keyframes marquee {

  0% {

    transform: translate(0, 0);

  }

  100% {

    transform: translate(-100%, 0);

  }

}



/* Styles for the sake of the demonstration */

#animated-text-strip{

  padding: 1rem 0;

}

.marquee h1{

  color: rgb(189, 189, 189);

  margin-left: 1rem;

}

.h1-green{

font-weight: 900;

color:#6DB459 !important ;

}



/* Core functionality */

#animated-text-strip2{

  display: flex;

  flex-flow: row nowrap;

  align-items: center;

  overflow: hidden;

}

#animated-text-strip2 .marquee2 {

  white-space: nowrap;

  animation: marquee 20s linear infinite;

  max-width: none;

}



@keyframes marquee {

  0% {

    transform: translate(0, 0);

  }

  100% {

    transform: translate(-100%, 0);

  }

}



/* Styles for the sake of the demonstration */

#animated-text-strip2{

  padding: 1rem 0;

}

.marquee2 h1{

  color: rgb(189, 189, 189);

  margin-left: 1rem;

}

.h1-green{

font-weight: 900;

color:#6DB459 !important ;

}



.text-b h4{

  color: #00A6D4;

}



input{

  width: 50%;

  padding: 1rem;

  margin-bottom:1rem!important ;

  border-radius:2rem;

  background-color:#7dce66;

  border: none;

}

textarea{

  width: 100%;

  padding: 1rem;

  border-radius:2rem;

  background-color:#7dce66;

  border: none;

}

input::placeholder{

 color: #000;

}

textarea::placeholder{

  color: #000;

}

.botonenviar{

  background-color: transparent;

  color: #fff;

  border-bottom: 1px solid #fff;

  border: none;

  padding: 1rem 2rem;

}

.botonenviar:hover{

 transition: all 1s;

  border-bottom: 1px solid #fff;

  

}

.t-end p{

  text-align: right;

}

.r-s i{

    background-color: #00A6D4;

    padding: 1rem 1.3rem;

    font-size: 1.5rem;

    border-radius: 6rem;

    color: #fff;

}

@media only screen and (max-width: 600px) {

  h1{

    font-size: 2.5rem!important;

    text-align: center!important;

  }

  h2{

    font-size: 2rem!important;

    text-align: center!important;

  }

  h3{

    font-size: 1.2rem!important;

    text-align: center!important;

  }

  

  h4{

    font-size: 1.1rem!important;

    text-align: center!important;

  }

  p{

    text-align: justify!important;

  }

  .navbar-toggler-icon{

    color: #7dce66;

  }

  .t-end p{

    text-align: center!important;

  }

  .t-end p br{

    display: none;

  }

  input{

    width: 100%;

    padding: 1rem;

    margin-bottom:1rem!important ;

    border-radius:2rem;

    background-color:#7dce66;

    border: none;

  }
  .r-s i{

    background-color: #00A6D4;

    padding: .8rem 1.1rem;

    font-size: 1rem;

    border-radius: 6rem;

    color: #fff;

}

}