@import"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap";:root{--cordovan: #8f3545;--jasmine: #ffd988;--black-bean: #300D14;--moss-green: #90A955;--resenda-green: #6E7F46;--seashell: #FFF8F1;--isabelline: #eee8e2;--sage: #b2b09b;--jasmine-transparent: #ffd98857;--seal-brown: #432000;--turquoise: #5eead4;--turquoise-transparent: #5eead457;--pale-azure: #94D4F5}*{box-sizing:border-box;margin:0;padding:0;font-family:Nunito,sans-serif;font-optical-sizing:auto}a{color:var(--moss-green)}body{background-image:linear-gradient(to top right,var(--seashell),var(--jasmine));min-height:100vh;margin:0}h2,h3,h4{margin-bottom:.25rem;margin-top:.25rem}.button{background-color:var(--isabelline);border:var(--black-bean) 2px solid;border-radius:.5rem;color:var(--black-bean);font-size:1.25rem;padding:.5rem;transition-duration:.2s}.button:hover{box-shadow:0 0 8px 2px var(--jasmine);translate:0px -2px}.button:active{box-shadow:0 0 8px 2px var(--jasmine);translate:0px 3px}.btn-group{display:flex;justify-content:space-between}.menu-button{background-color:transparent;border:none;color:var(--black-bean);font-size:1rem;font-weight:600}.delete{background-color:var(--cordovan);color:var(--isabelline)}.green{background-color:var(--moss-green);color:#fff}.full{min-width:100%}#root{display:grid;grid-template-rows:auto 1fr auto;min-height:100vh}.hero{background-color:var(--cordovan);box-shadow:1px 1px 8px 8px var(--black-bean);color:var(--seashell);margin-bottom:1rem;padding:1rem;text-align:center}.main-menu{background-color:var(--moss-green);top:8rem}.music-menu{background-color:var(--pale-azure);top:24rem}.floating-menu{border-top:var(--black-bean) 2px solid;border-left:var(--black-bean) 2px solid;border-bottom:var(--black-bean) 2px solid;border-radius:.5rem 0rem 0rem .5rem;box-shadow:5px 5px 5px var(--seal-brown);color:var(--black-bean);justify-self:end;padding:.5rem;position:fixed;text-orientation:upright;writing-mode:vertical-lr;z-index:2}.floating-menu a{color:var(--black-bean);text-decoration:none}.floating-menu hr{border:var(--black-bean) 1px solid;margin-top:.5rem;margin-bottom:.5rem}.menu-options{display:none}.floating-menu:hover .menu-options{display:block;list-style:none}.floating-menu:hover{writing-mode:horizontal-tb}.floating-menu a:hover{color:var(--seashell)}.card{background-color:var(--seashell);border:var(--black-bean) solid 2px;border-radius:.5rem;box-shadow:.25rem .25rem .25rem var(--seal-brown);color:var(--black-bean);margin:1rem;padding:1rem}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:var(--jasmine-transparent);display:flex;justify-content:center;align-items:center;z-index:10}.modal{padding:2rem;text-align:center;box-shadow:.5rem .5rem 1rem var(--seal-brown)}.modal.card{max-width:400px}.modal-story{padding:1rem;box-shadow:.5rem .5rem 1rem var(--seal-brown)}.modal-story.card{min-width:90%}.tag{border-radius:1rem;font-size:.75rem;padding:.25rem .75rem;text-transform:capitalize}.published{background-color:var(--moss-green);color:var(--isabelline)}.draft{background-color:var(--sage);color:var(--isabelline)}.title-tag{display:flex;justify-content:space-between}footer{background-color:var(--black-bean);color:var(--isabelline);padding:1rem}.footer-icons{display:flex;font-size:2rem}.socials i{color:var(--seashell);margin-right:1rem}.to-top{background-color:var(--jasmine-transparent);border-radius:1.5rem;margin-left:auto;margin-right:0;min-width:2.75rem;text-align:center}.to-top a{color:var(--jasmine)}.to-top:hover{background-color:var(--jasmine)}.to-top:hover a,.to-top a:hover{color:var(--seal-brown)}.login{font-size:1.5rem}.login button{font-size:1.5rem;padding:1rem}.login button:active,.login button:focus{border:2px solid var(--isabelline);box-shadow:0 0 8px 2px var(--jasmine)}.login label{display:grid}.login input{border:var(--seal-brown) 1px solid;border-radius:.25rem;font-size:1rem;padding:1rem;width:100%}.login p{margin-top:1rem}.stories-container{margin:auto;max-width:1200px}.submit-story{box-shadow:.25rem .25rem .25rem var(--seal-brown);margin:0 1rem}.story-form{display:flex;flex-direction:column;gap:.5rem}.story-form input,.story-form textarea{border:var(--seal-brown) 1px solid;border-radius:.25rem;font-size:1rem;padding:1rem;width:100%}.story-card{white-space:pre-wrap}.dateInfo{color:var(--resenda-green);font-size:.75rem;padding-top:.25rem}@media (min-width: 640px){footer{bottom:0;width:100%}.login{margin:auto;width:450px}}@media (min-width: 1024px){.card{margin:1rem auto;max-width:1200px}.modal-story.card{min-width:70%}.submit-story{margin:0}}