*{--yellow-primary:#ffd7a7;--yellow-secondary:#efc493;--yellow-tertiary:#6b3900;--yelow-quaternary:#deb180;--green-primary:#005f14;--green-secondary:#74ad7f;--green-tertiary:#93ddb2;--green-quaternary:#c0ead2;--grey-primary:#333333;--grey-secondary:#bfbfbf;--grey-tertiary:#e2e2e2;--grey-quaternary:rgb(215,215,215);--red-primary:#bb325d;--red-secondary:#e7788e;--red-tertiary:#9c2248;--red-quaternary:#4a041a}body{background-color:var(--blue-primary);color:var(--blue-text)}.bold{font-family:Atkinson Hyperlegible,sans-serif;font-weight:700}p{margin:0}.tutorial{position:relative;display:flex;align-items:center;margin-top:40px;flex-direction:column;gap:20px}.tutorial *{color:var(--blue-text)}.tutorial-actions{color:var(--blue-text);max-width:800px;padding:5px;margin:10px}.arrow-back,.tutorial-actions{background-color:white;border-radius:12px}.arrow-back{display:flex;flex-direction:row;align-items:center;gap:10px;padding:8px 6px;cursor:pointer}.arrow-back:hover{background-color:var(--blue-quaternary)}.card-content-tutorial{display:flex;flex-direction:column;gap:20px;padding:20px;background-color:white;border-radius:16px}.card-title{font-size:24px}.card-title-small{font-size:20px}.tutorial-url-button{display:flex;align-items:center;gap:10px;background-color:var(--blue-primary);color:white;padding:8px;width:max-content;border-radius:12px;text-decoration:none}.tutorial-url-button-text{overflow-wrap:break-word;display:inline}.tutorial-url-button:hover{background-color:var(--blue-text);cursor:pointer}.tutorial-card-menu{background-color:var(--blue-quaternary);border:1px solid var(--blue-quaternary);display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:16px;width:180px}.tutorial-card-menu:hover{background-color:var(--blue-tertiary);border:1px solid var(--blue-primary);cursor:pointer}.tutorial-menu{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;grid-gap:20px;gap:20px}@media only screen and (max-width:900px){.tutorial-menu{display:grid;grid-template-columns:1fr 1fr 1fr;grid-gap:20px;gap:20px}}@media only screen and (max-width:700px){.tutorial-menu{display:grid;grid-template-columns:1fr 1fr;grid-gap:20px;gap:20px}}.tutorial-card-menu-img-container{width:140px;height:140px;display:flex;align-items:center;justify-content:center;background-color:white;padding:20px;border-radius:16px 16px 0 0;box-shadow:0 4px 6px rgba(0,0,0,.1)}.tutorial-card-menu-img{width:100%;height:auto}.tutorial-card-menu-img-smaller{width:80%;height:auto}.tutorial-card-menu-text{padding:10px;align-self:center;text-align:center;border-top:1px solid var(--blue-tertiary)}.tutorial-modal-content{display:flex;flex-direction:column;gap:16px}.modal{position:fixed;z-index:101;top:50%;left:50%;transform:translate(-50%,-50%);background:white;padding:20px;border-radius:8px;width:90%;max-width:1000px;max-height:80vh;overflow-y:auto;box-shadow:0 10px 30px rgba(0,0,0,.1)}.modal-header{display:flex;justify-content:space-between;align-items:center}.modal-header>h2{color:var(--blue-text)}.title{margin:0;font-size:24px;font-weight:700}.close-button{background:none;border:none;font-size:18px;cursor:pointer;outline:none;background-color:var(--blue-quaternary);display:flex;align-items:center;justify-content:center;padding:8px;color:var(--blue-text);border-radius:12px}.close-button:hover{background-color:var(--blue-tertiary)}.tt-modal-image{border:1px solid var(--blue-primary);border-radius:8px;align-self:center}.no-border{border:0!important}.tt-modal-image-full{width:100%}.tt-modal-image-full,.tt-modal-image-half{height:auto;border:1px solid var(--blue-primary);border-radius:8px}.tt-modal-image-half{width:75%;align-self:center}.tt-modal-row{display:grid;grid-template-columns:48% 48%;grid-gap:4%;gap:4%}.tt-modal-column{display:grid;grid-template-columns:100%;grid-gap:4%;gap:4%}@media (max-width:800px){.tt-modal-row{grid-template-columns:100%}}.tt-modal-content{gap:50px;margin:10px;padding-bottom:80px}.tt-modal-content,.tt-modal-gap{display:flex;flex-direction:column}.tt-modal-gap{gap:15px;justify-content:center}.tt-modal-gap>p{text-align:justify}