@import"https://fonts.googleapis.com/css2?family=Advent+Pro:wght@300;400;500;600&family=Roboto:wght@700&display=swap";*{padding:0;margin:0;box-sizing:border-box;font-family:Advent Pro,sans-serif;transition:.3s ease}:root{--primaryColor: #00eaff;--primaryHover: hsl(182, 92%, 41%);--secondaryColor: rgb(150, 162, 188);--paragraphColor: rgb(127, 127, 175);--BgColor: #031a30;--formColor: rgb(2, 15, 29);--projectCardColor: #072340;--textColor: #dae4fb;--headerHeight: 3rem}[data-theme=dark]{--primaryColor: #00eaff !important;--primaryHover: hsl(182, 92%, 41%) !important;--secondaryColor: rgb(150, 162, 188) !important;--paragraphColor: rgb(127, 127, 175) !important;--BgColor: #031a30 !important;--formColor: rgb(2, 15, 29) !important;--projectCardColor: #072340 !important;--textColor: #dae4fb !important}[data-theme=light]{--primaryColor: #26a69a !important;--primaryHover: #00796b !important;--secondaryColor: #333 !important;--paragraphColor: #666 !important;--BgColor: #fff !important;--formColor: #f0f0f0 !important;--projectCardColor: #f7f8fa !important;--textColor: #000 !important}html{scroll-behavior:smooth}a{text-decoration:none}li{list-style:none}.flex{display:flex;align-content:center}.grid{display:grid;align-content:center}input,textarea{font-size:100%}section{padding:4rem 0 2rem}.container{padding-left:1.5rem;padding-right:1.5rem}img{height:auto;width:100%}.icon{font-size:20px;cursor:pointer}.btn{border:2px solid var(--primaryHover);padding:.5rem 1.5rem;font-size:1.1rem;font-weight:600;position:relative;color:var(--primaryColor);background:transparent}.btn:before{content:"";height:100%;width:0%;background:var(--primaryColor);position:absolute;top:0;left:0;z-index:-1;transition:.2s}.btn:after{content:"";height:100%;width:0%;background:var(--BgColor);position:absolute;top:0;left:0;z-index:-1;transition:.5s}.btn:hover:before,.btn:hover:after{width:100%}.navLink{position:relative}.navLink:before{content:"";position:absolute;background:var(--primaryHover);height:2px;width:0%;bottom:-3px;left:0;transition:.3s}.navLink:after{content:"";position:absolute;background:var(--projectCardColor);height:2px;width:0%;bottom:-3px;left:0;transition:.8s}.sectionTitle{padding:1rem 0;font-size:2rem;color:var(--textColor);display:flex;align-content:center}.titleNumber{color:var(--primaryColor);margin:0 .6rem;font-weight:600}.titleText{position:relative;width:max-content}.underline{position:absolute;width:100%;height:3px;top:35px;left:0;border-radius:10px;background:var(--secondaryColor);overflow:hidden}.underline span{top:0;left:10px;height:100%;width:10px;border-radius:10px;position:absolute;background:var(--textColor);animation:moveLine 2s linear infinite}@keyframes moveLine{0%{left:-20px}to{left:100px}}body{background:var(--BgColor);color:var(--textColor)}::selection{background-color:var(--primaryColor);color:#fff}::-webkit-scrollbar{width:5px;background:var(--projectCardColor)}::-webkit-scrollbar-thumb{background:var(--primaryHover);border-radius:5px}@media screen and (min-width: 769px){.container{width:70%;margin:auto}}@media screen and (min-width: 960px){.section{padding:6rem 0 4rem}}@media screen and (min-width: 1240px){.section{padding:6rem 0 4rem}.container{width:70%;margin:auto}}@media screen and (min-width: 1440px){body{zoom:1}}@media screen and (min-width: 2560px){body{zoom:1.7}}.about .sectionContent .textSection h4{color:var(--secondaryColor);font-size:1.1rem;max-width:100%;letter-spacing:1px;font-weight:500;margin:auto}.about .sectionContent .textSection .aboutBtn{display:flex;align-items:center;justify-content:center;margin-top:2rem;background:var(--primaryColor);width:max-content;padding:10px 15px}.about .sectionContent .textSection .aboutBtn:hover{background:var(--primaryHover)}.about .sectionContent .textSection .aboutBtn a{color:var(--projectCardColor);font-size:1.2rem;font-weight:600;cursor:pointer;gap:.5rem}.about .sectionContent .textSection .aboutBtn a:hover{color:var(--textColor)}.about .sectionContent .aboutImgDiv{position:relative;width:250px;height:250px;margin:2rem auto 3rem;border-radius:50%;overflow:hidden;display:grid;border:2px dashed var(--primaryColor)}.about .sectionContent .aboutImgDiv .aboutImg{width:100%;object-fit:cover;align-self:center;justify-self:center}@media screen and (min-width: 769px){.about{width:70%;margin:auto}}@media screen and (min-width: 960px){.about .sectionContent{grid-template-columns:repeat(2,1fr);justify-content:center;margin:auto}}@media screen and (min-width: 1240px){.about .sectionContent .textSection h4{font-size:1.2rem}}.contact .contactContainer{width:100%;justify-content:center;align-items:flex-start;gap:1rem}.contact .contactContainer .form h3{padding:12px 0!important}.contact .contactContainer .error-message{color:red;margin-top:10px}.contact .contactContainer .socialContacts{justify-content:center}.contact .contactContainer .socialContacts h3{color:var(--secondaryColor);padding:1rem 0;text-align:center}.contact .contactContainer .socialContacts .cards{gap:1rem}.contact .contactContainer .socialContacts .cards .card{display:grid;align-items:center;row-gap:10px;padding:1.5rem;width:240px;background:var(--projectCardColor);border-radius:10px;text-align:center}.contact .contactContainer .socialContacts .cards .card .icon{color:var(--primaryColor)}.contact .contactContainer .socialContacts .cards .card h4{color:var(--textColor);font-size:18px}.contact .contactContainer .socialContacts .cards .card .userName{color:var(--secondaryColor);font-weight:600}.contact .contactContainer .socialContacts .cards .card a{justify-content:center;gap:5px;color:var(--primaryColor);font-weight:600;cursor:pointer}.contact .contactContainer .socialContacts .cards .card a .icon{font-size:20px}.contact .contactContainer .socialContacts .cards .card a:hover{color:var(--primaryColor)}.contact .contactContainer .socialContacts .cards .card a:hover .icon{transform:translate(10px)}.contact .contactContainer .form{width:100%;justify-content:center;margin:auto}.contact .contactContainer .form h3{text-align:center;color:var(--secondaryColor)}.contact .contactContainer .form form{width:100%;text-align:center}.contact .contactContainer .form form input,.contact .contactContainer .form form textarea{height:1rem;width:90%;padding:1.5rem;border-radius:10px;background:none;border:2px solid var(--secondaryColor);margin:.5rem;outline:none;color:var(--textColor);font-weight:600}.contact .contactContainer .form form input::placeholder,.contact .contactContainer .form form textarea::placeholder{color:var(--secondaryColor);opacity:.5}.contact .contactContainer .form form textarea{height:150px;resize:none}.contact .contactContainer .form form .formBtn{display:block;margin:auto;width:90%;border:none;padding:1rem 0;border-radius:10px;font-size:18px;background:var(--primaryColor);color:var(--BgColor);font-weight:600;cursor:pointer}.contact .contactContainer .form form .formBtn:hover{background:var(--primaryHover)}@media screen and (min-width: 640px){.cards{justify-content:center;grid-template-columns:repeat(2,1fr)}}@media screen and (min-width: 1150px){.contact .contactContainer{grid-template-columns:repeat(2,1fr);align-items:flex-start!important}}.education .educationList{display:flex;flex-direction:column;align-items:center;margin-top:1rem;gap:30px}.education .educationList .educationItem{background:var(--projectCardColor);padding:1rem;margin-bottom:1rem;border-radius:8px;box-shadow:0 4px 8px #0000001a;width:80%;display:flex;flex-direction:column;justify-content:space-between;align-items:center;transition:transform .3s;min-height:300px}.education .educationList .educationItem .educationLogo{width:100px;height:auto;margin-bottom:1rem}.education .educationList .educationItem:hover{transform:scale(1.05)}.education .educationList .educationItem .educationSchool{font-size:1.2rem;font-weight:700;color:var(--textColor)}.education .educationList .educationItem .educationLocation,.education .educationList .educationItem .educationDegree,.education .educationList .educationItem .educationDate{display:block;color:var(--secondaryColor);margin-top:.3rem;text-align:center}.education .educationList .educationItem .educationDate{margin-top:1rem;font-weight:600}@media screen and (min-width: 480px){.education .educationList{flex-direction:column}.education .educationList .educationItem{width:100%}}@media screen and (min-width: 1150px){.education .educationList{flex-direction:row}.education .educationList .educationItem{width:50%}}.footer{width:100%;text-align:center;background:var(--projectCardColor);margin-top:1rem;padding:1rem 0}.footer span{text-align:center;color:var(--secondaryColor);opacity:.5;font-size:15px}.home .homeContainer{padding:4rem 1.5rem}.home .homeContainer .introText{font-size:1.3rem;color:var(--primaryColor);font-weight:600;letter-spacing:1px}.home .homeContainer .title{font-size:3.3rem;font-weight:600;color:var(--textColor);padding:.7rem 0}.home .homeContainer .subTitle{display:block;font-size:1.8rem;font-weight:600;color:var(--secondaryColor);line-height:2rem;padding:.5rem 0}.home .homeContainer .homeParagraph{font-size:1.3rem;padding:.6rem 1rem;color:var(--paragraphColor);padding:1rem 0;max-width:600px}.home .homeContainer .lowerHomeSection .contactBtn{padding:.6rem;background:var(--primaryColor);border:none;outline:none}.home .homeContainer .lowerHomeSection .contactBtn:hover{background:var(--primaryHover)}.home .homeContainer .lowerHomeSection .contactBtn a{font-size:18px;font-weight:600;gap:.5rem;align-items:center;color:var(--BgColor)}.home .homeContainer .lowerHomeSection .scrollDiv{padding-top:1rem;display:flex;align-items:center}.home .homeContainer .lowerHomeSection .scrollDiv .scroll{font-size:1rem;color:var(--primaryColor)}.home .homeContainer .lowerHomeSection .scrollDiv .icon{font-size:1.3rem;margin-left:.6rem;color:var(--primaryColor);animation:move .5s infinite}@keyframes move{0%{transform:translateY(5px)}25%{transform:translateY(0)}50%{transform:translateY(5px)}75%{transform:translateY(0)}to{transform:translateY(5px)}}.home .leftIcons,.home .rightEmail{display:none}@media screen and (min-width: 480px){.home .homeContainer{padding:5rem 1.5rem}.home .homeContainer .introText{font-size:1.5rem}.home .homeContainer .title{font-size:3.5rem}.home .homeContainer .subTitle{font-size:2.1rem}.home .homeContainer .homeParagraph{font-size:1.5rem}.home .homeContainer .lowerHomeSection .contactBtn{padding:.8rem 1.5rem}.home .homeContainer .lowerHomeSection .contactBtn a{font-size:22px}.home .homeContainer .scrollDiv{padding-top:1.5rem}.home .homeContainer .scrollDiv .icon{font-size:1.5rem}}@media screen and (min-width: 770px){.home .homeContainer{padding:5rem 1.5rem;width:70%;margin:auto}.home .leftIcons,.home .rightEmail{display:block;position:fixed}.home .leftIcons .icon,.home .rightEmail .icon{color:var(--secondaryColor)}.home .leftIcons a,.home .rightEmail a{font-weight:600;color:var(--secondaryColor)}.home .leftIcons .line,.home .rightEmail .line{margin:auto;content:"";background:var(--secondaryColor);height:100px;width:1px}.home .leftIcons{left:5%;bottom:0}.home .leftIcons .socials{gap:1rem}.home .leftIcons .socials a{color:var(--textColor)}.home .leftIcons .socials a:hover{color:var(--primaryColor)}.home .rightEmail{right:0;bottom:0}.home .rightEmail .emailAddress{transform:rotate(90deg) translate(-90px,-1px)}.home .rightEmail .emailAddress a{letter-spacing:1px}}@media screen and (min-width: 1240px){.home .homeContainer{padding:6rem}.home .homeContainer .introText{font-size:1.5rem}.home .homeContainer .title{font-size:5rem}.home .homeContainer .subTitle{line-height:2.5rem;font-size:2.4rem}.home .homeContainer .homeParagraph{font-size:1.8rem}}.header{position:fixed;display:flex;align-items:center;justify-content:space-between;width:100%;height:var(--headerHeight);padding:2rem;z-index:1000}.header .logoDiv{margin-top:-5px}.header .logo a{color:var(--textColor);font-weight:600;cursor:pointer;line-height:.5}.header .rightMenu{display:flex;align-items:center}.header .rightMenu .themeToggle{margin-right:1rem}.header .navLink{cursor:pointer}@media screen and (max-width: 768px){.header .navBar{background:var(--projectCardColor);position:absolute;height:max-content;width:80%;border-radius:1rem;padding:1rem;top:-100rem;left:50%;transform:translate(-50%);box-shadow:0 2px 4px #020f1de7;z-index:1000}.header .navLists{align-items:center;justify-content:center;flex-direction:column;width:100%;margin:auto;padding:1rem 0}.header .navLists .navItem{padding:1rem 0}.header .navLists .navItem .navLink{color:var(--textColor);font-size:1.2rem;font-weight:600}.header .navLists .navItem .navLink:hover,.header .navLists .navItem .navLink .headerNumber{color:var(--primaryColor)}.header .navLists .btn{margin-top:1rem}.header .navLists .btn a{color:var(--textColor)}.header .closeNavBar{position:absolute;top:1rem;right:1.5rem}.header .closeNavBar:hover .icon{color:var(--primaryColor)}}.header .activeNavBar{top:6rem}.activeHeader{background-color:var(--projectCardColor);box-shadow:0 2px 4px #010f1de7}@media screen and (min-width: 769px){.toggleNavBar,.closeNavBar{display:none}.header{padding:2.5rem 2rem}.header .navBar .navLists{display:flex;align-items:center;justify-content:center;flex-direction:row;padding:0 1rem}.header .navBar .navLists .navItem{padding:0 1rem}.header .navBar .navLists .navItem .navLink{color:var(--textColor);font-size:1.2rem;font-weight:600}.header .navBar .navLists .navItem .navLink:hover,.header .navBar .navLists .navItem .navLink .headerNumber{color:var(--primaryColor)}.header .navBar .navLists .btn{margin-left:1rem}.header .navBar .navLists .btn a{color:var(--primaryColor)}}@media screen and (min-width: 960px){.header{padding:2.5rem 5rem}.header .navBar .navLists,.header .navBar .navLists .navItem{padding:0 2rem}}.projects .projectContainer{margin-top:1rem;justify-content:space-between;grid-template-columns:repeat(1,1fr);gap:1rem}.projects .projectContainer .singleProject{display:grid;gap:.5rem;padding:1.5rem 1rem;border-radius:10px;height:100%;background:var(--projectCardColor)}.projects .projectContainer .singleProject .externalLinks{width:100%;justify-content:space-between}.projects .projectContainer .singleProject .externalLinks .youtubeIcon a,.projects .projectContainer .singleProject .externalLinks .githubIcon a{color:var(--primaryColor)}.projects .projectContainer .singleProject .externalLinks .youtubeIcon a:hover,.projects .projectContainer .singleProject .externalLinks .githubIcon a:hover{color:var(--primaryHover)}.projects .projectContainer .singleProject:hover{transform:translateY(-7px);border-bottom:2px solid var(--primaryColor)}.projects .projectContainer .singleProject .imgDiv{height:150px;width:auto;border-radius:5px;overflow:hidden;cursor:pointer}.projects .projectContainer .singleProject .imgDiv img{height:100%;width:100%;object-fit:cover;border-radius:5px}.projects .projectContainer .singleProject .projectTitle{display:flex;font-weight:600;color:var(--textColor)}.projects .projectContainer .singleProject .desc{font-weight:600;color:var(--secondaryColor)}.projects .projectContainer .singleProject .technologies{gap:.5rem;justify-content:flex-end}.projects .projectContainer .singleProject .technologies small{color:var(--secondaryColor);font-weight:600}@media screen and (min-width: 600px){.projects .projectContainer{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width: 769px){.projects{width:70%;margin:auto}.projects .projectContainer{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width: 1150px){.projects .projectContainer{grid-template-columns:repeat(3,1fr)}.projects .projectContainer .singleProject .desc{font-size:17px}.projects .projectContainer .singleProject .desc .technologies small{font-size:15px}}.skills .skillsContainer{gap:2rem 0;padding:1rem 0}.skills .skillsContainer .skillGroup .groupTitle .subTitle{display:block;padding:.3rem 0 1rem;color:var(--secondaryColor);font-weight:600}.skills .skillsContainer .skillGroup .generalSkills{margin-top:20px;display:grid;align-items:center;justify-content:center;grid-template-columns:repeat(3,1fr);gap:1rem}.skills .skillsContainer .skillGroup .generalSkills .singleSkill{display:grid;align-items:center;justify-content:center}.skills .skillsContainer .skillGroup .generalSkills .singleSkill .techLogo{height:70px;width:70px;z-index:500}.skills .skillsContainer .skillGroup .generalSkills .singleSkill .iconBox{position:relative;height:70px;width:50px;background:var(--projectCardColor);border:2px solid var(--secondaryColor);border-radius:3rem;align-items:center;justify-content:center;overflow:hidden;z-index:500}.skills .skillsContainer .skillGroup .generalSkills .singleSkill .iconBox .icon{font-size:28px;z-index:500}.skills .skillsContainer .skillGroup .generalSkills .singleSkill .iconBox:before{content:"";height:0;width:100%;background:var(--primaryHover);position:absolute;top:0;left:0;z-index:1;transition:.2s}.skills .skillsContainer .skillGroup .generalSkills .singleSkill .iconBox:after{content:"";height:0;width:100%;background:var(--BgColor);position:absolute;top:0;left:0;z-index:1;transition:.5s}.skills .skillsContainer .skillGroup .generalSkills .singleSkill .iconBox:hover{color:var(--textColor);border:2px solid var(--primaryColor)}.skills .skillsContainer .skillGroup .generalSkills .singleSkill .iconBox:hover .icon{color:var(--primaryColor)}.skills .skillsContainer .skillGroup .generalSkills .singleSkill .iconBox:hover:before,.skills .skillsContainer .skillGroup .generalSkills .singleSkill .iconBox:hover:after{height:100%}.skills .skillsContainer .skillGroup .generalSkills .singleSkill .skillName{padding-top:.3rem;text-align:center;font-weight:600;color:var(--secondaryColor)}@media screen and (min-width: 480px){.skills .skillsContainer .skillGroup .generalSkills{grid-template-columns:repeat(4,1fr)}}@media screen and (min-width: 640px){.skills .skillsContainer{grid-template-columns:repeat(2,1fr);gap:2rem;align-items:flex-start;justify-content:center;margin:auto}.skills .skillsContainer .skillGroup .generalSkills{grid-template-columns:repeat(3,1fr)}}@media screen and (min-width: 769px){.skills{width:70%;margin:auto}.skills .skillsContainer{grid-template-columns:repeat(2,1fr);gap:2rem;align-items:flex-start}.skills .skillsContainer .skillGroup .generalSkills{grid-template-columns:repeat(3,1fr)}}@media screen and (min-width: 1240px){.skills .skillsContainer{grid-template-columns:repeat(3,1fr);gap:2rem;align-items:flex-start}.skills .skillsContainer .skillGroup .generalSkills{grid-template-columns:repeat(2,1fr);padding-right:5rem;row-gap:1.5rem}.skills .skillsContainer .skillGroup .generalSkills .singleSkill{align-content:flex-start;align-items:flex-start;justify-content:flex-start}}.work .timeline{position:relative;margin-top:1rem;list-style:none;display:flex;flex-direction:column}.work .timelineItem{position:relative;padding-left:40px;margin-bottom:2rem}.work .timelineItem:before{content:"";position:absolute;left:15px;top:0;bottom:0;width:2px;background:var(--primaryColor)}.work .timelineItem .timelineContent{background:var(--projectCardColor);padding:1rem;border-radius:8px;transition:transform .3s}.work .timelineItem .timelineContent .responsibilitiesHeading{margin-top:1rem;text-decoration:underline}.work .timelineItem .timelineContent .companyLogo{height:50px;width:auto;margin-bottom:1rem}.work .timelineItem .timelineContent .nokiaLogo{height:20px}.work .timelineItem .timelineContent .workTitle{font-size:1.2rem;font-weight:700;color:var(--textColor);margin-top:1rem}.work .timelineItem .timelineContent .projectTitle{font-size:1.2rem;color:inherit}.work .timelineItem .timelineContent .projectTitle .projectLink{text-decoration:underline;font-weight:700;align-items:center;gap:4px;color:inherit;transition:color .3s}.work .timelineItem .timelineContent .workDate,.work .timelineItem .timelineContent .workCompany,.work .timelineItem .timelineContent .workLocation{display:block;color:var(--secondaryColor);margin-top:.3rem}.work .timelineItem .timelineContent .workResponsibilities{font-size:1.1rem;margin-top:.5rem}.work .timelineItem .timelineContent .workResponsibilities li{list-style-type:disc;color:var(--secondaryColor);font-weight:500;margin-bottom:5px;margin-left:1rem}.work .timelineItem .timelineContent .workResponsibilities .highlight{font-weight:800;color:var(--primaryColor)}@media screen and (min-width: 600px){.work .timeline .timelineItem{padding-left:60px}.work .timeline .timelineItem:before{left:30px}}@media screen and (min-width: 769px){.work{width:70%;margin:auto}.work .timeline .timelineItem{padding-left:80px}.work .timeline .timelineItem:before{left:45px}}@media screen and (min-width: 1150px){.work .timeline .timelineItem{padding-left:100px}.work .timeline .timelineItem:before{left:60px}}
