:root{--background:#fff;--foreground:#171717;--light:#f8f7f1}@media (prefers-color-scheme:dark){:root{--background:#0a0a0a;--foreground:#ededed}}html,body{max-width:100vw;overflow-x:hidden}body{color:var(--foreground);background:var(--background);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box;margin:0;padding:0}a{color:inherit;text-decoration:none}@media (prefers-color-scheme:dark){html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}.flex-column{flex-direction:column;justify-content:flex-start;align-items:center;display:flex}.flex-row{align-items:top;flex-direction:row;justify-content:space-between;gap:30px;display:flex}.page{background-image:url(../media/gradient-light-1.0ba43231.jpg);background-position:50%;background-repeat:no-repeat;background-size:cover;width:100vw;height:100%;min-height:100vh}.body{flex-grow:1;width:100%;max-width:800px}header{width:100%;padding:30px}.content{flex-grow:1;width:100%;padding:30px}footer{text-align:center;width:100%;padding:30px}header .logo{background-image:url(../media/flippy-spanish-logo.27d8bc1d.png);background-position:50%;background-repeat:no-repeat;background-size:contain;width:250px;height:59px}header nav{margin-top:30px}header a{padding:15px}header a:hover{text-decoration:underline}header a.active{font-weight:700}.card-container{text-align:center;width:80%;max-width:500px}.card{border:4px solid var(--primaryDark);background-color:var(--light);opacity:.9;border-radius:10px;justify-content:flex-start;width:100%;max-width:500px;min-height:300px;padding:45px 30px}.phrase-container{flex-grow:1;width:100%}.card .h2-container{width:100%;height:150px}.card h2{margin:initial;font-size:4rem;font-weight:400;line-height:4.5rem}.card h2.small-one{font-size:3rem;line-height:3.5rem}.card h2.small-two{font-size:2.5rem;line-height:3rem}.phonetic p{text-align:center;opacity:.7;margin:5px 0;font-size:1.5rem}.flip-button{cursor:pointer;border:2px solid var(--primaryDark);background-color:var(--light);opacity:.75;border-radius:100px;margin-top:30px;padding:15px 75px;font-size:1.25rem;font-weight:600}.flip-button:hover{opacity:1;box-shadow:0 5px 10px #0000000d}.flip-button:active{box-shadow:0 10px 12px #00000026}.new-phrase-button{cursor:pointer;background-color:#0000;border:none;margin-top:45px;padding:15px 30px;font-size:1.235rem}.new-phrase-button:hover{opacity:.7;text-decoration:underline}.new-phrase-button:active{opacity:.5}@media screen and (max-width:700px){.card h2{font-size:3rem;line-height:3.5rem}.card h2.small-one{font-size:2.5rem;line-height:3rem}.card h2.small-two{font-size:2rem;line-height:2.5rem}}@media screen and (max-width:500px){.content{padding-top:0}.card-container{width:100%}}@media screen and (max-width:400px){.card{padding:30px 15px}.card h2{font-size:2.25rem;line-height:2.5rem}.card h2.small-one{font-size:2rem;line-height:2.25rem}.card h2.small-two{font-size:1.5rem;line-height:2rem}.phonetic p{font-size:1.25rem}}.stories-container{flex-wrap:wrap;margin-top:30px}.story-card{background-color:var(--light);border-radius:5px;flex-grow:1;width:1px;min-width:250px;padding:15px}.story-card:hover{box-shadow:0 10px 10px #00000014}.story-card h4{margin-bottom:8px}.story-container{margin:0 30px}@media screen and (max-width:800px){.story-container{margin:0}}.message-wrapper{justify-content:flex-start;gap:15px;margin-bottom:15px}.message-wrapper.speaker-2{flex-flow:row-reverse}.message-container{border-radius:10px;min-width:65%;padding:15px}.speaker-1 p,.speaker-2 p{margin:initial;line-height:1.5rem}.speaker-1 p:last-of-type,.speaker-2 p:last-of-type{opacity:.5;margin-top:5px}.speaker-1 .message-container{background-color:#ffffffb3}.speaker-2 .message-container{text-align:right;background-color:#eaf5ffb3}.avatar{opacity:.6;background-image:url(../media/avatar-generic.9eb7b531.png);background-position:50%;background-repeat:no-repeat;background-size:cover;border:none;flex-shrink:0;width:48px;height:48px}@media screen and (max-width:800px){.avatar{width:36px;height:36px}}.translation-container{justify-content:flex-start}.speaker-2 .translation-container{justify-content:flex-end}.translation-container p.flex-row{gap:10px}.speaker-2 .translation-container p.flex-row{flex-flow:row-reverse}i.hide-text{filter:blur(5px)}button.show-hide-translation{background-image:url(../media/eye-hide.c0517d15.png);background-position:50%;background-repeat:no-repeat;background-size:cover;border:none;flex-shrink:0;width:24px;height:24px}button.show-hide-translation.show{background-image:url(../media/eye.57fcfdb3.png)}footer{opacity:.7;padding:30px;font-size:.9rem}footer p{line-height:1.25rem}footer a{text-decoration:underline}