:root{--font-family: "Montserrat", Arial, sans-serif;--font-1st-color: #fdfeff;--font-2nd-color: #282828;--font-3rd-color: #fec544;--bg-general-color: rgb(8, 13, 24);--semi-transparent-yellow: rgba(254, 197, 68, .5);--margin-x_y-body-pc: 3rem 0;--margin-scroll-top-pc: 85px;--margin-x_y-sections-pc: 0 3rem;--margin-profile_frame-pc: 70px 0px 10px;--margin-navbar_links-pc: 0 20px;--margin-logo-container-tablet_mobile: 0 0 0 15px;--margin-scroll-top-tablet: 75px;--margin-navbar_links-tablet: 0 10px;--margin-profile_frame-tablet: 25px 0px 11px;--margin-x_y-body-tablet_mobile: 4.75rem 0;--margin-x_y-sections-mobile: 0 1rem;--margin-scroll-top-mobile: 300px;--margin-navbar_links-mobile: 0;--margin-profile_frame-mobile: 30px 0px 11px;--font-size-p-pc: 1.2rem;--font-size-h1-pc: 2.5rem;--font-size-h2-pc: 5rem;--font-size-h3-pc: 3.1rem;--font-size-h4-pc: 2.8rem;--font-size-h5-pc: 2rem;--font-size-h6-pc: 1.4rem;--font-size-h7-pc: 1.2rem;--font-size-navbar-laptop_L: 1.4rem;--font-size-navbar-laptop_N: 1.2rem;--font-size-navbar-tablet: 1.1rem;--font-size-h1-tablet: 2.1rem;--font-size-h2-tablet: 2.5rem;--font-size-h3-tablet: 2.1rem;--font-size-p-mobile: .8rem;--font-size-h1-mobile: 1.8rem;--font-size-h2-mobile: 2.5rem;--font-size-h3-mobile: 1.8rem;--font-size-h4-mobile: 1.7rem;--font-size-h5-mobile: 1.3rem;--font-size-h6-mobile: 1rem;--font-size-h7-mobile: .9rem;--font-size-navbar-mobile: 1rem;--padding-navbar_links-mobile: .65rem;--img-profile-size-pc: 13vw;--img-profile-size-tablet: 17vw;--img-profile-size-mobile: 36vw}body,html{overflow-x:hidden}body{color:var(--font-1st-color);background-color:var(--bg-general-color);margin:var(--margin-x_y-body-pc);font-size:var(--font-size-p-pc);font-family:var(--font-family)}body h1{font-size:var(--font-size-h1-pc);text-align:center}@media (max-width: 768px){body h1{font-size:var(--font-size-h1-tablet)}}@media (max-width: 426px){body h1{font-size:var(--font-size-h1-mobile)}}body h2{color:var(--font-2nd-color);font-size:var(--font-size-h2-pc);text-transform:uppercase;position:relative;z-index:10;letter-spacing:1px}@media (max-width: 426px){body h2{font-size:var(--font-size-h2-mobile)}}body h3{color:var(--font-3rd-color);font-size:var(--font-size-h3-pc);text-transform:uppercase;position:relative;top:-67px;z-index:15;letter-spacing:1px}@media (max-width: 768px){body h3{top:-67px}}@media (max-width: 426px){body h3{font-size:var(--font-size-h3-mobile);top:-37px}}body h4{font-size:var(--font-size-h4-pc)}body h5{font-size:var(--font-size-h5-pc);color:var(--font-3rd-color)}body h6{font-size:var(--font-size-h6-pc);font-weight:700}body h7{font-size:var(--font-size-h7-pc);font-weight:700}body h1,body h2,body h3{text-align:center}body .sections{margin:2.5rem 0}body .btn-warning{background-color:var(--font-3rd-color)!important;color:var(--bg-general-color)!important}@media (max-width: 768px){body{margin:var(--margin-x_y-body-tablet_mobile)}}@media (max-width: 426px){body h4{font-size:var(--font-size-h4-mobile)}body h5{font-size:var(--font-size-h5-mobile)}body h6{font-size:var(--font-size-h6-mobile)}body h7{font-size:var(--font-size-h7-mobile)}body p{font-size:var(--font-size-p-mobile)}}[id]{scroll-margin-top:var(--margin-scroll-top-pc)}@media (max-width: 768px){[id]{scroll-margin-top:var(--margin-scroll-top-tablet)}}@media (max-width: 426px){[id]{scroll-margin-top:var(--margin-scroll-top-mobile)}}#navbar-container{font-size:var(--font-size-navbar-laptop_L)}@media (max-width: 1024px){#navbar-container{font-size:var(--font-size-navbar-laptop_N)}}@media (max-width: 768px){#navbar-container{font-size:var(--font-size-navbar-tablet)}}@media (max-width: 426px){#navbar-container{flex-direction:column;align-items:stretch;font-size:var(--font-size-navbar-mobile)}}#navbar-container #logo-container{justify-content:center}#navbar-container #logo-container img{width:80px;height:70px}@media (max-width: 768px){#navbar-container #logo-container img{max-width:70px;max-height:60px}}@media (max-width: 768px){#navbar-container #logo-container{justify-content:space-between;margin:var(--margin-logo-container-tablet_mobile)}}#navbar-container #navbar-toggler{margin-right:25px;width:50px;height:50px}#navbar-container #navbar-links li{margin:var(--margin-navbar_links-pc)}@media (max-width: 768px){#navbar-container #navbar-links li{margin:var(--margin-navbar_links-tablet)}}@media (max-width: 246px){#navbar-container #navbar-links li{margin:var(--margin-navbar_links-mobile)}}#navbar-container #navbar-links .nav-link.active{color:var(--font-3rd-color)!important;border-bottom:2px solid var(--font-3rd-color)}#navbar-container #navbar-links a{color:var(--font-1st-color);font-weight:700}#navbar-container #navbar-links a:hover{color:var(--semi-transparent-yellow)}@media (max-width: 425px){#navbar-container #navbar-links a{padding-left:var(--padding-navbar_links-mobile)}}#navbar-container #navbar-links #social{display:flex;gap:30px;justify-content:flex-end}#navbar-container #navbar-links #social a:hover i{transform:scale(1.3);transition:transform .3s ease}@media (max-width: 768px){#navbar-container #navbar-links #social{gap:20px;margin:0}}@media (max-width: 426px){#navbar-container #navbar-links #social{margin-right:35px}#navbar-container #navbar-links #social i:first-child{margin-left:10px}}@media (max-width: 426px){#navbar-container #navbar-links{max-height:0;overflow:hidden;opacity:0;transition:max-height .5s ease,opacity 2s ease}}#navbar-container #navbar-links.collapse.show{max-height:500px;opacity:1;transition:max-height 1s ease,opacity 2s ease}main{position:relative}main .btn{background-color:var(--font-3rd-color);color:var(--bg-general-color);border:none;padding:10px 20px;cursor:pointer;border-radius:15px}main #introduction-container{flex-direction:column;align-items:center;height:500px;background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed}main #introduction-container #img-profile-frame{margin:var(--margin-profile_frame-pc);width:var(--img-profile-size-pc);max-width:160px;border-radius:40%;border:5px solid #1f232d;overflow:hidden;display:flex;justify-content:center;align-items:center}main #introduction-container #img-profile-frame img{width:100%;-o-object-fit:cover;object-fit:cover}@media (max-width: 768px){main #introduction-container #img-profile-frame{width:var(--img-profile-size-tablet);margin:var(--margin-profile_frame-tablet)}}@media (max-width: 426px){main #introduction-container #img-profile-frame{width:var(--img-profile-size-mobile);max-width:130px;margin:var(--margin-profile_frame-mobile)}}main #introduction-container #introduction-header{color:var(--font-1st-color)}main #introduction-container #introduction-text{text-align:center;margin:0 7rem}main #introduction-container #introduction-text span{color:var(--font-3rd-color);display:inline-block;opacity:0;transform:translate(-50px);animation:fadeInFromLeft 3s forwards}@media (max-width: 1024px){main #introduction-container #introduction-text span{transform:translateY(-50px);animation:fadeInFromTop 3s forwards}}@media (max-width: 768px){main #introduction-container #introduction-text{margin:0 .5rem}}@media (max-width: 768px){main #introduction-container{height:400px}}@media (max-width: 426px){main #introduction-container{height:450px}}main #about-container #about-header{height:100px;margin-bottom:15px}@media (max-width: 426px){main #about-container #about-header{height:60px;margin-bottom:10px}}main #about-container #about-content{margin:0 1em;display:flex}main #about-container #about-content p{margin:0 1em}main #about-container #about-content #about-content-col1 img,main #about-container #about-content #about-content-col2 img{border-radius:30px;box-shadow:5px 5px 10px #757575;min-height:325px}@media (max-width: 375px){main #about-container #about-content #about-content-col1 #personal-info,main #about-container #about-content #about-content-col2 #personal-info{flex-direction:column}}main #about-container #about-content #about-content-col1{display:flex;justify-content:center;align-items:center;position:relative;opacity:0;transform:translate(-230px);animation:fadeInFromLeft 3s forwards;animation-play-state:paused}main #about-container #about-content #about-content-col2{position:relative;opacity:0;transform:translate(230px);animation:fadeInFromRight 3s forwards;animation-play-state:paused}main #about-container #about-content #about-content-col2 table{margin:0 1em;border-collapse:separate;border-spacing:0 20px}main #about-container #about-content #about-content-col2 table .colon{padding:0 10px 0 15px}@media (max-width: 768px){main #about-container #about-content #about-content-col2 p{margin:.5rem 0}main #about-container #about-content #about-content-col2 table{margin:0}}@media (max-width: 768px){main #about-container #about-content{flex-direction:column}main #about-container #about-content img{min-width:300px;min-height:225px}}@media (max-width: 426px){main #about-container #about-content{margin:.5rem}main #about-container #about-content img{max-width:80%}main #about-container #about-content #about-content-col2{margin-left:10px;font-size:small}main #about-container #about-content #about-content-col2 table{display:flex;justify-content:center}}main #cv-box{margin:0 15px;position:inline-block;opacity:0;transform:translateY(-70px);animation:fadeInFromTop 3s forwards;animation-play-state:paused}main #cv-box .cv-box-heading{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:25px}main #cv-box .cv-box-heading h4{margin:0}main #cv-box .cv-box-text>*:not(.fa-circle):not(button){margin-left:15px}main #cv-box .cv-box-text ul{margin:15px;padding:0}main #cv-box .fa-circle{position:relative;left:-10px;top:40px}main #cv-box .cv-box-content{margin-left:7px}main #cv-box .cv-box-content .cv-box-text{margin:0 0 0 11px;padding-bottom:50px;border-left:3px solid var(--font-3rd-color)}main #cv-box .cv-box-content .cv-box-text button{margin:0 0 5px}main #cv-box .cv-box-content .cv-box-text h5{margin-left:15px}main #cv-box .cv-box-content .cv-box-text .cv-text-desc a{color:var(--font-3rd-color)}main #cv-box .cv-box-content .cv-box-text time{font-size:1.3rem;font-style:italic}main #cv-box .cv-box-content .cv-box-text p{margin:10px 0 0}@media (max-width: 768px){main #cv-box{margin-left:30px}main #cv-box #cv-col-right{margin-top:50px}}@media (max-width: 426px){main #cv-box{padding-left:0;margin-left:0}main #cv-box>*{padding:5px}main #cv-box .cv-box-content .cv-box-text time{font-size:1.1rem;display:block}main #cv-box .fa-circle{top:33px}}main #contact-container h5{text-align:center}main #contact-container form input,main #contact-container form textarea{color:#fdfeff;border-color:#7e7567;background-color:var(--font-2nd-color)}main #contact-container form input::-moz-placeholder,main #contact-container form textarea::-moz-placeholder{color:#afa9a2}main #contact-container form input::placeholder,main #contact-container form textarea::placeholder{color:#afa9a2}main #contact-container form input:focus,main #contact-container form textarea:focus{border:2px solid var(--font-3rd-color)}main #contact-container form input{min-height:45px}main #contact-container form textarea{min-height:150px}main #contact-container #contact-info table{border-spacing:0 30px;border-collapse:separate}main #contact-container #contact-info table tr:hover .st-icon{border:1px solid var(--font-3rd-color)}main #contact-container #contact-info .st-icon{display:flex;justify-content:center;align-items:center;border:.5px solid #3f4551;border-radius:50%;background-color:#070d1b;width:60px;height:60px;transition:all .4s ease}main #contact-container #contact-info p{margin:0}main #contact-container #contact-info a{text-decoration:none;color:var(--font-1rs-color)}@media (max-width: 426px){main #contact-container #contact-info{margin-top:30px}}main #projects-container a{color:var(--font-1st-color);text-decoration:none}main #projects-container h5{text-align:center}main #projects-container .projects-cards{display:flex;flex-wrap:wrap;padding:0 15px;gap:10px;row-gap:50px;justify-content:space-around}main #projects-container .projects-cards .card{padding:0;border:none;max-width:30vw}main #projects-container .projects-cards .card:hover{transform:scale(1.05);transition:transform .3s ease}main #projects-container .projects-cards .card img{max-width:inherit;max-height:30vw}@media (max-width: 768px){main #projects-container .card{min-width:300px}main #projects-container img{min-width:inherit;min-height:300px}}@media (max-width: 426px){main #projects-container .card{min-width:290px}main #projects-container img{min-width:inherit;min-height:290px}}@keyframes fadeInFromLeft{to{opacity:1;transform:translate(0)}}@keyframes fadeInFromTop{to{opacity:1;transform:translateY(0)}}@keyframes fadeInFromRight{to{opacity:1;transform:translate(0)}}
