@import url("https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,400;9..40,700&display=swap");

* {

  font-family: "DM Sans", sans-serif;



  font-weight: 400;



}







.content {



  background-image: url("https://melinet.cl/static/img/fd.png");



  background-repeat: repeat;



  padding-bottom: 20px;

}






.video {



  margin-top: 10vh;



}








.video-player {



  height: fit-content;



  position: relative;



  overflow: hidden;



}











.logo-features {



  filter: saturate(0%) brightness(100%) invert(100%);



}







.test {



  width: 100%;



  height: auto;



  display: flex;



  justify-content: center;



  align-items: center;



  flex-direction: column;



}







.test h1 {



  font-size: 3rem;



  font-family: "DM Sans", sans-serif;



  font-weight: 600;



}







.test-button {



  align-items: center;



  appearance: none;



  background-color: #00c5fc;



  border-radius: 100px;



  border-width: 0;



  color: black;



  cursor: pointer;



  display: inline-flex;



  font-size: 1rem;



  width: 300px;



  height: auto;



  justify-content: center;



  line-height: 1.5;



  padding: 6px 20px;



  position: relative;



  text-align: center;



  text-decoration: none;



}







.presentation {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 10px 20px 10px;
}















.img-presentation {
  max-width: 50%;
  height: auto;
  object-fit: cover;
  border-radius: 30px; /* Puedes ajustar el valor según tu preferencia */
}





.text-presentation {



  width: 50%;



  text-align: left;



  padding: 20px;



}















.text-presentation h1 {



  font-family: "DM Sans", sans-serif;



  font-weight: 600;



  font-size: 3rem;



}







.text-presentation h1,



.text-presentation h3,



.text-presentation p {



  margin: 0;



  padding: 0;



}







.text-presentation h3 {



  font-size: 2rem;



}







.text-presentation p {



  color: gray;



  font-size: 20px ;



}







.success {



  height: 70vh;



  display: flex;



  justify-content: center;



  align-items: center;



  gap: 20px;







}







.img-success img {



  width: 375px;



}







.text-success {



  width: 30%;



  padding: 2%;



  border: 2px #00c5fc dotted;



  background-color: white;



}











/* Estilos para tablet (entre 768px y 1024px) */



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



  .content {



    background-size: cover;



  }







  .features {



    height: 250px;



    gap: 50px;



  }







  .video-player {



    height: 100%;



  }







  video {



    width: 100%;



    height: 100%;



    clip-path: none;



  }







  .test-button {



    width: 200px;



  }







  .presentation {



    flex-direction: column;



  }







  .img-presentation {



    max-width: 70%;



  }




    .success{
        flex-direction:column;
    }


  .text-presentation {



    width: 100%;



  }







  .text-success {



    width: 80%;



  }



}







/* Estilos para celular (hasta 767px) */



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



  .content {



    background-size: cover;



  }







  .features {



    height: 150px;



    gap: 10px;



  }







  .video-player {



    height: 100%;



  }







  video {



    width: 100%;



    height: 100%;



    clip-path: none;



  }







  .test {



    width: 100%;



    height: auto;



    display: flex;



    justify-content: center;



    align-items: center;



    flex-direction: column;



    text-align: center;



  }







  .test h1 {



    font-size: 2rem;



    /* Ajusta el tamaño del texto según tus preferencias */



  }







  .test-button {



    width: 80%;



    /* Ajusta el ancho del botón según tus preferencias */



    margin-top: 10px;



    /* Ajusta el margen superior según sea necesario */



  }







  .presentation {



    flex-direction: column;



  }







  .img-presentation {



    max-width: 90%;



  }







  .text-presentation {



    width: 100%;



    padding: 10px;



  }







  .text-presentation h1 {



    font-size: 2rem;



  }







  .text-presentation h3 {



    font-size: 1.5rem;



  }







  .text-presentation p {



    font-size: 1.5rem;



  }







  .success {



    height: auto;



    flex-direction: column;



  }







  .img-success img {



    width: 100%;



  }







  .text-success {


    margin:10px;
    width: 90%;



  }







  .features {



    height: 400px;



  }







  .bubble-features {



    display: flex;



    flex-wrap: wrap;



  }







  .bubble {



    margin: auto;



    height: 150px;



    width: 150px;



    /* Ajusta el ancho y el margen según tus preferencias */



    background-color: aqua;



    border-radius: 50%;



  }







  .logo-features {



    display: none;



  }



}







#footer {



  background: #f7f7f7;



  padding: 3rem;



  padding-top: 5rem;



  padding-top: 7rem;



  padding-bottom: 80px;



  background-image: url(https://arena.km.ua/wp-content/uploads/3538533.jpg);



}







#footer2 {



  background: #f7f7f7;



  padding: 3rem;



  margin-top: 0px;



  padding-top: 5rem;



  padding-top: 7rem;



  padding-bottom: 80px;



  background-image: url(../images/cards/v748-toon-111.png);



}







.logo-footer {



  max-width: 300px;



}







.social-links {



  display: flex;



  flex-direction: column;



  align-items: center;



  justify-content: center;







}







.social-links h2 {



  padding-bottom: 15px;



  font-size: 20px;



  font-weight: 600;



}







.social-links img {



  padding-bottom: 25px;



}







.social-icons {



  display: flex;



  gap: 3rem;



  display: flex;



  flex-direction: column;



  gap: 1rem;



  color: #777777;



}







.social-icons a {



  font-size: 18px;



  background: #ffffff;



  box-shadow: rgb(0 0 0 / 8%) 0px 4px 12px;



  padding: 0.4rem 1rem 0.4rem 1rem;



  border-radius: 3px;



  color: #82074a;



  margin-right: 18px;



  color: #777777;



}







.social-icons a:hover {



  color: #000;



}







.social-icons a i {



  box-shadow: rgb(0 0 0 / 8%) 0px 4px 12px;



  padding: 0.4rem 1rem 0.4rem 1rem;



  border-radius: 3px;



  color: #82074a;



  font-size: 16px;



  margin-right: 12px;



}







li {



  list-style: none;



}







.useful-link h2 {



  padding-bottom: 15px;



  font-size: 20px;



  font-weight: 600;



}







.useful-link img {



  padding-bottom: 15px;



}







.use-links {



  line-height: 32px;



}







.use-links li i {



  font-size: 14px;



  padding-right: 8px;



  color: #898989;



}







.use-links li a {



  color: #303030;



  font-size: 15px;



  font-weight: 500;



  color: #777777;



}







.use-links li a:hover {



  color: #000;



}







.address h2 {



  padding-bottom: 15px;



  font-size: 20px;



  font-weight: 600;



}







.address img {



  padding-bottom: 15px;



}







.address-links li a {



  color: #303030;



  font-size: 15px;



  font-weight: 500;



  color: #777777;







}







.address-links li i {



  font-size: 16px;



  padding-right: 8px;



  color: #82074a;







}







.address-links li i:nth-child(1) {



  padding-top: 9px;



}







.address-links .address1 {



  font-weight: 500;



  font-size: 15px;



  display: flex;



}







.address-links {



  line-height: 32px;



  color: #777777;



}







.copy-right-sec {



  padding: 1.8rem;



  background: #82074a;



  color: #fff;



  text-align: center;



}







.copy-right-sec a {



  color: #fcd462;



  font-weight: 500;



}







a {



  text-decoration: none;



}