*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:'Lato', sans-serif}body::-webkit-scrollbar{width:0.4rem}body::-webkit-scrollbar-track{background:#1e1e24}body::-webkit-scrollbar-thumb{background:#30bf74}ul{list-style:none}a{color:#fff;text-decoration:none;transition:all 0.2s;cursor:pointer}h1{font-size:3.5rem;text-transform:uppercase;white-space:nowrap}h2{margin-bottom:3rem;font-size:2.5rem;text-transform:capitalize}h3{margin:0.3rem 0;font-size:1.5rem;text-transform:capitalize}h5{font-size:1rem;text-transform:uppercase;font-weight:300}h6{color:rgba(0,0,0,0.4)}.text-primary{color:#30bf74}.container{max-width:1100px;margin-left:auto;margin-right:auto}section{margin:5rem auto}.copyright{margin:2.5rem 0;color:rgba(0,0,0,0.2)}hr{margin:auto;border:1px solid rgba(48,191,116,0.08);max-width:1100px}#open-btn{display:none;color:#fff}#close{display:none}.social-links{display:flex;justify-content:space-between;align-items:center;justify-content:space-evenly}.social-links .circle{height:50px;width:50px;border:#fff 1px solid;border-radius:50%;display:flex;justify-content:space-between;align-items:center;transition:all 0.2s}.social-links .circle:hover{border:#30bf74 1px solid;background:#30bf74}.social-links .circle:hover a{color:#fff}.social-links .circle:hover img{filter:brightness(0) invert(1)}.social-links .circle a{width:100%;font-size:1.5rem;display:grid;place-items:center}.social-links .circle img{width:70%;filter:brightness(0) invert(0.15)}.social-links .circle .apply-white{filter:brightness(0) invert(1)}header{position:relative;height:100vh;background:url("../img/header-bg-dark-2-min.png") center center/cover no-repeat;color:#fff}header nav{padding:2rem;display:flex;justify-content:space-between;align-items:center}header nav .logo{flex:100%}header nav .logo a{font-size:1.8rem}header nav .nav-menu{flex:100%}header nav .nav-menu ul{display:flex;justify-content:space-between;align-items:center}header nav .nav-menu ul a:hover{text-shadow:0.3px 0.3px #fff}header nav .nav-menu ul li:last-child a{padding:0.7rem 1.8rem;border:#30bf74 1px solid}header nav .nav-menu ul li:last-child a:hover{background:#30bf74;color:#fff}header .header-showcase{height:100%;width:100%;display:flex;justify-content:space-between;align-items:center}header .header-showcase-content{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);text-align:center}header .header-showcase-content h5{font-size:1.5rem}header .header-showcase-content h1{margin:1.3rem 0;font-size:3.5rem}.skills-tab{text-align:center;display:flex;justify-content:space-between;align-items:center;flex-direction:column}.skills-tab-container{text-align:center}.skills-tab-container ul{display:grid;grid-template-columns:repeat(4, 120px);gap:5rem}.skills-tab-container ul li .tooltip{padding:1rem;background:#fff;border:1px solid rgba(0,0,0,0.06);border-top:6px solid #30bf74;position:relative}.skills-tab-container ul li .tooltip .tooltiptext{position:absolute;top:0;left:50%;width:100%;transform:translate(-50%);padding:1rem 0;background:#30bf74;color:#fff;z-index:-1;transition:all 0.2s;text-align:center;white-space:nowrap}.skills-tab-container ul li .tooltip img{width:64px;height:64px}.skills-tab-container ul li .tooltip:hover .tooltiptext{top:-50%}.projects{text-align:center;display:flex;justify-content:space-between;align-items:center;flex-direction:column}.projects-container{display:grid;grid-template-columns:repeat(3, 300px);gap:3rem}.projects-container .box{width:100%;height:250px;box-shadow:0 10px 20px rgba(0,0,0,0.288);border-radius:23px;display:flex;justify-content:space-between;align-items:center;justify-content:center;flex-direction:column;color:white;position:relative;overflow:hidden;background:#242431;z-index:1000}.projects-container .box img{width:100px;height:100px;border-radius:50px;object-fit:contain;background:#e8ebee}.projects-container .box .project_name{margin-top:5px;margin-bottom:5px;font-size:1.5rem}.projects-container .box .project_desc{color:rgba(255,255,255,0.555)}.projects-container .box .arr_container,.projects-container .box .cancel{display:flex;justify-content:space-between;align-items:center;justify-content:center;position:absolute;width:50px;height:50px;background:white;bottom:0;right:0;border-radius:23px 0 23px 0;color:#464646;font-size:1.6rem;cursor:pointer;transition:all 0.4s}.projects-container .box .arr_container i{transform:rotate(45deg)}.projects-container .box .active_arr{transform:translate(80%, 80%)}.projects-container .box .left_container{position:absolute;background:#0f2027;width:100%;height:100%;border-radius:23px;padding:50px 0 0 0;transition:all 0.4s}.projects-container .box .off{transform:translate(-80%, -80%) rotate(90deg)}.projects-container .box .active{transform:translate(0) rotate(0)}.projects-container .box .left_container p{margin-bottom:15px;font-size:1.2rem}.projects-container .box .left_container .techs div{display:inline-block;color:#9b9b9b;border:1px solid #9b9b9b;padding:5px 10px;font-size:0.9rem;margin:4px 4px 4px 0}.projects-container .box .left_container .links{font-size:1.6rem;margin-top:10px}.projects-container .box .left_container .links i{color:#cfcfcf;cursor:pointer;margin-right:10px;transition:all 0.4s}.projects-container .box .left_container .links i:hover{color:#2c5364}.about{text-align:center;display:flex;justify-content:space-between;align-items:center;flex-direction:column}.about-content p{margin:0 auto;width:80%;font-size:1.3rem;line-height:1.5}footer{margin:0 auto;margin-top:5rem;text-align:center}footer .contact-details{margin-top:2rem}footer .social-links{margin:2rem auto;width:50%}footer .social-links .circle{border:#242431 1px solid}footer .social-links .circle a{color:#242431}footer .social-links .circle:hover{border:#30bf74 1px solid;background:#30bf74}footer .social-links .circle:hover a{color:#fff}@media only screen and (max-width: 1024px){h1{font-size:2.5rem;white-space:pre-wrap}h6{font-size:1rem}#open-btn{display:inline-block}#close{display:block}header nav .nav-menu{margin:0 auto;position:absolute;top:-1000%;left:50%;padding:2rem;width:90%;transform:translate(-50%);z-index:5;background:#fff;transition:all 0.2s}header nav .nav-menu ul{flex-direction:column;align-items:flex-end}header nav .nav-menu ul li{margin-bottom:3.5rem}header nav .nav-menu ul a{color:rgba(0,0,0,0.8);font-size:1.3rem}header nav .nav-menu ul a:hover{text-shadow:none}header nav .nav-menu ul li:last-child a{padding:0;border:none}header nav .nav-menu ul li:last-child a:hover{background:#fff;color:#30bf74}header nav .nav-menu.open{top:10%}.skills-tab-container ul{grid-template-columns:repeat(2, 100px);gap:2.5rem}.projects-container{grid-template-columns:repeat(1, 300px);gap:3rem}footer .social-links{margin:2rem auto;width:80%}footer .social-links .circle{border:#242431 1px solid}footer .social-links .circle a{color:#242431}footer .social-links .circle:hover{border:#30bf74 1px solid;background:#242431}footer .social-links .circle:hover a{color:#fff}}
