@import url(https://fonts.googleapis.com/css2?family=Lobster&family=Roboto:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap);*{box-sizing:border-box;margin:0;padding:0}body{background-color:#e9ecef;color:#212529;font-family:Roboto,sans-serif}#root{margin:0 1.5rem}#header-container{align-items:center;display:flex;flex-wrap:wrap;justify-content:center;margin:1.5rem 0 2.5rem}#header-container h1{font-family:Lobster,cursive;font-size:3rem;margin-bottom:.5rem;text-align:center}.add-note-btn{align-items:center;background-color:#198754;border:none;border-radius:5px;color:#fff;display:flex;font-size:1rem;margin:0 1.5rem .5rem;padding:.5rem 1rem;transition:background-color .15s ease-in-out}.add-note-btn svg{margin-right:.25rem}.add-note-btn:hover{background-color:#479f76}#form-container{-webkit-animation:fadeIn .5s;animation:fadeIn .5s;background-color:#49505788;height:100vh;left:0;padding-top:100px;position:absolute;top:0;width:100vw;z-index:1}#form-container form{-webkit-animation:zoomIn .75s;animation:zoomIn .75s;background-color:#dee2e6;border-radius:10px;color:#212529;display:flex;flex-direction:column;margin:auto;max-width:650px;padding:1rem 1.5rem;position:relative;width:95%}#form-container input[type=text],textarea{border:1px solid #212529;border-radius:5px;font-size:120%;margin:1rem 0;padding:.25rem .5rem;transition:all .1s}#form-container input[type=text]:focus,textarea:focus{border-color:transparent}.form-label-input{align-items:center;display:flex;margin-left:.5rem}#color{border:0;margin:1rem}#form-last-row{align-items:center;display:flex;justify-content:space-between}#form-last-row button{margin:0}#close-btn{position:absolute;right:0;top:0}#form-header{align-items:center;display:flex;font-size:1.2rem;justify-content:space-between;margin-top:.25rem}#form-header svg{font-size:2.25rem}.note-preview{border-radius:10px;height:180px;margin-bottom:1.5rem;padding:.75rem;position:relative;transition:all .3s ease-in-out;width:220px}.note-preview:hover{-webkit-transform:scale(110%);transform:scale(110%)}.note-preview-title{border-bottom:1px solid #212529;margin-bottom:.75rem;padding-bottom:.25rem;text-align:center}.note-preview-icon{color:gray;font-size:44px;left:0;position:absolute;top:-12px}.note-preview-content{color:#495057;padding:0 .1rem}h2.dark-bg{border-color:#f8f9fa;color:#f8f9fa}p.dark-bg{color:#ced4da}#note-container{align-items:center;display:flex;flex-wrap:wrap;justify-content:space-around;margin:auto;max-width:1200px}@-webkit-keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@-webkit-keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@-webkit-keyframes zoomIn{0%{scale:1%}to{scale:100%}}@keyframes zoomIn{0%{scale:1%}to{scale:100%}}#viewing-note-container{-webkit-animation:fadeIn .5s;animation:fadeIn .5s;background-color:#49505788;height:100vh;left:0;padding-top:100px;position:absolute;top:0;width:100vw;z-index:1}#viewing-note-container>div{-webkit-animation:zoomIn .75s;animation:zoomIn .75s;border-radius:10px;display:flex;flex-direction:column;margin:auto;max-width:800px;padding:1rem 1.5rem;position:relative;width:95%}#viewing-note-header{align-items:center;display:flex;font-size:1.2rem;justify-content:space-between;margin:.25rem 0 .6rem}#viewing-note-header svg{font-size:2.25rem}.note-dark-bg{border-color:#f8f9fa;color:#f8f9fa}#viewing-note-container p{line-height:140%}#remove-note-btn{align-items:center;align-self:flex-end;background-color:#dc3545;border:none;border-radius:5px;color:#fff;display:flex;font-size:1rem;margin-top:1rem;padding:.5rem 1rem;transition:background-color .15s ease-in-out;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}#remove-note-btn svg{margin-right:.25rem}#remove-note-btn:hover{background-color:#e35d6a}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{-webkit-animation:App-logo-spin 20s linear infinite;animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@-webkit-keyframes App-logo-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes App-logo-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}
/*# sourceMappingURL=main.97447504.css.map*/