body{}
main{display: flex;height: 100vh;}
#background{background-image: url(../img/background-logins.webp);width: 100%;height: 100vh;background-repeat: no-repeat;background-size: contain;background-position: center;}
#login{background-color: white;min-width: max-content;padding: 40px 50px 0px;margin: auto;align-items: center;justify-content: center;display: flex;border-radius: 20px;box-shadow: 0px 8px 24px 0px rgb(0 0 0 / 10%);}
#login img{margin-bottom: 25px;}

.btn-wa-active{background-color: #000;text-decoration: none;border: 1px solid transparent;border-radius: 50px;padding: 10px 40px;color: #ffffffee;transition: 0.5s; transition: background-color 0.1s;}
.btn-wa-active:hover{border: 1px solid transparent;text-decoration: none;background-color: black;color: #fff;}

.btn-wa{background-color: transparent;text-decoration: none;border: 1px solid black;border-radius: 50px;padding: 10px 40px;color: #000;transition: 0.5s; transition: background-color 0.1s;}
.btn-wa:hover{border: 1px solid transparent;text-decoration: none;background-color: black;color: #fff;}

div.barsd{display: flex;justify-content: center;color: transparent;}
ul.selectPage {display: flex;list-style: none;gap: 40px;}
ul.selectPage li {background: rgba(68, 68, 68, 0.389);padding: 0 30px;border-radius: 100px;}
ul.selectPage li.pageActive {background: #0042c6;}

form .btn-check {display: none;}




@media (max-width: 500px) {
div.barsd{justify-content: center    ;}
ul.selectPage{padding: 0;gap: 20px;}
main{padding: 0 10px;}
  
}