@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&display=swap";.navbar{background:rgba(133,192,173,.3);width:max-content;padding:.1rem;z-index:2;position:fixed;left:50%;transform:translate(-50%);bottom:2rem;display:flex;gap:.8rem;border-radius:3rem;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);text-decoration:none;text-transform:uppercase}.navbar .icon{background:transparent;padding:.7rem;border-radius:2rem;display:flex;transition:var(--transition);cursor:pointer}.navbar .icon:hover{background:rgba(133,192,173,.3)}.icon__cover{position:fixed;background:rgba(133,192,173,.3);padding:.7rem;border-radius:2rem;display:flex;transition:var(--transition);z-index:3;cursor:pointer}.Line{height:100%;max-height:100%;max-width:2px;background:transparent;overflow-y:hidden;padding:0% .4rem}.header_circle{width:11px;height:11px;background:transparent;border:2px solid rgb(22,141,143);border-radius:50%;transform:translate(-50%)}.header_line{width:1px;height:89%;background:rgb(22,141,143);overflow:hidden}.header_line_start{width:1px;height:31vh;background:rgb(22,141,143);overflow:hidden}.header_line_start_empty{width:1px;height:31vh;background:transparent;overflow:hidden}.stars_canvas{width:100%;height:100%;position:absolute}.card{position:relative;width:100%;overflow:visible;border-radius:8px;color:#fff;padding:10px;background-color:#168d8f1a;border:2px solid rgb(22,141,143);width:0%;display:flex;flex-direction:row;justify-content:flex-start;align-items:flex-start}.card img{border-radius:10px;height:200px;width:200px;object-fit:contain;opacity:0}.card .description{flex-grow:1;justify-content:center;opacity:0;font-size:1px;display:flex;flex-direction:column;justify-content:flex-start;margin-top:20px}.card .description .top{display:flex;flex-direction:row;justify-content:space-between;flex-wrap:wrap;flex-grow:1;margin-bottom:50px;margin-right:20px}.card .description .top p:first-child{margin-right:100px}.open{animation:onOpen 1.5s ease-in-out none 1 normal;animation-fill-mode:forwards}.open img{animation:imgAnimation .3s ease-in-out .5s 1 normal;animation-fill-mode:forwards}.open .description{animation:imgAnimation .3s ease-in-out 1.5s 1 normal;animation-fill-mode:forwards}@keyframes onOpen{0%{height:100%;width:0%}to{height:100%;width:100%}}@keyframes imgAnimation{0%{display:block;font-size:15px}1%{transform:translate(-20px);opacity:0;font-size:15px}to{transform:translate(0);opacity:1;font-size:15px}}.app__about{display:flex;flex-direction:row;background-color:#011010;overflow:visible;position:relative}.app__about__inner{display:flex;flex-direction:row;gap:30px;padding-left:10vw}.app__about__content{color:#fff;position:relative;margin-top:28vh}.app__about__content h2{color:#988e9f;font-size:18px;font-weight:300;margin:1rem 0rem}.green{color:#168d8f}.lightGreen{color:#24e394}.comment{color:#78707e}.yellow{color:#eeff31}.red{color:#e3244c}.desc{color:#24e33a}.dots{color:#3b3553;display:inline;font-weight:bolder;font-size:15px;letter-spacing:5px}@media screen and (max-width: 600px){.dots{visibility:hidden}}.app__header{height:100vh;background:black;position:relative;z-index:1;display:flex;flex-direction:row;gap:30px;padding-left:10vw}.app__header .circle{z-index:-1;position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 50% 200%,rgb(22,141,143) 0%,rgb(0,0,0) 70%);background-size:100% 100%;animation:colorChange 1.5s infinite alternate}.app__header .app__header__content{height:auto;width:60%;margin-top:28vh}.app__header .app__header__content h2{color:#988e9f;font-size:18px;font-weight:300;margin:1rem 0rem}.app__header .app__header__content h1{color:#fff;font-size:30px;font-weight:700}.app__header .app__header__content h1 span.title{color:#168d8f}.app__header .app__header__content h1 span.italic{font-style:italic;font-weight:300}.app__header .app__header__content h1 span.bold{font-style:normal;font-weight:700}.app__header img{margin-top:28vh;width:400px;height:400px;object-fit:cover;background-color:#168d8f1a;border-radius:50%;animation:image .5s 1 ease-in-out;transition:all .5s ease-in-out}.app__header img:hover{background-color:#168d8f26}@keyframes colorChange{to{background-size:100% 120%}}@keyframes image{0%{opacity:0}to{opacity:1}}.subtitle{display:flex;align-items:center}.subtitle .arrow{color:#988e9f;margin-left:10px;transition:all .4s ease-in-out;cursor:pointer}.subtitle .arrow:hover{font-size:50px}.app__work{display:flex;flex-direction:row;background-color:#011010;overflow:visible;position:relative}.app__work__inner{display:flex;flex-direction:row;gap:30px;padding-left:10vw;flex-grow:1}.app__work__content{width:60%;margin-top:28vh;margin-right:5%;flex-grow:1}.app__work__content h2{color:#988e9f;font-size:18px;font-weight:300;margin:1rem 0rem}.app__work__content .projects-list{margin-left:5vw;margin-top:9vh;display:flex;flex-direction:column;gap:30px}.app__contact{display:flex;flex-direction:row;background-color:#011010;overflow:visible;position:relative}.app__contact__inner{display:flex;flex-direction:row;gap:30px;padding-left:10vw}.app__contact__content{color:#fff;position:relative;margin-top:28vh;display:flex;flex-direction:column}.app__contact__content h2{color:#988e9f;font-size:18px;font-weight:300;margin:1rem 0rem}.app__contact__content h1{font-size:21px;font-weight:100}.app__contact__content button{cursor:pointer;padding:15px 30px;text-align:center;border-radius:50px;color:#fff;margin-top:50px;font-size:21px;background-color:#168d8f;outline:none;transition:all .4s ease-in-out}.app__contact__content button:hover{scale:1.05;background-color:#1eb4b7}.app__contact__content small{margin-top:100px}.contacts{display:flex;flex-direction:row;justify-content:space-between;width:40vw;flex-wrap:wrap;margin-top:10px}.contacts a{color:#168d8f;text-decoration:none;transition:all .2s ease-in-out}.contacts a:hover{color:#19abad}.app{background-color:var(--primary-color);font-family:var(--font-base)}.app__whitebg{background-color:var(--white-color)}.app__primarybg{background-color:var(--primary-color)}.app__container{width:100%;min-height:100vh;display:flex;flex-direction:row}.app__flex{display:flex;justify-content:center;align-items:center}.app__wrapper{flex:1;width:100%;flex-direction:column;padding:4rem 2rem}@media screen and (max-width: 450px){.app__wrapper{padding:4rem 1rem 2rem}}.copyright{width:100%;padding:2rem 0 0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end}.copyright p{text-transform:uppercase;color:var(--black-color)}.head-text{font-size:2.75rem;font-weight:800;text-align:center;color:var(--black-color);text-transform:capitalize}.head-text span{color:var(--secondary-color)}@media screen and (min-width: 2000px){.head-text{font-size:4rem}}@media screen and (max-width: 450px){.head-text{font-size:2rem}}.p-text{font-size:.8rem;text-align:left;color:var(--gray-color);line-height:1.5}@media screen and (min-width: 2000px){.p-text{font-size:1.75rem}}.bold-text{font-size:1rem;font-weight:800;color:var(--black-color);text-align:left}@media screen and (min-width: 2000px){.bold-text{font-size:2rem}}@media screen and (max-width: 450px){.bold-text{font-size:.9rem}}.app__social{display:flex;justify-content:flex-end;align-items:center;flex-direction:column;padding:1rem}.app__social div{width:40px;height:40px;border-radius:50%;background-color:var(--white-color);margin:.25rem 0;border:1px solid var(--lightGray-color);display:flex;justify-content:center;align-items:center;transition:all .3s ease-in-out}.app__social div svg{width:15px;height:15px;color:var(--gray-color)}.app__social div:hover{background-color:var(--secondary-color);border-color:var(--secondary-color)}.app__social div:hover svg{color:var(--white-color)}@media screen and (min-width: 2000px){.app__social div{width:70px;height:70px;margin:.5rem 0}.app__social div svg{width:30px;height:30px}}.app__navigation{display:flex;justify-content:center;align-items:center;flex-direction:column;padding:1rem}.app__navigation .app__navigation-dot{width:10px;height:10px;border-radius:50%;background-color:#cbcbcb;margin:.5rem;transition:background-color .2s ease-in-out}.app__navigation .app__navigation-dot:hover{background-color:var(--secondary-color)}@media screen and (min-width: 2000px){.app__navigation .app__navigation-dot{width:20px;height:20px}}@media screen and (max-width: 500px){.app__navigation,.app__social{display:none}.copyright{padding:2rem}}.work_section{position:relative;z-index:0;background-color:#011010}:root{--font-base: "DM Sans", sans-serif;--primary-color: #edf2f8;--secondary-color: #313bac;--black-color: #030303;--lightGray-color: #e4e4e4;--gray-color: #6b7688;--brown-color: #46364a;--white-color: #ffffff;--transition: all .4s ease}*{box-sizing:border-box;padding:0;margin:0;scroll-behavior:smooth}* ::-webkit-scrollbar{display:none}
