/* Estilos del botón para google*/ .switch { position: relative; display: inline-block; min-width: 54px; max-width: 54px; height: 30px; margin: auto; } .switch input { opacity: 0; width: 0; height: 0; } .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #a1a1a1; -webkit-transition: .4s; transition: .4s; } .slider:before { position: absolute; content: ""; height: 23px; width: 23px; left: 4px; bottom: 4px; background: no-repeat center/80% url(https://upload.wikimedia.org/wikipedia/commons/thumb/5/53/Google_%22G%22_Logo.svg/235px-Google_%22G%22_Logo.svg.png); background-color: white; -webkit-transition: .4s; transition: .4s; } input:checked+.slider { background-color: #3BBD96; } input:focus+.slider { box-shadow: 0 0 1px #3BBD96; } input:checked+.slider:before { -webkit-transform: translateX(23px); -ms-transform: translateX(23px); transform: translateX(23px); box-shadow: 0 0 3px rgba(0, 0, 0, 5.5); } .slider.round { border-radius: 34px; } .slider.round:before { border-radius: 50%; box-shadow: 0 0 3px rgba(0, 0, 0, 5.5); background: no-repeat center/80% url(https://upload.wikimedia.org/wikipedia/commons/thumb/5/53/Google_%22G%22_Logo.svg/235px-Google_%22G%22_Logo.svg.png); background-color: white; } .switch:has(input:disabled) { background: #8b8b8b; filter: contrast(0.5); }