.preloader{height:20px;display:flex;align-items:center}.dot-flashing{position:relative;width:10px;height:10px;border-radius:5px;background-color:#333;color:#333;animation:dotFlashing 1s infinite linear alternate;animation-delay:.2s;left:15px}.dot-flashing:before,.dot-flashing:after{content:"";display:inline-block;position:absolute;top:0}.dot-flashing:before{left:-13px;width:10px;height:10px;border-radius:5px;background-color:#333;color:#333;animation:dotFlashing 1s infinite alternate;animation-delay:0s}.dot-flashing:after{left:13px;width:10px;height:10px;border-radius:5px;background-color:#333;color:#333;animation:dotFlashing 1s infinite alternate;animation-delay:.3s}@keyframes dotFlashing{0%{background-color:#333}50%,to{background-color:#b5b5b7}}*{padding:0;margin:0;box-sizing:border-box}::-webkit-scrollbar{display:none}@font-face{* {font-family: Delicious; src: url(Delicious-Roman.otf);}}@font-face{* {font-family: Delicious; font-weight: bold; src: url(Delicious-Bold.otf);}}.message{opacity:1;flex:auto;height:auto;max-width:70%;max-height:70.25rem;line-height:1.1;background:rgba(206,206,206,.5);overflow:hidden;display:inline-block;margin:0 0 .225rem;padding:.9rem .95rem;line-height:1.25rem;border-radius:1.25rem;transform-origin:0 100%;vertical-align:middle}.senderMessage{opacity:1;flex:auto;max-width:60%;max-height:20.25rem;background:#1982fc;color:#fff;overflow:hidden;display:inline-block;margin:0 0 .225rem;padding:.9rem .95rem;line-height:1.25rem;border-radius:1.25rem;transform-origin:0 100%;vertical-align:middle;align-self:end}.highlight-container,.highlight{position:relative}.highlight-container{display:inline-block}.highlight-container:before{content:" ";display:block;height:90%;width:100%;margin-left:-3px;margin-right:-3px;position:absolute;background:rgba(255,213,0,.5);transform:rotate(1deg);top:-1px;left:-1px;border-radius:20% 25% 20% 24%;padding:10px 3px 3px 10px}.textAreaWrapper{height:90%;overflow-y:scroll;scroll-behavior:smooth;padding-bottom:10px}.textArea{display:flex;flex-direction:column;align-items:start;height:auto}.controlArea{height:auto;position:fixed;bottom:0;right:0px;align-self:flex-end}.sendControls{box-sizing:border-box;background-color:#ececec;width:100vw;padding:25px 55px;display:flex;justify-content:space-between;position:relative}#message{font-size:1.2rem;padding:10px 25px;border:none;outline:none;border-radius:20px}.sendControls button{font-size:1rem;border-radius:10px;border:none;outline:none;color:#fff;background:#1982fc;padding:10px;cursor:pointer}.dropdown .dropdownBtn{display:none}.dropdown .predefinedBtn{display:flex;flex-direction:row}.dropdown .predefinedBtn button{margin-right:10px}@media screen and (min-width: 1244px){#message{width:50%}}@media screen and (max-width: 768px){#message{font-size:1rem;padding:5px 12px;max-width:70%}.sendControls{padding:10px;font-size:1rem}.sendControls button{font-size:.9rem;padding:10px;border-radius:6px}.sendControls input{width:58%}}@media screen and (max-width: 1244px){.dropdown .predefinedBtn{display:none;flex-direction:column;position:absolute;bottom:70%;right:20%;background-color:#fff;padding:20px 30px;border-radius:15px}.dropdown .predefinedBtn button{margin-bottom:10px}.dropdown .dropdownBtn{display:block}.dropdown:hover .predefinedBtn{display:flex}}.resumeBlock{display:flex;justify-content:space-between;align-items:center;max-width:250px;margin:0;background:floralwhite;padding:10px;border-radius:10px}.resumeBlock img{height:50px}.resumeBlock a{text-decoration:none;color:#000;display:flex;align-items:center;justify-content:space-between}.resumeBlock a p{margin-left:10px}.projectContainer{height:auto;display:flex;justify-content:space-around;align-self:flex-start}.thumbnail{max-width:50%;display:flex;align-items:center;padding:10px 15px}.thumbnail img{width:100%;border-radius:10px;box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}.about{display:flex;max-width:40%;flex-direction:column;justify-content:space-between;padding:20px 0}.about .title{font-weight:600;font-size:1.5rem}.about .description{font-size:1.2rem}.about button{outline:none;border:none;font-size:1.2rem;padding:10px 15px;border-radius:10px;cursor:pointer}.about .github{border:rgb(8,119,224) 2px solid;color:#000}.about .preview{background-color:#0877e0;color:#fff;padding:14px 20px;margin-left:20px}@media screen and (max-width: 900px){.projectContainer{flex-direction:column}.projectContainer .thumbnail{max-width:90%}.projectContainer .about{max-width:90%;padding-left:20px}.projectContainer .about .title{margin-bottom:15px}.projectContainer .about .description{margin-bottom:15px;font-size:1rem}.projectContainer .about button{font-size:1rem;padding:10px}.projectContainer .about .preview{margin-left:0;padding:13px}}.skillCard{width:500px;padding:10px 0 0 20px;text-align:left}.skillCard .skillHeader{display:flex;justify-content:flex-start}.skillCard .skillHeader img{height:50px}.skillCard .skillHeader .title{align-self:flex-start;margin-top:10px;margin-left:20px;font-size:1.8rem;font-weight:600;padding-bottom:5px}.skillCard .skillHeader strong{position:relative}.skillCard .skillHeader strong:before{background-color:#46b96cb3;content:"";position:absolute;width:calc(100% + 4px);height:20%;left:-2px;bottom:0;z-index:-1;transform:rotate(-1.5deg)}@keyframes titleHover{0%{height:20%}to{height:50%}}.skillCard .skillHeader strong:hover:before{animation:titleHover .2s ease-in;animation-fill-mode:forwards}.skillCard .skillContent{margin-top:15px;font-size:1.2rem;border-left:3px solid rgba(0,0,0,.8);padding:10px 15px}.skillCard .skillContent .tools{margin-top:20px}@media screen and (max-width: 900px){.skillCard{padding:5px 0 0 5px;max-width:100%}.skillCard .skillHeader{align-items:center}.skillCard .skillHeader img{height:30px}.skillCard .skillHeader .title{font-size:1.2rem;margin-top:0;margin-left:10px}.skillCard .skillContent{font-size:1rem}}#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:100vw;height:100vh;padding:1rem 1.4rem;font-size:1.5rem}.wrapper{height:100%}@media screen and (max-width: 768px){#app{font-size:1.2rem}}@media screen and (max-width: 1200px) and (min-width: 768px){#app{font-size:1.4rem}}