body,html{height:auto;width:100%;margin:0;font-family:DM Sans,sans-serif;overflow:hidden}:root{--transition-time:200ms ease-in 10ms}.background-container{position:absolute;display:flex;flex-direction:column;width:100%;height:100%;margin:0;z-index:-1}img{width:auto;height:49%;margin:0}.background-color{background-color:#d2d2d5;position:relative;width:100%;height:100%}.elements-container{display:flex;flex-direction:column;padding-top:92px}.logo-container{position:relative;display:flex;justify-content:center;align-items:center}p{color:#fff}.boxes-container{position:relative;display:flex;gap:1rem;padding:52px 72px}.box{display:flex;flex-direction:column;opacity:80%;border:1px solid #4d5562;border-radius:20px;padding:24px;width:100%}.myTextArea{font-size:16px;font-family:DM Sans,sans-serif;background-color:#88038f;color:#fff;border:none;outline:none;padding-top:24px;resize:none;font-weight:700;height:160px;overflow:hidden}.empty{position:absolute;opacity:0;bottom:0;left:0;width:0;height:0}.scroll{display:flex;flex-wrap:wrap;overflow:auto;position:relative;background-color:#191e2b;height:186px;width:100%;border-radius:0 0 12px 12px;transition:all var(--transition-time)}.main-heading{display:flex;align-items:center;justify-content:center;margin-top:2vw}.scroll-translated{display:flex;flex-wrap:wrap;overflow:auto;position:relative;background-color:#0e121b;height:186px;width:100%;border-radius:0 0 12px 12px;transition:all var(--transition-time)}.translate,.translated{background-color:#88038f}.translated{color:#fff}.languages{height:25px;margin:0;padding-bottom:16px;display:flex;gap:12px;align-items:center;font-size:14px}.lang-word{color:#fff;cursor:pointer;padding:12px;border-radius:10px;transition:background-color var(--transition-time)}.spanish{display:flex;align-items:center;gap:4px}.lang-es{padding-right:12px}.active,.lang-word:hover{background-color:#4d5562}.reverse{margin-left:auto}.hover-blue-reverse,.hover-hear-translate{transition:fill var(--transition-time)}.hover-hear-translate-stroke{transition:stroke var(--transition-time)}.hover-hear-translated{transition:fill var(--transition-time)}.hover-copy-translate,.hover-copy-translated,.hover-hear-translated-stroke{transition:stroke var(--transition-time)}.line{height:1px;width:100%;background-color:#f9fafb}.translated-div{padding-top:24px;font-weight:700;overflow:auto;word-wrap:break-word;text-overflow:ellipsis}.number-of-words{box-sizing:border-box;position:relative;font-size:12px;color:#f9fafb;text-align:end;right:0;margin:0}.bottom-container{position:relative;display:flex;align-items:end;width:100%;margin:12px 0 0}.copy-and-hear{border:2px solid #f9fafb;padding:4px;margin-right:8px;border-radius:25%;float:left;cursor:pointer;transition:border-color var(--transition-time)}.copy-and-hear,.p-clipboard{display:flex;justify-content:center;align-items:center}.p-clipboard,.p-empty{background-color:#13161d;border-radius:5px;font-size:small;padding:2px;color:#e9c9c9;transition:all var(--transition-time);opacity:0}.p-empty{position:absolute;margin-left:80px;display:flex;align-items:center;justify-content:center}.shown,.shown-translated{opacity:100%}button{margin-left:auto;background-color:#4d0951;border:1px solid #4d0951;color:#f9fafb;font-size:16px;font-weight:600;display:flex;align-items:center;padding:12px 24px;border-radius:10px;cursor:pointer;transition:background-color var(--transition-time)}button:active,button:hover{background-color:#f9fafb;color:#4d0951}.bottom-translated{position:relative;margin-top:auto}@media (max-height:920px) and (max-width:1024px){.myTextArea{height:150px}}@media (max-height:900px) and (max-width:1024px){.myTextArea{height:140px}.elements-container{padding-top:50px}}@media (max-height:850px) and (max-width:1024px){.myTextArea{height:120px}.elements-container{padding-top:30px}.boxes-container{padding-top:40px}}@media (max-height:800px) and (max-width:1024px){.myTextArea{height:100px}.boxes-container,.elements-container{padding-top:20px}}@media (max-height:700px) and (max-width:1024px){.elements-container{padding-top:10px}}@media (max-height:680px) and (max-width:1024px){.boxes-container{padding-top:0;padding-bottom:0}.elements-container{padding:0}}@media (max-height:660px) and (max-width:1024px){.boxes-container{padding-top:0;padding-bottom:0}.elements-container{padding:0}.myTextArea{height:80px}}@media (max-width:500px){.boxes-container{padding-left:24px;padding-right:24px}}@media (max-width:380px){.boxes-container{padding-left:12px;padding-right:12px}}@media (max-width:360px){.boxes-container{padding-left:4px;padding-right:4px}}@media (max-width:340px){.boxes-container{padding-left:0;padding-right:0}}@media (max-width:1025px){.boxes-container{flex-direction:column}.box{box-sizing:border-box}}.a{left:0}.a,.rep{position:absolute;color:#4d4d4d;font-size:12px;bottom:0}.rep{right:0}