*{margin:0;font-family:Sans-Serif}.my-style{display:flex;height:100vh;justify-content:center;align-items:center;background-repeat:no-repeat;background-size:cover;transition:opacity .3s ease-in-out;opacity:1}.my-style.fade-out{opacity:0}.my-style-2{display:flex;flex-direction:column;width:calc(100% - 80px);height:calc(100vh - 80px);margin:40px;text-align:center;font-size:36px;font-weight:700;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.5);background-color:#00000080;position:relative}.phrase{font-size:2em;flex:3;display:flex;justify-content:center;align-items:center;padding:40px 60px}@media screen and (max-width: 1024px){.phrase{font-size:1.5em}}@media screen and (max-width: 768px){.phrase{font-size:1.2em}}@media screen and (max-width: 480px){.phrase{font-size:1em;padding:20px 30px}}.refresh-button{position:absolute;bottom:25%;left:50%;transform:translate(-50%);padding:12px 28px;background-color:#1a73e8;color:#fff;border:2px solid rgba(255,255,255,.2);border-radius:6px;cursor:pointer;font-size:16px;font-weight:500;letter-spacing:.5px;text-transform:uppercase;transition:all .3s ease;box-shadow:0 4px 6px #0000001a;display:flex;align-items:center;justify-content:center;gap:8px}.button-icon{margin-right:8px;font-size:1.2em;vertical-align:middle}.refresh-button:hover{background-color:#1557b0;transform:translate(-50%) translateY(-2px);box-shadow:0 6px 8px #0003}.refresh-button:active{transform:translate(-50%) translateY(0);box-shadow:0 2px 4px #0000001a}.rotate:active{-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-webkit-transform:rotate(360deg);transform:rotate(360deg)}.error-message{padding:20px;background-color:#ffebee;color:#c62828;border-radius:4px;text-align:center;margin:20px;box-shadow:0 2px 4px #0000001a}