@charset "UTF-8";*,*:before,*:after{margin:0;padding:0;box-sizing:inherit}html{box-sizing:border-box;font-size:62.5%}body{font-family:Lato,sans-serif;font-size:1rem;background:#dbdff1;color:#000;width:100%;min-height:100vh;display:flex;flex-direction:column}main{flex-grow:1;text-align:center;padding:2rem;width:100%}section{margin-top:1.2rem}@media (min-width: 768px){section{margin-top:0}}.hidden{display:none}@media (min-width: 768px){.gridContainer{display:grid;grid-template-areas:"projectsSCSS projectsJS" "projectsREACT projectsMY" "info info";grid-template-columns:50% 50%;gap:1rem;justify-items:center;align-items:center;margin-top:2rem}}@media (min-width: 1600px){.gridContainer{width:95%;margin:0 auto auto;display:grid;grid-template-columns:33% 33% 33%;grid-template-rows:330px 330px;grid-template-areas:"projectsSCSS projectsJS info" "projectsREACT projectsMY info";gap:1rem;justify-items:center;align-items:center;padding-top:0}}.projectsSCSS{margin-top:0;grid-area:projectsSCSS}@media (min-width: 768px){.projectsSCSS{height:280px;width:330px}}.projectsJS{grid-area:projectsJS}@media (min-width: 768px){.projectsJS{height:280px;width:330px}}.projectsREACT{grid-area:projectsREACT}@media (min-width: 768px){.projectsREACT{height:280px;width:330px}}@media (min-width: 1200px){.projectsREACT{margin-top:1.5rem}}@media (min-width: 1600px){.projectsREACT{margin-top:0}}.projectsMY{grid-area:projectsMY}@media (min-width: 768px){.projectsMY{height:280px;width:330px}}@media (min-width: 1200px){.projectsMY{margin-top:1.5rem}}@media (min-width: 1600px){.projectsMY{margin-top:0}}@media (min-width: 576px){.projectsMY a img{max-width:70%}}@media (min-width: 768px){.projectsMY a img{max-width:100%}}.info{grid-area:info;gap:1.5rem}@media (min-width: 768px){.info{max-width:100%;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto;grid-template-areas:"description description" "skills contact"}}@media (min-width: 992px){.info{max-width:95%;display:grid;grid-template-columns:1.4fr .6fr;grid-template-rows:auto;grid-template-areas:"description skills" "description contact"}}@media (min-width: 1600px){.info{max-width:none;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto;grid-template-areas:"description description" "skills contact"}}@media (min-width: 992px){.upperContentContainer{display:flex;flex-direction:row-reverse;justify-content:space-between;padding-left:5rem;padding-right:5rem}}.options{width:50px;background-color:#e2d2d2;border:2px black solid;border-radius:0 0 8px 8px;list-style:none;font-size:2rem;position:fixed;top:0;right:5px;z-index:100;display:flex;flex-direction:column;align-items:center;padding-top:1rem;transition:transform .3s ease-in-out}@media (min-width: 992px){.options{flex-direction:row;justify-content:space-between;position:static;transition:none;width:150px;border:none;border-radius:0;background-color:transparent;padding-left:1rem;padding-right:1rem;padding-top:0}}.options__item{padding:5px;margin:5px 0;cursor:pointer}.options__item img{height:28px}@media (min-width: 992px){.options__item img{height:42px}}.options__item--inactive{border-radius:50%;background-color:gray;opacity:.5}.options__item--active{background-color:#e2d2d2;opacity:1}.options.closed{transform:translateY(-80%)}@media (min-width: 992px){.options.closed{transform:none}}.options.open{transform:translateY(-5%)}.options .arrow-icon{transition:transform .6s ease}.options.open .arrow-icon{transform:rotate(180deg)}#close-accordions{display:flex;justify-content:center;align-items:center;width:max-content;height:100%}@media (min-width: 768px){#close-accordions{display:none}}@media (min-width: 992px){#toggle-menu{display:none}}@media (min-width: 992px){#toggle-theme{background-color:#eae3e3;border-radius:50%;display:flex;justify-content:center;align-items:center}#toggle-theme img{height:36px}#toggle-theme img:hover{border:white 2px solid;border-radius:50%;scale:1.6}}@media (min-width: 992px){#toggle-lang img{height:36px}#toggle-lang img:hover{border:white 2px solid;border-radius:50%;scale:1.5}}.header{margin-top:25px;padding:2rem;width:100%;text-align:justify}@media (min-width: 992px){.header{max-width:fit-content}}.header__main{padding-bottom:1rem}.header__additional{font-size:1.6rem}@media (min-width: 576px){.projects{display:flex;justify-content:space-evenly}}@media (min-width: 768px){.projects{position:relative}}@media (min-width: 1200px){.projects{position:relative;min-height:250px}}.projects__item{list-style:none;padding:1rem 0}@media (min-width: 768px){.projects__item{width:100%;height:100%;position:absolute}}@media (min-width: 768px){.projects__item--1{bottom:0;left:-70px}}@media (min-width: 768px){.projects__item--2{bottom:-40px;left:90px}}@media (min-width: 768px){.projects__item--3{bottom:-100px;left:-25px}}.projects__img{width:80%;aspect-ratio:2/1;border:rgb(25,25,239) 1px solid;border-radius:.7rem;box-shadow:.3rem .3rem 1rem #16003f}@media (min-width: 768px){.projects__img{width:70%}}@media (min-width: 992px){.projects__img{width:80%}}@media (min-width: 1200px){.projects__img{width:90%}}@media (min-width: 576px){.preview{transform:scale(1.4);z-index:10;position:relative;transition:transform .3s ease}}@media (min-width: 768px){.preview{transform:scale(1.2)}}.aboutMe{text-align:justify}.aboutMe__heading{font-size:1.8rem;margin-bottom:.5rem}@media (min-width: 576px){.aboutMe__content{display:grid;grid-template-areas:"photo text-1" "photo text-2"}}@media (min-width: 1400px){.aboutMe__content{grid-template-areas:"photo text-1" "text-2 text-2"}}.aboutMe__text{font-size:1.5rem}.aboutMe__descriptionMain{grid-area:text-1}@media (min-width: 768px){.aboutMe__descriptionMain{padding-top:5%}}@media (min-width: 992px){.aboutMe__descriptionMain{padding-top:0}}@media (min-width: 1200px){.aboutMe__descriptionMain{padding-top:5%}}@media (min-width: 1600px){.aboutMe__descriptionMain{padding-top:0}}@media (min-width: 1600px){.aboutMe__descriptionMain{margin-top:1.5rem}}.aboutMe__descriptionSecondary{grid-area:text-2;margin-top:1.5rem}@media (min-width: 1400px){.aboutMe__descriptionSecondary{margin-top:.5rem}}.aboutMe__myPhoto{grid-area:photo;display:block;height:200px;border:#9198e5 .3rem solid;border-radius:50%;margin:auto;margin-top:1.5rem}@media (min-width: 576px){.aboutMe__myPhoto{margin-right:1.5rem}}@media (min-width: 1600px){.aboutMe__myPhoto{float:left;margin:1.5rem}}@media (min-width: 1400px){.aboutMe__myPhoto{margin-bottom:0}}.skills{text-align:left}.skills__heading{font-size:1.8rem;margin-bottom:.5rem}.skills__list{list-style:none;margin-left:1rem}.skills__item{font-size:1.5rem}.skills__icon{width:1.5rem}.contact{text-align:left}.contact__heading{font-size:1.8rem;margin-bottom:.5rem}.contact__list{list-style:none;margin-left:1rem}.contact__item{font-size:1.5rem}.contact__item a:link,.contact__item a:visited{text-decoration:none;color:inherit}.contact__item a:hover{text-decoration:underline}.info__section--aboutMe{grid-area:description}.info__section--skills{grid-area:skills}.info__section--contact{grid-area:"skills contact"}@media (min-width: 1200px){.info{margin-top:5.5rem}}@media (min-width: 1600px){.info{margin-top:0}}.footer{padding:1rem 1rem 1.5rem;font-size:1.3rem;background-color:#364a54;color:#fce9dd}@media (min-width: 992px){.footer__container{margin-left:2.5rem}}.footer__courses,.footer__icons{margin-top:.5rem}.footer__link:link,.footer__link:visited{color:#eeace9}.accordion-header{background-color:#e2d2d2;padding:4px;margin:auto;width:95%;border:black solid 2px;border-radius:7px;font-size:1.5rem;display:grid;grid-template-columns:1fr 5fr 1fr}.accordion-header span{grid-column:2/3}.accordion-header img{margin:auto 0}@media (min-width: 768px){.accordion-header img{opacity:0}}@media (min-width: 768px){.accordion-header{min-width:fit-content;font-size:1.8rem;font-weight:700;background-color:transparent;border:none}}img.arrow-icon{width:40px;height:10px;rotate:180deg;object-fit:cover}.accordion-content{max-height:0;overflow:hidden;transition:max-height .3s ease-out,padding .3s;padding:0 1rem}@media (min-width: 768px){.accordion-content{max-height:min-content;overflow:visible;transition:none;padding:1rem 1.3rem}}.accordion-content.open{max-height:min-content;padding:1rem 1.3rem}.dark-mode{background:#2a3143;color:#fff}@media (min-width: 768px){.dark-mode button.accordion-header{color:#fff}}.light-mode{background:#dbdff1;color:#000}
