*,*:before,*:after{margin:0;padding:0}:root{color:green;background:#cdb4db;font-family:Caveat,cursive;font-optical-sizing:auto;font-weight:400;font-style:normal}section{min-height:100dvh;display:flex;justify-content:center;align-items:center}form{display:flex;flex-direction:column;gap:1em}form>input{padding:1em;border-radius:10px;border:none}form>button{padding:1em;border-radius:10px;border:none;background:#ffc8dd;color:green;font-weight:900;cursor:pointer;transition:ease-in-out 1s}form>button:hover{transform:rotate(360deg);transition:ease-in-out 1s}.nav{display:flex;justify-content:space-around;background:#fff0;padding:.5em 0;position:fixed;z-index:999;align-items:center;width:100%}a{color:green;text-decoration:none;font-size:xx-large}a:hover{color:#adff2f;transition:ease-in-out .1s}.nav>a{text-shadow:#A2D2FF 3px 3px;text-decoration:underline overline}.links>p{font-size:xx-large}.links{display:flex;gap:1em}@media(max-width:590px){.nav{flex-direction:column}}@media(max-width:685px){.links>p,.links>a{font-size:x-large}}section{display:flex!important;flex-direction:column!important;gap:1em!important}#chat{width:500px;overflow-y:scroll;height:500px;background:#ffc8dd;border-radius:10px;padding:.5em}#chat::-webkit-scrollbar{display:none}.message>p{font-weight:900;font-size:x-large;max-width:500px}.message img{vertical-align:middle}.image{max-width:400px;max-height:400px}@media screen and (max-width:520px){#chat{width:300px}.send-form{flex-direction:column!important}.image{max-width:200px;max-height:200px}}@media screen and (max-height:845px){#chat{height:300px}}@media screen and (max-height:485px){#chat{height:150px}}#emoteMenu{display:flex;background:#ffc8dd;padding:.5em;width:500px;margin-top:.5em;border-radius:10px;white-space:nowrap}.availableEmotes{display:flex;gap:.5em;overflow-x:scroll;padding-bottom:.2em}.availableEmotes::-webkit-scrollbar{display:block;height:3px}.availableEmotes::-webkit-scrollbar-thumb{background:green;border-radius:10px}@media screen and (max-width:520px){#emoteMenu{width:300px}}.send-form{display:flex;flex-direction:row!important;gap:.5em;margin-top:.5em}.send-form>input{padding:1em;border-radius:10px;border:none;flex:1}.send-form>button{padding:1em;border-radius:10px;border:none;background:#ffc8dd;color:green;font-weight:900;cursor:pointer;transition:ease-in-out 1s}.send-form>button:hover{transform:rotate(360deg);transition:ease-in-out 1s}@media screen and (max-width:520px){.send-form{flex-direction:column!important}}
