body {background-color: #111;background-size: cover;background-position: center;}.section-title h2, .section-title p {font-family: Poppins, sans-serif;text-transform: uppercase }.menu-btn, .wrapper {position: fixed;transition: .2s ease-in-out }.menu, li {display: flex;flex-direction: column;}.portfolio .portfolio-wrap .portfolio-links a:hover, ul li a {color: #f00 }.portfolio #portfolio-flters li, .section-title h2, .section-title p, ul li a, ul li::after {text-transform: uppercase }.portfolio .portfolio-item {margin-bottom: 30px }.portfolio #portfolio-flters {padding: 2px 15px;margin: 0 auto 15px;list-style: none;text-align: center;border-radius: 50px }.portfolio #portfolio-flters li {display: inline-block;padding: 8px 16px 10px;font-size: 14px;font-weight: 600;line-height: 1;color: #fff;background: rgba(255, 255, 255, .1);margin: 0 3px 10px;transition: .3s ease-in-out;border-radius: 4px }.portfolio #portfolio-flters li.filter-active, .portfolio #portfolio-flters li:hover {background: #f00 }.portfolio #portfolio-flters li:last-child {margin-right: 0 }.portfolio .portfolio-wrap {transition: .3s;position: relative;overflow: hidden;z-index: 1;background: rgba(0, 0, 0, .6) }.portfolio .portfolio-wrap::before {content: "";background: rgba(0, 0, 0, .6);position: absolute;left: 30px;right: 30px;top: 30px;bottom: 30px;transition: .3s ease-in-out;z-index: 2;opacity: 0 }.portfolio .portfolio-wrap .portfolio-info {opacity: 0;position: absolute;top: 0;left: 0;right: 0;bottom: 0;text-align: center;z-index: 3;transition: .3s ease-in-out;display: flex;flex-direction: column;justify-content: center;align-items: center }.portfolio .portfolio-wrap .portfolio-info::before {display: block;content: "";width: 48px;height: 48px;position: absolute;top: 35px;left: 35px;border-top: 3px solid #fff;border-left: 3px solid #fff;transition: .5s;z-index: 9994 }.portfolio .portfolio-wrap .portfolio-info::after {display: block;content: "";width: 48px;height: 48px;position: absolute;bottom: 35px;right: 35px;border-bottom: 3px solid #fff;border-right: 3px solid #fff;transition: .5s;z-index: 9994 }.portfolio .portfolio-wrap .portfolio-info h4 {font-size: 20px;color: #fff;font-weight: 600 }.portfolio .portfolio-wrap .portfolio-info p {color: #fff;font-size: 14px;text-transform: uppercase;padding: 0;margin: 0 }.portfolio .portfolio-wrap .portfolio-links {text-align: center;z-index: 4 }.portfolio .portfolio-wrap .portfolio-links a {color: #fff;margin: 0 2px;font-size: 28px;display: inline-block;transition: .3s }.portfolio .portfolio-wrap:hover::before {top: 0;left: 0;right: 0;bottom: 0;opacity: 1 }.portfolio .portfolio-wrap:hover .portfolio-info {opacity: 1 }.portfolio .portfolio-wrap:hover .portfolio-info::before {top: 15px;left: 15px }.portfolio .portfolio-wrap:hover .portfolio-info::after {bottom: 15px;right: 15px }.portfolio-details {padding-top: 40px;background: rgba(0, 0, 0, .8);position: fixed;left: 0;right: 0;top: 0;bottom: 0;overflow-y: auto }.portfolio-details .container {padding-top: 20px;padding-bottom: 40px }.portfolio-details .portfolio-title {font-size: 26px;font-weight: 700;margin-bottom: 20px }.portfolio-details .portfolio-info {padding-top: 45px }.portfolio-details .portfolio-info h3 {font-size: 22px;font-weight: 400;margin-bottom: 20px }.portfolio-details .portfolio-info ul {list-style: none;padding: 0;font-size: 15px }.portfolio-details .portfolio-info ul li+li {margin-top: 10px }.portfolio-details .portfolio-info p {font-size: 15px;padding: 15px 0 0 }@media (max-width:992px) {.portfolio-details .portfolio-info {padding-top: 20px }}.portfolio-details .swiper-pagination {margin-top: 20px;position: relative }.portfolio-details .swiper-pagination .swiper-pagination-bullet {width: 12px;height: 12px;opacity: 1;background-color: rgba(255, 255, 255, .3) }.portfolio-details .swiper-pagination .swiper-pagination-bullet-active {background-color: #f00 }.section-title h2 {font-size: 14px;font-weight: 500;padding: 0;line-height: 1px;margin: 60px 0 20px;letter-spacing: 2px;color: #aaa }#active:checked~.menu-btn, .menu-btn {color: #fff }.section-title h2::after {content: "";width: 120px;height: 1px;display: inline-block;background: #f00;margin: 4px 10px }.section-title p {margin: -15px 0 15px;font-size: 36px;font-weight: 700;color: #fff }.wrapper {top: 0;left: 0;height: 100vh;width: 100%;background-color: rgba(0, 0, 0, 0.9);backdrop-filter: blur(10px);background-position: center;background-repeat: no-repeat;background-size: cover;clip-path: circle(25px at calc(100% - 45px) 45px) }#active:checked~.wrapper {clip-path: circle(75%);z-index: 100 }.menu-btn {top: 20px;right: 20px;z-index: 200;height: 50px;width: 50px;text-align: center;line-height: 50px;border-radius: 50%;font-size: 20px;border: none;background-color: #f00 }.fa-bars {margin-top: 15px }#active:checked~.menu-btn i:before {content: "\f00d";z-index: 100 }.menu {height: 100vh;justify-content: center;align-items: center }ul {text-align: center }li {list-style: none;margin: 9px auto }ul li a {text-decoration: none;font-weight: 800;letter-spacing: 4px;border-radius: 20px;display: inline-block;transition: .5s;position: absolute;font-size: 45px;left:50%;transform:translate(-50%);color: #f00 }ul li a:hover {transform: scale(1.5);opacity: 1;color: #f00 }.link1{padding-bottom:75px}ul:hover li a {opacity: 0;color: #f00 }ul li::after {content: attr(data-text);-webkit-text-stroke: 1px #fff;color: transparent;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);font-size: 80px;font-weight: 900;opacity: 0;pointer-events: none;letter-spacing: 50px;transition: .5s }ul li:hover:after {opacity: .5;letter-spacing: 5px }input[type=checkbox] {display: none }@keyframes rotate {0% {filter: hue-rotate(0deg) }100% {filter: hue-rotate(360deg) }}@keyframes wipe-enter {0% {transform: scale(0, .025) }50% {transform: scale(1, .025) }}.cv {width: 220px;height: 46px;background-color: #f00;color: #fff;border-radius: 999px;text-align: center;font-weight: bold;border: none;position:absolute;left:50%;transform: translate(-50%);}.cv:hover {background: transparent;border: none;box-shadow: 0 0 20px #f00;}.fa-download {padding: 5px;color: rgb(255 23 23);background-color: #fff;border-radius: 50%;font-size: 12px; }@media screen and (max-width:750px) {.wrapper ul{position:absolute;top:180px;}.cv{position:absolute;top:450px;margin-left:5px}.wrapper{padding-left:10px}}