@import url(https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap);
*,
ul {
    margin: 0;
    padding: 0
}

body,
p {
    line-height: 26px
}

.button:focus,
a,
a:focus,
a:hover {
    text-decoration: none
}

*,
ul {
    padding: 0
}

.px-doubble-effect i,
.px-doubble-effect span {
    overflow: hidden;
    position: relative
}

.bf-about-video video,
.px-step-video video {
    mix-blend-mode: multiply
}

.back-to-top-wrapper,
.transition-3,
a,
button,
input,
li,
p,
select,
textarea {
    -webkit-transition: .3s ease-out;
    -moz-transition: .3s ease-out;
    -ms-transition: .3s ease-out;
    -o-transition: .3s ease-out;
    transition: .3s ease-out
}

.back-to-top-btn svg,
.postbox__comment-reply a span,
.px-contact-inf-social a span,
.tp-team-details-info-contact a svg {
    -webkit-transform: translateY(-2px);
    -moz-transform: translateY(-2px);
    -ms-transform: translateY(-2px);
    -o-transform: translateY(-2px);
    transform: translateY(-2px)
}

@font-face {
    font-family: 'Power Grotesk';
    src: url('../../assets/fonts/PowerGrotesk-Regular.ttf') format('ttf'), url('../../assets/fonts/PowerGrotesk-Regular.ttf') format('ttf');
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'Power Grotesk';
    src: url('../../assets/fonts/PowerGrotesk-Regular.ttf') format('ttf'), url('../../assets/fonts/PowerGrotesk-Regular.ttf') format('ttf');
    font-weight: 700;
    font-style: normal
}

:root {
    --tp-ff-body: 'Inter', sans-serif;
    --tp-ff-inter: 'Inter', sans-serif;
    --tp-ff-heading: 'Inter', sans-serif;
    --tp-ff-p: 'Inter', sans-serif;
    --tp-ff-thunder: 'Thunder', sans-serif;
    --tp-ff-thundermed: 'ThunderMed', sans-serif;
    --tp-ff-morganite-bold: 'Morganite-Bold', sans-serif;
    --tp-ff-fontawesome: "Font Awesome 6 Pro";
    --tp-common-px-white: #FFFFFF;
    --tp-common-px-black: #0A0A0A;
    --tp-common-px-black-2: #1E1E1E;
    --tp-common-px-red: #000;
    --tp-common-px-orange: #000;
    --tp-common-px-orange-dark: #000;
    --tp-grey-px-1: #F6F7F9;
    --tp-text-px-body: #6D6868;
    --tp-theme-px-1: #FF5E00;
    --tp-border-px-1: #EAEBED;
    --numOfSlides: 5;
    --slidingAT: 1.3s;
    --controlSize: 60px
}

* {
    box-sizing: border-box
}

html {
    scroll-behavior: smooth
}

body {
    font-size: 18px;
    font-weight: 400;
    color: var(--tp-text-px-body);
    font-family: Montserrat !important
}

.hover-reveal-item .des-text-reveal-img img,
.m-img img,
img {
    max-width: 100%
}

.text-effect a,
.text-effect span {
    display: inline-block;
    color: inherit;
    font-weight: inherit;
    letter-spacing: normal
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    font-weight: 500;
    line-height: 1.2;
    -webkit-transition: color .3s ease-out;
    -moz-transition: color .3s ease-out;
    -ms-transition: color .3s ease-out;
    -o-transition: color .3s ease-out;
    transition: color .3s ease-out;
    color: var(--tp-common-px-black);
    font-family: Montserrat
}

h1 {
    font-size: 40px
}

h2 {
    font-size: 50px
}

h3 {
    font-size: 28px
}

h4 {
    font-size: 24px
}

h5 {
    font-size: 20px
}

h6 {
    font-size: 16px
}

p {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 10px;
    font-family: var(--tp-ff-p);
    color: #000
}

a:not([href]):not([class]),
a:not([href]):not([class]):hover {
    color: inherit;
    text-decoration: none
}

.button:focus,
a:focus {
    outline: 0
}

a:focus,
a:hover {
    color: #ec4f62
}

a,
button {
    color: #fff;
    outline: 0;
    border: none;
    background: 0 0
}

button:hover {
    cursor: pointer
}

button:focus {
    outline: 0
}

.uppercase {
    text-transform: uppercase
}

.capitalize,
.px-breadcrumb-list span,
.px-inner-service-2-heading .px-btn-border,
.tp-dropcap::first-letter {
    text-transform: capitalize
}

.px-btn-black,
.px-btn-border,
.px-btn-zikzak,
.px-portfolio-details-btn,
.tp-btn-yellow-border {
    text-transform: uppercase
}

input[type=email],
input[type=number],
input[type=password],
input[type=tel],
input[type=text],
input[type=url],
textarea {
    outline: 0;
    height: 56px;
    width: 95%;
    line-height: 56px;
    font-size: 14px;
    padding-left: 26px;
    padding-right: 26px;
    color: var(--tp-common-px-black);
    border: 1px solid var(--tp-common-px-black);
    background-color: var(--tp-common-px-white)
}

input[type=email]::-webkit-input-placeholder,
input[type=number]::-webkit-input-placeholder,
input[type=password]::-webkit-input-placeholder,
input[type=tel]::-webkit-input-placeholder,
input[type=text]::-webkit-input-placeholder,
input[type=url]::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: var(--tp-common-px-black)
}

input[type=email]::-moz-placeholder,
input[type=number]::-moz-placeholder,
input[type=password]::-moz-placeholder,
input[type=tel]::-moz-placeholder,
input[type=text]::-moz-placeholder,
input[type=url]::-moz-placeholder,
textarea::-moz-placeholder {
    color: var(--tp-common-px-black)
}

input[type=email]:-moz-placeholder,
input[type=number]:-moz-placeholder,
input[type=password]:-moz-placeholder,
input[type=tel]:-moz-placeholder,
input[type=text]:-moz-placeholder,
input[type=url]:-moz-placeholder,
textarea:-moz-placeholder {
    color: var(--tp-common-px-black)
}

input[type=email]:-ms-input-placeholder,
input[type=number]:-ms-input-placeholder,
input[type=password]:-ms-input-placeholder,
input[type=tel]:-ms-input-placeholder,
input[type=text]:-ms-input-placeholder,
input[type=url]:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    color: var(--tp-common-px-black)
}

input[type=email]::placeholder,
input[type=number]::placeholder,
input[type=password]::placeholder,
input[type=tel]::placeholder,
input[type=text]::placeholder,
input[type=url]::placeholder,
textarea::placeholder {
    color: var(--tp-common-px-black)
}

.bf-contact-us-form .tp-input:focus,
.design-award-item:hover,
.design-footer-widget-input input:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=tel]:focus,
input[type=text]:focus,
input[type=url]:focus,
textarea:focus {
    border-color: var(--tp-common-px-black)
}

input[type=email]:focus::placeholder,
input[type=number]:focus::placeholder,
input[type=password]:focus::placeholder,
input[type=tel]:focus::placeholder,
input[type=text]:focus::placeholder,
input[type=url]:focus::placeholder,
textarea:focus::placeholder {
    opacity: 0
}

textarea {
    line-height: 1.4;
    padding-top: 17px;
    padding-bottom: 17px
}

input[type=color] {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background: 0 0;
    border: 0;
    cursor: pointer;
    height: 100%;
    width: 100%;
    padding: 0;
    border-radius: 50%
}

.back-to-top-btn,
.back-to-top-wrapper {
    width: 44px;
    height: 44px;
    border-radius: 50%
}

::-moz-selection {
    background: var(--tp-common-px-black);
    color: var(--tp-common-px-white);
    text-shadow: none
}

::selection {
    background: var(--tp-common-px-black);
    color: var(--tp-common-px-white);
    text-shadow: none
}

.back-to-top-btn,
.px-btn-white {
    color: var(--tp-common-px-black)
}

::-moz-placeholder {
    color: var(--tp-common-px-black);
    font-size: 14px;
    opacity: 1
}

::placeholder {
    color: var(--tp-common-px-black);
    font-size: 14px;
    opacity: 1
}

.bf-service-accordion-wrap .accordion-buttons,
.des-footer-bottom a:hover::after,
.px-btn-slide:hover::before,
.px-service-accordion-wrap .accordion-buttons,
.px-video-4-wrap video,
.w-img img {
    width: 100%
}

.fix,
.inner-service-1-thumb .tp--hover-img,
.px-hero-2-item.active .px-hero-2-content,
.px-pd-2-slider-thumb {
    overflow: hidden
}

.clear {
    clear: both
}

.bf-service-accordion-wrap .accordion .accordion-items,
.bf-service-item-3-slider,
.in-blog-list-search-input,
.p-relative,
.px-3d-anim,
.px-footer-3-input,
.px-line-lr,
.px-service-6-slide-wrap,
.px-service-accordion-wrap .accordion .accordion-items,
.sidebar-search,
.tp-offcanvas-menu ul li,
.z-index-1 {
    position: relative
}

.px-step-content,
.z-index-2 {
    position: relative;
    z-index: 2
}

.z-index-3 {
    position: relative;
    z-index: 3
}

.z-index-4 {
    position: relative;
    z-index: 4
}

.z-index-5 {
    position: relative;
    z-index: 5
}

.z-index-6 {
    position: relative;
    z-index: 6
}

.z-index-7 {
    position: relative;
    z-index: 7
}

.z-index-8 {
    position: relative;
    z-index: 8
}

.z-index-9 {
    position: relative;
    z-index: 9
}

.z-index-10 {
    position: relative;
    z-index: 10
}

.gx-10 {
    --bs-gutter-x: 10px
}

.gx-20 {
    --bs-gutter-x: 20px
}

.gx-30 {
    --bs-gutter-x: 30px
}

.gx-40 {
    --bs-gutter-x: 40px
}

.gx-45 {
    --bs-gutter-x: 45px
}

.gx-50 {
    --bs-gutter-x: 50px
}

.gx-60 {
    --bs-gutter-x: 60px
}

.gx-70 {
    --bs-gutter-x: 70px
}

.gx-80 {
    --bs-gutter-x: 80px
}

.gx-90 {
    --bs-gutter-x: 90px
}

.gx-100 {
    --bs-gutter-x: 100px
}

.overflow-y-visible {
    overflow-x: hidden;
    overflow-y: visible
}

.p-absolute {
    position: absolute
}

.bg-position,
.include-bg {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat
}

.tp-dropcap::first-letter {
    float: left;
    width: 65px;
    height: 85px;
    font-size: 90px;
    line-height: .8;
    font-weight: 500;
    margin-right: 5px;
    text-align: center;
    line-height: inherit;
    color: var(--tp-common-white);
    font-family: var(--tp-ff-body)
}

.slide-transtion {
    -webkit-transition-timing-function: linear;
    transition-timing-function: linear
}

.slide-transtion .swiper-slide {
    width: auto
}

.px-line-black {
    display: inline;
    transition: .3s linear;
    background-repeat: no-repeat;
    background-size: 0 1px, 0 1px;
    background-position: 100% 100%, 0 100%;
    background-image: linear-gradient(currentcolor, currentcolor), linear-gradient(currentcolor, currentcolor)
}

.px-line-black:hover {
    background-size: 0 1px, 100% 1px
}

.back-to-top-wrapper {
    position: fixed;
    right: 50px;
    bottom: 0;
    cursor: pointer;
    display: block;
    z-index: 99;
    opacity: 0;
    visibility: hidden
}

.back-to-top-wrapper.back-to-top-btn-show {
    visibility: visible;
    opacity: 1;
    bottom: 50px
}

.back-to-top-btn {
    display: inline-block;
    line-height: 44px;
    text-align: center;
    background: var(--tp-common-px-white);
    box-shadow: 0 8px 16px rgba(3, 4, 28, .3);
    -webkit-transition: .3s ease-out;
    -moz-transition: .3s ease-out;
    -ms-transition: .3s ease-out;
    -o-transition: .3s ease-out;
    transition: .3s ease-out
}

.back-to-top-btn:hover {
    -webkit-transform: translateY(-4px);
    -moz-transform: translateY(-4px);
    -ms-transform: translateY(-4px);
    -o-transform: translateY(-4px);
    transform: translateY(-4px)
}

.px-btn-white {
    border-radius: 50px;
    padding: 21px 43px;
    font-weight: 600;
    font-size: 18px;
    line-height: 1;
    transition: .3s;
    display: inline-block;
    background-color: var(--tp-common-px-white)
}

.dropdown-black-bg .px-megamenu-title,
.pixora-dark .in-team-hero-title,
.pixora-dark .inner-service-1-category-item span,
.pixora-dark .inner-service-1-left>span,
.pixora-dark .inner-service-1-text p,
.pixora-dark .px-inner-service-title,
.pixora-dark .px-section-subtitle,
.pixora-dark .px-team-details-style .tp-team-details-text-title,
.pixora-dark .px-team-title,
.pixora-dark .px-text-inner-studio .studio-hero-banner-text span,
.pixora-dark .td-hero-title,
.pixora-dark .tp-team-details-info-contact a,
.pixora-dark .tp-team-details-more ul li,
.pixora-dark .tp-team-details-more-title,
.pixora-dark .tp-team-details-progress-title,
.px-about-4-link:hover,
.px-btn-slide:hover,
.px-btn-zikzak,
.px-btn-zikzak:hover,
.px-copyright-3-text p a,
.px-header-menu.tp-header-dropdown nav ul li.has-dropdown>a::after,
.px-section-subtitle.white-style,
.px-section-title.white-style,
.px-service-4-item:hover .px-service-4-content span,
.px-service-4-item:hover .px-service-4-title,
.tp-btn-px:hover,
.tp-btn:hover,
.tp-offcanvas-wrapper.offcanvas-black-bg .tp-menu-close i,
.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-close-btn,
.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-contact ul li a:hover,
.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-menu ul li>a,
.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-title,
.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-title.sm {
    color: var(--tp-common-px-white)
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-btn-white {
        padding: 18px 30px
    }
}

.design-footer-widget-input-icon:hover,
.pixora-dark .px-btn-black:hover,
.px-btn-white:hover,
.px-footer-widget-menu ul li a:hover,
.px-footer-widget-social a:hover {
    color: var(--tp-common-px-white);
    background-color: var(--tp-common-px-red)
}

.px-btn-zikzak {
    display: inline-block;
    font-weight: 700;
    font-size: 30px;
    line-height: .93;
    font-family: var(--tp-ff-thunder)
}

.px-btn-zikzak .btn-text {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    transform: translate(-50%, -50%)
}

.px-btn-zikzak .btn-text.text-pos-1 {
    top: 56%
}

.px-btn-zikzak .btn-icon {
    display: block;
    margin-bottom: 5px
}

.px-btn-zikzak .zikzak-bg {
    display: inline-block;
    animation: 10s cubic-bezier(1, .99, .03, .01) infinite rotate_anim
}

.px-btn-zikzak:hover .zikzak-bg {
    animation-play-state: paused
}

.px-btn-border {
    font-weight: 500;
    font-size: 17px;
    line-height: 1;
    padding: 13px 35px;
    border-radius: 70px;
    display: inline-block;
    letter-spacing: -.06em;
    background-color: #fefff8;
    color: var(--tp-common-px-black);
    border: 1px solid rgba(30, 30, 30, .1)
}

.px-btn-black:hover,
.px-btn-border:hover,
.px-hero-4-scrolldown:hover,
.px-project-3-category span:hover {
    color: var(--tp-common-px-white);
    border-color: var(--tp-common-px-red);
    background-color: var(--tp-common-px-red)
}

.px-btn-black {
    font-size: 15px;
    font-weight: 600;
    padding: 17px 36px;
    border-radius: 50px;
    display: inline-block;
    letter-spacing: -.6px;
    color: var(--tp-common-px-white);
    background-color: var(--tp-common-px-black)
}

.px-btn-grey,
.px-btn-slide,
.px-header-6-menu nav>ul>li>a {
    font-weight: 500;
    display: inline-block;
    letter-spacing: -.6px
}

.px-btn-black.hover-orange-bg:hover,
.px-btn-grey:hover {
    color: var(--tp-common-px-white);
    border-color: var(--tp-common-px-orange);
    background-color: var(--tp-common-px-orange)
}

.px-btn-slide {
    font-size: 18px;
    z-index: 1;
    position: relative;
    padding: 17px 26px;
    color: var(--tp-common-px-black-2)
}

.px-btn-slide span {
    display: inline-block;
    margin-left: 118px
}

.px-btn-slide::before {
    top: 0;
    left: 0;
    height: 100%;
    width: 3px;
    content: "";
    z-index: -1;
    position: absolute;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    background-color: #ec4f62
}

.px-btn-grey,
.px-header-6-menu nav>ul>li>a {
    font-size: 15px;
    padding: 7px 24px;
    border-radius: 50px;
    background: #f8f8f8;
    text-transform: uppercase;
    color: var(--tp-common-px-black)
}

.tp-btn-px,
.tp-btn-yellow-border {
    font-size: 16px;
    border-radius: 10px;
    letter-spacing: -.01em;
    font-weight: 600;
    line-height: 1
}

.px-doubble-effect {
    display: inline-flex;
    align-items: center
}

.px-doubble-effect i {
    width: 14px;
    height: 14px;
    display: inline-flex;
    margin-left: 7px
}

.px-doubble-effect i svg,
.tp-btn-yellow-border i svg {
    transform: translateY(-2px);
    position: absolute;
    bottom: -1px;
    left: 1px;
    transition: .2s ease-out
}

.px-doubble-effect i svg:last-child,
.tp-btn-yellow-border i svg:last-child {
    left: -12px;
    bottom: -12px;
    transform: translate(0, 0);
    opacity: 0
}

.px-doubble-effect:hover i svg:first-child,
.tp-btn-px:hover i svg:first-child,
.tp-btn-yellow-border:hover i svg:first-child {
    transform: translate(16px, -16px)
}

.px-doubble-effect:hover i svg:last-child,
.tp-btn-px.postbox-btn:hover i svg:last-child,
.tp-btn-yellow-border:hover i svg:last-child {
    opacity: 1;
    visibility: visible;
    transform: translate(13px, -13px)
}

.px-doubble-effect:hover span::after {
    transform: translate(1rem)
}

.px-doubble-effect:hover span::before {
    transform: translate(calc(100% + 1rem))
}

.px-doubble-effect span::after,
.px-doubble-effect span::before {
    content: "";
    position: absolute;
    display: block;
    bottom: .2em;
    width: 100%;
    height: 1px;
    background-color: currentColor;
    transition: transform .5s cubic-bezier(.59, .23, .22, .96)
}

.px-doubble-effect span::before {
    left: 0
}

.px-doubble-effect span::after {
    left: -1rem;
    transform: translate(-100%)
}

.px-line-lr::after {
    position: absolute;
    content: "";
    bottom: 0;
    right: 0;
    height: 1px;
    width: 0;
    transition: .5s;
    background-color: currentColor
}

.px-line-lr:hover::after {
    right: auto;
    left: 0;
    width: 100%
}

.tp-btn-px {
    padding: 18px 24px;
    display: inline-block;
    color: var(--tp-common-px-white);
    background-color: var(--tp-common-px-orange)
}

.tp-btn-yellow-border,
.tp-btn-yellow-border:focus,
.tp-btn-yellow-border:hover {
    color: var(--tp-common-yellow-green)
}

.tp-btn span,
.tp-btn-px span,
.tp-btn-switch span,
.tp-btn-yellow-border span {
    position: relative;
    z-index: 1;
    overflow: hidden;
    display: inline-block
}

.tp-btn-px.postbox-btn i,
.tp-btn-yellow-border i {
    position: relative;
    display: inline-flex;
    margin-left: 7px;
    overflow: hidden
}

.px-contact-wrapper .tp-contact-form-btn button span span.text-1,
.tp-btn span span.text-1,
.tp-btn-px span span.text-1,
.tp-btn-switch span span.text-1,
.tp-btn-yellow-border span span.text-1,
.tp-contact-form-btn button span span.text-1,
.tp-contact-us-btn .tp-btn-yellow-green span span.text-1 {
    position: relative;
    display: block;
    transition: .3s
}

.px-contact-wrapper .tp-contact-form-btn button span span.text-2,
.tp-btn span span.text-2,
.tp-btn-px span span.text-2,
.tp-btn-switch span span.text-2,
.tp-contact-form-btn button span span.text-2,
.tp-contact-us-btn .tp-btn-yellow-green span span.text-2 {
    position: absolute;
    top: 100%;
    display: block;
    transition: .3s
}

.px-contact-wrapper .tp-contact-form-btn button:hover span span.text-1,
.tp-btn-px:hover span span.text-1,
.tp-btn-switch-hover:hover .tp-btn-switch span span.text-1,
.tp-btn:hover span span.text-1,
.tp-contact-form-btn button:hover span span.text-1,
.tp-contact-us-btn .tp-btn-yellow-green:hover span span.text-1 {
    -webkit-transform: translateY(-150%);
    transform: translateY(-150%)
}

.px-contact-wrapper .tp-contact-form-btn button:hover span span.text-2,
.tp-btn-px:hover span span.text-2,
.tp-btn-switch-hover:hover .tp-btn-switch span span.text-2,
.tp-btn:hover span span.text-2,
.tp-contact-form-btn button:hover span span.text-2,
.tp-contact-us-btn .tp-btn-yellow-green:hover span span.text-2 {
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.tp-btn-px.postbox-btn {
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    border-radius: 12px;
    padding: 15.5px 28px
}

.tp-btn-px.postbox-btn i {
    width: 15px;
    height: 15px
}

.tp-btn-px.postbox-btn i svg {
    left: 1px;
    bottom: -1px;
    position: absolute;
    transform: translateY(-2px);
    transition: .2s ease-out
}

.tp-btn-px.postbox-btn i svg:last-child {
    left: -12px;
    bottom: -12px;
    opacity: 0;
    transform: translate(0, 0)
}

.tp-btn-yellow-border {
    padding: 21px 28px;
    display: inline-block;
    border: 1px solid var(--tp-common-yellow-green)
}

.tp-btn-yellow-border span span.text-2 {
    position: absolute;
    bottom: 100%;
    display: block;
    transition: .3s
}

.tp-btn-yellow-border i {
    width: 12px;
    height: 12px
}

.px-portfolio-details-btn,
.tp-btn {
    font-size: 16px;
    display: inline-block
}

.tp-btn-yellow-border.sm {
    font-size: 14px;
    padding: 15px 28px
}

.tp-btn-yellow-border:hover span span.text-1 {
    -webkit-transform: translateY(150%);
    transform: translateY(150%)
}

.tp-btn-yellow-border:hover span span.text-2 {
    bottom: 50%;
    -webkit-transform: translateY(50%);
    transform: translateY(50%)
}

.tp-btn-yellow-border.postbox-btn {
    font-weight: 600;
    font-size: 15px;
    line-height: 1;
    color: #d0ff71;
    padding: 15.5px 28px;
    background: #1a1b1e;
    border: 1px solid #1a1b1e
}

.tp-btn-yellow-border.postbox-btn i {
    width: 15px;
    height: 15px;
    border-radius: 14px
}

.px-portfolio-details-btn {
    font-weight: 600;
    padding: 10px 25px 9px;
    border-radius: 24px;
    letter-spacing: -.16px;
    color: var(--tp-common-px-black);
    border: 1px solid var(--tp-common-px-black)
}

.px-portfolio-details-btn span {
    margin-left: 15px;
    display: inline-block;
    transform: translateY(-2px)
}

.px-portfolio-details-btn:hover {
    color: var(--tp-common-px-white);
    border-color: var(--tp-common-px-black);
    background-color: var(--tp-common-px-black)
}

.bf-team-item:hover .bf-team-thumb::before,
.tp-split {
    opacity: 0
}

.tp-split * {
    will-change: transform
}

.tp-btn {
    font-weight: 500;
    color: var(--tp-common-px-white);
    border-radius: 30px;
    padding: 12px 30px;
    background: #ec4f62
}

.bf-btn-white:hover,
.bf-dark .bf-btn-white-border:hover,
.bf-dark .bf-contact-form .tp-contact-form-input .tp-label,
.bf-header-white.header-sticky .tp-header-search,
.bf-header-white.header-sticky .tp-main-menu nav>ul>li>a,
.design-award-item.active .design-award-content h4,
.design-award-item.active .design-award-content span,
.design-award-item:hover .design-award-content h4,
.design-award-item:hover .design-award-content span,
.dropdown-white-bg nav ul li .tp-submenu li.menu-item-has-children:hover>a::after,
.in-blog-list-search-icon span,
.px-about-5-style .px-about-4-content p span,
.px-about-5-style .px-about-4-link,
.px-about-content p span,
.px-about-link:hover,
.px-about-title span,
.px-contact-info-item-content a:hover,
.px-project-6-item.is-active .px-project-6-content p,
.px-project-6-item.is-active .px-project-6-content span,
.px-project-6-item.is-active .px-project-6-title,
.px-project-6-item.is-active .px-project-inner-wrap-content span,
.px-text-slider-style-3 .px-text-slider-item span,
.reveal-text .char.revealed,
.tp-btn-border,
.tp-btn-border:hover,
.tp-portfolio-mix-slider-navigation.navigation-white .nav-icon {
    color: var(--tp-common-px-black)
}

.tp-btn span span,
.tp-btn-switch span span {
    line-height: 1.3
}

.tp-btn-border {
    border: 1px solid rgba(0, 0, 0, .08);
    background: 0 0
}

@keyframes rotate_anim {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes text_upper {
    0% {
        transform: translateY(0)
    }
    to {
        transform: translateY(-105%)
    }
}

@keyframes text_bottom {
    0% {
        transform: translateY(105%)
    }
    to {
        transform: translateY(0)
    }
}

@keyframes animate-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, .2), 0 0 0 0 rgba(255, 255, 255, .2)
    }
    40% {
        box-shadow: 0 0 0 50px rgba(255, 109, 74, 0), 0 0 0 0 rgba(255, 255, 255, .2)
    }
    80% {
        box-shadow: 0 0 0 50px rgba(255, 109, 74, 0), 0 0 0 30px rgba(255, 109, 74, 0)
    }
    100% {
        box-shadow: 0 0 0 0 rgba(255, 109, 74, 0), 0 0 0 30px rgba(255, 109, 74, 0)
    }
}

@keyframes headerSlideDown {
    0% {
        margin-top: -150px
    }
    100% {
        margin-top: 0
    }
}

.loader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    display: flex;
    justify-content: center;
    align-items: center
}

.loader.loaded {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s, visibility .5s
}

.loader__wrapper {
    padding: 0 40px;
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fefff8;
    background: var(--tp-common-px-red)
}

.loader__wrapper::after {
    position: absolute;
    bottom: 40px;
    content: "";
    height: 1px;
    width: 100%;
    display: inline-block;
    border-bottom: 1px solid #fefff8
}

.loader__content {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    overflow: hidden
}

.loader__count {
    position: relative;
    display: flex;
    align-items: center;
    line-height: 1
}

.count__percent,
.count__text {
    font-size: 200px;
    font-family: var(--tp-ff-thunder);
    color: #fefff8
}

.px-breadcrumb-list span:last-child,
.px-breadcrumb-title,
.px-project-inner-5-tab .masonary-menu button.active,
.px-project-inner-5-tab .masonary-menu button:hover,
.tp-contact-us-info-details a:hover {
    color: var(--tp-common-px-black-2)
}

.count__bdr {
    position: absolute;
    bottom: 40px;
    left: 0;
    width: 100%;
    height: 5px;
    border-radius: 30px;
    background-color: #fefff8;
    transition: width .1s linear
}

.grey-bg {
    background-color: var(--tp-grey-px-1)
}

.theme-bg {
    background-color: var(--tp-theme-px-1)
}

.pixora-dark .am-skill-item ul li span::before,
.pixora-dark .in-blog-list-search-input::before,
.pixora-dark .px-about-2-subtitle i,
.pixora-dark .px-header-style-black .px-header-bar span,
.pixora-dark .px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons .accordion-icon::after,
.pixora-dark .px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons .accordion-icon::before,
.pixora-dark .px-line-shape.px-line-bg-black span,
.pixora-dark .px-pd-2-dot .swiper-pagination-bullet.swiper-pagination-bullet-active,
.pixora-dark .px-pd-4-about-list ul li::before,
.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-contact ul li a::after,
.white-bg,
[data-bg-color=footer-bg-white] {
    background-color: var(--tp-common-px-white)
}

.black-bg {
    background-color: var(--tp-dark-black)
}

[data-bg-color=footer-bg-grey] {
    background-color: var(--tp-footer-grey-1)
}

.px-breadcrumb-ptb {
    padding-top: 180px
}

.px-breadcrumb-title {
    font-size: 200px;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 0;
    letter-spacing: -2px;
    font-family: var(--tp-ff-thundermed)
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .px-breadcrumb-title {
        font-size: 150px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-breadcrumb-title {
        font-size: 100px
    }
}

.px-breadcrumb-list {
    padding: 0 10px;
    display: inline-block
}

.px-breadcrumb-list span {
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    color: rgba(30, 30, 30, .8)
}

.px-breadcrumb-list span.dvdr i {
    padding: 0 14px;
    font-style: normal
}

.bf-service-accordion-wrap .accordion .accordion-items:not(:last-child),
.px-service-accordion-wrap .accordion .accordion-items:not(:last-child) {
    border-bottom: 1px solid rgba(254, 255, 248, .08)
}

.px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons {
    text-align: start;
    font-weight: 500;
    font-size: 30px;
    line-height: 1;
    padding: 24px 0;
    cursor: pointer;
    letter-spacing: -.03em;
    color: var(--tp-common-px-white)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons {
        font-size: 25px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons {
        font-size: 22px
    }
    .px-section-subtitle {
        padding-top: 0;
        padding-bottom: 20px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons {
        font-size: 23px
    }
}

.bf-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons:not(.collapsed) .accordion-icon::before,
.px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons:not(.collapsed) .accordion-icon::before {
    transform: translate(-50%, -50%) rotate(90deg)
}

.bf-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons .accordion-icon,
.px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons .accordion-icon {
    position: absolute;
    top: 15px;
    right: 7px;
    height: 46px;
    width: 46px;
    border-radius: 50%;
    display: inline-block;
    border: 1px solid rgba(255, 255, 255, .14)
}

.bf-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons .accordion-icon::before,
.px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons .accordion-icon::before {
    position: absolute;
    content: "";
    width: 2px;
    height: 14px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--tp-common-px-white);
    border-radius: 2px;
    transition: .4s
}

.bf-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons .accordion-icon::after,
.px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons .accordion-icon::after {
    position: absolute;
    content: "";
    width: 14px;
    height: 2px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--tp-common-px-white);
    border-radius: 2px
}

.bf-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons i,
.px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons i {
    margin-right: 80px;
    display: inline-block;
    transform: translateY(-3px)
}

.bf-service-accordion-wrap .accordion .accordion-items .accordion-body,
.px-service-accordion-wrap .accordion .accordion-items .accordion-body {
    padding: 20px 0 60px
}

.px-service-accordion-wrap .accordion .accordion-items .accordion-body p {
    font-size: 18px;
    font-weight: 500;
    letter-spacing: -.4px;
    color: rgba(255, 255, 255, .6)
}

.bf-service-accordion-category span,
.px-service-accordion-category span {
    font-weight: 600;
    font-size: 13px;
    padding: 4px 16px;
    border-radius: 32px;
    display: inline-block;
    text-transform: uppercase;
    color: var(--tp-common-px-white);
    background: rgba(255, 255, 255, .06)
}

.px-section-subtitle {
    font-size: 16px;
    font-weight: 500;
    display: inline-block;
    letter-spacing: -.03em;
    color: var(--tp-common-px-black)
}

.px-section-subtitle i {
    height: 20px;
    width: 20px;
    margin-right: 10px;
    display: inline-grid;
    border-radius: 50%;
    text-align: center;
    place-content: center;
    background-color: #e8e9e3;
    color: var(--tp-common-px-black)
}

.px-section-subtitle.white-style i {
    color: var(--tp-common-px-white);
    background-color: rgba(255, 255, 255, .1)
}

.px-section-title {
    font-weight: 700;
    font-size: 144px;
    line-height: .83;
    letter-spacing: -.06em
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-section-title {
        font-size: 125px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-section-title {
        font-size: 110px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-section-title {
        font-size: 100px
    }
}

.px-section-title.ff-thunder {
    font-weight: 700;
    font-size: 350px;
    line-height: .8;
    letter-spacing: 1px;
    color: var(--tp-common-px-red);
    font-family: var(--tp-ff-thunder)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-section-title.ff-thunder {
        font-size: 330px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-section-title.ff-thunder {
        font-size: 300px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-section-title.ff-thunder {
        font-size: 230px
    }
}

.px-section-title.ff-thunder.fs-100 {
    font-weight: 600;
    font-size: 50px;
    line-height: .9;
    letter-spacing: 1px;
    color: #000
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-section-title.ff-thunder.fs-100 {
        font-size: 75px
    }
}

.px-section-title.ff-thunder.fs-130 {
    font-weight: 600;
    font-size: 130px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-section-title.ff-thunder.fs-130 {
        font-size: 75px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-section-title.ff-thunder.fs-130 {
        font-size: 60px
    }
}

.px-section-title.ff-thunder.fs-80 {
    font-size: 80px;
    font-weight: 500;
    letter-spacing: 1px;
    color: var(--tp-common-px-black);
    font-family: var(--tp-ff-thundermed)
}

.px-section-title.ff-inter {
    font-weight: 600;
    font-size: 130px;
    line-height: .92;
    letter-spacing: -.06em;
    text-transform: uppercase;
    color: var(--tp-common-px-white);
    font-family: var(--tp-ff-body)
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-section-title.ff-inter {
        font-size: 100px
    }
    .px-header-6-menu nav>ul>li>a {
        font-size: 14px;
        padding: 7px 18px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-section-title.ff-inter {
        font-size: 85px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-section-title.ff-inter {
        font-size: 70px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-section-title.ff-inter {
        font-size: 85px
    }
    .px-section-title.ff-inter br {
        display: none
    }
}

.tp-section-subtitle {
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    margin-right: 15px;
    display: inline-block;
    text-transform: uppercase;
    color: var(--tp-common-px-black)
}

.tp-section-subtitle.pre::before {
    content: "";
    height: 8px;
    width: 8px;
    margin-right: 12px;
    border-radius: 4px;
    display: inline-block;
    transform: translateY(-2px);
    background-color: var(--tp-common-px-orange)
}

.tp-section-title {
    font-size: 120px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -4.8px;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .tp-section-title {
        font-size: 100px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .tp-section-title {
        font-size: 90px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .tp-section-title {
        font-size: 70px;
        letter-spacing: -1.8px
    }
}

.nice-select.px-select {
    position: relative;
    width: 100%;
    height: 56px;
    line-height: 56px;
    padding: 0 23px;
    border-radius: 72px;
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, .1)
}

.nice-select.px-select span.current {
    font-size: 17px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: -.17px;
    color: rgba(255, 255, 255, .7)
}

.nice-select.px-select::after {
    position: absolute;
    content: "\f107";
    top: 50%;
    right: 20px;
    margin-top: 0;
    font-weight: 500;
    pointer-events: none;
    -webkit-transition: .15s ease-in-out;
    transition: .15s ease-in-out;
    transform-origin: center;
    transform: translateY(-50%);
    color: rgba(255, 255, 255, .7);
    font-family: var(--tp-ff-fontawesome)
}

.bf-dark .bf-contact-us-form .tp-input:focus,
.nice-select.px-select.open,
.pixora-dark .design-footer-widget-input input:focus,
.px-footer-3-input input:focus,
.px-footer-3-input textarea:focus,
.tp-footer-subscribe-form .tp-input:focus {
    border-color: var(--tp-common-px-white)
}

.nice-select.px-select.open::after {
    transform: translateY(-50%) rotate(-180deg)
}

.nice-select.px-select .list {
    width: 100%;
    background: #121212
}

.nice-select.px-select .list li {
    font-size: 15px;
    font-weight: 500;
    color: rgba(255, 255, 255, .5)
}

.nice-select.px-select .list li.selected {
    font-size: 17px;
    font-weight: 500;
    letter-spacing: -.17px;
    color: rgba(255, 255, 255, .7)
}

.header-transparent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9;
    width: 100%
}

.header-fixed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 9
}

.postbox-arrow-next,
.postbox-arrow-prev {
    top: 50%;
    z-index: 2;
    transform: translateY(-50%)
}

.header-fixed::after {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    content: "";
    top: 9px;
    left: 0;
    right: 0;
    width: 99%;
    height: 77%;
    z-index: -1;
    margin: 0 auto;
    text-align: center;
    transition: .3s ease-in-out;
    backdrop-filter: blur(40px);
    background-color: rgba(255, 255, 255, .8);
    box-shadow: 0 1px 3px 0 rgba(19, 19, 22, .08);
    animation: .95s forwards headerSlideUp;
    -webkit-animation: .95s forwards headerSlideUp
}

.header-fixed.sticky-bg,
.sidebar-widget-category ul li a span {
    transition: .3s
}

.header-fixed.sticky-bg::after {
    opacity: 1;
    visibility: visible;
    transition: .3s ease-in-out;
    animation: .95s forwards headerSlideDown;
    -webkit-animation: .95s forwards headerSlideDown
}

.header-fixed.sticky-bg .px-header-logo {
    padding-top: 18px;
    transition: .3s
}

.header-fixed.sticky-bg .px-header-logo.px-logo-pt {
    padding-top: 0
}

.bf-header-white.header-sticky .logo-white,
.header-fixed.px-header-2-area::after,
.postbox-details-remeber input,
.tp-contact-me-form-category-list span label input,
.tp-offcanvas-menu ul li .submenu,
.tp-offcanvas-wrapper .logo-2,
.tp-offcanvas-wrapper.offcanvas-black-bg .logo-1 {
    display: none
}

.header-fixed.px-header-2-area.sticky-bg .px-header-logo {
    padding-top: 0;
    transition: .3s
}

.px-header-logo-anim {
    transform-origin: top left
}

.px-copyright-3-menu ul li,
.px-header-menu>nav>ul>li {
    display: inline-block;
    list-style-type: none
}

.px-header-menu>nav>ul>li:not(:last-child) {
    margin-right: 35px
}

.px-header-menu>nav>ul>li a {
    padding: 30px 0;
    font-weight: 600;
    font-size: 16px;
    display: inline-block;
    color: var(--tp-common-px-white)
}

.px-header-bar {
    margin-left: 40px
}

.px-header-bar span {
    margin: 8px auto;
    width: 60px;
    height: 2px;
    display: block;
    transform: translateY(5px);
    background-color: var(--tp-common-px-white)
}

.px-header-2-bar button {
    height: 56px;
    width: 56px;
    justify-content: center;
    align-items: center;
    display: inline-block;
    border-radius: 50%;
    background-color: var(--tp-common-px-black)
}

.postbox-arrow button,
.postbox-play-btn a,
.px-header-2-bar button span {
    background-color: var(--tp-common-px-white)
}

.px-header-2-bar button span {
    margin: 8px auto;
    width: 26px;
    height: 2px;
    display: block
}

.px-header-style-black .px-header-menu nav>ul>li>a {
    text-transform: capitalize;
    color: var(--tp-common-px-black)
}

.px-header-style-black .px-header-menu nav>ul>li.has-dropdown a::after {
    color: #fff
}

.px-header-style-black .px-header-bar span {
    background-color: #ec4f62
}

.px-header-6-menu nav>ul>li {
    margin: 20px 2px;
    display: inline-block;
    list-style-type: none
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-header-menu>nav>ul>li:not(:last-child) {
        margin-right: 10px
    }
    .px-header-menu>nav>ul>li a {
        font-size: 18px
    }
    .px-header-6-menu nav>ul>li>a {
        font-size: 12px;
        padding: 7px 12px
    }
}

.px-header-6-menu.tp-header-dropdown nav ul li.has-dropdown>a::after,
.px-offcanvas-2-wrapper .tp-offcanvas-menu>nav>ul>li>a::after {
    content: none
}

.px-header-6-info a {
    font-size: 15px;
    font-weight: 500;
    letter-spacing: -.6px;
    text-transform: uppercase;
    color: var(--tp-common-px-black)
}

.postbox-wrapper,
.px-pd-2-bottom .tp-pd-2-bottom-item:not(:last-of-type) {
    margin-right: 20px
}

.postbox-author-img {
    flex: 0 0 auto;
    margin-right: 15px
}

.postbox-author-img img {
    height: 42px;
    width: 42px;
    border-radius: 50%
}

.postbox-author-name {
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 5px;
    letter-spacing: -.01em;
    color: rgba(0, 0, 0, .9)
}

.postbox-author-info span,
.postbox-meta span,
.postbox-tag {
    font-weight: 600;
    line-height: 1
}

.postbox-meta i,
.postbox-meta span,
.postbox-tag {
    color: rgba(0, 0, 0, .6)
}

.postbox-author-info,
.px-hero-4-video,
.px-line-shape {
    line-height: 1
}

.postbox-author-info span {
    font-size: 13px;
    color: rgba(0, 0, 0, .6)
}

.postbox-author-wrap,
.postbox-content {
    padding: 0 20px
}

@media (max-width:767px) {
    .back-to-top-wrapper {
        right: 20px;
        bottom: 20px
    }
    .px-btn-slide span {
        margin-left: 45px
    }
    .tp-btn-yellow-border {
        font-size: 14px;
        padding: 15px 20px
    }
    .px-breadcrumb-title {
        font-size: 60px;
        letter-spacing: 0
    }
    .px-breadcrumb-list span {
        font-size: 15px
    }
    .px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons {
        font-size: 22px
    }
    .px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons .accordion-icon {
        height: 30px;
        width: 30px
    }
    .px-service-accordion-category span {
        font-size: 12px;
        padding: 4px 12px
    }
    .px-section-title {
        font-size: 55px
    }
    .px-section-title.ff-thunder {
        font-size: 150px;
        padding-bottom: 10px
    }
    .px-section-title.ff-thunder.fs-100 {
        font-size: 30px
    }
    .px-section-title.ff-thunder.fs-130 {
        font-size: 80px;
        padding-bottom: 0;
        margin-bottom: 0
    }
    .px-section-title.ff-inter {
        font-size: 40px
    }
    .px-section-title.ff-inter br,
    .tp-section-title br {
        display: none
    }
    .tp-section-title {
        font-size: 52px;
        letter-spacing: -1.8px
    }
    .header-fixed.px-header-2-area {
        padding-top: 15px
    }
    .postbox-author-wrap {
        flex-wrap: wrap;
        padding: 0
    }
    .postbox-author-box {
        margin-bottom: 15px;
        margin-right: 15px
    }
}

.postbox-meta i svg {
    margin-right: 4px;
    display: inline-block;
    transform: translateY(-2px)
}

.postbox-meta span {
    font-size: 15px
}

.postbox-item {
    padding: 35px 15px 40px;
    border-radius: 20px;
    border: 1px solid rgba(0, 0, 0, .08)
}

.postbox-item:hover .postbox-thumb img,
.rc-post:hover .rc-post-thumb img,
.tp-blog-item:hover .tp-blog-thumb img,
.tp-contact-us-content:hover .tp-contact-us-thumb img {
    transform: scale(1.1)
}

.postbox-tag {
    font-size: 16px;
    margin-bottom: 15px;
    display: inline-block
}

.postbox-tag i svg {
    margin-right: 4px;
    transform: translateY(-1px)
}

.postbox-title {
    font-size: 50px;
    line-height: 1;
    font-weight: 500;
    margin-bottom: 18px;
    letter-spacing: -.04em;
    color: var(--tp-common-px-black)
}

.postbox-title.fs-80 {
    font-size: 80px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -2.4px
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .postbox-wrapper {
        margin-right: 0
    }
    .postbox-title.fs-80 {
        font-size: 75px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .postbox-title.fs-80 {
        font-size: 60px
    }
}

.postbox-title.fs-54 {
    font-size: 54px;
    font-weight: 700
}

.postbox-title.fs-34 {
    font-size: 34px;
    margin-bottom: 18px
}

.postbox-title.ff-thandar {
    font-size: 100px;
    font-weight: 600;
    letter-spacing: -1px;
    font-family: var(--tp-ff-thunder)
}

.postbox-blockquote-paragraph p,
.postbox-details-quote p,
.postbox-title.ff-thandermed,
.px-blog-title {
    font-family: var(--tp-ff-thundermed)
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-header-menu>nav>ul>li:not(:last-child) {
        margin-right: 20px
    }
    .postbox-title.fs-54 {
        font-size: 45px
    }
    .postbox-title.ff-thandar {
        font-size: 75px
    }
}

.postbox-title.ff-thandermed {
    letter-spacing: 0
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .postbox-title {
        font-size: 45px
    }
    .px-footer-area {
        padding-top: 90px
    }
}

.in-team-hero-title span,
.pf-3-hero-title span,
.pf-6-hero-title span,
.pixora-dark .sidebar-widget-category ul li a:hover,
.postbox-details-text p span,
.postbox-title a:hover,
.px-copyright-right a:hover,
.px-hero-6-btn .zikzak-bg,
.px-inner-service-2-title span,
.px-orange-style .px-blog-title a:hover,
.px-orange-style .px-copyright-big-text,
.px-orange-style .px-footer-widget-info a:hover,
.px-orange-style .px-hero-4-content p span,
.px-orange-style .px-project-3-title a:hover,
.px-orange-style .px-project-title a:hover,
.px-project-5-title span,
.rc-post-title a:hover,
.sidebar-widget-author-social a:hover span,
.sidebar-widget-category ul li a:hover {
    color: var(--tp-common-px-orange)
}

.postbox-content p {
    font-size: 17px;
    font-weight: 400;
    line-height: 1.6;
    margin-bottom: 30px;
    color: rgba(0, 0, 0, .6)
}

.postbox-play-btn,
.tp-contact-map-icon-box {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.postbox-play-btn a {
    height: 80px;
    width: 80px;
    line-height: 77px;
    text-align: center;
    border-radius: 50%;
    display: inline-block;
    animation: 3s linear infinite animate-pulse
}

.basic-pagination ul li .current,
.basic-pagination ul li>a,
.postbox-arrow button {
    height: 50px;
    width: 50px;
    text-align: center
}

.postbox-play-btn a svg {
    margin-left: 3px;
    display: inline-block
}

.postbox-slider-item {
    position: relative;
    border-radius: 14px
}

.postbox-slider-item::after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 14px;
    background-color: rgba(0, 0, 0, .3)
}

.postbox-details-thumb img,
.postbox-slider-item img {
    border-radius: 14px
}

.postbox-arrow button {
    line-height: 50px;
    border-radius: 50%;
    display: inline-block
}

.postbox-arrow button:hover,
.px-pd-2-np-content a:hover {
    color: var(--tp-common-px-white);
    background-color: var(--tp-common-px-black)
}

.postbox-arrow-prev {
    position: absolute;
    left: 30px
}

.postbox-arrow-next {
    position: absolute;
    right: 30px
}

.postbox-blockquote {
    padding: 50px 55px 30px;
    border-radius: 14px;
    background: #f7f7f7
}

.postbox-blockquote-paragraph p {
    font-size: 32px;
    font-weight: 500;
    line-height: 1.2;
    margin-bottom: 0;
    letter-spacing: .32px;
    color: var(--tp-common-px-black-2)
}

.postbox-blockquote-icon {
    margin-bottom: 20px;
    display: inline-block
}

.postbox-thumb {
    border-radius: 14px;
    overflow: hidden
}

.postbox-thumb-overlay::after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, .3)
}

.postbox-thumb img,
.rc-post-thumb img {
    transition: .9s;
    border-radius: 14px
}

.postbox__comment ul {
    margin-right: 75px
}

.postbox__comment ul li {
    margin-bottom: 30px;
    list-style: none
}

.postbox__comment ul li.children {
    margin-left: 100px
}

.postbox__comment-title {
    font-weight: 600;
    font-size: 30px;
    line-height: 1.1;
    margin-bottom: 15px;
    letter-spacing: -.04em;
    color: var(--tp-common-white)
}

.postbox__comment-box {
    padding-top: 20px
}

.postbox__comment-avater,
.postbox__comment-info,
.px-project-3-category {
    flex: 0 0 auto
}

.postbox__comment-avater img {
    width: 70px;
    height: 70px;
    border-radius: 50%
}

.postbox__comment-name {
    margin-bottom: 17px
}

.postbox__comment-name h5 {
    font-weight: 700;
    font-size: 16px;
    line-height: 1;
    margin-bottom: 0;
    letter-spacing: -.01em;
    color: var(--tp-common-px-black-2)
}

.postbox__comment-name span {
    font-size: 14px;
    line-height: 1;
    font-weight: 500;
    color: rgba(0, 0, 0, .7)
}

.postbox__comment-text p {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6;
    margin-bottom: 20px;
    color: rgba(0, 0, 0, .7)
}

.postbox__comment-reply a {
    font-weight: 600;
    font-size: 13px;
    line-height: 1;
    padding: 11px 20px;
    border-radius: 40px;
    display: inline-block;
    text-transform: uppercase;
    color: var(--tp-common-px-black);
    border: 1px solid rgba(0, 0, 0, .1)
}

.postbox__comment-reply a span {
    margin-left: 6px;
    display: inline-block
}

.ar-testimonial-arrow button:hover,
.basic-pagination ul li:hover a,
.postbox__comment-reply a:hover,
.tp-contact-me-form-category-list span label input:checked~span,
.tp-contact-me-form-category-list span label span:hover,
.tp-team-details-info-social .px-footer-widget-social a:hover {
    color: var(--tp-common-px-white);
    border-color: var(--tp-common-px-orange);
    background-color: var(--tp-common-px-orange)
}

.design-footer-col-3,
.postbox__comment-agree {
    padding-left: 5px
}

.postbox__comment-agree input {
    margin: 0;
    appearance: none;
    -moz-appearance: none;
    display: block;
    width: 16px;
    height: 16px;
    background: var(--tp-common-white);
    border: 1px solid #949392;
    outline: 0;
    flex: 0 0 auto;
    transform: translateY(-1px)
}

.postbox__comment-agree input:checked {
    position: relative;
    background-color: var(--tp-theme-1);
    border-color: transparent
}

.postbox__comment-agree input:checked::after {
    box-sizing: border-box;
    content: "\f00c";
    position: absolute;
    font-family: var(--tp-ff-fontawesome);
    font-size: 10px;
    color: var(--tp-common-white);
    top: 47%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.postbox__comment-agree input:hover {
    cursor: pointer
}

.postbox__comment-agree label {
    padding-left: 8px;
    color: #838383;
    line-height: 1
}

.postbox__comment-agree label a {
    color: var(--tp-common-black);
    font-weight: 600;
    padding-left: 4px
}

.postbox__comment-agree label a:hover {
    color: var(--tp-theme-1)
}

.postbox-details-remeber label:hover,
.postbox__comment-agree label:hover {
    cursor: pointer
}

.basic-pagination {
    margin-bottom: 40px
}

.basic-pagination ul li {
    list-style: none;
    display: inline-block;
    margin-right: 5px
}

.basic-pagination ul li>a {
    line-height: 49px;
    font-weight: 600;
    font-size: 16px;
    border-radius: 50%;
    display: inline-block;
    color: var(--tp-common-px-black);
    transition: .3s ease-in-out;
    border: 1px solid rgba(0, 0, 0, .08)
}

.basic-pagination ul li .current {
    font-weight: 600;
    line-height: 49px;
    font-size: 16px;
    border-radius: 50%;
    display: inline-block;
    transition: .3s ease-in-out;
    color: var(--tp-common-px-white);
    border-color: var(--tp-common-px-orange);
    background-color: var(--tp-common-px-orange)
}

.basic-pagination-label span {
    font-weight: 500;
    font-size: 15px;
    line-height: 1.33;
    color: #525356;
    display: inline-block
}

.basic-pagination.product-pagination ul li>a {
    color: #4d3d30;
    border: 1px solid #4d3d30
}

.basic-pagination.product-pagination ul li .current,
.basic-pagination.product-pagination ul li:hover a {
    background-color: #4d3d30;
    color: var(--tp-common-white)
}

.postbox-details-author .sidebar-widget-author-content span,
.postbox-details-tag,
.px-hero-5-category a:not(:last-child),
.px-hero-5-social a:not(:last-child) {
    margin-bottom: 8px
}

.postbox-details-tag span:last-child {
    position: relative;
    padding-left: 9px;
    margin-left: 9px;
    display: inline-block
}

.postbox-details-tag span:last-child::after {
    position: absolute;
    content: "";
    top: 8px;
    left: -3px;
    height: 4px;
    width: 4px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, .6)
}

.postbox-details-meta .postbox-author-name {
    font-weight: 700;
    margin-bottom: 0;
    color: rgba(0, 0, 0, .6)
}

.postbox-details-meta>div:not(:first-child) {
    padding-left: 16px;
    margin-left: 16px;
    position: relative
}

.postbox-details-meta>div:not(:first-child)::after {
    position: absolute;
    content: "";
    top: 2px;
    left: 0;
    width: 1px;
    height: 24px;
    background: rgba(0, 0, 0, .1)
}

@media (max-width:767px) {
    .postbox-title.fs-80 {
        font-size: 45px;
        letter-spacing: 0
    }
    .postbox-title.fs-54 {
        font-size: 40px
    }
    .postbox-title {
        font-size: 35px
    }
    .postbox-content {
        padding: 0
    }
    .postbox-blockquote {
        padding: 30px 20px
    }
    .postbox-blockquote-paragraph p {
        font-size: 26px
    }
    .postbox-blockquote-paragraph p br,
    .postbox-details-meta>div:not(:first-child)::after {
        display: none
    }
    .postbox__comment {
        padding-top: 50px
    }
    .postbox__comment ul li.children {
        margin-left: 15px
    }
    .postbox-details-meta,
    .postbox-details-tag,
    .postbox-details-tag-wrap,
    .postbox__comment-box {
        flex-wrap: wrap
    }
    .postbox__comment-avater {
        margin-right: 0
    }
    .postbox__comment-avater img {
        margin-bottom: 30px
    }
    .basic-pagination ul li {
        margin-right: 5px
    }
    .basic-pagination-label span,
    .postbox-details-meta .postbox-meta {
        margin-bottom: 15px
    }
    .postbox-details-meta>div:not(:first-child) {
        padding-left: 0;
        margin-left: 0;
        margin-right: 10px
    }
}

.postbox-details-thumb {
    gap: 11px
}

.postbox-details-text p {
    font-size: 17px;
    font-weight: 500;
    line-height: 1.6;
    color: rgba(30, 30, 30, .7)
}

.postbox-details-quote p {
    font-size: 34px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: .34px;
    color: var(--tp-common-px-black-2)
}

.postbox-details-quote span {
    font-size: 16px;
    line-height: 1;
    font-weight: 500;
    color: rgba(30, 30, 30, .6)
}

.postbox-details-quote-box {
    padding: 60px;
    border-radius: 12px;
    background: #f7f7f7
}

@media (max-width:767px) {
    .postbox-details-quote-box {
        padding: 20px
    }
}

.postbox-details-quote-box blockquote {
    margin: 0
}

.postbox-details-quote-box i {
    flex: 0 0 auto;
    margin-right: 25px;
    display: inline-block
}

.postbox-details-list ul {
    padding-left: 30px
}

.postbox-details-list ul li {
    font-size: 17px;
    font-weight: 500;
    line-height: 1.1;
    position: relative;
    padding-left: 20px;
    list-style-type: none;
    color: rgba(0, 0, 0, .7)
}

.postbox-details-list ul li:not(:last-child),
.px-footer-widget-info,
.px-hero-service-item span:not(:last-child) {
    margin-bottom: 15px
}

.postbox-details-list ul li::before {
    position: absolute;
    top: 7px;
    left: 0;
    content: "";
    height: 5px;
    width: 5px;
    margin-right: 10px;
    border-radius: 50%;
    display: inline-block;
    background-color: rgba(0, 0, 0, .7)
}

.postbox-details-list ul li span {
    color: rgba(0, 0, 0, .3)
}

.postbox-details-list ul li i {
    font-style: normal;
    color: var(--tp-common-px-orange)
}

.postbox-details-code {
    padding: 25px 30px;
    border-radius: 14px;
    background: #f6f6f9
}

.postbox-details-code pre {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.8;
    margin: 0;
    color: rgba(0, 0, 0, .7)
}

.postbox-details-tag span {
    margin-bottom: 10px;
    display: inline-block;
    font-weight: 600;
    font-size: 17px;
    line-height: 1;
    margin-right: 15px;
    color: var(--tp-common-white)
}

.postbox-details-author .sidebar-widget-author-img {
    flex: 0 0 auto;
    margin-bottom: 0;
    margin-right: 30px
}

.postbox-details-author .sidebar-widget-author-img img {
    height: 100px;
    width: 100px
}

.postbox-details-author .sidebar-widget-author {
    padding: 30px;
    border: none;
    border-radius: 14px;
    background: #f6f6f9
}

.postbox-details-author .sidebar-widget-author-name {
    margin-bottom: 18px
}

.postbox-details-form {
    padding: 60px;
    border-radius: 20px;
    border: 1px solid rgba(0, 0, 0, .08)
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .postbox__comment-text p {
        font-size: 15px
    }
    .postbox-details-form {
        padding: 30px
    }
}

.postbox-details-form p {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.3;
    margin-bottom: 23px;
    color: rgba(0, 0, 0, .7)
}

.postbox-details-form-title {
    font-size: 30px;
    font-weight: 600;
    line-height: 1.6;
    margin-bottom: 0;
    letter-spacing: -.04em;
    color: var(--tp-common-px-black)
}

.postbox-details-input label {
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 12px;
    color: var(--tp-common-px-black)
}

.postbox-details-input input,
.postbox-details-input textarea {
    font-size: 17px;
    font-weight: 400;
    margin-bottom: 25px;
    border-radius: 14px;
    color: var(--tp-common-px-black);
    background: #f6f6f9;
    border: 1px solid #f6f6f9
}

.postbox-details-input input::-webkit-input-placeholder,
.postbox-details-input textarea::-webkit-input-placeholder {
    font-size: 17px;
    font-weight: 400;
    color: #707072
}

.postbox-details-input input::-moz-placeholder,
.postbox-details-input textarea::-moz-placeholder {
    font-size: 17px;
    font-weight: 400;
    color: #707072
}

.postbox-details-input input:-moz-placeholder,
.postbox-details-input textarea:-moz-placeholder {
    font-size: 17px;
    font-weight: 400;
    color: #707072
}

.postbox-details-input input:-ms-input-placeholder,
.postbox-details-input textarea:-ms-input-placeholder {
    font-size: 17px;
    font-weight: 400;
    color: #707072
}

.postbox-details-input input::placeholder,
.postbox-details-input textarea::placeholder {
    font-size: 17px;
    font-weight: 400;
    color: #707072
}

.postbox-details-input input:focus,
.postbox-details-input textarea:focus {
    background: 0 0;
    border-color: var(--tp-common-px-orange)
}

.postbox-details-input textarea {
    height: 160px;
    resize: none;
    margin-bottom: 20px
}

.bf-team-item:hover .bf-team-thumb::after,
.body-overlay.opened,
.postbox-details-remeber input:checked~label::before,
.px-social-icon a:hover span {
    opacity: 1;
    visibility: visible
}

.postbox-details-remeber label {
    font-size: 15px;
    line-height: 1;
    font-weight: 500;
    padding-left: 30px;
    position: relative;
    color: rgba(0, 0, 0, .7)
}

.postbox-details-remeber label::after {
    position: absolute;
    content: "";
    top: -3px;
    left: 0;
    width: 20px;
    height: 20px;
    z-index: -1;
    transition: .3s;
    line-height: 16px;
    border-radius: 4px;
    text-align: center;
    border: 1px solid rgba(0, 0, 0, .1)
}

.postbox-details-remeber label::before {
    position: absolute;
    top: -2px;
    left: 2px;
    width: 16px;
    height: 16px;
    opacity: 0;
    transition: .3s;
    line-height: 16px;
    filter: invert(1);
    text-align: center;
    visibility: hidden;
    color: var(--tp-common-px-black-2);
    content: url("../img/svg/check.html")
}

.postbox-details-social a {
    height: 36px;
    width: 36px;
    line-height: 33px;
    text-align: center;
    margin-bottom: 10px;
    border-radius: 14px;
    display: inline-block;
    color: rgba(0, 0, 0, .8);
    background-color: #f6f6f9
}

.postbox-details-social a svg {
    height: 15px;
    width: 15px
}

.design-footer-widget-input-icon.hover-bg-orange:hover,
.in-blog-list-category span.active,
.in-blog-list-category span:hover,
.pf-3-hero-social a:hover,
.postbox-details-social a:hover,
.px-footer-3-btn:hover,
.px-footer-3-social a:hover,
.px-hero-6-category span:hover,
.tp-contact-me-interest-form-wrap .tp-contact-form-btn button,
.tp-contact-us-btn .tp-btn-yellow-green.active {
    color: var(--tp-common-px-white);
    background-color: var(--tp-common-px-orange)
}

.rc-post-thumb {
    flex: 0 0 auto;
    overflow: hidden;
    margin-right: 30px;
    border-radius: 14px
}

.px-contact-inf,
.px-footer-widget-info a:not(:last-child),
.px-offcanvas-2-wrapper .tp-offcanvas-menu>nav>ul>li:not(:last-child),
.rc-post-category {
    margin-bottom: 10px
}

.rc-post-category a {
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    padding: 7px 12px;
    border-radius: 15px;
    display: inline-block;
    color: var(--tp-common-px-black-2);
    border: 1px solid rgba(30, 30, 30, .1)
}

.rc-post-title {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 8px;
    letter-spacing: -.2px;
    color: var(--tp-common-px-black-2)
}

.sidebar-widget-author-name,
.sidebar-widget-title {
    letter-spacing: -.02em;
    color: var(--tp-common-px-black-2);
    font-weight: 600
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px),
(max-width:767px) {
    .pf-hero-content p br,
    .postbox-content p br,
    .postbox-details-author .sidebar-widget-author-content p br,
    .px-service-accordion-wrap .accordion .accordion-items .accordion-body p br {
        display: none
    }
    .postbox-content p {
        font-size: 16px
    }
    .postbox__comment ul {
        margin-right: 0
    }
    .rc-post-title {
        font-size: 18px
    }
}

.rc-post-meta span {
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    color: rgba(0, 0, 0, .6)
}

.sidebar-search button,
.sidebar-search input {
    line-height: 60px;
    color: var(--tp-common-px-black)
}

.rc-post-wrap .rc-post:not(:last-child) {
    margin-bottom: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid rgba(0, 0, 0, .06)
}

.sidebar-search input {
    width: 100%;
    height: 60px;
    padding: 0 50px 0 25px;
    font-weight: 500;
    font-size: 18px;
    border-radius: 14px;
    background: #f6f6f9;
    border: 1px solid transparent
}

.sidebar-search input::-webkit-input-placeholder {
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    color: rgba(0, 0, 0, .6)
}

.sidebar-search input::-moz-placeholder {
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    color: rgba(0, 0, 0, .6)
}

.sidebar-search input:-moz-placeholder {
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    color: rgba(0, 0, 0, .6)
}

.sidebar-search input:-ms-input-placeholder {
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    color: rgba(0, 0, 0, .6)
}

.sidebar-search input::placeholder {
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    color: rgba(0, 0, 0, .6)
}

.sidebar-search input:focus {
    background-color: transparent;
    border: 1px solid var(--tp-common-px-orange)
}

.sidebar-search button {
    position: absolute;
    top: 0;
    right: 25px;
    height: 100%
}

.sidebar-widget-author {
    padding: 40px;
    border-radius: 14px;
    border: 1px solid rgba(0, 0, 0, .06)
}

.in-blog-list-category-wrap,
.tp-blog-details-ptb {
    border-bottom: 1px solid rgba(30, 30, 30, .08)
}

.px-offcanvas-2-wrapper .tp-offcanvas-menu>nav>ul>li .submenu,
.sidebar-widget-author-img {
    margin-bottom: 35px
}

.sidebar-widget-author-img img {
    border-radius: 50%
}

.sidebar-widget-author-name {
    font-size: 18px;
    line-height: 1;
    margin-bottom: 5px
}

.sidebar-widget-author-content span {
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 20px;
    color: #9e9a9a;
    display: inline-block
}

.sidebar-widget-author-content p {
    font-size: 17px;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 20px;
    color: rgba(0, 0, 0, .7)
}

.sidebar-widget-category ul li a,
.tagcloud a {
    font-size: 16px;
    border-radius: 14px;
    font-weight: 500;
    background: #f6f6f9
}

.sidebar-widget-author-social a {
    margin: 0 5px
}

.sidebar-widget-author-social a span {
    transition: .4s ease-in-out;
    color: var(--tp-common-px-black-2)
}

.sidebar-widget-title {
    font-size: 24px;
    line-height: 1;
    margin-bottom: 30px
}

.am-skill-item ul li,
.inner-service-1-left ul li,
.sidebar-widget-category ul li {
    list-style-type: none
}

.sidebar-widget-category ul li a {
    padding: 12px 20px;
    line-height: 1;
    letter-spacing: -.01em;
    color: rgba(0, 0, 0, .8)
}

.sidebar-widget-category ul li a span:last-child {
    color: rgba(0, 0, 0, .4)
}

.sidebar-widget-category ul li a:hover span:last-child {
    color: VAR(--tp-common-px-orange)
}

.pf-3-hero-social a:not(:last-of-type),
.sidebar-widget-category ul li:not(:last-child) {
    margin-bottom: 6px
}

.px-blog-category,
.tp-offcanvas-contact ul li:not(:last-child) {
    margin-bottom: 2px
}

.px-footer-col-3,
.sidebar-wrapper {
    padding-left: 20px
}

.sidebar-blog-grid-wrap .sidebar-wrapper {
    padding-left: 2px
}

.tagcloud a {
    line-height: 1;
    padding: 10px 18px;
    text-align: center;
    margin-bottom: 10px;
    color: rgba(0, 0, 0, .6);
    display: inline-block;
    text-transform: capitalize
}

.bf-about-3-thumb-2 img,
.bf-instagram-thumb-inner-1 img,
.bf-instagram-thumb-inner-2 img,
.bf-instagram-thumb-inner-3 img,
.bf-instagram-thumb-inner-4 img,
.bf-instagram-thumb-inner-5 img,
.bf-instagram-thumb-inner-6 img,
.bf-instagram-thumb-inner-7 img,
.bf-portfolio-3-thumb img,
.px-blog-thumb,
.px-blog-thumb img {
    border-radius: 30px
}

.tagcloud a:not(:last-child),
.tp-team-details-info-contact a svg {
    margin-right: 5px
}

.tagcloud a:hover {
    color: var(--tp-common-px-white);
    background-color: VAR(--tp-common-px-orange)
}

.px-blog-category {
    font-size: 15px;
    font-weight: 600;
    display: inline-block;
    letter-spacing: -.03em;
    color: var(--tp-common-px-black)
}

.px-blog-title {
    margin-bottom: 0;
    font-weight: 500;
    font-size: 38px
}

.in-blog-hero-title,
.px-footer-3-mail a,
.px-footer-3-tel a,
.px-hero-2-text,
.px-hero-title {
    font-family: var(--tp-ff-thunder)
}

.bf-text-slider-style .tp-text-slide-bottom .tp-text-content span,
.px-blog-title a:hover,
.px-footer-widget-info a:hover,
.px-hero-4-content p span,
.px-inner-about-1-top p span,
.px-inner-about-style .px-about-3-content p span,
.px-project-3-title a:hover,
.px-project-title a:hover {
    color: var(--tp-common-px-red)
}

.px-blog-meta {
    font-weight: 500;
    font-size: 14px;
    letter-spacing: -.03em;
    color: rgba(30, 30, 30, .5)
}

.px-blog-thumb {
    overflow: hidden;
    margin-bottom: 20px
}

.in-blog-hero-title {
    font-size: 140px;
    font-weight: 700;
    line-height: .8;
    letter-spacing: -2.8px;
    text-transform: uppercase;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:1600px) and (max-width:1700px),
only screen and (min-width:1400px) and (max-width:1599px) {
    .in-blog-hero-title {
        font-size: 200px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-blog-title {
        font-size: 35px
    }
    .in-blog-hero-title {
        font-size: 180px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .rc-post-title {
        font-size: 16px
    }
    .tagcloud a {
        padding: 10px 14px;
        font-size: 13px
    }
    .in-blog-hero-title {
        font-size: 140px;
        letter-spacing: 0
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .in-blog-hero-title {
        font-size: 100px;
        letter-spacing: 0
    }
}

@media (max-width:767px) {
    .postbox-details-author .sidebar-widget-author-img,
    .postbox-details-quote-box i {
        margin-right: 0;
        margin-bottom: 20px
    }
    .postbox-details-author .sidebar-widget-author,
    .postbox-details-quote-wrap {
        flex-wrap: wrap
    }
    .postbox-details-list ul {
        padding-left: 0
    }
    .postbox-details-form {
        padding: 20px
    }
    .postbox-details-form p {
        font-size: 16px
    }
    .tagcloud a {
        padding: 10px 14px
    }
    .in-blog-hero-title {
        font-size: 55px;
        letter-spacing: 0
    }
}

.in-blog-hero-ptb {
    padding-top: 200px
}

.in-blog-list-category span {
    display: inline-flex;
    padding: 12px 30px;
    font-size: 15px;
    font-weight: 500;
    line-height: 1;
    transition: .3s;
    border-radius: 6px;
    background: #f5f5f5;
    letter-spacing: -.2px;
    text-transform: uppercase;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .in-blog-list-category span {
        padding: 12px 25px
    }
}

.in-blog-list-category-wrap {
    padding: 5px 0;
    margin-bottom: 60px;
    border-top: 1px solid rgba(30, 30, 30, .08)
}

.in-blog-list-search-input::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 1px;
    transition: width .3s;
    background-color: var(--tp-common-px-black)
}

.in-blog-list-search-input.active::before {
    width: 100%;
    transition-delay: 0.3s
}

.in-blog-list-search-input.active input {
    width: 240px
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .in-blog-list-category span {
        padding: 12px 15px;
        font-size: 14px
    }
    .in-blog-list-search-input.active input {
        width: 150px
    }
}

.in-blog-list-search-input input {
    font-size: 14px;
    font-weight: 400;
    padding: 0 0 0 35px;
    height: 44px;
    width: 95px;
    border: 0;
    display: inline-block;
    letter-spacing: -.02em;
    background-color: transparent;
    color: var(--tp-common-px-black)
}

.in-blog-list-search-input input::-webkit-input-placeholder {
    color: rgba(0, 0, 0, .6)
}

.in-blog-list-search-input input::-moz-placeholder {
    color: rgba(0, 0, 0, .6)
}

.in-blog-list-search-input input:-moz-placeholder {
    color: rgba(0, 0, 0, .6)
}

.in-blog-list-search-input input:-ms-input-placeholder {
    color: rgba(0, 0, 0, .6)
}

.in-blog-list-search-input input::placeholder {
    color: rgba(0, 0, 0, .6)
}

.in-blog-list-search-icon {
    position: absolute;
    left: 0;
    top: 48%;
    transform: translateY(-50%)
}

.px-postbox-style .sidebar-widget-author-img img {
    height: 60px;
    width: 60px
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .in-blog-list-search-input.active input {
        width: 160px
    }
    .tp-blog-details-ptb {
        padding-top: 80px
    }
}

.tp-blog-details-without-ptb {
    padding-top: 220px
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .tp-blog-details-without-ptb {
        padding-top: 185px
    }
}

.tp-blog-details-without-heading .postbox-details-item .postbox-tag span {
    font-size: 16px;
    font-weight: 600;
    margin-right: 0;
    color: rgba(0, 0, 0, .6)
}

.tp-blog-details-banner {
    height: 830px
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .sidebar-wrapper {
        padding-left: 0
    }
    .tp-blog-details-banner {
        height: 600px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .tp-blog-details-banner {
        height: 300px
    }
}

.tp-blog-details-banner img {
    margin-top: -200px
}

.tp-header-dropdown nav ul li {
    position: relative;
    list-style: none
}

.tp-header-dropdown nav ul li.p-static {
    position: static
}

.tp-header-dropdown nav ul li.tp-menu-last .tp-submenu {
    left: auto;
    right: 0
}

.tp-header-dropdown nav ul li.has-dropdown>a::after {
    content: "\f107";
    font-size: 16px;
    font-weight: 400;
    margin-left: 5px;
    display: inline-block;
    color: var(--tp-common-px-black);
    transition: .3s ease-out;
    font-family: var(--tp-ff-fontawesome)
}

.tp-header-dropdown nav ul li.has-dropdown:hover>a::after {
    transform: rotate(-180deg)
}

.tp-header-dropdown nav ul li .tp-submenu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 340px;
    z-index: 99;
    opacity: 0;
    padding: 12px 0;
    transition: .5s;
    text-align: start;
    visibility: hidden;
    border-radius: 14px;
    transform-origin: 0 0;
    transform: scale(1, 0);
    backdrop-filter: blur(40px);
    background: rgba(38, 37, 40, .9);
    box-shadow: 0 20px 30px -8px rgba(19, 19, 22, .1)
}

.tp-header-dropdown nav ul li .tp-submenu li {
    width: 100%;
    padding: 0 12px;
    border-radius: 8px
}

.tp-header-dropdown nav ul li .tp-submenu li a {
    position: relative;
    border-radius: 8px;
    font-weight: 500;
    font-size: 16px;
    line-height: 1;
    color: #bfbfc0;
    padding: 12px 18px;
    display: inline-block;
    letter-spacing: -.01em;
    text-align: start;
    width: 100%
}

@media only screen and (min-width:1600px) and (max-width:1700px),
only screen and (min-width:1400px) and (max-width:1599px),
only screen and (min-width:1200px) and (max-width:1399px) {
    .px-header-6-menu nav>ul>li {
        margin: 20px 1px
    }
    .tp-header-dropdown nav ul li .tp-submenu li a {
        font-size: 14px
    }
}

.tp-header-dropdown nav ul li .tp-submenu li .tp-submenu {
    top: 0;
    left: 100%
}

.tp-header-dropdown nav ul li .tp-submenu li:hover>a,
.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-menu .tp-submenu li a:hover {
    background-color: #2c2b2e;
    color: var(--tp-common-px-white)
}

.tp-header-dropdown nav ul li .tp-submenu.px-megamenu {
    width: 480px;
    padding: 30px
}

.tp-header-dropdown nav ul li:hover>.tp-submenu {
    visibility: visible;
    opacity: 1;
    transform: scale(1)
}

.dropdown-white-bg nav ul li .tp-submenu {
    background: rgba(255, 255, 255, .9)
}

.dropdown-white-bg nav ul li .tp-submenu li a,
.dropdown-white-bg nav ul li .tp-submenu li.menu-item-has-children>a::after {
    color: #636368
}

.dropdown-white-bg nav ul li .tp-submenu li:hover>a {
    background-color: #ec4f62;
    color: var(--tp-common-px-black)
}

.px-megamenu-style.tp-header-dropdown nav ul li .tp-submenu.px-megamenu li,
.tp-offcanvas-menu .tp-megamenu-list ul li {
    padding: 0
}

.px-megamenu-title {
    font-size: 20px;
    font-weight: 600;
    padding-left: 18px;
    color: var(--tp-common-px-black)
}

.px-megamenu-title-wrap {
    display: block;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, .08)
}

.dropdown-black-bg .px-megamenu-title-wrap,
.pixora-dark .am-skill-bdr,
.pixora-dark .postbox-details-remeber label::after,
.pixora-dark .px-award-item,
.pixora-dark .px-text-slider-style-3 {
    border-color: rgba(255, 255, 255, .1)
}

.body-overlay {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99;
    width: 100%;
    height: 100%;
    visibility: hidden;
    opacity: 0;
    transition: .45s ease-in-out;
    background: rgba(24, 24, 24, .4)
}

.tp-offcanvas-wrapper {
    position: fixed;
    top: 0;
    right: 0;
    width: 450px;
    height: 100vh;
    z-index: 999;
    padding: 50px;
    overflow-y: scroll;
    transition: .3s;
    background: #fff;
    scrollbar-width: none;
    overscroll-behavior-y: contain;
    -webkit-transform: translateX(calc(100% + 80px));
    -moz-transform: translateX(calc(100% + 80px));
    -ms-transform: translateX(calc(100% + 80px));
    -o-transform: translateX(calc(100% + 80px));
    transform: translateX(calc(100% + 80px))
}

.px-hero-3-bg,
.px-hero-6-bg,
.px-hero-bg {
    background-repeat: no-repeat
}

@media (max-width:767px) {
    .tp-blog-details-ptb {
        padding-top: 40px
    }
    .tp-blog-details-banner {
        height: 240px
    }
    .tp-blog-details-banner img {
        margin-top: -100px
    }
    .tp-offcanvas-wrapper {
        width: 100%
    }
}

.pixora-dark .postbox-blockquote,
.pixora-dark .px-about-info-body,
.pixora-dark .px-about-info-head,
.pixora-dark .tp-contact-us-content,
.pixora-dark .tp-contact-us-form-wrapper,
.tp-offcanvas-wrapper.offcanvas-black-bg {
    background: #1c1d20
}

.bf-header-white.header-sticky .logo-dark,
.tp-offcanvas-wrapper.offcanvas-black-bg .logo-2 {
    display: block !important
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-menu ul li.active>a {
    color: var(--tp-common-red-3)
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-megamenu-wrapper.megamenu-black-bg {
    backdrop-filter: initial;
    background: 0 0;
    box-shadow: none
}

.pixora-dark .px-breadcrumb-list span,
.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-contact ul li a,
.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-content p {
    color: rgba(255, 255, 255, .8)
}

.pixora-dark .design-footer-widget-input input,
.pixora-dark .px-contact-info-item-btn a,
.pixora-dark .px-hero-4-scrolldown,
.pixora-dark .px-pd-2-categories span,
.pixora-dark .px-pd-2-np-content a,
.pixora-dark .px-project-3-category span,
.pixora-dark .tp-contact-me-form-category-list span label span,
.pixora-dark .tp-contact-us-btn .tp-btn-yellow-green,
.pixora-dark .tp-team-details-info-social .px-footer-widget-social a,
.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-social ul li a {
    color: var(--tp-common-px-white);
    border: 1px solid rgba(255, 255, 255, .1)
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-social ul li a:hover {
    color: var(--tp-common-black);
    border-color: var(--tp-common-px-white);
    background-color: var(--tp-common-px-white)
}

.tp-offcanvas-area.opened .tp-offcanvas-wrapper {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0)
}

.tp-offcanvas-top {
    margin-bottom: 90px
}

.tp-offcanvas-close-btn,
.tp-offcanvas-menu ul li.active>a {
    color: #000
}

.tp-offcanvas-close-btn:hover {
    opacity: 1;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg)
}

.tp-contact-us-info-details,
.tp-offcanvas-content {
    margin-bottom: 45px
}

.tp-offcanvas-title,
.tp-offcanvas-title.sm {
    margin-bottom: 15px;
    color: #fff;
    font-weight: 700
}

.tp-offcanvas-content p {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #fff
}

.tp-offcanvas-title {
    font-size: 40px;
    line-height: 1;
    letter-spacing: -.8px
}

.tp-offcanvas-title.sm {
    font-size: 20px;
    text-transform: uppercase
}

.px-step-card-content,
.tp-offcanvas-gallery {
    margin-bottom: 65px
}

.tp-offcanvas-gallery-img img {
    transition: .9s
}

.px-social-icon a span,
.tp-hamburger-btn span {
    transition: .3s ease-in-out
}

.tp-offcanvas-gallery-img:hover img {
    transform: scale(1.2) rotate(-2deg)
}

.tp-offcanvas-contact {
    margin-bottom: 55px
}

.bf-hero-right-content ul li,
.bf-service-step-item ul li,
.tp-offcanvas-contact ul li,
.tp-offcanvas-menu ul,
.tp-offcanvas-social ul li {
    list-style: none
}

.tp-offcanvas-contact ul li a {
    display: inline-block;
    color: #fff;
    font-size: 16px
}

.tp-offcanvas-contact ul li a::after {
    position: absolute;
    bottom: 2px;
    right: 0;
    width: 0;
    height: 1px;
    content: "";
    transition: .4s;
    background-color: #1e1e1e
}

.px-inner-about-style .px-about-3-bigtext,
.tp-offcanvas-contact ul li a:hover {
    color: #ec4f62
}

.tp-offcanvas-contact ul li a:hover::after {
    width: 100%;
    right: auto;
    left: 0
}

.tp-offcanvas-social ul {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center
}

.tp-offcanvas-social ul li:not(:last-child) {
    margin-right: 8px
}

.tp-offcanvas-social ul li a {
    display: inline-block;
    text-align: center;
    width: 40px;
    height: 40px;
    line-height: 38px;
    border-radius: 40px;
    transition: .3s;
    color: #fff;
    border: 1px solid rgba(2, 11, 24, .1)
}

.tp-offcanvas-social ul li a:hover {
    background-color: var(--tp-common-px-black);
    border-color: var(--tp-common-px-black);
    color: var(--tp-common-px-white)
}

.design-footer-middle,
.design-footer-top-wrap {
    border-bottom: 1px solid rgba(10, 10, 10, .08)
}

.tp-offcanvas-social ul li a svg {
    -webkit-transform: translateY(-1px);
    -moz-transform: translateY(-1px);
    -ms-transform: translateY(-1px);
    -o-transform: translateY(-1px);
    transform: translateY(-1px)
}

.px-offcanvas-2-wrapper {
    padding: 155px 100px 0;
    margin-bottom: 60px
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-offcanvas-2-wrapper {
        padding: 155px 30px 0
    }
}

.px-offcanvas-2-wrapper .tp-offcanvas-menu>nav>ul>li>a {
    font-size: 120px;
    padding: 0;
    line-height: .8;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-family: var(--tp-ff-thunder);
    color: var(--tp-common-px-white)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-offcanvas-2-wrapper .tp-offcanvas-menu>nav>ul>li>a {
        font-size: 100px
    }
}

.px-offcanvas-2-wrapper .tp-offcanvas-menu>nav>ul>li .tp-menu-close i {
    font-size: 28px;
    color: var(--tp-common-px-white)
}

.px-offcanvas-2-wrapper .tp-offcanvas-menu>nav>ul>li .submenu>li>a {
    font-size: 30px;
    font-weight: 600;
    line-height: 1;
    transition: .3s;
    color: #717172;
    letter-spacing: -.02em
}

.px-offcanvas-2-wrapper .tp-offcanvas-menu>nav>ul>li .submenu>li>a:hover {
    background-color: initial;
    transform: translateX(15px);
    color: var(--tp-common-px-white)
}

.px-offcanvas-2-left {
    opacity: 0;
    animation-delay: 1s;
    transform: translateY(20px)
}

.px-offcanvas-2-left .tp-offcanvas-menu {
    margin-bottom: 105px
}

.px-offcanvas-2-left .tp-offcanvas-menu ul {
    overflow: hidden;
    overflow-y: scroll;
    scrollbar-width: none;
    max-height: 510px;
    padding-top: 10px
}

.px-offcanvas-2-left-btn-box {
    gap: 10px
}

.px-offcanvas-2-left-btn .tp-btn-yellow-border.postbox-btn {
    border-radius: 12px;
    color: var(--tp-common-px-white);
    background-color: var(--tp-common-px-black-2)
}

.pixora-dark .px-portfolio-details-btn:hover,
.px-offcanvas-2-left-btn .tp-btn-yellow-border.postbox-btn.active,
.px-offcanvas-2-social.tp-offcanvas-social ul li a:hover {
    background-color: var(--tp-common-px-red)
}

.design-award-item:hover::after,
.design-award-item:hover::before,
.design-footer-widget-input-icon,
.px-line-shape.px-line-bg-black span,
.tp-hamburger-btn.active {
    background-color: var(--tp-common-px-black)
}

.px-offcanvas-2-social.tp-offcanvas-social ul {
    justify-content: end
}

.px-offcanvas-2-social.tp-offcanvas-social ul li a {
    line-height: 36px;
    color: var(--tp-common-px-white);
    background-color: var(--tp-common-px-black-2)
}

.px-offcanvas-2-video {
    display: flex;
    justify-content: end
}

.px-offcanvas-2-video .px-hero-video {
    width: 532px;
    height: 300px;
    border-radius: 16px
}

.px-offcanvas-2-area.menu-open,
.px-offcanvas-2-area.menu-open-temp {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    transition: z-index 0s 2s
}

.px-offcanvas-2-area .offcanvas-bg {
    position: fixed;
    inset: 0;
    margin: 20px;
    border-radius: 20px;
    background: var(--tp-common-px-black);
    clip-path: circle(0% at calc(100% - 45px) 45px);
    transition: clip-path .7s ease-in-out;
    z-index: -1
}

.px-offcanvas-2-area.menu-open .offcanvas-bg {
    clip-path: circle(150% at calc(100% - 45px) 45px)
}

.px-offcanvas-2-area.menu-open .offcanvas-menu {
    pointer-events: auto
}

.px-offcanvas-2-area.menu-open .px-offcanvas-2-left {
    opacity: 1;
    transform: translateY(0);
    transition-delay: calc(0.7s + 0.06s)
}

.px-offcanvas-2-area.menu-open .px-offcanvas-2-left .tp-offcanvas-menu {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .6s cubic-bezier(.2, .8, .2, 1), transform .6s cubic-bezier(.2, .8, .2, 1);
    transition-delay: calc(calc(0.7s + 0.06s) + 0.2s)
}

.px-offcanvas-2-area.menu-open .px-offcanvas-2-left .px-offcanvas-2-left-btn-box {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .6s cubic-bezier(.2, .8, .2, 1), transform .6s cubic-bezier(.2, .8, .2, 1);
    transition-delay: calc(calc(calc(0.7s + 0.06s) + 0.2s) + 0.15s)
}

.px-offcanvas-2-area.menu-open .px-offcanvas-2-right {
    opacity: 1;
    transform: translateY(0);
    transition-delay: calc(calc(calc(calc(0.7s + 0.06s) + 0.2s) + 0.15s) + 0.2s)
}

.hover-reveal-item .tp-award-reveal-img,
.px-offcanvas-2-area:not(.menu-open) .offcanvas-menu {
    pointer-events: none
}

.px-offcanvas-2-area:not(.menu-open) .px-offcanvas-2-right {
    opacity: 0;
    transform: translateY(30px);
    transition-delay: 0s
}

.px-offcanvas-2-area:not(.menu-open) .px-offcanvas-2-left {
    transition-delay: 0.6s;
    opacity: 0;
    transform: translateY(30px)
}

.px-offcanvas-2-area:not(.menu-open) .px-offcanvas-2-left .tp-offcanvas-menu {
    opacity: 0;
    transform: translateY(20px);
    transition-delay: 0.4s
}

.px-offcanvas-2-area:not(.menu-open) .px-offcanvas-2-left .px-offcanvas-2-left-btn-box {
    opacity: 0;
    transform: translateY(20px);
    transition-delay: 0.2s
}

.px-offcanvas-2-area:not(.menu-open) .offcanvas-bg {
    clip-path: circle(0% at calc(100% - 45px) 45px);
    transition-delay: 0.4s
}

.px-offcanvas-2-area * {
    transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1)
}

.px-offcanvas-2-area .px-offcanvas-2-left,
.px-offcanvas-2-area .px-offcanvas-2-right {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity .7s cubic-bezier(.2, .8, .2, 1), transform .7s cubic-bezier(.2, .8, .2, 1)
}

.px-offcanvas-2-area .px-offcanvas-2-left-btn-box,
.px-offcanvas-2-area .tp-offcanvas-menu {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .6s cubic-bezier(.2, .8, .2, 1), transform .6s cubic-bezier(.2, .8, .2, 1)
}

.tp-hamburger-btn.active span {
    margin: 0 auto
}

.tp-hamburger-btn.active span:first-child {
    transform: rotate(45deg) translate(3px, 2px)
}

.tp-hamburger-btn.active span:nth-child(2) {
    transform: rotate(-45deg) translate(0, 1px)
}

.px-service-5-content,
.tp-offcanvas-menu {
    margin-bottom: 80px
}

.tp-offcanvas-menu ul li>a {
    padding: 10px 0;
    display: block;
    font-size: 20px;
    font-weight: 500
}

.tp-offcanvas-menu ul li.active>.tp-menu-close i {
    top: 10px;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg)
}

.tp-offcanvas-menu ul li .submenu .submenu {
    margin-left: 30px
}

.tp-offcanvas-menu .tp-megamenu-wrapper.megamenu-white-bg {
    backdrop-filter: none;
    background: 0 0;
    box-shadow: none
}

.tp-offcanvas-menu .mega-menu {
    width: auto;
    opacity: 1;
    visibility: visible;
    transition: none;
    position: static;
    display: none;
    -webkit-transform: perspective(0) rotateX(0);
    -moz-transform: perspective(0) rotateX(0);
    -ms-transform: perspective(0) rotateX(0);
    -o-transform: perspective(0) rotateX(0);
    transform: perspective(0) rotateX(0)
}

.tp-offcanvas-menu .tp-megamenu-list ul li a {
    font-size: 17px;
    padding: 12px 20px
}

.tp-offcanvas-menu .px-megamenu-box li a,
.tp-offcanvas-menu .tp-submenu>li>a {
    padding: 8px 20px;
    border-radius: 10px;
    font-size: 17px
}

.tp-offcanvas-menu .px-megamenu-box li a:hover,
.tp-offcanvas-menu .tp-submenu>li>a:hover {
    background-color: #f8f8fb;
    color: var(--tp-common-black)
}

.tp-offcanvas-menu .px-megamenu-box {
    padding: 20px 0
}

.tp-menu-close {
    position: absolute;
    right: 7px;
    top: 12px
}

.tp-menu-close i {
    transition: .3s;
    font-size: 18px;
    font-weight: 500
}

.menu-item-has-children .tp-menu-close {
    right: 14px;
    top: 9px
}

.px-footer-col-2 {
    padding-left: 150px;
    padding-right: 50px
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-footer-col-2 {
        padding-left: 130px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-footer-col-2 {
        padding-left: 55px
    }
    .px-footer-col-3 {
        padding-left: 0
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-footer-col-2 {
        padding-left: 40px;
        padding-right: 0
    }
}

.px-footer-widget-title {
    font-weight: 700;
    font-size: 80px;
    line-height: 1;
    margin-bottom: 30px;
    letter-spacing: -.06em;
    color: var(--tp-common-px-white)
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-footer-widget-title {
        font-size: 75px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-footer-widget-title {
        font-size: 60px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-footer-col-2 {
        padding-left: 0;
        padding-right: 0
    }
    .px-footer-widget-title {
        font-size: 65px
    }
    .px-footer-widget-title br {
        display: none
    }
}

.px-footer-widget-title-sm {
    font-weight: 600;
    font-size: 18px;
    line-height: 1;
    letter-spacing: -.02em;
    color: var(--tp-common-px-white)
}

.px-footer-widget-title-sm.pre::before {
    content: "";
    width: 8px;
    height: 8px;
    margin-right: 9px;
    border-radius: 50%;
    display: inline-block;
    transform: translateY(-2px);
    background-color: var(--tp-common-px-white)
}

.px-footer-widget-social a {
    height: 42px;
    width: 42px;
    line-height: 39px;
    text-align: center;
    border-radius: 50%;
    display: inline-block;
    color: var(--tp-common-px-white);
    background-color: rgba(255, 255, 255, .1);
    margin-bottom: 8px
}

.px-copyright-left span,
.px-copyright-right a,
.px-footer-widget-info a {
    line-height: 1.5;
    color: var(--tp-common-px-white);
    font-size: 16px
}

.px-footer-widget-social a:not(:last-child) {
    margin-right: 3px
}

.px-footer-widget-menu ul li {
    list-style-type: none;
    display: inline-block
}

.px-footer-widget-menu ul li a {
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    border-radius: 20px;
    padding: 13px 20px;
    display: inline-block;
    margin-bottom: 8px;
    letter-spacing: -.02em;
    text-transform: uppercase;
    color: var(--tp-common-px-white);
    background-color: rgba(255, 255, 255, .1)
}

.px-footer-widget-info a {
    display: block;
    font-weight: 400;
    letter-spacing: -.02em
}

.px-copyright-big-text {
    font-size: 290px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.06em;
    transform: translateX(-10px);
    color: var(--tp-common-px-red)
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-copyright-big-text {
        font-size: 234px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-copyright-big-text {
        font-size: 185px;
        letter-spacing: -10px;
        margin-bottom: 0
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-copyright-big-text {
        font-size: 150px;
        letter-spacing: -7px;
        margin-bottom: 0
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-copyright-big-text {
        font-size: 116px;
        letter-spacing: -7px;
        margin-bottom: 0
    }
}

@media (max-width:767px) {
    .px-offcanvas-2-area .offcanvas-bg {
        margin: 5px
    }
    .px-footer-area {
        padding-top: 80px
    }
    .px-footer-col-2 {
        padding-left: 0;
        padding-right: 0
    }
    .px-footer-col-3 {
        padding: 0
    }
    .px-copyright-big-text {
        font-size: 50px;
        letter-spacing: -2px;
        margin-bottom: 0
    }
}

.px-copyright-left span {
    font-weight: 400;
    letter-spacing: -.02em
}

.px-copyright-right a {
    font-weight: 500;
    letter-spacing: -.02em
}

.px-copyright-right a:not(:first-child) {
    margin-left: 120px
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-copyright-right a:not(:first-child) {
        margin-left: 80px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-copyright-right a:not(:first-child) {
        margin-left: 30px
    }
}

.px-copyright-bottom {
    padding-bottom: 55px;
    margin-top: -20px
}

.design-footer-bg {
    padding: 20px;
    border-radius: 16px
}

.design-footer-wrap {
    padding: 0 55px
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .design-footer-wrap {
        padding: 0 15px
    }
}

.design-footer-top-btn {
    transform: translateY(-45px)
}

.design-footer-top-wrap {
    padding-top: 110px
}

.design-footer-widget-title {
    font-weight: 500;
    font-size: 24px;
    line-height: 1.25;
    margin-bottom: 20px;
    letter-spacing: -.02em;
    color: var(--tp-common-px-black)
}

.design-footer-widget-title.sm {
    font-weight: 500;
    font-size: 16px;
    line-height: 1;
    margin-bottom: 20px;
    letter-spacing: -.02em;
    color: rgba(10, 10, 10, .5)
}

.design-footer-widget-input input {
    font-weight: 500;
    font-size: 20px;
    line-height: 1;
    height: 60px;
    padding: 0 60px 0 35px;
    border-radius: 40px;
    background-color: transparent;
    color: var(--tp-common-px-black);
    border: 1px solid rgba(6, 2, 0, .1)
}

.design-footer-widget-input input::-webkit-input-placeholder {
    font-weight: 500;
    font-size: 20px;
    line-height: 1;
    color: rgba(0, 0, 0, .6)
}

.design-footer-widget-input input::-moz-placeholder {
    font-weight: 500;
    font-size: 20px;
    line-height: 1;
    color: rgba(0, 0, 0, .6)
}

.design-footer-widget-input input:-moz-placeholder {
    font-weight: 500;
    font-size: 20px;
    line-height: 1;
    color: rgba(0, 0, 0, .6)
}

.design-footer-widget-input input:-ms-input-placeholder {
    font-weight: 500;
    font-size: 20px;
    line-height: 1;
    color: rgba(0, 0, 0, .6)
}

.design-footer-widget-input input::placeholder {
    font-weight: 500;
    font-size: 20px;
    line-height: 1;
    color: rgba(0, 0, 0, .6)
}

.design-footer-widget-input-icon {
    position: absolute;
    top: 50%;
    right: 10px;
    height: 40px;
    width: 40px;
    line-height: 1;
    border-radius: 50%;
    text-align: center;
    display: inline-block;
    transform: translateY(-50%);
    color: var(--tp-common-px-white)
}

.design-copyright-backtoTop a,
.design-footer-widget-info a {
    font-weight: 500;
    font-size: 24px;
    line-height: 1;
    letter-spacing: -.02em;
    color: var(--tp-common-px-black)
}

.design-footer-col-1 {
    padding-right: 40px
}

.bf-service-category,
.design-footer-col-4,
.px-service-category {
    padding-left: 50px
}

.design-footer-right {
    padding-left: 160px
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .design-footer-right {
        padding-left: 60px
    }
}

.design-copyright-text p {
    font-weight: 500;
    font-size: 18px;
    line-height: 1.2;
    margin-bottom: 0;
    letter-spacing: -.02em;
    color: rgba(10, 10, 10, .5)
}

.design-copyright-backtoTop a span {
    margin-left: 8px;
    color: var(--tp-common-px-black)
}

.px-social-mail a {
    font-weight: 600;
    font-size: 26px;
    line-height: 1;
    display: inline-block;
    letter-spacing: -.02em;
    color: var(--tp-common-px-white)
}

.px-social-mail a span {
    margin-right: 10px;
    display: inline-block
}

.px-social-mail a span svg {
    transform: translateY(-2px)
}

.px-social-bg {
    padding: 19px 0
}

.px-social-shape {
    display: inline-block;
    transform: translateY(-6px)
}

.px-social-black-bg {
    padding: 19px 20px;
    border-radius: 8px
}

.px-social-icon a {
    position: relative;
    display: inline-block
}

.px-social-icon a span {
    left: 0;
    opacity: 0;
    bottom: 0;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    position: absolute;
    visibility: hidden;
    letter-spacing: -.28px;
    color: var(--tp-common-px-white)
}

.px-social-icon a img {
    position: relative;
    top: 0;
    transition: .4s ease-in-out;
    transform-origin: 50% 50%
}

.px-social-icon a:first-child img,
.px-social-icon a:nth-child(2) img {
    transform: rotate(8deg)
}

.px-social-icon a:first-child:hover img,
.px-social-icon a:nth-child(2):hover img {
    top: -17px;
    transform: rotate(14deg)
}

.px-social-icon a:nth-child(3) img {
    transform: rotate(-4deg)
}

.px-social-icon a:nth-child(3):hover img {
    top: -17px;
    transform: rotate(2deg)
}

.px-social-icon a:nth-child(4) img {
    transform: rotate(-3deg);
    will-change: transform
}

.px-social-icon a:nth-child(4):hover img {
    top: -17px;
    transform: rotate(3deg)
}

.px-footer-3-slider-style .px-hero-6-text span {
    font-size: 280px;
    letter-spacing: -1.4px;
    color: var(--tp-common-px-white)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .design-footer-widget-info a {
        font-size: 20px
    }
    .px-footer-3-slider-style .px-hero-6-text span {
        font-size: 190px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-footer-3-slider-style .px-hero-6-text span {
        font-size: 150px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-footer-3-slider-style .px-hero-6-text span {
        font-size: 140px
    }
}

.px-footer-3-slider-style .px-hero-6-text span i {
    margin-right: 25px;
    display: inline-block
}

.px-footer-3-mail a,
.px-footer-3-tel a {
    font-size: 34px;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 20px;
    display: inline-block;
    color: var(--tp-common-px-white)
}

.px-footer-3-mail a {
    font-size: 130px
}

.px-footer-3-input input,
.px-footer-3-input textarea {
    padding: 0 55px 0 23px;
    font-size: 17px;
    font-weight: 500;
    border-radius: 72px;
    letter-spacing: -.17px;
    background-color: transparent;
    color: rgba(255, 255, 255, .7);
    border: 1px solid rgba(255, 255, 255, .1)
}

.px-footer-3-btn,
.px-hero-4-scrolldown {
    text-align: center;
    border-radius: 50%;
    place-content: center
}

.px-footer-3-input input::-webkit-input-placeholder,
.px-footer-3-input textarea::-webkit-input-placeholder {
    font-size: 17px;
    font-weight: 500;
    letter-spacing: -.17px;
    color: rgba(255, 255, 255, .7)
}

.px-footer-3-input input::-moz-placeholder,
.px-footer-3-input textarea::-moz-placeholder {
    font-size: 17px;
    font-weight: 500;
    letter-spacing: -.17px;
    color: rgba(255, 255, 255, .7)
}

.px-footer-3-input input:-moz-placeholder,
.px-footer-3-input textarea:-moz-placeholder {
    font-size: 17px;
    font-weight: 500;
    letter-spacing: -.17px;
    color: rgba(255, 255, 255, .7)
}

.px-footer-3-input input:-ms-input-placeholder,
.px-footer-3-input textarea:-ms-input-placeholder {
    font-size: 17px;
    font-weight: 500;
    letter-spacing: -.17px;
    color: rgba(255, 255, 255, .7)
}

.px-footer-3-input input::placeholder,
.px-footer-3-input textarea::placeholder {
    font-size: 17px;
    font-weight: 500;
    letter-spacing: -.17px;
    color: rgba(255, 255, 255, .7)
}

.px-footer-3-input textarea {
    resize: none;
    line-height: 56px
}

.px-footer-3-btn {
    position: absolute;
    top: 50%;
    right: 8px;
    height: 40px;
    width: 40px;
    display: grid;
    transition: .3s;
    transform: translateY(-50%);
    color: var(--tp-common-px-black);
    background-color: var(--tp-common-px-white)
}

.px-hero-2-thumb,
.px-hero-2-thumbs {
    transition: 1s cubic-bezier(.19, 1, .22, 1);
    filter: saturate(0)
}

.px-footer-3-social a {
    padding: 20px 40px;
    font-size: 17px;
    font-weight: 600;
    line-height: 1;
    border-radius: 72px;
    display: inline-block;
    letter-spacing: -.17px;
    background-color: #121212;
    color: rgba(255, 255, 255, .7)
}

.px-copyright-3-backtop a,
.px-copyright-3-menu ul li a,
.px-copyright-3-text p {
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.15px;
    text-transform: uppercase
}

.px-footer-3-social a span {
    margin-left: 10px;
    display: inline-block
}

.px-footer-3-select {
    width: 100%;
    display: inline-block
}

.px-copyright-3-wrap {
    padding: 30px 0;
    border-top: 1px solid rgba(255, 255, 255, .1)
}

.px-copyright-3-menu ul li a {
    margin-right: 36px;
    display: inline-block;
    color: var(--tp-common-px-white)
}

.px-copyright-3-text p {
    margin-bottom: 0;
    color: rgba(255, 255, 255, .6)
}

.px-copyright-3-backtop a {
    color: var(--tp-common-px-white)
}

.px-hero-info p,
.px-hero-subtitle {
    font-size: 22px;
    line-height: 1.4;
    margin-bottom: 25px
}

.px-hero-info p,
.px-hero-service-item span,
.px-hero-subtitle {
    font-weight: 600;
    letter-spacing: -.04em;
    color: var(--tp-common-px-white)
}

.px-copyright-3-backtop a svg {
    display: inline-block;
    transform: translateY(-2px)
}

.pixora-dark .in-blog-list-category span.active,
.pixora-dark .in-blog-list-category span:hover,
.pixora-dark .postbox-details-social a:hover,
.pixora-dark .px-btn-black.hover-orange-bg:hover,
.pixora-dark .px-footer-3-social a:hover,
.pixora-dark .tagcloud a:hover,
.px-orange-style .px-footer-widget-menu ul li a:hover,
.px-orange-style .px-footer-widget-social a:hover,
.px-orange-style .px-project-3-category span:hover {
    background-color: var(--tp-common-px-orange)
}

.px-hero-video {
    width: 300px;
    overflow: hidden
}

.px-hero-video video {
    width: 100%;
    border-radius: 16px
}

.px-hero-bg {
    padding-top: 290px;
    padding-bottom: 70px;
    background-position: bottom;
    background-size: cover;
    border-radius: 0 0 60px 60px;
    overflow: hidden
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-hero-bg {
        padding-top: 260px;
        padding-bottom: 80px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-hero-bg {
        padding-top: 220px
    }
}

.px-hero-bg-img,
.tp-image-distortion canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1
}

.px-hero-subtitle {
    display: inline-block
}

.px-hero-title {
    font-size: 140px;
    font-weight: 800;
    line-height: .9;
    text-transform: uppercase;
    color: var(--tp-common-px-white)
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-hero-title {
        font-size: 110px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-hero-title {
        font-size: 90px
    }
}

.px-hero-title-box {
    transform: translateY(20px)
}

.px-hero-2-item.active .px-hero-2-thumb img,
.px-hero-2-thumb,
.px-hero-2-thumb:hover img {
    transform: scale(1)
}

.bf-service-thumb img,
.px-about-6-thumb img,
.px-hero-info img,
.px-service-thumb img,
.px-wrapper-box {
    border-radius: 16px
}

.px-hero-service-item,
.tp-team-details-text {
    margin-bottom: 30px
}

.px-hero-service-item span {
    font-size: 18px;
    line-height: 1;
    display: block
}

.px-hero-2-content span,
.px-hero-2-contents span,
.px-hero-2-text span {
    font-weight: 700;
    line-height: 1.07;
    letter-spacing: -.05em;
    text-transform: uppercase
}

.px-hero-2-content span,
.px-hero-2-contents span,
.px-hero-2-text span,
.px-hero-4-bigtitle h2,
.px-hero-4-content p,
.px-hero-4-video-btn span {
    color: var(--tp-common-px-black)
}

.px-hero-2-thumb {
    display: flex;
    width: 130px;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    transform-origin: center center
}

.px-hero-2-thumb img {
    height: 100%;
    object-fit: cover;
    transform: scale(1.2);
    transform-origin: center center;
    transition: transform 1s cubic-bezier(.19, 1, .22, 1)
}

.px-hero-2-item.active .px-hero-2-thumb,
.px-hero-2-thumb:hover {
    filter: saturate(1);
    transform: scale(1.2)
}

.px-hero-2-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    text-align: center
}

.px-hero-2-content span {
    font-size: 30px;
    display: inline-block;
    transform: translateY(-105%);
    animation: 1s cubic-bezier(.19, 1, .22, 1) forwards text_upper
}

.px-hero-2-item.active .px-hero-2-content span {
    animation: 1s cubic-bezier(.19, 1, .22, 1) forwards text_bottom
}

.px-hero-2-text {
    position: relative;
    font-weight: 700;
    font-size: 350px;
    line-height: .7;
    letter-spacing: -.01em;
    text-transform: uppercase;
    color: var(--tp-common-px-red)
}

@media only screen and (min-width:1800px) and (max-width:1900px) {
    .px-hero-2-text {
        font-size: 320px
    }
}

@media only screen and (min-width:1701px) and (max-width:1800px) {
    .px-hero-2-text {
        font-size: 295px
    }
}

@media only screen and (min-width:1600px) and (max-width:1700px) {
    .px-hero-2-text {
        font-size: 270px
    }
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-hero-2-text {
        font-size: 220px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-copyright-3-menu ul li a {
        font-size: 14px;
        margin-right: 25px
    }
    .px-hero-2-text {
        font-size: 172px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-hero-2-text {
        font-size: 230px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-hero-2-text {
        font-size: 175px
    }
}

.px-hero-2-text i {
    flex: 0 0 auto;
    height: 10px;
    width: 420px;
    margin: 0 15px 0 30px;
    font-style: normal;
    display: inline-block;
    transform: translateY(-50px);
    background-color: var(--tp-common-px-red)
}

.px-hero-2-text span {
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    margin: 0 auto;
    font-size: 30px;
    font-family: var(--tp-ff-body)
}

.px-hero-2-contents span {
    font-size: 45px;
    display: inline-block
}

.px-hero-2-bottom-active .swiper-slide-active .px-hero-2-thumbs {
    filter: saturate(1)
}

.px-hero-3-bg {
    position: relative;
    background-position-x: center
}

.px-hero-4-content p {
    font-weight: 600;
    font-size: 40px;
    line-height: 1.1;
    margin-bottom: 30px;
    letter-spacing: -.07em
}

.px-hero-4-bigtitle h2 {
    font-size: 515px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.02em;
    text-transform: uppercase;
    transform: translateX(-27px)
}

@media only screen and (min-width:1801px) and (max-width:1900px) {
    .px-hero-4-bigtitle h2 {
        font-size: 500px
    }
}

@media only screen and (min-width:1701px) and (max-width:1800px) {
    .px-hero-4-bigtitle h2 {
        font-size: 474px
    }
}

@media only screen and (min-width:1600px) and (max-width:1700px) {
    .px-hero-4-bigtitle h2 {
        font-size: 440px;
        transform: translateX(-10px)
    }
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-hero-4-bigtitle h2 {
        font-size: 380px;
        transform: translateX(-10px)
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-hero-2-text i {
        transform: translateY(-22px)
    }
    .px-hero-2-text span {
        font-size: 20px
    }
    .px-hero-4-bigtitle h2 {
        font-size: 310px;
        transform: translateX(-10px)
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-hero-4-bigtitle h2 {
        font-size: 260px;
        transform: translateX(-15px)
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-hero-4-bigtitle h2 {
        font-size: 190px;
        transform: translateX(-10px)
    }
    .px-hero-5-thumb {
        margin-right: 30px
    }
}

.px-hero-4-scrolldown {
    height: 50px;
    width: 50px;
    display: inline-block;
    border: 1px solid rgba(10, 10, 10, .1)
}

.px-hero-4-video video {
    width: 300px;
    height: 195px;
    object-fit: cover;
    margin-bottom: 10px
}

.px-hero-4-video-btn span {
    font-weight: 500;
    font-size: 15px;
    letter-spacing: -.04em;
    text-transform: uppercase
}

.px-hero-5-thumb span {
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    color: #6d6868;
    margin-left: 10px;
    margin-bottom: 10px;
    display: inline-block;
    letter-spacing: -.01em;
    text-transform: uppercase;
    writing-mode: sideways-lr
}

.px-hero-5-content p {
    font-weight: 500;
    font-size: 36px;
    line-height: 1.1;
    margin-bottom: 170px;
    letter-spacing: -.04em;
    color: var(--tp-common-px-black)
}

.px-hero-5-category a,
.px-hero-5-content span,
.px-hero-5-social a {
    font-weight: 500;
    font-size: 14px;
    line-height: 1.3;
    color: #6d6868;
    display: inline-block;
    letter-spacing: -.01em;
    text-transform: uppercase
}

.px-about-title,
.px-hero-6-info p {
    line-height: 1.1;
    letter-spacing: -.05em
}

.px-hero-5-category span {
    flex: 0 0 auto;
    opacity: 0;
    visibility: hidden;
    transition: .3s;
    display: inline-block;
    transform: translateY(-2px)
}

.px-hero-5-category:hover span {
    opacity: 1;
    visibility: visible;
    transform: translateX(-10px) translateY(-2px)
}

.px-hero-5-pt {
    padding-top: 450px
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-hero-5-content p {
        font-size: 34px
    }
    .px-hero-5-pt {
        padding-top: 330px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-hero-5-pt {
        padding-top: 160px
    }
    .px-hero-6-social {
        margin-bottom: 25px
    }
}

.px-hero-6-bg {
    background-position-y: 80px
}

.px-hero-6-info p {
    font-weight: 600;
    font-size: 40px;
    margin-bottom: 25px;
    color: var(--tp-common-px-black)
}

.px-hero-6-category span,
.px-hero-6-social a {
    font-weight: 500;
    font-size: 14px;
    color: #575454;
    text-transform: uppercase;
    line-height: 1;
    letter-spacing: -.01em
}

.px-contact-inf-social a:not(:last-of-type),
.px-hero-6-social a:not(:last-child) {
    margin-right: 40px
}

.px-hero-6-social a span {
    margin-left: 8px
}

.px-hero-6-category span {
    transition: .3s;
    margin-bottom: 8px;
    border-radius: 20px;
    padding: 10px 20px;
    display: inline-block;
    background: #f8f8f8
}

.px-hero-6-thumb img {
    max-width: inherit;
    margin-left: -115px
}

.px-hero-6-signature {
    margin-bottom: 110px
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-hero-5-thumb-wrap {
        display: flex;
        margin-bottom: 30px
    }
    .px-hero-5-content p {
        margin-bottom: 50px
    }
    .px-hero-6-info p br {
        display: none
    }
    .px-hero-6-signature {
        margin-bottom: 40px
    }
}

.px-hero-6-text span {
    font-weight: 600;
    font-size: 140px;
    line-height: 1;
    letter-spacing: -.01em;
    text-transform: capitalize;
    color: var(--tp-common-px-black);
    font-family: var(--tp-ff-thunder)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-hero-6-social a:not(:last-child) {
        margin-right: 15px
    }
    .px-hero-6-category span {
        font-size: 13px
    }
    .px-hero-6-text span {
        font-size: 200px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-hero-6-category br {
        display: none
    }
    .px-hero-6-text span {
        font-size: 170px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-hero-6-text span {
        font-size: 150px
    }
}

.ar-funfact-item h4 i,
.px-hero-6-text span i,
.px-pd-4-work-item-title i {
    font-style: normal
}

.px-hero-6-text span i.icon-left {
    margin-left: -18px
}

.px-hero-6-btn-wrap {
    position: absolute;
    top: -90px;
    right: 30%;
    z-index: 55
}

.bf-dark .bf-header-logo .logo-white,
.bf-dark .bf-header-white.header-sticky .bf-header-logo .logo-white,
.bf-portfolio-post-thumbnail a,
.ripples canvas {
    display: block
}

.px-blur-bottom {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    bottom: 0;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    height: 80px;
    left: 0;
    -webkit-mask: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(black)) add;
    -webkit-mask: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, black 100%) add;
    mask: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(black)) add;
    mask: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, black 100%) add;
    overflow: visible;
    position: fixed;
    right: 0;
    pointer-events: none;
    z-index: 999
}

.px-about-info-body,
.px-about-info-head {
    border-radius: 16px;
    padding: 25px 30px;
    background: var(--tp-common-px-white)
}

.px-about-title {
    font-weight: 600;
    font-size: 60px;
    color: #686868
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-about-title {
        font-size: 55px
    }
    .px-about-title br {
        display: none
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-about-title {
        font-size: 45px;
        margin-bottom: 20px
    }
    .px-about-title br {
        display: none
    }
    .px-about-content {
        margin-bottom: 40px
    }
}

.px-about-content p {
    font-size: 22px;
    line-height: 1.36;
    color: #686868;
    letter-spacing: -.04em
}

.px-about-info-head {
    margin-bottom: 4px
}

.px-about-info-head h4 {
    font-weight: 600;
    font-size: 46px;
    line-height: 1;
    margin-bottom: 0;
    letter-spacing: -.07em;
    color: var(--tp-common-px-black)
}

.px-about-info-head em {
    font-weight: 600;
    font-size: 14px;
    line-height: 1;
    color: #686868;
    font-style: normal
}

.px-about-2-title,
.px-about-info-body h4,
.px-about-link {
    color: var(--tp-common-px-black)
}

.px-about-info-body {
    min-height: 250px
}

.px-about-info-body h4 {
    font-weight: 600;
    font-size: 18px;
    line-height: 1.3;
    margin-bottom: 40px;
    letter-spacing: -.03em
}

.px-about-info-body p {
    font-weight: 500;
    font-size: 16px;
    line-height: 1.5;
    color: #6d6868;
    margin-bottom: 0;
    letter-spacing: -.04em
}

.px-about-link {
    position: relative;
    font-weight: 500;
    font-size: 16px;
    line-height: 1
}

.px-about-2-subtitle,
.px-about-2-title {
    font-weight: 700;
    font-family: var(--tp-ff-thunder);
    text-transform: uppercase
}

.px-about-link>span {
    display: inline-block;
    padding-bottom: 5px
}

.px-about-link:hover::after {
    width: 0
}

.px-about-2-title {
    flex: 0 0 auto;
    font-size: 350px;
    line-height: .74;
    margin-bottom: 0;
    letter-spacing: -.01em
}

@media only screen and (min-width:1600px) and (max-width:1700px) {
    .px-about-2-title {
        font-size: 322px
    }
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-about-2-title {
        font-size: 275px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-about-2-title {
        font-size: 225px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-about-2-title {
        font-size: 200px
    }
    .px-about-2-title br,
    .px-about-2-title em img {
        display: none
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-about-2-title {
        font-size: 150px;
        margin-bottom: 30px
    }
    .px-about-2-title br {
        display: none
    }
}

.px-about-2-title em,
.px-about-2-title i,
.px-about-3-content p>i {
    font-style: normal;
    color: var(--tp-common-px-red)
}

.px-about-2-title i {
    font-size: 80px;
    line-height: .87;
    display: inline-block;
    letter-spacing: normal;
    text-transform: uppercase;
    transform: translateX(-30px)
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-about-2-title i {
        transform: translateX(-10px)
    }
}

.px-about-2-title em {
    position: relative;
    padding-left: 330px
}

.px-about-2-title em img {
    position: absolute;
    top: -18%;
    left: -15%;
    z-index: 2
}

.px-about-2-title>span {
    position: absolute;
    bottom: 32%;
    width: 76%;
    left: 105%;
    height: 10px;
    display: inline-block;
    background-color: var(--tp-common-px-black)
}

.px-about-2-title.fs-300 {
    font-size: 300px
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-about-2-title em img {
        top: -46%;
        left: -19%;
        transform: scale(.7)
    }
    .px-about-2-title.fs-300 {
        font-size: 225px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-about-2-title.fs-300 {
        font-size: 200px
    }
    .px-about-2-subtitle-box {
        display: flex;
        justify-content: end;
        align-items: center
    }
    .px-about-2-subtitle-box .px-btn-zikzak {
        margin-bottom: 0;
        margin-right: 20px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-about-2-title.fs-300 {
        font-size: 150px
    }
}

.px-about-2-title.fs-300 em {
    padding-left: 240px
}

.px-about-2-title.fs-300 em img {
    top: 2%;
    left: 0
}

.px-about-2-title.fs-300 i {
    font-size: 58px
}

.px-about-2-subtitle {
    font-size: 160px;
    line-height: .81;
    text-align: end;
    padding-bottom: 17px;
    display: inline-block;
    color: var(--tp-common-px-black)
}

.px-about-3-bigtext,
.px-about-3-content p {
    line-height: 1;
    color: var(--tp-common-px-black)
}

.px-about-2-subtitle.fs-130 {
    font-size: 40px;
    color: #fff
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-about-2-subtitle.fs-130 {
        font-size: 100px
    }
}

.px-about-2-subtitle i {
    position: absolute;
    bottom: 16%;
    width: 76%;
    right: 100%;
    height: 10px;
    margin-right: 15px;
    display: inline-block
}

@media only screen and (min-width:1600px) and (max-width:1700px),
only screen and (min-width:1400px) and (max-width:1599px) {
    .px-about-2-subtitle {
        font-size: 125px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .px-hero-6-info p {
        font-size: 35px
    }
    .px-about-info-body p br {
        display: none
    }
    .px-about-2-subtitle {
        font-size: 100px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-about-2-subtitle-box {
        display: flex;
        justify-content: end;
        align-items: start
    }
    .px-about-2-subtitle-box .px-btn-zikzak {
        margin-bottom: 0;
        margin-right: 20px;
        transform: translateY(-10px)
    }
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .px-copyright-bottom {
        padding-bottom: 30px
    }
    .px-footer-3-mail a {
        font-size: 90px
    }
    .px-hero-title-wrap {
        padding-bottom: 70px
    }
    .px-hero-5-style .px-hero-4-video video {
        width: 100%;
        height: 100%;
        margin-top: 40px
    }
    .px-hero-6-btn-wrap {
        right: 7%
    }
    .px-about-2-area {
        padding-bottom: 80px
    }
    .px-about-3-ptb {
        padding-bottom: 0
    }
}

.px-about-3-area {
    border-bottom: 1px solid rgba(30, 30, 30, .06)
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-about-3-area {
        padding-top: 110px;
        padding-bottom: 70px
    }
}

.px-about-3-bigtext {
    font-size: 140px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: capitalize;
    font-family: var(--tp-ff-thunder)
}

@media only screen and (min-width:1701px) and (max-width:1800px) {
    .px-about-3-bigtext {
        font-size: 350px
    }
}

@media only screen and (min-width:1600px) and (max-width:1700px) {
    .px-about-3-bigtext {
        font-size: 350px
    }
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-about-3-bigtext {
        font-size: 140px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-about-2-title.fs-300 em img {
        top: -11%
    }
    .px-about-3-bigtext {
        font-size: 120px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-about-3-bigtext {
        font-size: 212px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-about-3-bigtext {
        font-size: 155px
    }
}

@media (max-width:767px) {
    .px-copyright-right a:not(:first-child) {
        margin: 0 10px;
        font-size: 14px
    }
    .px-copyright-bottom {
        margin-top: 0;
        padding-bottom: 20px
    }
    .px-social-mail a {
        font-size: 25px;
        margin-bottom: 30px
    }
    .px-footer-3-slider-style .px-hero-6-text span {
        font-size: 90px
    }
    .px-footer-3-slider-style .px-hero-6-text span i {
        margin-right: 10px
    }
    .px-footer-3-mail a {
        font-size: 60px
    }
    .px-footer-3-social a {
        padding: 14px 15px;
        font-size: 14px
    }
    .px-copyright-3-menu ul li a {
        font-size: 13px;
        margin-right: 12px;
        margin-bottom: 15px
    }
    .px-hero-video {
        width: 100%
    }
    .px-hero-bg {
        padding-top: 210px
    }
    .px-hero-title {
        font-size: 60px;
        line-height: 1;
        margin-bottom: 20px
    }
    .px-hero-title-wrap {
        padding-bottom: 40px
    }
    .px-about-content p,
    .px-hero-info p {
        font-size: 18px
    }
    .px-about-2-subtitle i,
    .px-about-2-title br,
    .px-about-content p br,
    .px-about-title br,
    .px-hero-4-content p br,
    .px-hero-5-category span,
    .px-hero-5-content p br,
    .px-hero-info p br {
        display: none
    }
    .px-about-2-title.fs-300,
    .px-hero-2-text {
        font-size: 85px
    }
    .px-hero-2-contents span {
        font-size: 25px
    }
    .px-hero-2-slider-wrap {
        padding-bottom: 60px
    }
    .px-hero-4-content p {
        font-size: 37px;
        margin-bottom: 20px
    }
    .px-hero-4-bigtitle h2 {
        font-size: 95px;
        transform: translateX(0)
    }
    .px-hero-5-content p {
        font-size: 28px;
        margin-bottom: 50px
    }
    .px-hero-5-style .px-hero-4-video video {
        width: 100%;
        height: 100%
    }
    .px-hero-6-info p {
        font-size: 35px
    }
    .px-hero-6-social a:not(:last-child) {
        margin-right: 30px
    }
    .px-hero-6-signature {
        margin-bottom: 30px
    }
    .px-hero-6-text span {
        font-size: 110px
    }
    .px-hero-6-btn-wrap {
        position: relative;
        top: 0;
        right: 0;
        margin-left: 15px;
        margin-bottom: 20px
    }
    .px-about-title {
        font-size: 35px;
        margin-bottom: 20px
    }
    .px-about-2-title {
        font-size: 85px;
        margin-bottom: 30px
    }
    .px-about-2-title i {
        transform: translateX(0)
    }
    .px-about-2-subtitle.fs-130 {
        font-size: 27px;
        margin-top: 100px
    }
    .px-about-2-subtitle-box {
        display: flex;
        justify-content: end;
        align-items: start
    }
    .px-about-2-subtitle-box .px-btn-zikzak {
        margin-bottom: 0;
        margin-right: 20px;
        transform: translateY(-10px)
    }
    .px-about-2-area {
        padding-bottom: 80px
    }
    .px-about-3-ptb {
        padding-bottom: 0
    }
    .px-about-3-bigtext {
        font-size: 36px
    }
}

.px-about-3-content p {
    font-weight: 500;
    font-size: 80px;
    margin-bottom: 25px;
    letter-spacing: -.01em;
    font-family: var(--tp-ff-thundermed)
}

.am-hero-title,
.px-inner-about-1-top p,
.px-portfolio-title,
.px-project-5-title {
    font-family: var(--tp-ff-thunder)
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-about-3-content p {
        font-size: 70px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-about-3-content p {
        font-size: 57px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-about-3-content p {
        font-size: 75px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-about-3-content p {
        font-size: 60px
    }
}

.px-about-3-gift-img {
    margin-bottom: 40px;
    max-width: inherit;
    display: inline-block;
    transform: translateX(-300px)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-about-3-gift-img {
        max-width: 100%;
        transform: translateX(0)
    }
    .px-about-4-content p br {
        display: none
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-about-3-gift-img {
        max-width: 100%;
        transform: translateX(-120px)
    }
    .px-about-6-area {
        padding-top: 40px;
        padding-bottom: 80px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-about-3-gift-img {
        max-width: 100%;
        margin-top: -90px;
        transform: translateX(0) scale(.7)
    }
}

.px-about-4-content p {
    font-weight: 500;
    font-size: 20px;
    line-height: 1.5;
    color: #878787;
    letter-spacing: -.02em
}

.px-about-4-link {
    font-weight: 500;
    font-size: 16px;
    line-height: 1.8;
    letter-spacing: -.01em;
    color: var(--tp-common-px-white)
}

.bf-service-item-3-btn a,
.px-about-4-link span,
.px-pd-4-about-list,
.px-service-6-wrap,
.tp-contact-us-text a {
    display: inline-block
}

.px-about-5-style .px-section-title.ff-inter {
    font-weight: 600;
    font-size: 130px;
    line-height: .92;
    letter-spacing: -.06em;
    text-transform: uppercase;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-about-5-style .px-section-title.ff-inter {
        font-size: 110px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .px-about-5-style .px-section-title.ff-inter {
        font-size: 95px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-about-5-style .px-section-title.ff-inter {
        font-size: 75px
    }
}

.px-about-5-style .px-about-4-content p {
    font-weight: 400;
    font-size: 22px;
    line-height: 1.3;
    color: #686868;
    letter-spacing: -.04em
}

.px-about-area {
    align-content: center;
    align-items: center;
    display: flex;
    flex: none;
    flex-direction: column;
    flex-wrap: nowrap;
    height: min-content;
    justify-content: center;
    overflow: hidden;
    position: relative;
    width: 100%
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-about-6-top {
        margin-bottom: 60px
    }
    .px-about-6-thumb {
        padding-top: 0
    }
}

.px-about-6-content p {
    font-weight: 500;
    font-size: 18px;
    line-height: 1.2;
    padding-right: 10px;
    margin-bottom: 0px;
    letter-spacing: 0;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-about-6-content p {
        font-size: 16px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-about-6-content p {
        font-size: 25px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-about-6-content p {
        font-size: 35px;
        padding-right: 0;
        margin-bottom: 0px
    }
}

.px-about-6-content p span {
    font-weight: 800
}

.px-inner-about-style .px-about-3-content p {
    font-size: 50px;
    font-weight: 600;
    margin-bottom: 50px;
    letter-spacing: -2px;
    font-family: var(--tp-ff-p)
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-inner-about-style .px-about-3-content p {
        font-size: 42px;
        margin-bottom: 30px
    }
}

@media only screen and (min-width:1400px) and (max-width:1599px),
only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:768px) and (max-width:991px),
(max-width:767px) {
    .px-inner-about-style .px-about-3-content p br {
        display: none
    }
}

.px-inner-about-1-top p {
    margin-bottom: 0;
    font-size: 100px;
    line-height: 1;
    letter-spacing: -1px;
    text-transform: uppercase;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .px-inner-about-1-top p {
        font-size: 85px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-inner-about-1-top p {
        font-size: 75px
    }
}

.px-inner-about-1-video video {
    position: relative;
    z-index: -1;
    width: 770px;
    margin-left: -55px;
    margin-top: -50px
}

.px-inner-about-1-content p {
    font-size: 18px;
    font-weight: 500;
    line-height: 40px;
    color: var(--tp-common-px-black)
}

.aus-service-content label,
.aus-service-content span {
    line-height: 1;
    letter-spacing: -.2px;
    color: var(--tp-common-px-black);
    text-transform: uppercase
}

.px-inner-about-1-content p.fw-400 {
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
    color: #5d5d5d;
    letter-spacing: -.36px
}

.aus-service-content label {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 15px
}

.aus-service-content span {
    font-size: 18px;
    font-weight: 400;
    margin-right: 40px;
    display: inline-block
}

.aus-service-content h4 {
    font-size: 42px;
    font-weight: 500;
    margin-bottom: 0;
    letter-spacing: -3px;
    color: var(--tp-common-px-black)
}

.aus-service-content p {
    font-weight: 400;
    font-size: 16px;
    line-height: 1.6;
    color: #5d5d5d;
    margin-bottom: 0;
    letter-spacing: -.04em
}

.am-skill-item h4,
.inner-service-1-left ul li:not(:last-child) {
    margin-bottom: 12px
}

@media only screen and (min-width:1200px) and (max-width:1399px),
(max-width:767px) {
    .aus-service-content p br {
        display: none
    }
}

.aus-service-content-wrap {
    border-bottom: 1px solid rgba(0, 0, 0, .1)
}

.aus-service-item {
    padding: 29px 20px;
    border-top: 1px solid rgba(0, 0, 0, .1)
}

.am-hero-title {
    font-size: 424px;
    font-weight: 700;
    line-height: .75;
    text-transform: uppercase;
    color: var(--tp-common-px-orange)
}

.am-about-content p,
.am-skill-item h4,
.am-skill-item ul li span,
.px-project-title {
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .am-hero-title {
        font-size: 350px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .am-hero-title {
        font-size: 200px
    }
}

@media (max-width:767px) {
    .px-about-3-content p {
        font-size: 35px
    }
    .px-about-3-content p br,
    .px-about-4-content p br {
        display: none
    }
    .px-about-3-gift-img {
        max-width: 100%;
        margin-top: -50px;
        transform: translateX(65px) scale(.7);
        margin-left: -168px
    }
    .px-about-4-content p {
        font-size: 17px
    }
    .px-about-5-style .px-section-title.ff-inter {
        font-size: 50px
    }
    .px-about-6-content p {
        font-size: 25px;
        padding-right: 0;
        margin-bottom: 10px
    }
    .px-inner-about-style .px-about-3-content p {
        font-size: 38px;
        margin-bottom: 30px
    }
    .px-inner-about-1-style {
        padding-top: 100px
    }
    .px-inner-about-1-top p {
        font-size: 54px
    }
    .px-inner-about-1-video video {
        width: 100%;
        margin-left: 0
    }
    .aus-service-content label.pl-20 {
        padding-left: 0
    }
    .aus-service-item .aus-service-content {
        margin-bottom: 20px
    }
    .am-hero-title {
        font-size: 120px
    }
}

.am-hero-title i {
    font-style: normal;
    display: inline-block
}

.am-hero-img-wrap {
    padding: 0 40px;
    margin-top: -145px
}

.am-hero-img-wrap .signature {
    margin-top: -117px
}

.am-hero-img-wrap .am-hero-img-main img,
.bf-about-4-thumb img,
.bf-portfolio-item img,
.bf-portfolio-post-thumbnail img,
.bf-team-thumb img,
.tp-blog-thumb {
    border-radius: 20px
}

.am-about-content p {
    font-size: 80px;
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: -.48px;
    font-family: var(--tp-ff-thundermed)
}

@media only screen and (min-width:1400px) and (max-width:1599px),
only screen and (min-width:1200px) and (max-width:1399px) {
    .px-offcanvas-2-left .tp-offcanvas-menu {
        margin-bottom: 65px
    }
    .am-about-content p {
        font-size: 72px
    }
    .px-project-3-inner-box p br {
        display: none
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .am-hero-img-wrap {
        margin-top: 0
    }
    .am-about-content p {
        font-size: 70px
    }
}

.am-about-content p img {
    border-radius: 10px;
    transition: .5s ease-in-out
}

.am-about-content p img:hover {
    transform: scale(1.4)
}

@media only screen and (min-width:1400px) and (max-width:1599px),
only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .am-about-inner-ptb {
        padding-top: 0
    }
}

.am-skill-bdr,
.px-contact-info-wrap {
    border-top: 1px solid rgba(30, 30, 30, .08)
}

.am-skill-item h4 {
    font-size: 34px;
    letter-spacing: -1.7px
}

.am-skill-item ul li span {
    font-size: 18px;
    font-weight: 400;
    line-height: 32px;
    letter-spacing: -.36px
}

.am-skill-item ul li span::before {
    content: "";
    height: 6px;
    width: 6px;
    margin-right: 12px;
    border-radius: 50%;
    display: inline-block;
    transform: translateY(-3px);
    background-color: var(--tp-common-px-black)
}

.am-capsule-style .px-capsule-title-wrapper {
    padding: 60px 0 0 60px
}

.am-capsule-style .px-capsule-inner {
    border: 0;
    border-radius: 20px;
    background-color: #f6f6f6
}

.am-capsule-style .px-capsule-item {
    background-color: #ffff
}

.am-capsule-style .px-capsule-top-wrapper .px-capsule-item-wrapper {
    height: 540px;
    pointer-events: none;
    margin-top: -170px
}

.px-project-content p {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 0;
    padding-left: 10px;
    letter-spacing: -.04em
}

.px-project-item {
    padding: 6px;
    border-radius: 16px;
    background-color: #fff
}

.px-project-thumb .ripple-image {
    border-radius: 12px;
    overflow: hidden
}

.px-project-title {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 0;
    letter-spacing: -.03em
}

.px-project-content {
    padding: 13px 20px 18px
}

.px-award-label label,
.px-project-content span {
    font-weight: 400;
    font-size: 14px;
    line-height: 1;
    letter-spacing: -.01em
}

.px-portfolio-item img {
    width: 100%;
    border-radius: 20px
}

.px-portfolio-thumb {
    position: relative;
    border-radius: 20px;
    overflow: hidden
}

.px-portfolio-thumb::after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(20, 20, 20, 0) 0, rgba(20, 20, 20, .4) 100%)
}

.px-portfolio-category {
    top: 45px;
    left: 50px;
    z-index: 2;
    position: absolute
}

.px-portfolio-category.portfolio-meta {
    left: auto;
    right: 50px
}

.px-portfolio-category span {
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    border-radius: 20px;
    padding: 7px 12px;
    transition: .3s;
    letter-spacing: .4px;
    display: inline-block;
    text-transform: uppercase;
    color: var(--tp-common-px-white);
    border: 1px solid rgba(255, 255, 255, .2)
}

.px-portfolio-category span:hover {
    color: var(--tp-common-px-black);
    border-color: var(--tp-common-px-white);
    background-color: var(--tp-common-px-white)
}

.px-portfolio-content {
    left: 0;
    right: 0;
    bottom: 50px;
    text-align: center;
    position: absolute;
    display: inline-block
}

.px-portfolio-title {
    font-size: 180px;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 0;
    display: inline-block;
    color: var(--tp-common-px-white)
}

.px-project-3-category span,
.px-project-3-title {
    font-weight: 600;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-portfolio-title {
        font-size: 125px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-portfolio-title {
        font-size: 110px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-portfolio-title {
        font-size: 90px
    }
    .px-project-5-area {
        padding-bottom: 0
    }
}

.px-portfolio-wrap {
    padding: 0 35px
}

.px-project-3-title {
    font-size: 26px;
    padding-right: 30px;
    letter-spacing: -.05em
}

.px-project-3-category span {
    font-size: 12px;
    padding: 2px 19px;
    border-radius: 32px;
    transition: .3s;
    display: inline-block;
    text-transform: uppercase;
    border: 1px solid rgba(30, 30, 30, .08)
}

.px-pd-4-about-title svg,
.px-project-3-category span:not(:first-child) {
    margin-left: 5px
}

.px-project-3-thumb {
    height: 640px;
    overflow: hidden;
    border-radius: 10px;
    margin-bottom: 25px
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:768px) and (max-width:991px) {
    .px-about-content p br {
        display: none
    }
    .px-project-3-thumb {
        height: 550px
    }
}

.px-project-3-thumb img {
    height: 100%;
    object-fit: cover;
    border-radius: 10px
}

.px-gallery-item img,
.px-gallery-item video,
.px-project-3-thumb video {
    height: 100%;
    width: 100%;
    object-fit: cover
}

.px-project-3-thumb .ripple-image {
    height: 100%
}

.px-project-3-inner-box p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    color: #6b7280;
    margin-bottom: 0;
    padding-right: 20px;
    letter-spacing: -.03em
}

.px-project-5-title {
    font-size: 345px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase
}

@media only screen and (min-width:1801px) and (max-width:1900px) {
    .px-project-5-title {
        font-size: 335px
    }
}

@media only screen and (min-width:1701px) and (max-width:1800px) {
    .px-project-5-title {
        font-size: 315px
    }
}

@media only screen and (min-width:1600px) and (max-width:1700px) {
    .px-project-5-title {
        font-size: 295px
    }
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-project-5-title {
        font-size: 260px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-project-3-title {
        font-size: 22px
    }
    .px-project-3-category span {
        padding: 2px 14px
    }
    .px-project-5-title {
        font-size: 210px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-project-3-title {
        font-size: 18px;
        padding-right: 20px
    }
    .px-project-3-category span {
        font-size: 11px;
        padding: 2px 12px
    }
    .px-project-3-category span:not(:first-child) {
        margin-left: 2px
    }
    .px-project-3-thumb {
        height: 500px
    }
    .px-project-3-inner-box p {
        font-size: 14px
    }
    .px-project-3-inner-box p br {
        display: none
    }
    .px-project-4-style .px-project-3-content {
        flex-wrap: wrap
    }
    .px-project-5-title {
        font-size: 173px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-project-5-title {
        font-size: 130px
    }
}

.px-project-5-title-sm {
    font-weight: 600;
    font-size: 20px;
    line-height: 1;
    margin-bottom: 0;
    letter-spacing: -.03em;
    color: #fff
}

.pf-3-hero-title,
.px-project-6-title {
    line-height: .75;
    font-family: var(--tp-ff-thunder);
    text-transform: uppercase
}

.px-project-5-btn {
    bottom: 4%;
    right: 13%;
    position: absolute
}

.px-project-5-content span {
    font-size: 18px;
    font-weight: 400;
    color: #6d6868
}

.px-project-6-content p,
.px-project-6-content span,
.px-project-6-title {
    color: #d3d3d3;
    letter-spacing: -.01em;
    transition: .3s
}

.px-project-5-content span::before {
    content: "";
    height: 2px;
    width: 7px;
    margin: 0 10px;
    display: inline-block;
    transform: translateY(-4px);
    background-color: #6d6868
}

.px-project-5-thumb {
    margin-bottom: 25px;
    border-radius: 30px
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .px-project-5-btn {
        bottom: 50%;
        transform: scale(.7)
    }
    .px-gallery-area {
        padding-top: 80px;
        padding-bottom: 80px
    }
}

.px-gallery-item {
    width: 520px;
    height: 400px;
    overflow: hidden;
    border-radius: 16px
}

.px-project-6-title {
    font-size: 180px;
    font-weight: 600;
    margin-bottom: 0
}

@media only screen and (min-width:1600px) and (max-width:1700px) {
    .px-project-6-title {
        font-size: 150px
    }
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-project-6-title {
        font-size: 120px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .postbox-blockquote-paragraph p br {
        display: none
    }
    .px-project-6-title {
        font-size: 100px
    }
}

.px-project-6-content span {
    padding-top: 15px;
    padding-right: 10px;
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    text-transform: uppercase
}

.px-project-6-content p {
    font-weight: 500;
    font-size: 18px;
    line-height: 1
}

.pf-3-hero-title,
.pf-hero-content p,
.pf-hero-content span {
    color: var(--tp-common-px-black)
}

.px-project-6-item {
    padding: 70px 0 30px;
    border-bottom: 1px dashed rgba(30, 30, 30, .09)
}

.px-project-6-img-wrap {
    width: 330px;
    height: 330px;
    opacity: 0;
    position: absolute;
    overflow: hidden;
    transform: translate(-50%, -50%);
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 3
}

.px-project-6-img-slider {
    display: flex;
    flex-direction: column
}

.px-project-6-img-slider img {
    width: 330px;
    height: 330px;
    object-fit: cover;
    object-position: center
}

.pf-hero-ptb {
    padding-top: 450px;
    padding-bottom: 60px;
    border-bottom: 1px solid rgba(10, 10, 10, .08)
}

.px-project-inner-5-top,
.px-project-inner-top-ptb,
.px-project-inner-wrapper {
    border-bottom: 1px solid rgba(30, 30, 30, .08)
}

.pf-hero-content p {
    font-size: 80px;
    line-height: 1;
    margin-bottom: 0;
    letter-spacing: -.48px;
    font-family: var(--tp-ff-thundermed)
}

@media only screen and (min-width:1600px) and (max-width:1700px) {
    .pf-hero-content p {
        font-size: 72px
    }
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .pf-hero-content p {
        font-size: 65px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .pf-hero-content p {
        font-size: 60px
    }
    .pf-6-hero-ptb {
        padding-bottom: 70px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .pf-hero-content p {
        font-size: 55px
    }
}

.pf-hero-content span {
    font-size: 22px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: -.9px
}

.pf-3-hero-title {
    font-size: 300px;
    font-weight: 700;
    letter-spacing: -3px
}

.pf-4-hero-subtitle,
.pf-4-hero-title {
    font-family: var(--tp-ff-thundermed);
    color: var(--tp-common-px-black-2)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .pf-3-hero-title {
        font-size: 250px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .pf-3-hero-title {
        font-size: 190px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .pf-3-hero-title {
        font-size: 145px
    }
    .pf-4-hero-ptb {
        padding-top: 180px;
        padding-bottom: 30px
    }
}

@media (max-width:767px) {
    .am-hero-img-wrap {
        margin-top: 0;
        padding: 0
    }
    .am-about-content p {
        line-height: 1;
        font-size: 60px
    }
    .am-about-content p img {
        transform: scale(.8)
    }
    .px-project-3-inner-box p br,
    .px-project-5-btn,
    .px-project-title-box br {
        display: none
    }
    .px-portfolio-category {
        top: 15px;
        left: 15px
    }
    .px-portfolio-category.portfolio-meta {
        right: 15px
    }
    .px-portfolio-category span {
        font-size: 12px;
        padding: 7px
    }
    .px-portfolio-content {
        bottom: 5px
    }
    .px-portfolio-title {
        font-size: 60px
    }
    .px-portfolio-wrap {
        padding: 0
    }
    .px-project-3-title {
        padding-right: 0;
        margin-bottom: 15px
    }
    .px-project-3-thumb {
        height: 400px
    }
    .px-project-3-content {
        flex-wrap: wrap
    }
    .px-project-5-area {
        padding-top: 40px;
        padding-bottom: 0
    }
    .px-project-5-title {
        font-size: 110px
    }
    .px-project-5-item {
        margin-bottom: 30px
    }
    .px-gallery-area {
        padding-top: 80px;
        padding-bottom: 0
    }
    .px-gallery-item {
        width: 300px;
        height: 200px
    }
    .px-project-6-title {
        font-size: 75px
    }
    .pf-hero-content p {
        font-size: 45px
    }
    .pf-3-hero-ptb {
        padding-top: 150px
    }
    .pf-3-hero-title {
        font-size: 70px;
        letter-spacing: 0
    }
    .pf-4-hero-ptb {
        padding-top: 150px;
        padding-bottom: 30px
    }
}

.pf-3-hero-social a {
    display: block;
    color: #575454;
    font-size: 14px;
    font-weight: 500;
    padding: 5px 13px;
    border-radius: 20px;
    text-align: center;
    letter-spacing: -.2px;
    background: var(--tp-grey-px-1)
}

.pf-3-hero-social-wrap {
    gap: 50px;
    display: flex;
    align-items: center;
    justify-content: end
}

.pf-3-hero-social-text span {
    position: relative;
    color: #575454;
    font-size: 14px;
    font-weight: 500;
    display: flex;
    align-items: center;
    letter-spacing: -.2px
}

.pf-3-hero-social-text span i {
    font-style: normal;
    flex: 0 0 auto;
    margin-left: 20px
}

.pf-3-hero-social-text span::before {
    content: "";
    width: 410px;
    height: 1px;
    display: inline-block;
    background-color: rgba(30, 30, 30, .08)
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .pf-3-hero-social-text span::before {
        width: 385px
    }
    .px-service-content p br {
        display: none
    }
}

.pf-4-hero-title {
    font-size: 200px;
    line-height: .6;
    margin-bottom: 45px;
    letter-spacing: -2px
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .pf-3-hero-social-text span::before {
        width: 255px
    }
    .pf-4-hero-title {
        font-size: 175px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .pf-3-hero-social-text span::before {
        width: 210px
    }
    .pf-4-hero-title {
        font-size: 150px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .pf-4-hero-title {
        font-size: 120px;
        margin-bottom: 20px
    }
}

.pf-4-hero-subtitle {
    font-size: 50px;
    line-height: 1;
    margin-bottom: 6px;
    display: inline-block
}

.pf-4-hero-wrap p {
    font-size: 16px;
    color: #575454;
    font-weight: 500;
    letter-spacing: -.5px
}

.pf-5-hero-subtitle {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 18px;
    display: inline-block;
    letter-spacing: -.2px;
    text-transform: uppercase;
    font-family: var(--tp-ff-p);
    color: var(--tp-common-px-black-2)
}

.pf-5-hero-title,
.pf-6-hero-title {
    font-family: var(--tp-ff-thunder);
    text-transform: uppercase
}

.pf-5-hero-title {
    font-size: 80px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .8px;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .pf-5-hero-title {
        font-size: 60px
    }
}

.pf-6-hero-title {
    font-size: 200px;
    font-weight: 700;
    line-height: .75;
    letter-spacing: -2px;
    color: var(--tp-common-px-black-2)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .pf-6-hero-title {
        font-size: 170px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .pf-6-hero-title {
        font-size: 150px
    }
    .px-pd-2-area {
        padding-bottom: 100px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .pf-6-hero-title {
        font-size: 100px
    }
}

@media (max-width:767px) {
    .pf-4-hero-title {
        font-size: 80px;
        letter-spacing: 0;
        margin-bottom: 20px
    }
    .pf-4-hero-subtitle {
        font-size: 38px
    }
    .pf-4-hero-wrap p {
        margin: 0
    }
    .pf-5-hero-title {
        font-size: 44px
    }
    .pf-5-hero-title br,
    .pf-6-hero-title br {
        display: none
    }
    .pf-6-hero-title {
        font-size: 55px;
        letter-spacing: 0;
        line-height: 1
    }
}

.px-project-inner-top-ptb {
    padding-bottom: 28px
}

.px-project-inner-style .px-project-6-item {
    border: none;
    padding: 40px 0 0
}

.px-project-inner-style .px-project-6-title {
    font-size: 100px;
    transform: translateY(10px)
}

.px-project-inner-header span {
    font-size: 14px;
    font-weight: 400;
    color: #6d6868;
    letter-spacing: -.2px;
    display: inline-block
}

.px-project-inner-wrap-content span {
    font-size: 18px;
    font-weight: 500;
    color: #d3d3d3;
    transition: .3s;
    letter-spacing: -.4px
}

.px-project-inner-wrapper {
    padding-bottom: 40px
}

.px-project-inner-4-box {
    padding: 0 25px
}

.px-project-inner-4-tab-wrap .masonary-menu button {
    font-size: 15px;
    font-weight: 500;
    color: #575454;
    padding: 8px 23px;
    border-radius: 30px;
    letter-spacing: -.2px;
    -webkit-transition: .3s ease-out;
    -moz-transition: .3s ease-out;
    -ms-transition: .3s ease-out;
    -o-transition: .3s ease-out;
    transition: .3s ease-out;
    font-family: var(--tp-ff-p);
    border: 1px solid rgba(30, 30, 30, .1)
}

.px-project-inner-4-tab-wrap .masonary-menu button.active,
.px-project-inner-4-tab-wrap .masonary-menu button:hover {
    color: var(--tp-common-px-white);
    background-color: var(--tp-common-px-black-2)
}

.px-project-inner-4-tab-wrap .masonary-menu button:not(:last-of-type) {
    margin-right: 6px
}

.px-project-inner-5-top {
    margin-bottom: 80px;
    padding-bottom: 25px
}

.px-project-inner-5-tab .masonary-menu button {
    font-size: 26px;
    font-weight: 600;
    color: #bcbcbc;
    letter-spacing: -.52px;
    font-family: var(--tp-ff-p)
}

.px-project-inner-5-tab .masonary-menu button:not(:last-of-type) {
    margin-right: 30px
}

.px-project-inner-5-count span {
    font-size: 20px;
    font-weight: 600;
    color: #bcbcbc;
    line-height: 1;
    display: inline-block;
    letter-spacing: -.4px;
    font-family: var(--tp-ff-p)
}

.px-project-inner-6-text span {
    font-size: 18px;
    font-weight: 500;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-pd-2-top {
        padding-bottom: 50px
    }
}

.px-pd-2-title {
    font-size: 140px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -7px;
    color: var(--tp-common-px-black)
}

.px-pd-2-categories span {
    font-size: 14px;
    font-weight: 600;
    padding: 4px 24px;
    position: relative;
    border-radius: 30px;
    margin-right: 10px;
    display: inline-block;
    color: var(--tp-common-px-black);
    border: 1px solid rgba(0, 0, 0, .1)
}

.px-pd-2-categories span::before {
    position: absolute;
    top: 15px;
    left: 12px;
    content: "";
    height: 5px;
    width: 5px;
    border-radius: 50%;
    background-color: var(--tp-common-px-red)
}

.px-pd-2-bottom-item span {
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 10px;
    display: inline-block;
    color: rgba(0, 0, 0, .7)
}

.px-pd-2-bottom-item h6,
.px-pd-2-overview-wrap ul li {
    font-size: 20px;
    font-weight: 600
}

.px-pd-2-bottom-item h6,
.px-pd-2-overview-title,
.px-pd-2-overview-wrap ul li,
.px-pd-2-step-item-title,
.px-pd-2-step-title {
    color: var(--tp-common-px-black)
}

.px-pd-2-banner {
    height: 950px;
    overflow: hidden
}

@media only screen and (min-width:1400px) and (max-width:1599px),
only screen and (min-width:1200px) and (max-width:1399px) {
    .px-pd-2-banner {
        height: 680px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-pd-2-banner {
        height: 600px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-pd-2-banner {
        height: 500px
    }
}

.px-pd-2-banner img {
    width: 100%;
    margin-top: -150px
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-pd-2-banner img {
        margin-top: -100px
    }
    .px-pd-2-thumb-ptb {
        padding-bottom: 100px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-pd-2-banner img {
        margin-top: -20px
    }
}

.px-pd-2-overview-title {
    font-size: 50px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -1.5px
}

.px-pd-2-overview-wrap p {
    font-size: 16px;
    font-weight: 500;
    line-height: 26px;
    margin-bottom: 24px;
    color: rgba(0, 0, 0, .6)
}

.px-pd-2-overview-wrap ul {
    padding-top: 20px;
    display: inline-block
}

.px-pd-2-overview-wrap ul li {
    margin-bottom: 20px;
    padding-bottom: 20px;
    margin-left: 16px
}

.px-pd-2-overview-wrap ul li:not(:last-of-type) {
    border-bottom: 1px solid rgba(0, 0, 0, .08)
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .px-pd-2-slider-ptb {
        padding-bottom: 100px
    }
    .px-inner-service-2-style.px-about-5-style .px-section-title.ff-inter br {
        display: none
    }
}

.px-pd-2-slider-wrapper {
    margin: 0 -200px
}

.px-pd-2-slider-wrapper .swiper-wrapper {
    padding-bottom: 40px
}

.px-pd-2-slider-thumb:hover img {
    transform: scale(1.2)
}

.px-pd-2-slider-thumb img {
    transition: .9s ease-in-out
}

.px-pd-2-dot .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    opacity: 1;
    transition: .3s;
    border-radius: 50%;
    display: inline-block;
    background: rgba(0, 0, 0, .3)
}

.px-pd-2-dot .swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 24px;
    border-radius: 10px;
    background-color: var(--tp-common-px-black)
}

.px-pd-2-step-title {
    font-size: 40px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1.2px
}

.px-pd-2-step-item-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 10px
}

.px-pd-2-step-item span {
    font-size: 15px;
    font-weight: 500;
    line-height: 24px;
    display: inline-block;
    color: rgba(0, 0, 0, .6)
}

.px-pd-2-np-content a,
.px-pd-4-about-sub,
.px-pd-4-about-text,
.px-pd-4-title,
.px-pd-4-work-title {
    color: var(--tp-common-px-black)
}

.px-pd-2-thumb-item {
    overflow: hidden;
    height: 600px
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-pd-2-title {
        font-size: 110px
    }
    .px-pd-2-thumb-item {
        height: 500px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-pd-2-thumb-item {
        height: 400px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-pd-2-thumb-item {
        height: 450px
    }
}

.px-pd-2-thumb-item img {
    margin-top: -100px;
    width: 100%
}

.px-pd-2-np-content a {
    width: 180px;
    height: 180px;
    font-size: 16px;
    font-weight: 600;
    margin: 0 -14px;
    text-align: center;
    line-height: 180px;
    border-radius: 50%;
    display: inline-block;
    border: 1px solid rgba(0, 0, 0, .1)
}

.px-pd-4-work-content p,
.px-pd-4-work-item-text span {
    font-size: 20px;
    font-weight: 400;
    color: rgba(30, 30, 30, .6);
    letter-spacing: -.4px
}

.px-pd-2-np-content a svg {
    margin: 0 4px
}

.px-pd-4-title {
    font-size: 140px;
    line-height: 1;
    letter-spacing: -2px;
    font-family: var(--tp-ff-thundermed)
}

.px-pd-4-about-sub {
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    text-transform: uppercase
}

.px-pd-4-about-text {
    font-size: 32px;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 65px;
    letter-spacing: -.64px;
    text-transform: uppercase;
    font-family: var(--tp-ff-p)
}

.px-pd-4-about-list ul li {
    position: relative;
    font-size: 18px;
    font-weight: 500;
    list-style: none;
    float: left;
    width: 50%;
    padding-left: 18px;
    margin-bottom: 14px
}

.px-pd-4-about-list ul li::before {
    position: absolute;
    content: "";
    width: 6px;
    height: 6px;
    top: 10px;
    left: 0;
    border-radius: 50%;
    background-color: var(--tp-common-px-black)
}

.px-pd-4-work-title {
    font-size: 140px;
    font-weight: 700;
    line-height: .8;
    letter-spacing: 0;
    text-transform: capitalize;
    font-family: var(--tp-ff-thundermed)
}

.px-pd-4-work-heading {
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    font-family: var(--tp-ff-p);
    color: var(--tp-common-px-black)
}

.px-pd-4-np-title,
.px-pd-4-work-item-title {
    font-weight: 600;
    color: var(--tp-common-px-black)
}

.px-pd-4-work-content p {
    line-height: 1.56
}

.px-pd-4-work-item {
    display: flex;
    align-items: center;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(30, 30, 30, .1)
}

.px-pd-4-work-item-title {
    width: 135px;
    font-size: 50px;
    margin-right: 45px;
    letter-spacing: -1px;
    font-family: var(--tp-ff-p)
}

.px-pd-4-np-content span,
.px-pd-4-np-title,
.px-service-2-title {
    font-family: var(--tp-ff-thunder)
}

.px-pd-4-thumb-wrap {
    height: 950px;
    border-radius: 20px
}

.px-pd-4-thumb-box {
    height: 800px;
    border-radius: 20px;
    overflow: hidden
}

.px-pd-4-thumb-box img {
    width: 100%;
    height: 100%;
    margin-top: -40px;
    object-fit: cover;
    border-radius: 20px
}

.px-pd-4-thumb-item {
    margin-bottom: -100%
}

.px-pd-4-slider-wrapper {
    margin: 0 -220px
}

.px-pd-4-slider-thumb {
    overflow: hidden;
    border-radius: 10px
}

.px-pd-4-np-title {
    font-size: 80px;
    line-height: 1;
    text-transform: uppercase
}

.px-pd-4-np-content span {
    font-size: 50px;
    font-weight: 500;
    display: block;
    margin-bottom: 30px;
    text-transform: uppercase;
    color: rgba(0, 0, 0, .2)
}

.px-pd-4-np-content p {
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: -.4px;
    color: rgba(0, 0, 0, .2)
}

.px-pd-4-np-box.hover-reveal-item .tp-award-reveal-img {
    width: 520px;
    height: 360px;
    object-fit: cover;
    mix-blend-mode: difference
}

.px-service-bg {
    border-radius: 40px
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px),
(max-width:767px) {
    .px-service-category {
        padding-left: 0
    }
}

.px-service-category span {
    font-size: 13px;
    line-height: 1;
    margin-bottom: 6px;
    font-weight: 600;
    padding: 11px 16px;
    border-radius: 16px;
    font-style: normal;
    display: inline-block;
    letter-spacing: 0;
    color: var(--tp-common-px-white);
    background: rgba(255, 255, 255, .08)
}

.bf-service-num span,
.px-service-num span {
    display: flex;
    font-weight: 600;
    font-size: 16px;
    letter-spacing: -.04em;
    color: rgba(255, 255, 255, .6)
}

.bf-service-title h4,
.px-service-title h4 {
    transition: .4s ease-in-out;
    font-weight: 600;
    font-size: 22px;
    text-align: start;
    margin-bottom: 0;
    letter-spacing: -.04em;
    color: var(--tp-common-px-white)
}

.bf-service-thumb,
.px-service-thumb {
    flex: 0 0 auto;
    margin-right: 55px
}

.bf-service-content p,
.px-service-content p {
    font-weight: 600;
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 0;
    letter-spacing: -.04em;
    color: rgba(255, 255, 255, .6)
}

.pixora-dark .pf-hero-ptb,
.pixora-dark .px-pd-2-overview-wrap ul li:not(:last-of-type),
.pixora-dark .px-pd-4-work-item,
.pixora-dark .px-project-inner-top-ptb,
.pixora-dark .px-service-2-item,
.px-service-accordion-wrap .accordion-items {
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

.px-accordion-item {
    overflow: hidden;
    padding: 30px;
    border: 1px solid rgba(255, 255, 255, .1)
}

.px-accordion-item.active .px-service-top {
    margin-top: 0
}

.px-accordion-item.active .px-service-title h4 {
    opacity: 0;
    visibility: hidden
}

.px-award-content>span {
    font-weight: 600;
    font-size: 30px;
    line-height: 1;
    letter-spacing: -.07em;
    color: var(--tp-common-px-black)
}

.px-award-item {
    padding: 27px 0;
    border-bottom: 1px solid rgba(10, 10, 10, .08)
}

.px-award-item .row [class*=col-]:nth-child(3) .px-award-nomination,
.px-service-3-style .px-service-accordion-wrap .accordion .accordion-items .accordion-body {
    padding-left: 120px
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-service-category span {
        font-size: 12px
    }
    .px-service-thumb {
        margin-right: 20px
    }
    .px-service-content p {
        font-size: 15px
    }
    .px-service-content p br {
        display: none
    }
    .px-award-item .row [class*=col-]:nth-child(3) .px-award-nomination {
        padding-left: 90px
    }
    .px-award-inner-ptb {
        padding-top: 80px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-pd-2-thumb-item img {
        margin-top: -60px
    }
    .px-service-category span {
        padding: 11px 14px
    }
    .px-service-content p {
        font-size: 14px
    }
    .px-service-content p br {
        display: none
    }
    .px-award-item .row [class*=col-]:nth-child(3) .px-award-nomination {
        padding-left: 50px
    }
}

.px-award-nomination span,
.px-award-num span {
    font-weight: 500;
    font-size: 16px;
    letter-spacing: -.03em
}

.px-award-category {
    display: flex;
    align-items: center
}

.px-award-category img {
    margin-right: 14px
}

.px-award-category span {
    font-weight: 500;
    font-size: 18px;
    margin-bottom: 0;
    letter-spacing: -.04em;
    color: var(--tp-common-px-black)
}

.px-award-year span {
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -.03em;
    color: var(--tp-common-px-black)
}

.px-award-style-2 .px-award-item .row [class*=col-]:nth-child(2) .px-award-category,
.px-award-style-2 .px-award-item .row [class*=col-]:nth-child(3) .px-award-nomination {
    padding-left: 0
}

.px-award-style-2 .px-award-content>span {
    font-weight: 600;
    font-size: 60px;
    line-height: 1;
    margin-top: -20px;
    display: inline-block;
    letter-spacing: normal;
    color: var(--tp-common-px-black);
    font-family: var(--tp-ff-thunder)
}

.px-service-2-content span {
    font-weight: 400;
    font-size: 17px;
    line-height: 1.4;
    margin-bottom: 10px;
    display: inline-block;
    letter-spacing: -.06em
}

.px-service-2-content p,
.px-service-2-title {
    font-weight: 600;
    color: var(--tp-common-px-black)
}

.px-service-2-content p {
    font-size: 22px;
    line-height: 1.18;
    letter-spacing: -.05em
}

.px-service-2-title>span,
.px-service-2-wrap label {
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase
}

.px-service-2-thumb,
.px-team-thumb {
    margin-bottom: 25px
}

.px-service-2-title {
    font-size: 100px;
    line-height: 1;
    margin-bottom: 0;
    display: inline-block;
    transition: .3s ease-in-out
}

.px-service-2-title>span {
    position: absolute;
    top: 20%;
    right: -55px;
    line-height: 1;
    letter-spacing: -.04em;
    color: var(--tp-common-px-black);
    font-family: var(--tp-ff-body)
}

.bf-instagram-content,
.inner-service-1-right,
.px-service-2-wrap {
    padding-left: 100px
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:768px) and (max-width:991px),
(max-width:767px) {
    .design-footer-right,
    .px-service-2-wrap {
        padding-left: 0
    }
}

.px-service-2-wrap label {
    line-height: 1;
    letter-spacing: -.04em
}

.px-service-2-item {
    cursor: pointer;
    padding-top: 30px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(30, 30, 30, .08)
}

.px-service-2-element.active .px-service-2-title {
    padding-left: 50px;
    color: var(--tp-common-px-red)
}

.px-service-2-element.active .px-service-2-info {
    transform: translateY(0);
    opacity: 1;
    visibility: visible
}

.px-service-2-info {
    position: absolute;
    top: 20px;
    left: 0;
    width: 350px;
    opacity: 0;
    visibility: hidden;
    transition: .4s ease-in-out;
    transform: translateY(80px)
}

.px-service-3-video {
    z-index: -1;
    position: relative;
    display: inline-block;
    transform: scaleX(-1) translateY(-60px)
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .px-pd-2-title {
        font-size: 100px;
        letter-spacing: 0
    }
    .px-service-content {
        padding-bottom: 20px
    }
    .px-award-style-2 .px-section-subtitle {
        padding-bottom: 50px
    }
    .px-service-4-area {
        padding-bottom: 0
    }
}

.px-service-4-content>span {
    font-weight: 500;
    font-size: 18px;
    line-height: 1.7;
    margin-right: 70px;
    transition: .3s;
    display: inline-block;
    text-transform: uppercase;
    color: rgba(135, 135, 135, .5)
}

.px-service-4-title {
    position: relative;
    font-weight: 700;
    font-size: 42px;
    color: #616161;
    margin-bottom: 0;
    overflow: hidden;
    letter-spacing: -.07em;
    text-transform: uppercase;
    transition: color 1s cubic-bezier(.33, 1, .68, 1)
}

.px-service-4-thumb img {
    border-radius: 6px
}

.px-service-4-item {
    padding: 15px 0;
    border-bottom: 1px solid rgba(255, 255, 255, .08)
}

.px-3d-anim:hover span:first-child,
.px-service-4-item:hover .px-3d-anim span:first-child {
    opacity: 0;
    transform: translate3d(0, -25.5961px, -26.0468px) rotateX(91deg);
    transition-delay: 0s
}

.px-3d-anim:hover span:last-child,
.px-service-4-item:hover .px-3d-anim span:last-child {
    opacity: 1;
    transform: translate(0);
    transition-delay: 0s
}

.px-service-4-wrap {
    border-top: 1px solid rgba(255, 255, 255, .08)
}

.px-service-5-item {
    padding: 40px;
    border: 1px solid rgb(235 180 40);
    border-radius: 30px
}

.px-service-5-title {
    font-weight: 600;
    font-size: 19px;
    line-height: 1;
    margin-bottom: 20px;
    letter-spacing: 0;
    color: #fff
}

@media only screen and (min-width:1200px) and (max-width:1499px) {
    .px-service-5-title {
        font-size: 20px
    }
}

.px-service-5-icon {
    margin-bottom: 60px
}

.px-service-5-content p {
    font-weight: 400;
    font-size: 18px;
    line-height: 1.5;
    color: #fff;
    margin-bottom: 0;
    letter-spacing: -.04em
}

.px-service-5-link a {
    font-weight: 500;
    font-size: 16px;
    line-height: 1;
    color: #fff
}

.px-capsule-inner {
    border: 1px solid rgba(30, 30, 30, .1)
}

.px-capsule-top-wrapper .px-capsule-item-wrapper {
    position: relative;
    pointer-events: none;
    height: 500px;
    overflow: hidden;
    margin-top: 0
}

.px-capsule-top-wrapper .px-capsule-item-wrapper>* {
    position: absolute;
    display: inline-block;
    margin-bottom: 0;
    left: 0;
    top: 0;
    user-select: none;
    pointer-events: auto;
    transition: none
}

.px-capsule-item {
    font-size: 18px;
    height: 160px;
    width: 160px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background-color: #f6f6f6;
    color: #fff;
    font-family: var(--tp-ff-thundermed)
}

.px-capsule-subtitle {
    font-weight: 400;
    font-size: 18px;
    line-height: 1.6;
    margin-bottom: 30px;
    display: inline-block;
    letter-spacing: -.05em;
    color: var(--tp-common-px-black)
}

.px-capsule-title,
.px-service-6-text span {
    letter-spacing: -.01em;
    font-family: var(--tp-ff-thunder);
    font-weight: 600
}

.px-capsule-title {
    font-size: 50px;
    line-height: .8;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-service-2-title {
        font-size: 70px
    }
    .px-capsule-title {
        font-size: 80px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-award-num span {
        font-size: 11px
    }
    .px-award-category span {
        font-size: 16px
    }
    .px-award-year span {
        font-size: 12px
    }
    .px-capsule-title {
        font-size: 70px
    }
}

.px-capsule-title-wrapper {
    padding: 0 0 30px 15px
}

.px-service-6-active {
    height: 330px
}

.px-service-6-active .swiper-wrapper {
    padding-top: 15px
}

.px-service-6-text span {
    font-size: 115px;
    line-height: .85;
    text-transform: uppercase
}

.inner-service-1-left ul li span,
.inner-service-1-left>span,
.inner-service-1-number h1 {
    font-family: var(--tp-ff-p);
    letter-spacing: .02em;
    text-transform: uppercase
}

.px-service-6-slide-wrap::after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
    pointer-events: none;
    display: inline-block;
    background-image: linear-gradient(#f5f5f5 10%, #e8e9e800 40% 60%, #f5f5f5 90%)
}

.px-3d-anim span {
    display: inline-block;
    transition: transform 1s cubic-bezier(.33, 1, .68, 1), opacity 1s cubic-bezier(.33, 1, .68, 1);
    align-self: center;
    transform-style: preserve-3d;
    backface-visibility: hidden;
    transform-origin: center center -0.2em
}

.px-3d-anim span:last-child {
    position: absolute;
    left: 0;
    bottom: 0;
    opacity: 0;
    transform: translate3d(0, 25.5961px, -26.0467px) rotateX(-91deg)
}

.px-inner-service-video {
    transform: scaleX(-1) translateX(16%)
}

.px-inner-service-video video {
    width: 900px
}

.px-inner-service-title {
    font-size: 50px;
    font-weight: 100;
    line-height: 1;
    margin-bottom: 35px;
    letter-spacing: .8px;
    color: #0a0a0a;
    font-family: "Power Grotesk" !important
}

.px-inner-service-big-text {
    font-size: 464px;
    font-weight: 700;
    line-height: 1;
    margin: 0 auto;
    letter-spacing: -4.64px;
    text-transform: uppercase;
    font-family: var(--tp-ff-thunder);
    color: var(--tp-common-px-orange)
}

@media only screen and (min-width:1701px) and (max-width:1800px) {
    .px-inner-service-big-text {
        font-size: 450px
    }
}

@media only screen and (min-width:1600px) and (max-width:1700px) {
    .px-inner-service-big-text {
        font-size: 400px
    }
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-inner-service-big-text {
        font-size: 350px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-service-3-video {
        transform: scale(.7) scaleX(-1) translateY(0) translateX(120px)
    }
    .px-service-5-item {
        padding: 20px
    }
    .px-inner-service-big-text {
        font-size: 300px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-service-6-text span {
        font-size: 100px
    }
    .px-inner-service-video {
        transform: scaleX(-1) translateX(-5%) scale(.8)
    }
    .px-inner-service-big-text {
        font-size: 250px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-inner-service-big-text {
        font-size: 195px
    }
    .px-inner-service-2-title {
        margin-bottom: 30px
    }
}

@media (max-width:767px) {
    .px-project-inner-4-tab-wrap .masonary-menu button {
        margin-bottom: 15px
    }
    .px-project-inner-5-tab .masonary-menu button:not(:last-of-type) {
        margin-right: 20px
    }
    .px-project-inner-5-tab .masonary-menu button {
        font-size: 20px
    }
    .px-pd-2-bottom,
    .px-project-inner-6-top,
    .px-service-title-box {
        flex-wrap: wrap
    }
    .px-project-inner-6-text {
        margin-bottom: 20px
    }
    .px-pd-2-ptb {
        padding-bottom: 50px
    }
    .px-pd-2-title {
        font-size: 60px;
        letter-spacing: 0
    }
    .px-pd-2-bottom-item,
    .px-service-title-box .px-section-title {
        padding-bottom: 20px
    }
    .px-pd-2-banner,
    .px-pd-2-thumb-item {
        height: 250px
    }
    .px-pd-2-banner img {
        margin-top: -50px
    }
    .px-pd-2-slider-wrapper {
        margin: 0
    }
    .px-pd-2-step-heading {
        padding-bottom: 40px
    }
    .px-pd-2-step-title {
        font-size: 35px;
        letter-spacing: 0
    }
    .px-pd-2-thumb-item img {
        margin-top: -40px
    }
    .px-service-title h4 {
        font-size: 16px
    }
    .px-service-thumb {
        margin-right: 0;
        margin-bottom: 15px
    }
    .px-service-content {
        flex-wrap: wrap;
        padding-bottom: 10px
    }
    .px-award-category,
    .px-award-year {
        padding: 7px 0
    }
    .px-capsule-title,
    .px-service-2-title {
        font-size: 50px
    }
    .px-service-3-style .px-service-accordion-wrap .accordion .accordion-items .accordion-body {
        padding-left: 0
    }
    .px-service-4-content>span {
        margin-right: 30px
    }
    .px-inner-service-title,
    .px-service-4-title {
        font-size: 30px
    }
    .px-service-6-text span {
        font-size: 85px !important
    }
    .px-inner-service-video {
        transform: scaleX(-1) scale(.8) translateX(-12%)
    }
    .px-inner-service-big-text {
        font-size: 85px;
        letter-spacing: -.64px
    }
}

.px-inner-service-2-style.px-about-5-style .px-section-title.ff-inter {
    font-size: 50px;
    letter-spacing: 0;
    line-height: 1.1
}

.px-inner-service-2-title {
    font-size: 300px;
    font-weight: 700;
    line-height: .75;
    letter-spacing: -3px;
    text-transform: uppercase;
    font-family: var(--tp-ff-thunder);
    color: var(--tp-common-px-black-2)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-inner-service-2-title {
        font-size: 200px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .px-inner-service-2-title {
        font-size: 190px
    }
}

@media (max-width:767px) {
    .px-inner-service-2-style.px-about-5-style .px-section-title.ff-inter {
        font-size: 30px;
        letter-spacing: 0
    }
    .px-inner-service-2-title {
        font-size: 85px;
        line-height: .9;
        letter-spacing: 0;
        margin-bottom: 30px
    }
    .px-inner-service-2-title br {
        display: none
    }
}

.px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items {
    margin-bottom: 8px;
    border: 1px solid transparent
}

.px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items.faq-active {
    border-color: #fff;
    background: #fff
}

.px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items.faq-active .accordion-header .accordion-buttons {
    background-color: transparent;
    color: var(--tp-common-px-orange)
}

.px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons {
    font-size: 20px;
    padding-left: 32px;
    padding-right: 40px;
    background: #fff;
    letter-spacing: 0;
    color: var(--tp-common-px-black-2)
}

.px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons .accordion-icon::after,
.px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons .accordion-icon::before {
    background-color: var(--tp-common-px-black-2)
}

.px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-body {
    padding: 0 32px 45px
}

.px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-body p {
    font-weight: 400;
    color: #6d6868;
    margin-bottom: 16px;
    letter-spacing: -.6px
}

.px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-body .px-inner-service-2-list {
    padding-left: 32px
}

.px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-body .px-inner-service-2-list ul li {
    font-size: 16px;
    color: #6d6868;
    font-weight: 400;
    letter-spacing: -.6px
}

.inner-service-1-left>span {
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    margin-bottom: 25px;
    display: inline-block;
    color: var(--tp-common-px-black-2)
}

.inner-service-1-left ul li span {
    font-weight: 600;
    font-size: 20px;
    line-height: 1;
    color: var(--tp-common-px-orange)
}

.inner-service-1-number h1 {
    font-size: 400px;
    font-weight: 700;
    line-height: .7;
    margin-bottom: 0;
    margin-top: 7px;
    color: var(--tp-common-px-orange)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .inner-service-1-number h1 {
        font-size: 300px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .inner-service-1-number h1 {
        font-size: 200px
    }
}

@media (max-width:767px) {
    .px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-body .px-inner-service-2-list {
        padding-left: 0
    }
    .inner-service-1-number h1 {
        margin-top: 0;
        font-size: 100px
    }
}

.inner-service-1-category,
.inner-service-1-text {
    margin-bottom: 100px
}

.inner-service-1-text span {
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    margin-bottom: 20px;
    display: inline-block;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: rgba(0, 0, 0, .6)
}

.inner-service-1-text p {
    font-size: 30px;
    font-weight: 500;
    line-height: 1.33;
    margin-bottom: 40px;
    padding-right: 100px;
    letter-spacing: -.01em;
    color: var(--tp-common-px-black-2)
}

@media only screen and (min-width:576px) and (max-width:767px) {
    .postbox-author-box,
    .postbox-details-meta .postbox-meta {
        margin-bottom: 0
    }
    .postbox-details-quote-box {
        padding: 40px
    }
    .in-blog-hero-title,
    .pf-6-hero-title {
        font-size: 75px
    }
    .tp-offcanvas-wrapper {
        width: 450px
    }
    .px-copyright-big-text {
        font-size: 80px
    }
    .px-hero-6-info p br {
        display: none
    }
    .px-hero-6-category span {
        font-size: 12px;
        padding: 10px 14px
    }
    .px-about-3-bigtext {
        font-size: 115px
    }
    .am-hero-title {
        font-size: 160px
    }
    .pf-3-hero-title,
    .px-inner-service-2-title {
        font-size: 100px
    }
    .px-inner-service-big-text {
        font-size: 130px;
        letter-spacing: -.64px
    }
    .inner-service-1-number h1 {
        font-size: 130px
    }
    .inner-service-1-text p {
        font-size: 24px
    }
}

.inner-service-1-category-item {
    padding: 17px 0;
    border-bottom: 1px solid rgba(30, 30, 30, .06)
}

.inner-service-1-category-item:hover span {
    transform: translateX(20px)
}

.inner-service-1-category-item:hover i {
    transform: translateX(-20px)
}

.inner-service-1-category-item:first-child {
    border-top: 1px solid rgba(30, 30, 30, .06)
}

.inner-service-1-category-item span {
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    transition: .3s ease-in-out;
    color: var(--tp-common-px-black-2)
}

.inner-service-1-category-item span::before {
    content: "";
    height: 6px;
    width: 6px;
    margin-right: 12px;
    border-radius: 50%;
    display: inline-block;
    background-color: #ff535b;
    transform: translateY(-3px)
}

.inner-service-1-category-item i {
    transition: .3s ease-in-out;
    color: var(--tp-common-px-white)
}

.inner-service-1-thumb {
    position: relative;
    overflow: hidden;
    border-radius: 30px
}

.bf-about-3-thumb img,
.bf-about-thumb img,
.bf-contact-author-thumb img,
.bf-service-item-3-thumb img,
.inner-service-1-thumb img,
.px-video-4-wrap {
    border-radius: 10px
}

.inner-service-1-thumb .tp--hover-img canvas {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute
}

.inner-service-1-thumb-text span {
    font-size: 12px;
    line-height: 1;
    font-weight: 600;
    margin-bottom: 15px;
    display: inline-block;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: rgba(30, 30, 30, .6)
}

.px-text-slider-item>span {
    font-weight: 600;
    font-size: 18px;
    line-height: 1;
    letter-spacing: -.06em;
    text-transform: uppercase;
    color: var(--tp-common-px-white)
}

.px-text-slider-style-3 {
    border-top: 1px solid rgba(30, 30, 30, .1);
    border-bottom: 1px solid rgba(30, 30, 30, .1)
}

.px-text-slider-style-5 .px-text-slider-item>span {
    font-weight: 700;
    font-size: 140px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: uppercase;
    color: var(--tp-common-px-white);
    font-family: var(--tp-ff-thunder)
}

.px-text-slider-style-5 .px-btn-zikzak {
    font-size: 24px;
    transform: translateY(-15px);
    color: var(--tp-common-px-orange);
    font-family: var(--tp-ff-thunder)
}

.px-text-slider-mt {
    position: relative;
    z-index: -1;
    transform: translateY(-300px)
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-body {
        padding-right: 60px
    }
    .px-text-slider-mt {
        transform: translateY(-112px)
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-text-slider-mt {
        transform: translateY(-200px)
    }
}

.px-text-inner-slider .px-hero-6-text span {
    color: #d4c5eb;
    font-family: var(--tp-ff-thunder)
}

.px-text-inner-studio .studio-hero-banner-text span {
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    text-transform: uppercase;
    font-family: var(--tp-ff-p);
    color: var(--tp-common-px-black-2)
}

.px-line-shape span {
    height: 10px;
    width: 100%;
    display: inline-block;
    background-color: #000
}

.px-line-shape span:nth-child(2) {
    margin-top: 8px;
    height: 9px
}

.px-line-shape span:nth-child(3) {
    height: 6px
}

.px-line-shape span:nth-child(4) {
    height: 4px
}

.px-line-shape span:nth-child(5) {
    height: 2px;
    display: inline-block;
    transform: translateY(-4px)
}

.px-line-shape.m-2-top {
    margin-top: -2px
}

.px-video-4-wrap {
    width: 100%;
    overflow: hidden
}

.px-team-details-style .tp-team-details-thumb img,
.px-video-4-wrap.px-bdr-style video {
    border-radius: 0
}

.px-testimonial-top-content span {
    font-weight: 500;
    font-size: 16px;
    line-height: 1;
    color: #878787;
    letter-spacing: -.04em;
    text-transform: uppercase
}

.px-testimonial-client-info span {
    font-weight: 500;
    font-size: 16px;
    line-height: 1;
    color: #878787;
    letter-spacing: -.04em
}

.px-testimonial-client-name {
    font-weight: 600;
    font-size: 20px;
    line-height: 1.6;
    margin-bottom: 0;
    letter-spacing: -.03em;
    color: var(--tp-common-px-white)
}

.px-testimonial-avater img {
    height: 80px;
    width: 80px;
    overflow: hidden;
    border-radius: 50%;
    object-fit: cover
}

.px-testimonial-item p {
    font-weight: 500;
    font-size: 46px;
    line-height: 1.1;
    margin-bottom: 55px;
    letter-spacing: -.04em;
    color: var(--tp-common-px-white)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-testimonial-item p {
        font-size: 40px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-testimonial-item p {
        font-size: 35px
    }
}

.px-testimonial-slider {
    padding-right: 65px
}

.ar-testimonial-client-info span {
    font-weight: 500;
    font-size: 20px;
    line-height: 1;
    color: #878787;
    letter-spacing: -.04em
}

.ar-testimonial-client-name {
    font-weight: 600;
    font-size: 20px;
    line-height: 1.1;
    margin-bottom: 5px;
    letter-spacing: -.03em;
    color: var(--tp-common-px-black)
}

.ar-testimonial-item p {
    font-size: 18px;
    line-height: 1.2;
    margin-bottom: 40px;
    letter-spacing: 0;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .ar-testimonial-item p {
        font-size: 18px
    }
    .ar-testimonial-item p br {
        display: none
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .ar-testimonial-item p {
        font-size: 30px
    }
}

.ar-testimonial-arrow button {
    width: 50px;
    height: 50px;
    line-height: 1;
    transition: .3s;
    border-radius: 50%;
    display: inline-block;
    border: 1px solid rgba(25, 25, 25, .1);
    background-color: #ec4f62
}

.ar-testimonial-arrow button span svg {
    margin-left: 1px
}

.ar-testimonial-arrow button.ar-testimonial-next,
.ar-testimonial-arrow button.ar-testimonial-prev {
    position: absolute;
    top: 50%;
    left: -85px;
    transform: translateY(-50%)
}

.ar-testimonial-arrow button.ar-testimonial-next {
    left: auto;
    right: -85px
}

.ar-testimonial-fraction-wrap {
    position: absolute;
    bottom: -80px;
    right: 0;
    left: 0;
    width: 260px;
    margin: 0 auto;
    text-align: center;
    display: inline-flex;
    justify-content: center
}

.ar-testimonial-fraction-wrap .swiper-horizontal>.swiper-pagination-progressbar,
.ar-testimonial-fraction-wrap .swiper-pagination-progressbar.swiper-pagination-horizontal,
.ar-testimonial-fraction-wrap .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,
.ar-testimonial-fraction-wrap .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: 2px;
    left: 0;
    top: auto;
    bottom: 0;
    right: 0;
    text-align: center;
    margin: 0 30px;
    background: #d9d9d9
}

.ar-testimonial-fraction-wrap .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
.pixora-dark .px-hero-6-category span:hover {
    background: var(--tp-common-px-orange)
}

.ar-testimonial-fraction-wrap .swiper-horizontal>.swiper-pagination-bullets,
.ar-testimonial-fraction-wrap .swiper-pagination-bullets.swiper-pagination-horizontal,
.ar-testimonial-fraction-wrap .swiper-pagination-custom,
.ar-testimonial-fraction-wrap .swiper-pagination-fraction {
    bottom: 0;
    left: 0;
    width: auto
}

.ar-testimonial-fraction-wrap .swiper-pagination-fraction span {
    position: absolute;
    top: -10px;
    right: -60px;
    font-weight: 500;
    font-size: 15px;
    line-height: 1;
    letter-spacing: -.01em;
    color: var(--tp-common-px-black)
}

.ar-testimonial-fraction-wrap .swiper-pagination-fraction span.current {
    right: auto;
    left: 0
}

.ar-funfact-item h4 {
    line-height: .8;
    font-size: 100px;
    letter-spacing: -.04em;
    color: var(--tp-common-px-black)
}

.ar-funfact-item span {
    font-weight: 500;
    font-size: 16px;
    line-height: 1;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--tp-common-px-black)
}

.ar-funfact-bg {
    padding: 20px 0 0
}

.px-funfact-inner-style .ar-funfact-item h4 {
    font-size: 100px;
    line-height: .76;
    margin-bottom: 0;
    letter-spacing: normal;
    text-transform: uppercase;
    color: var(--tp-common-px-black);
    font-family: var(--tp-ff-thunder)
}

@media only screen and (min-width:1400px) and (max-width:1599px),
only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px),
(max-width:767px) {
    .px-funfact-inner-style .ar-funfact-item h4 {
        font-size: 70px
    }
}

.px-funfact-inner-style .ar-funfact-item {
    padding: 45px 45px 35px;
    box-shadow: -1px 0 0 0 #000;
    border: 1px solid rgba(30, 30, 30, .06)
}

@media only screen and (min-width:1400px) and (max-width:1599px),
only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:576px) and (max-width:767px) {
    .px-funfact-inner-style .ar-funfact-item {
        padding: 30px
    }
}

.px-funfact-inner-style .ar-funfact-item span {
    color: #5d5d5d;
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: -.36px;
    text-transform: capitalize
}

.px-brand-item {
    min-height: 180px;
    width: 100%;
    padding: 20px;
    display: grid;
    text-align: center;
    border-radius: 14px;
    place-content: center;
    background: var(--tp-common-px-white)
}

.px-brand-style-3 .px-brand-item {
    min-width: 240px;
    background-color: transparent;
    border: 1px solid rgba(0, 0, 0, .06)
}

.px-brand-style-3 .px-section-subtitle {
    font-weight: 500;
    font-size: 17px;
    text-transform: uppercase
}

.px-brand-style-4 .px-brand-item {
    min-width: 240px;
    background: 0 0;
    border: 1px solid rgba(255, 255, 255, .09)
}

.px-brand-style-5 .px-brand-item {
    min-height: 140px;
    padding: 20px;
    border-radius: 0;
    margin: 0;
    background: 0 0;
    border: 1px solid #ececec
}

.px-team-title {
    font-size: 22px;
    line-height: 1;
    font-weight: 600;
    margin-bottom: 10px;
    letter-spacing: -.03em;
    color: #000
}

.px-team-item:hover .px-team-social-icon a {
    opacity: 1;
    visibility: visible;
    transform: translateY(0)
}

.px-team-item:hover .px-team-social-link svg {
    transform: rotate(180deg)
}

.px-team-content span {
    font-weight: 400;
    font-size: 20px;
    line-height: 1
}

.px-team-social-icon a,
.px-team-social-link {
    display: block;
    height: 46px;
    width: 45px;
    margin: 6px 0;
    line-height: 44px;
    text-align: center;
    border-radius: 50%;
    position: relative;
    color: var(--tp-common-px-black);
    background-color: var(--tp-common-px-white)
}

#tp-porfolio-10-bg-box.tp-porfolio-10-bg-1 .tp-porfolio-10-bg-1,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-2 .tp-porfolio-10-bg-2,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-3 .tp-porfolio-10-bg-3,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-4 .tp-porfolio-10-bg-4,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-5 .tp-porfolio-10-bg-5,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-6 .tp-porfolio-10-bg-6,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-7 .tp-porfolio-10-bg-7,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-8 .tp-porfolio-10-bg-8,
.px-team-social-icon a:hover::after,
.px-team-social-link:hover::after {
    opacity: 1;
    visibility: visible;
    transform: scale(1)
}

.px-team-social-icon a::after,
.px-team-social-link::after {
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    border-radius: 50%;
    transform: scale(.3);
    transition: .5s ease-in-out;
    background-color: var(--tp-common-px-orange)
}

.px-team-social-icon {
    position: absolute;
    top: 15px;
    right: 20px
}

.px-team-social-icon>a {
    opacity: 0;
    visibility: hidden;
    transition: .2s ease-in-out;
    transform: translateY(-20px)
}

.px-team-social-icon>a:first-child {
    transition-delay: 0.1s
}

.px-team-social-icon>a:nth-child(2) {
    transition-delay: 0.2s
}

.px-team-social-icon>a:nth-child(3) {
    transition-delay: 0.3s
}

.px-team-6-pt {
    padding-top: 330px
}

.in-team-hero-title {
    font-size: 200px;
    font-weight: 700;
    line-height: .8;
    text-transform: uppercase;
    color: var(--tp-common-px-black);
    font-family: var(--tp-ff-thunder)
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .in-team-hero-title {
        font-size: 185px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .in-team-hero-title {
        font-size: 140px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .ar-funfact-item span {
        font-size: 15px
    }
    .in-team-hero-title {
        font-size: 135px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .in-team-hero-title {
        font-size: 100px
    }
}

.in-team-hero-title img {
    transform: translateY(-15px)
}

.in-team-hero-content p {
    font-size: 22px;
    font-weight: 500;
    padding-left: 490px;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .in-team-hero-content p {
        padding-left: 410px
    }
}

.td-hero-title {
    font-size: 50px;
    font-weight: 600;
    line-height: 1;
    color: var(--tp-common-px-black);
    font-family: 'Power Grotesk' !important
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .td-hero-title {
        font-size: 80px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .td-hero-title {
        font-size: 70px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .px-team-inner-ptb {
        padding-top: 100px
    }
    .px-team-details-style .tp-team-details-wrapper {
        padding-left: 0
    }
}

.px-team-details-style .tp-team-details-text-title {
    font-size: 50px;
    font-weight: 500;
    line-height: 1;
    color: var(--tp-common-px-black);
    font-family: "Power Grotesk" !important
}

.tp-team-details-thumb img {
    width: 100%;
    border-radius: 14px
}

.tp-team-details-info-contact {
    padding: 10px 0;
    border-top: 1px solid rgba(17, 16, 19, .1);
    border-bottom: 1px solid rgba(17, 16, 19, .1)
}

.tp-team-details-info-contact a {
    font-size: 14px;
    font-weight: 500;
    color: #111013;
    display: inline-block;
    letter-spacing: -.28px
}

.tp-team-details-info-contact a:not(:last-of-type) {
    margin-right: 20px;
    padding-right: 20px;
    border-right: 1px solid rgba(17, 16, 19, .1)
}

.tp-team-details-info-social .px-footer-widget-social a {
    background-color: transparent;
    color: var(--tp-common-px-black-2);
    border: 1px solid rgba(17, 16, 19, .08)
}

.tp-team-details-wrapper {
    padding-left: 70px
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .tp-team-details-wrapper {
        padding-left: 50px
    }
}

.tp-team-details-text p {
    color: #4d5051
}

.tp-team-details-text-sub {
    color: #525356;
    font-size: 16px;
    font-weight: 400;
    display: inline-block
}

.tp-team-details-text-title {
    color: #111013;
    font-size: 40px;
    font-weight: 700;
    margin-bottom: 10px;
    letter-spacing: -.8px
}

.tp-team-details-more-title {
    color: #111013;
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 18px;
    letter-spacing: -.48px
}

.tp-team-details-more ul li {
    list-style: none;
    color: #111013;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 12px
}

.tp-team-details-more ul li span {
    color: #525356;
    font-size: 16px;
    font-weight: 400;
    min-width: 100px;
    margin-right: 40px;
    display: inline-block
}

.tp-team-details-progress-title {
    font-size: 16px;
    font-weight: 500;
    color: #111013
}

.tp-team-details-progress-inner {
    position: relative;
    width: 100%;
    height: 5px;
    background: #d9d9d9
}

.tp-team-details-progress-bar {
    overflow: visible;
    display: flex;
    height: 5px;
    text-align: center;
    white-space: nowrap;
    transition: .6s;
    position: relative;
    background-color: var(--tp-common-px-orange)
}

.tp-team-details-progress-bar::before {
    position: absolute;
    content: "";
    height: 20px;
    width: 1px;
    right: 0;
    top: -8px;
    margin: auto;
    background-color: var(--tp-common-px-orange)
}

.tp-team-details-progress-counter {
    margin-top: -29px;
    font-weight: 500;
    font-size: 14px;
    position: absolute;
    top: 0;
    right: -15px;
    text-transform: uppercase
}

.tp-team-details-input-content input,
.tp-team-details-input-content textarea {
    border-radius: 6px;
    margin-bottom: 20px;
    background-color: #f8f8fb;
    color: var(--tp-common-px-black);
    border: 1px solid rgba(17, 16, 19, .08)
}

.pixora-dark .tp-team-details-input-content input:focus,
.pixora-dark .tp-team-details-input-content textarea:focus,
.tp-team-details-input-content input:focus,
.tp-team-details-input-content textarea:focus {
    background-color: transparent;
    border-color: var(--tp-common-px-orange);
    box-shadow: 0 0 0 3px rgba(255, 87, 34, .1)
}

.tp-team-details-input-content input::placeholder,
.tp-team-details-input-content textarea::placeholder {
    color: #848788
}

.tp-team-details-input-content textarea {
    resize: none;
    height: 160px
}

.tp-team-details-input-btn button {
    font-size: 16px;
    font-weight: 700;
    padding: 15px 35px;
    border-radius: 6px;
    letter-spacing: 0;
    border: 1px solid transparent;
    color: var(--tp-common-px-white);
    background-color: var(--tp-common-px-orange)
}

.tp-team-details-input-btn button:hover {
    color: var(--tp-common-px-black);
    background-color: transparent;
    border-color: var(--tp-common-px-orange)
}

.px-step-item {
    height: 920px
}

.px-step-video {
    position: absolute;
    top: 11%;
    left: 9%
}

.px-step-card {
    max-width: 530px;
    padding: 60px 60px 45px;
    margin-bottom: 250px
}

.px-step-card-badge {
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    padding: 6px 14px;
    border-radius: 27px;
    display: inline-block;
    text-transform: uppercase;
    color: var(--tp-common-px-white);
    background: var(--tp-common-px-black)
}

.px-step-card-content span,
.px-step-title {
    font-weight: 500;
    font-family: var(--tp-ff-thundermed);
    text-transform: uppercase
}

.px-step-bottom-text span,
.px-step-card-content p,
.px-step-card-content span,
.px-step-num span,
.px-step-num span i,
.px-step-title {
    color: var(--tp-common-px-black)
}

.px-step-card-content span {
    font-size: 260px;
    line-height: .7
}

.px-step-card-content p {
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    margin-bottom: 0
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px),
(max-width:767px) {
    .px-service-accordion-wrap .accordion .accordion-items .accordion-body {
        padding-top: 0;
        padding-bottom: 20px
    }
    .header-fixed::after {
        top: 0;
        height: 100%
    }
    .header-fixed.sticky-bg .px-header-logo,
    .px-header-logo,
    .px-service-4-subtitle-box,
    .px-service-subtitle-box {
        padding-top: 0
    }
    .px-header-6-ptb,
    .px-header-ptb {
        padding: 15px 0
    }
    .rc-post-thumb img {
        height: 100px;
        width: 100px
    }
    .px-about-area,
    .px-blog-area,
    .px-wrapper-box {
        padding-top: 80px;
        padding-bottom: 0
    }
    .in-blog-list-category span {
        margin-bottom: 6px
    }
    .px-offcanvas-2-wrapper .tp-offcanvas-menu>nav>ul>li>a {
        font-size: 80px
    }
    .design-footer-wrap {
        padding: 0
    }
    .design-footer-top-wrap,
    .px-team-6-pt {
        padding-top: 80px
    }
    .design-footer-col-1,
    .inner-service-1-text p,
    .px-testimonial-slider {
        padding-right: 0
    }
    .design-footer-col-3 {
        padding-left: 0;
        margin-bottom: 20px
    }
    .design-footer-col-2,
    .px-brand-subtitle-box,
    .tp-team-details-info-contact {
        margin-bottom: 20px
    }
    .design-footer-col-4,
    .in-team-hero-content p,
    .inner-service-1-right,
    .px-about-2-title em,
    .px-about-2-title.fs-300 em {
        padding-left: 0
    }
    .px-award-area,
    .px-brand-area,
    .px-footer-3-area,
    .px-service-3-style,
    .px-service-bg {
        padding-top: 80px;
        padding-bottom: 80px
    }
    .px-footer-3-slider-style {
        margin-bottom: 60px
    }
    .px-copyright-3-text p {
        margin-bottom: 10px
    }
    .px-hero-5-style .px-hero-4-video {
        width: 100%;
        margin-bottom: 0
    }
    .px-hero-5-area,
    .px-project-area {
        padding-bottom: 80px
    }
    .px-about-2-title>span,
    .px-pd-2-step-item span br {
        display: none
    }
    .px-about-4-title-box {
        margin-bottom: 25px
    }
    .inner-service-1-thumb,
    .px-award-title-wrap,
    .px-project-title-wrap {
        margin-bottom: 30px
    }
    .px-project-3-area,
    .px-service-2-area {
        padding-bottom: 0
    }
    .px-project-4-style .px-project-3-inner-box {
        margin-bottom: 15px
    }
    .px-project-6-area {
        padding-top: 40px
    }
    .px-pd-2-ptb {
        padding-top: 150px
    }
    .px-award-2-area {
        padding-top: 40px;
        padding-bottom: 80px
    }
    .px-award-inner-ptb {
        padding-top: 60px
    }
    .px-capsule-item {
        font-size: 12px;
        height: 140px !important;
        width: 140px !important
    }
    .inner-service-1-number {
        padding-bottom: 30px
    }
    .inner-service-1-text {
        margin-bottom: 45px
    }
    .inner-service-1-category {
        margin-bottom: 50px
    }
    .tp-inner-service-area {
        padding-top: 20px;
        padding-bottom: 0
    }
    .px-contact-heading,
    .tp-inner-service-item {
        margin-bottom: 0
    }
    .px-brand-item {
        margin-bottom: 5px
    }
    .in-team-hero-area {
        padding-bottom: 50px
    }
    .tp-team-details-info {
        flex-wrap: wrap
    }
    .px-step-card-wrap {
        margin-top: 30px;
        margin-right: 0
    }
}

.px-step-title {
    font-size: 80px;
    line-height: .9;
    margin-bottom: 0
}

.px-contact-title,
.px-step-num span {
    font-weight: 700;
    font-family: var(--tp-ff-thunder)
}

.px-step-ptb {
    padding-top: 210px;
    padding-bottom: 210px
}

.px-step-list ul li {
    line-height: 1;
    list-style-type: none
}

.px-step-list ul li span {
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: -.6px
}

.px-step-list ul li span::before {
    content: "";
    height: 4px;
    width: 4px;
    margin-right: 10px;
    border-radius: 50%;
    display: inline-block;
    background-color: #6d6868;
    transform: translateY(-3px)
}

.px-step-num {
    position: absolute;
    top: 120px;
    left: 40px
}

.px-step-num span {
    font-size: 160px;
    line-height: 1.3;
    text-transform: uppercase
}

.px-step-num span i {
    position: absolute;
    top: 30%;
    left: 1%;
    font-weight: 600;
    font-size: 13px;
    line-height: 1;
    padding: 6px 12px 1px;
    font-style: normal;
    display: inline-block;
    letter-spacing: .34em;
    text-transform: uppercase;
    background-color: #f6f6f6
}

.px-step-bottom {
    padding: 10px 45px;
    border-top: 1px solid #1e1e1e;
    border-bottom: 1px solid #1e1e1e
}

.px-step-bottom-text span {
    font-weight: 500;
    font-size: 12px;
    line-height: 1;
    text-transform: uppercase
}

.px-step-bottom-text span.text-2 {
    display: inline-block;
    margin-left: -30px
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .px-text-slider-style-5 .px-text-slider-item>span {
        font-size: 100px
    }
    .px-step-card {
        margin-bottom: 30px;
        max-width: 100%
    }
    .px-contact-ptb {
        padding-top: 40px
    }
    .px-contact-inf {
        margin-bottom: 40px
    }
}

.px-contact-title {
    font-size: 140px;
    line-height: 1;
    text-transform: capitalize;
    color: #ec4f62
}

@media (max-width:1890px) {
    .px-contact-title {
        font-size: 450px
    }
}

@media only screen and (min-width:1701px) and (max-width:1800px) {
    .px-contact-title {
        font-size: 450px
    }
}

@media only screen and (min-width:1600px) and (max-width:1700px) {
    .px-contact-title {
        font-size: 400px
    }
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .px-contact-title {
        font-size: 140px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .px-step-card {
        padding: 60px 30px 45px
    }
    .px-contact-title {
        font-size: 300px
    }
    .px-contact-inf a br {
        display: none
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .px-contact-title {
        font-size: 230px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-contact-title {
        font-size: 180px
    }
}

@media (max-width:767px) {
    .inner-service-1-text p {
        font-size: 20px
    }
    .px-text-slider-style-5 .px-text-slider-item>span {
        font-size: 70px
    }
    .px-text-slider-mt {
        transform: translateY(0)
    }
    .px-testimonial-area {
        padding-top: 80px
    }
    .px-testimonial-item p {
        font-size: 25px
    }
    .ar-testimonial-item p br,
    .in-team-hero-content p br,
    .in-team-hero-title img,
    .px-testimonial-item p br,
    .td-hero-title br {
        display: none
    }
    .px-testimonial-slider {
        padding-top: 70px
    }
    .ar-testimonial-area {
        padding-top: 40px;
        padding-bottom: 40px
    }
    .ar-testimonial-item p {
        font-size: 18px
    }
    .ar-testimonial-fraction-wrap {
        left: -60px;
        bottom: -20px
    }
    .px-brand-area {
        padding-top: 40px
    }
    .px-team-top {
        margin-bottom: 40px
    }
    .px-team-inner-ptb {
        padding-top: 60px
    }
    .in-team-hero-title {
        font-size: 80px
    }
    .td-hero-title {
        font-size: 55px
    }
    .tp-footer-middle {
        margin-bottom: 0 !important
    }
    .px-step-video {
        left: -38%
    }
    .px-step-card {
        padding: 50px 30px 45px;
        margin-bottom: 30px;
        max-width: 100%
    }
    .px-step-card-content span {
        font-size: 180px
    }
    .px-contact-title,
    .px-step-title {
        font-size: 50px
    }
    .px-step-num span {
        font-size: 110px
    }
    .px-contact-ptb {
        padding-top: 20px;
        padding-bottom: 0
    }
}

.px-contact-inf a,
.px-contact-inf-title {
    font-size: 18px;
    color: var(--tp-common-px-black-2)
}

.px-contact-inf-title {
    font-weight: 600;
    line-height: 1;
    display: block;
    margin-bottom: 8px;
    text-transform: uppercase
}

.px-contact-inf a {
    font-weight: 400;
    letter-spacing: -.8px
}

.px-contact-inf-social a {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -.2px;
    text-transform: capitalize;
    color: var(--tp-common-px-black-2)
}

.px-contact-inf-social a span {
    margin-left: 2px;
    display: inline-block
}

.px-contact-wrapper {
    border-radius: 20px;
   
    background-color: #f7f7f7
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .px-contact-wrapper {
        padding: 60px 60px 65px
    }
}

@media (max-width:767px) {
    .px-contact-inf {
        margin-bottom: 30px
    }
    .px-contact-wrapper {
        padding: 30px
    }
}

.px-contact-wrapper .tp-contact-form-input input,
.px-contact-wrapper .tp-contact-form-input textarea {
    border: none;
    resize: none;
    padding-left: 0;
    border-radius: 0;
    font-size: 18px;
    background-color: transparent;
    color: var(--tp-common-px-black-2);
    border-bottom: 1px solid rgba(30, 30, 30, .2);
    font-family: Montserrat
}

.px-contact-info-item-btn a:hover,
.tp-contact-form-btn button {
    background-color: var(--tp-common-px-orange);
    color: var(--tp-common-px-white)
}

.pixora-dark .ar-testimonial-arrow button:hover,
.pixora-dark .px-contact-wrapper .tp-contact-form-input input:focus,
.pixora-dark .px-contact-wrapper .tp-contact-form-input textarea:focus,
.px-contact-wrapper .tp-contact-form-input input:focus,
.px-contact-wrapper .tp-contact-form-input textarea:focus {
    border-color: var(--tp-common-px-orange)
}

.px-contact-wrapper .tp-contact-form-input input::-webkit-input-placeholder,
.px-contact-wrapper .tp-contact-form-input textarea::-webkit-input-placeholder {
    font-size: 18px;
    letter-spacing: -.8px;
    text-transform: capitalize;
    color: rgba(30, 30, 30, .4)
}

.px-contact-wrapper .tp-contact-form-input input::-moz-placeholder,
.px-contact-wrapper .tp-contact-form-input textarea::-moz-placeholder {
    font-size: 18px;
    letter-spacing: -.8px;
    text-transform: uppercase;
    color: rgba(30, 30, 30, .4)
}

.px-contact-wrapper .tp-contact-form-input input:-moz-placeholder,
.px-contact-wrapper .tp-contact-form-input textarea:-moz-placeholder {
    font-size: 18px;
    letter-spacing: -.8px;
    text-transform: uppercase;
    color: rgba(30, 30, 30, .4)
}

.px-contact-wrapper .tp-contact-form-input input:-ms-input-placeholder,
.px-contact-wrapper .tp-contact-form-input textarea:-ms-input-placeholder {
    font-size: 18px;
    letter-spacing: -.8px;
    text-transform: uppercase;
    color: rgba(30, 30, 30, .4)
}

.px-contact-wrapper .tp-contact-form-input input::placeholder,
.px-contact-wrapper .tp-contact-form-input textarea::placeholder {
    font-size: 18px;
    letter-spacing: -.8px;
    text-transform: capitalize;
    color: rgba(30, 30, 30, .4)
}

.px-contact-wrapper .tp-contact-form-input textarea {
    height: 120px
}

.px-contact-wrapper .tp-contact-form-btn button {
    font-size: 40px;
    border-radius: 16px;
    letter-spacing: .8px;
    line-height: inherit;
    padding: 24px 54px 13px;
    text-transform: uppercase;
    color: var(--tp-common-px-white);
    font-family: var(--tp-ff-thunder);
    background-color: var(--tp-common-px-orange)
}

.px-contact-wrapper .tp-contact-form-btn button span,
.tp-contact-form-btn button span,
.tp-contact-us-btn .tp-btn-yellow-green span {
    position: relative;
    z-index: 1;
    line-height: 1;
    overflow: hidden;
    display: inline-block
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px),
(max-width:767px) {
    .px-contact-wrapper .tp-contact-form-btn button {
        font-size: 30px;
        padding: 17px 54px 8px
    }
}

.px-contact-info-title {
    font-size: 140px;
    font-weight: 600;
    line-height: 1;
    text-transform: capitalize;
    color: var(--tp-common-px-black-2);
    font-family: var(--tp-ff-thunder)
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .px-contact-info-title {
        font-size: 120px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .px-contact-info-title {
        font-size: 90px
    }
}

.px-contact-info-item {
    padding-top: 46px;
    padding-bottom: 46px;
    border-bottom: 1px solid rgba(30, 30, 30, .08)
}

.px-contact-info-item-title {
    font-size: 44px;
    line-height: 1;
    font-weight: 600;
    display: inline-block;
    letter-spacing: -1.32px;
    color: var(--tp-common-px-black-2)
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .px-contact-info-item-title {
        font-size: 30px
    }
}

.px-contact-info-item-content a {
    font-size: 16px;
    font-weight: 500;
    color: #000;
    letter-spacing: -.4px
}

.px-contact-info-item-btn a {
    font-size: 16px;
    font-weight: 500;
    color: #686868;
    padding: 11px 35px;
    border-radius: 60px;
    display: inline-block;
    letter-spacing: -.6px;
    border: 1px solid #e5e5e5
}

.px-contact-info-item-btn a:hover {
    border-color: transparent
}

.tp-contact-me-form-category-title {
    font-size: 32px;
    line-height: 1;
    font-weight: 500;
    margin-bottom: 20px;
    letter-spacing: -.32px;
    color: var(--tp-common-white);
    font-family: var(--tp-ff-teko)
}

.tp-contact-me-form-category-list span {
    margin-left: 0;
    display: inline-block
}

.tp-contact-me-form-category-list span label {
    margin-bottom: 10px;
    display: inline-block
}

.tp-contact-me-form-category-list span label span {
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    margin-right: 7px;
    padding: 11px 31px;
    border-radius: 12px;
    display: inline-block;
    -webkit-transition: .3s ease-out;
    -moz-transition: .3s ease-out;
    -ms-transition: .3s ease-out;
    -o-transition: .3s ease-out;
    transition: .3s ease-out;
    margin-left: 0 !important;
    color: var(--tp-common-px-black-2);
    border: 1px solid rgba(30, 30, 30, .1)
}

.tp-contact-me-interest-title {
    font-size: 46px;
    line-height: 1;
    font-weight: 500;
    margin-bottom: 15px;
    letter-spacing: -.46px;
    color: var(--tp-common-px-black-2);
    font-family: var(--tp-ff-thundermed)
}

.tp-contact-me-interest-form-wrap .tp-contact-form-input label,
.tp-contact-us-wrap .tp-contact-form-input label {
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 12px;
    color: var(--tp-common-px-black-2)
}

.tp-contact-me-interest-form-wrap .tp-contact-form-input input,
.tp-contact-me-interest-form-wrap .tp-contact-form-input textarea {
    border-radius: 8px;
    background: #edecf1;
    border-color: transparent;
    color: var(--tp-common-px-black-2)
}

.pixora-dark .postbox-details-input input:focus,
.pixora-dark .postbox-details-input textarea:focus,
.pixora-dark .sidebar-search input:focus,
.pixora-dark .tp-contact-us-wrap .tp-contact-form-input input:focus,
.pixora-dark .tp-contact-us-wrap .tp-contact-form-input textarea:focus,
.tp-contact-me-interest-form-wrap .tp-contact-form-input input:focus,
.tp-contact-me-interest-form-wrap .tp-contact-form-input textarea:focus,
.tp-contact-us-wrap .tp-contact-form-input input:focus,
.tp-contact-us-wrap .tp-contact-form-input textarea:focus {
    background-color: transparent;
    border-color: var(--tp-common-px-orange)
}

.tp-contact-me-interest-form-wrap .tp-contact-form-input textarea,
.tp-contact-us-wrap .tp-contact-form-input textarea {
    height: 160px;
    resize: none
}

.tp-contact-form-btn button {
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    border-radius: 30px;
    padding: 20px 54px;
    letter-spacing: -.18px
}

.tp-contact-us-text p {
    font-size: 18px;
    font-weight: 400;
    margin: 0;
    color: var(--tp-common-px-black-2)
}

.tp-contact-us-wrap-ptb {
    padding-bottom: 100px
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .tp-contact-us-wrap-ptb {
        padding-bottom: 60px
    }
}

.tp-contact-us-form-wrapper {
    padding: 10px;
    border-radius: 14px;
    background: #f6f6f9
}

.tp-contact-us-map,
.tp-contact-us-map iframe {
    width: 100%;
    height: 100%;
    border-radius: 8px
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .tp-contact-us-map {
        height: 500px;
        margin-bottom: 30px
    }
}

.tp-contact-us-title {
    font-size: 30px;
    font-weight: 600;
    letter-spacing: -.6px;
    text-transform: uppercase;
    color: var(--tp-common-px-black)
}

.tp-contact-us-wrap {
    padding: 110px
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .tp-contact-us-wrap {
        padding: 70px
    }
    .tp-portfolio-mix-slider-navigation .slider-nav {
        height: 80px
    }
}

.tp-contact-us-wrap .tp-contact-form-input input,
.tp-contact-us-wrap .tp-contact-form-input textarea {
    font-size: 16px;
    border-radius: 8px;
    color: var(--tp-common-px-black);
    border-color: #ededf5;
    background: var(--tp-common-px-white)
}

.tp-contact-us-thumb {
    overflow: hidden;
    border-radius: 10px;
    margin-bottom: 40px
}

.tp-contact-us-thumb img {
    width: 100%;
    transition: .9s;
    border-radius: 10px
}

.tp-contact-us-content {
    padding: 15px;
    border-radius: 14px;
    background: #f6f6f9
}

.tp-contact-us-info-title {
    font-size: 26px;
    font-weight: 700;
    margin-bottom: 25px;
    padding-bottom: 20px;
    letter-spacing: -.52px;
    color: var(--tp-common-px-black);
    border-bottom: 1px solid rgba(30, 30, 30, .1)
}

.tp-contact-us-info-details a {
    font-size: 18px;
    font-weight: 400;
    display: block;
    margin-bottom: 15px;
    color: rgba(0, 0, 0, .7)
}

.tp-contact-us-bottom {
    padding: 0 22px 28px
}

.tp-contact-us-btn .tp-btn-yellow-green {
    font-size: 16px;
    font-weight: 600;
    padding: 15px 10px;
    border-radius: 30px;
    display: inline-block;
    text-transform: capitalize;
    color: var(--tp-common-px-black);
    border: 1px solid rgba(0, 0, 0, .1)
}

@media only screen and (min-width:768px) and (max-width:991px),
(max-width:767px) {
    .px-btn-white {
        font-size: 15px;
        padding: 16px 30px
    }
    .px-breadcrumb-ptb,
    .px-inner-service-ptb {
        padding-top: 120px
    }
    .px-section-subtitle {
        padding-top: 0;
        padding-bottom: 0;
        margin-bottom: 0
    }
    .postbox-ptb {
        padding-top: 70px
    }
    .postbox-wrapper {
        margin-right: 0;
        margin-bottom: 0
    }
    .pf-3-hero-social-text,
    .postbox-title.fs-80 br,
    .px-hero-6-category br,
    .px-pd-2-step-title br,
    .px-service-2-info {
        display: none
    }
    .postbox-title.ff-thandar {
        font-size: 65px
    }
    .sidebar-wrapper {
        padding-left: 0;
        margin-top: 70px
    }
    .in-blog-hero-content,
    .px-contact-info-item-content,
    .px-hero-6-category,
    .px-project-inner-5-tab .masonary-menu button {
        margin-bottom: 20px
    }
    .in-blog-hero-ptb,
    .tp-blog-details-without-ptb,
    .tp-contact-us-ptb {
        padding-top: 150px
    }
    .px-hero-4-content,
    .tp-blog-details-banner {
        margin-bottom: 40px
    }
    .px-offcanvas-2-wrapper {
        padding: 110px 30px 0
    }
    .px-offcanvas-2-left .tp-offcanvas-menu,
    .tp-team-details-wrap {
        margin-bottom: 0
    }
    .design-footer-top-btn,
    .px-project-inner-style .px-project-6-title {
        transform: translateY(0)
    }
    .px-hero-service-wrap {
        flex-wrap: wrap
    }
    .px-hero-4-video {
        width: 100%;
        margin-bottom: 30px;
        display: inline-table
    }
    .px-hero-4-video video {
        width: 100%;
        height: 100%;
        margin-bottom: 15px
    }
    .px-hero-5-pt {
        padding-top: 100px
    }
    .px-hero-6-thumb img {
        max-width: 100%;
        margin-left: 0
    }
    .px-about-2-subtitle {
        font-size: 70px
    }
    .px-about-3-area,
    .px-brand-style-3 {
        padding-top: 40px;
        padding-bottom: 40px
    }
    .px-about-5-style {
        padding-top: 0
    }
    .px-about-6-area {
        padding-top: 40px;
        padding-bottom: 80px
    }
    .pf-3-hero-content,
    .pf-hero-content,
    .px-about-6-top,
    .tp-contact-us-title {
        margin-bottom: 30px
    }
    .px-about-6-thumb {
        padding-top: 0;
        margin-bottom: 40px
    }
    .px-about-6-thumb img {
        width: 100%
    }
    .am-about-inner-ptb,
    .px-pd-2-area,
    .px-pd-2-np-ptb,
    .px-pd-2-slider-ptb,
    .px-pd-2-thumb-ptb {
        padding-bottom: 80px
    }
    .am-skill-title-box {
        margin-bottom: 10px
    }
    .px-project-4-style .px-project-3-item {
        margin-bottom: 60px
    }
    .pf-hero-ptb {
        padding-top: 200px;
        padding-bottom: 30px
    }
    .pf-3-hero-social a {
        display: inline-block
    }
    .pf-3-hero-social-wrap {
        justify-content: start;
        margin-bottom: 30px
    }
    .pf-6-hero-ptb {
        padding-top: 150px;
        padding-bottom: 40px
    }
    .px-inner-service-2-ptb,
    .px-pd-2-top,
    .tp-contact-us-wrap-ptb {
        padding-bottom: 40px
    }
    .px-pd-2-overview-heading {
        padding-bottom: 30px
    }
    .px-award-item .row [class*=col-]:nth-child(3) .px-award-nomination,
    .tp-team-details-wrapper {
        padding-left: 0
    }
    .px-service-2-wrap label {
        font-size: 14px
    }
    .px-service-4-area {
        padding-top: 80px;
        padding-bottom: 0
    }
    .px-inner-service-2-faq-ptb {
        padding-top: 30;
        padding-bottom: 30px
    }
    .inner-service-1-left {
        margin-bottom: 50px
    }
    .ar-testimonial-arrow {
        text-align: center;
        margin-top: 70px
    }
    .ar-testimonial-arrow button.ar-testimonial-next,
    .ar-testimonial-arrow button.ar-testimonial-prev {
        position: static
    }
    .px-funfact-inner-style {
        padding-bottom: 50px
    }
    .td-hero-area {
        padding-top: 30px
    }
    .px-team-details-style.tp-team-details-area {
        padding-top: 10px
    }
    .px-step-area {
        margin-bottom: 100px
    }
    .px-contact-info-item {
        padding-bottom: 35px
    }
    .px-contact-info-item-title {
        font-size: 28px;
        margin-bottom: 20px
    }
    .tp-contact-me-form-category-list span label span {
        font-size: 15px;
        padding: 11px 14px
    }
    .tp-contact-us-content {
        margin-top: 0
    }
    .tp-contact-us-info-area {
        padding-bottom: 90px
    }
    .cn-contactform-support-area {
        margin-bottom: 80px
    }
}

.cn-contactform-support-bg {
    background-repeat: no-repeat;
    background-size: cover;
    object-fit: cover;
    height: 385px
}

.cn-contactform-support-text span {
    font-size: 44px;
    font-weight: 500;
    line-height: 52px;
    max-width: 755px;
    margin: 0 auto;
    display: inline-block;
    letter-spacing: -.88px;
    color: var(--tp-common-px-black)
}

.pixora-dark body {
    background-color: #0e0f11
}

.pixora-dark .inner-service-1-category-item:first-child {
    border-top: 1px solid rgba(255, 255, 255, .06)
}

.pixora-dark .inner-service-1-category-item {
    border-bottom: 1px solid rgba(255, 255, 255, .06)
}

.bf-dark .bf-about-4-icon,
.bf-dark .bf-brands-item img,
.bf-dark .bf-contact-us-shape,
.bf-dark .bf-hero-2-left-right,
.bf-dark .bf-portfolio-3-shape img,
.bf-dark .bf-service-step-icon,
.bf-dark .bf-text-moving-top span img,
.pixora-dark .px-hero-4-video img,
.pixora-dark .px-inner-service-video video,
.pixora-dark .px-service-5-icon img {
    filter: invert(1)
}

.pixora-dark .px-header-style-black .px-header-menu nav>ul>li>a {
    text-transform: uppercase;
    color: var(--tp-common-px-white)
}

.pixora-dark .inner-service-1-text span,
.pixora-dark .pf-4-hero-wrap p,
.pixora-dark .postbox-author-info span,
.pixora-dark .postbox-content p,
.pixora-dark .postbox-details-meta .postbox-author-name,
.pixora-dark .postbox-details-quote span,
.pixora-dark .postbox-meta span,
.pixora-dark .postbox-tag,
.pixora-dark .px-about-5-style .px-about-4-content p,
.pixora-dark .px-about-content p,
.pixora-dark .px-about-info-body p,
.pixora-dark .px-about-info-head em,
.pixora-dark .px-about-title,
.pixora-dark .px-contact-inf a,
.pixora-dark .px-contact-info-item-content a,
.pixora-dark .px-hero-5-category a,
.pixora-dark .px-hero-5-content span,
.pixora-dark .px-hero-5-social a,
.pixora-dark .px-hero-5-thumb span,
.pixora-dark .px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-body .px-inner-service-2-list ul li,
.pixora-dark .px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-body p,
.pixora-dark .px-pd-2-overview-wrap p,
.pixora-dark .px-pd-2-step-item span,
.pixora-dark .px-pd-4-work-content p,
.pixora-dark .px-pd-4-work-item-text span,
.pixora-dark .px-project-3-inner-box p,
.pixora-dark .px-project-5-content span,
.pixora-dark .px-project-content span,
.pixora-dark .px-project-title-box p,
.pixora-dark .px-service-2-content span,
.pixora-dark .px-service-5-content p,
.pixora-dark .rc-post-meta span,
.pixora-dark .tp-blog-details-without-heading .postbox-details-item .postbox-tag span,
.pixora-dark .tp-team-details-more ul li span,
.pixora-dark .tp-team-details-text p,
.pixora-dark .tp-team-details-text-sub {
    color: rgba(255, 255, 255, .6)
}

.pixora-dark .px-step-bottom,
.pixora-dark .tp-team-details-info-contact {
    border-top: 1px solid rgba(255, 255, 255, .1);
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

.pixora-dark .tp-team-details-input-content input,
.pixora-dark .tp-team-details-input-content textarea {
    background-color: #0a0a0a;
    color: var(--tp-common-px-white);
    border: 1px solid rgba(255, 255, 255, .1)
}

.pixora-dark .tp-team-details-input-content input::-webkit-input-placeholder,
.pixora-dark .tp-team-details-input-content textarea::-webkit-input-placeholder {
    color: var(--tp-common-px-white)
}

.pixora-dark .tp-team-details-input-content input::-moz-placeholder,
.pixora-dark .tp-team-details-input-content textarea::-moz-placeholder {
    color: var(--tp-common-px-white)
}

.pixora-dark .tp-team-details-input-content input:-moz-placeholder,
.pixora-dark .tp-team-details-input-content textarea:-moz-placeholder {
    color: var(--tp-common-px-white)
}

.pixora-dark .tp-team-details-input-content input:-ms-input-placeholder,
.pixora-dark .tp-team-details-input-content textarea:-ms-input-placeholder {
    color: var(--tp-common-px-white)
}

.pixora-dark .tp-team-details-input-content input::placeholder,
.pixora-dark .tp-team-details-input-content textarea::placeholder {
    color: var(--tp-common-px-white)
}

.pixora-dark .tp-team-details-input-btn button:hover {
    background-color: var(--tp-common-px-white);
    border-color: var(--tp-common-px-white)
}

.pixora-dark .ar-testimonial-client-name,
.pixora-dark .ar-testimonial-fraction-wrap .swiper-pagination-fraction span,
.pixora-dark .ar-testimonial-item p,
.pixora-dark .design-copyright-backtoTop a,
.pixora-dark .design-copyright-backtoTop a span,
.pixora-dark .design-footer-widget-info a,
.pixora-dark .design-footer-widget-title,
.pixora-dark .pf-3-hero-title,
.pixora-dark .pf-4-hero-subtitle,
.pixora-dark .pf-4-hero-title,
.pixora-dark .pf-5-hero-subtitle,
.pixora-dark .pf-5-hero-title,
.pixora-dark .pf-6-hero-title,
.pixora-dark .pf-hero-content p,
.pixora-dark .pf-hero-content span,
.pixora-dark .px-about-5-style .px-about-4-content p span,
.pixora-dark .px-about-5-style .px-about-4-link,
.pixora-dark .px-about-5-style .px-section-title.ff-inter,
.pixora-dark .px-capsule-subtitle,
.pixora-dark .px-capsule-title,
.pixora-dark .px-hero-4-bigtitle h2,
.pixora-dark .px-hero-4-content p,
.pixora-dark .px-hero-4-video-btn span,
.pixora-dark .px-inner-service-2-title,
.pixora-dark .px-pd-2-bottom-item h6,
.pixora-dark .px-pd-2-overview-title,
.pixora-dark .px-pd-2-overview-wrap ul li,
.pixora-dark .px-pd-2-step-item-title,
.pixora-dark .px-pd-2-step-title,
.pixora-dark .px-pd-2-title,
.pixora-dark .px-pd-4-about-list ul li,
.pixora-dark .px-pd-4-about-sub,
.pixora-dark .px-pd-4-about-text,
.pixora-dark .px-pd-4-title,
.pixora-dark .px-pd-4-work-heading,
.pixora-dark .px-pd-4-work-item-title,
.pixora-dark .px-pd-4-work-title,
.pixora-dark .px-project-3-title,
.pixora-dark .px-project-5-title-sm,
.pixora-dark .px-project-inner-4-tab-wrap .masonary-menu button,
.pixora-dark .px-project-inner-5-tab .masonary-menu button.active,
.pixora-dark .px-project-inner-5-tab .masonary-menu button:hover,
.pixora-dark .px-project-inner-style .px-project-6-item.is-active .px-project-6-title,
.pixora-dark .px-project-inner-style .px-project-6-item.is-active .px-project-inner-wrap-content span,
.pixora-dark .px-project-title,
.pixora-dark .px-section-title.ff-thunder.fs-100,
.pixora-dark .px-section-title.ff-thunder.fs-130,
.pixora-dark .px-service-5-link a,
.pixora-dark .px-service-5-title,
.pixora-dark .px-step-bottom-text span,
.pixora-dark .px-step-num span {
    color: var(--tp-common-px-white)
}

.pixora-dark .pf-3-hero-social-text span::before {
    background-color: rgba(255, 255, 255, .1)
}

.pixora-dark .aus-service-content-wrap,
.pixora-dark .aus-service-item,
.pixora-dark .in-blog-list-category-wrap,
.pixora-dark .postbox-details-form,
.pixora-dark .postbox-item,
.pixora-dark .px-project-inner-wrapper,
.pixora-dark .sidebar-widget-author,
.pixora-dark .tp-blog-details-ptb {
    border-color: rgba(255, 255, 255, .08)
}

.pixora-dark .px-project-inner-4-tab-wrap .masonary-menu button.active,
.pixora-dark .px-project-inner-4-tab-wrap .masonary-menu button:hover {
    color: var(--tp-common-px-white);
    background-color: #1c1d20
}

.pixora-dark .px-project-inner-5-top {
    border-bottom: 1px solid rgba(255, 255, 255, .2)
}

.pixora-dark .am-capsule-style .px-capsule-inner,
.pixora-dark .postbox-details-author .sidebar-widget-author,
.pixora-dark .postbox-details-code,
.pixora-dark .postbox-details-quote-box,
.pixora-dark .px-brand-item,
.pixora-dark .px-contact-wrapper,
.pixora-dark .px-header-2-bar button,
.pixora-dark .px-project-item {
    background-color: #1c1d20
}

.pixora-dark .aus-service-content p,
.pixora-dark .design-copyright-text p,
.pixora-dark .design-footer-widget-title.sm,
.pixora-dark .px-blog-meta,
.pixora-dark .px-funfact-inner-style .ar-funfact-item span,
.pixora-dark .px-pd-2-bottom-item span,
.pixora-dark .px-team-content span {
    color: rgba(255, 255, 255, .5)
}

.pixora-dark .px-pd-2-dot .swiper-pagination-bullet {
    background: rgba(255, 255, 255, .3)
}

.pixora-dark .postbox-details-social a,
.pixora-dark .px-portfolio-details-btn,
.pixora-dark .sidebar-widget-category ul li a,
.pixora-dark .tagcloud a {
    background-color: #1c1d20;
    color: var(--tp-common-px-white)
}

.pixora-dark .px-pd-4-np-content p,
.pixora-dark .px-pd-4-np-content span {
    color: rgba(255, 255, 255, .2)
}

.bf-dark .bf-about-4-item,
.bf-dark .homemenu-thumb-wrap,
.pixora-dark .px-capsule-inner,
.pixora-dark .px-service-5-item {
    border: 1px solid rgba(255, 255, 255, .1)
}

.pixora-dark .in-blog-list-category span,
.pixora-dark .px-btn-slide,
.pixora-dark .px-header-6-menu nav>ul>li>a,
.pixora-dark .px-hero-6-category span,
.pixora-dark .px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons,
.pixora-dark .tp-contact-me-interest-form-wrap .tp-contact-form-input input,
.pixora-dark .tp-contact-me-interest-form-wrap .tp-contact-form-input textarea {
    background: #1c1d20;
    color: var(--tp-common-px-white)
}

.pixora-dark .ar-testimonial-arrow button {
    border: 1px solid rgba(255, 255, 255, .2)
}

.pixora-dark .px-brand-style-3 .px-brand-item,
.pixora-dark .px-brand-style-5 .px-brand-item {
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, .1)
}

.pixora-dark .px-inner-about-1-video video,
.pixora-dark .px-step-video video {
    mix-blend-mode: lighten;
    filter: invert(1)
}

.pixora-dark .px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items.faq-active,
.pixora-dark .rc-post-wrap .rc-post:not(:last-child) {
    border-color: rgba(255, 255, 255, .2)
}

.bf-dark .bf-header-white .tp-main-menu-2 nav>ul,
.pixora-dark .px-inner-service-2-faq .px-service-accordion-wrap .accordion .accordion-items.faq-active .accordion-header .accordion-buttons {
    background: 0 0
}

.pixora-dark .design-footer-middle,
.pixora-dark .px-contact-info-item {
    border-bottom: 1px solid rgba(255, 255, 255, .08)
}

.pixora-dark .design-footer-widget-input input::-webkit-input-placeholder {
    color: var(--tp-common-px-white)
}

.pixora-dark .design-footer-widget-input input::-moz-placeholder {
    color: var(--tp-common-px-white)
}

.pixora-dark .design-footer-widget-input input:-moz-placeholder {
    color: var(--tp-common-px-white)
}

.pixora-dark .design-footer-widget-input input:-ms-input-placeholder {
    color: var(--tp-common-px-white)
}

.pixora-dark .design-footer-widget-input input::placeholder {
    color: var(--tp-common-px-white)
}

.bf-dark .bf-instagram-thumb-inner-8 a,
.bf-service-item-3-btn a:hover span,
.pixora-dark .design-footer-widget-input-icon,
.pixora-dark .px-btn-black {
    color: var(--tp-common-px-black);
    background-color: var(--tp-common-px-white)
}

.pixora-dark .am-about-content p,
.pixora-dark .am-skill-item h4,
.pixora-dark .am-skill-item ul li span,
.pixora-dark .ar-funfact-item h4,
.pixora-dark .ar-funfact-item span,
.pixora-dark .aus-service-content h4,
.pixora-dark .aus-service-content label,
.pixora-dark .aus-service-content span,
.pixora-dark .in-team-hero-content p,
.pixora-dark .postbox-title,
.pixora-dark .px-about-2-subtitle,
.pixora-dark .px-about-2-title,
.pixora-dark .px-about-3-bigtext,
.pixora-dark .px-about-3-content p,
.pixora-dark .px-about-content p span,
.pixora-dark .px-about-info-body h4,
.pixora-dark .px-about-info-head h4,
.pixora-dark .px-about-link,
.pixora-dark .px-about-title span,
.pixora-dark .px-award-category span,
.pixora-dark .px-award-content>span,
.pixora-dark .px-award-nomination span,
.pixora-dark .px-award-num span,
.pixora-dark .px-award-year span,
.pixora-dark .px-contact-inf a:hover,
.pixora-dark .px-contact-inf-social a,
.pixora-dark .px-contact-inf-title,
.pixora-dark .px-contact-info-item-content a:hover,
.pixora-dark .px-contact-info-item-title,
.pixora-dark .px-contact-info-title,
.pixora-dark .px-contact-title,
.pixora-dark .px-funfact-inner-style .ar-funfact-item h4,
.pixora-dark .px-header-style-black .px-header-menu nav>ul>li.has-dropdown a::after,
.pixora-dark .px-hero-2-content span,
.pixora-dark .px-hero-2-text span,
.pixora-dark .px-hero-5-content p,
.pixora-dark .px-inner-about-1-content p,
.pixora-dark .px-inner-about-1-top p,
.pixora-dark .px-inner-about-style .px-about-3-content p,
.pixora-dark .px-section-title,
.pixora-dark .px-section-title.ff-thunder.fs-80,
.pixora-dark .px-service-2-content p,
.pixora-dark .px-service-2-title,
.pixora-dark .px-service-2-title>span,
.pixora-dark .px-service-2-wrap label,
.pixora-dark .px-text-slider-style-3 .px-text-slider-item span,
.pixora-dark .tp-contact-me-interest-form-wrap .tp-contact-form-input label,
.pixora-dark .tp-contact-me-interest-title,
.pixora-dark .tp-contact-us-text p,
.pixora-dark .tp-contact-us-title,
.pixora-dark .tp-contact-us-wrap .tp-contact-form-input label,
.pixora-dark .tp-section-subtitle,
.pixora-dark .tp-section-title {
    color: var(--tp-common-px-white)
}

.pixora-dark .px-contact-wrapper .tp-contact-form-input input,
.pixora-dark .px-contact-wrapper .tp-contact-form-input textarea,
.pixora-dark .tp-contact-us-info-title {
    color: var(--tp-common-px-white);
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

.pixora-dark .px-contact-wrapper .tp-contact-form-input input::-webkit-input-placeholder,
.pixora-dark .px-contact-wrapper .tp-contact-form-input textarea::-webkit-input-placeholder {
    color: rgba(255, 255, 255, .4)
}

.pixora-dark .px-contact-wrapper .tp-contact-form-input input::-moz-placeholder,
.pixora-dark .px-contact-wrapper .tp-contact-form-input textarea::-moz-placeholder {
    color: rgba(255, 255, 255, .4)
}

.pixora-dark .px-contact-wrapper .tp-contact-form-input input:-moz-placeholder,
.pixora-dark .px-contact-wrapper .tp-contact-form-input textarea:-moz-placeholder {
    color: rgba(255, 255, 255, .4)
}

.pixora-dark .px-contact-wrapper .tp-contact-form-input input:-ms-input-placeholder,
.pixora-dark .px-contact-wrapper .tp-contact-form-input textarea:-ms-input-placeholder {
    color: rgba(255, 255, 255, .4)
}

.pixora-dark .px-contact-wrapper .tp-contact-form-input input::placeholder,
.pixora-dark .px-contact-wrapper .tp-contact-form-input textarea::placeholder {
    color: rgba(255, 255, 255, .4)
}

.pixora-dark .tp-contact-me-interest-form-wrap .tp-contact-form-input input:focus,
.pixora-dark .tp-contact-me-interest-form-wrap .tp-contact-form-input textarea:focus {
    background-color: transparent
}

.pixora-dark .tp-contact-us-wrap .tp-contact-form-input input,
.pixora-dark .tp-contact-us-wrap .tp-contact-form-input textarea {
    color: var(--tp-common-px-white);
    border-color: transparent;
    background: rgba(255, 255, 255, .06)
}

.pixora-dark .postbox-details-code pre,
.pixora-dark .postbox-details-form p,
.pixora-dark .postbox-details-list ul li,
.pixora-dark .postbox-details-remeber label,
.pixora-dark .postbox-details-text p,
.pixora-dark .postbox__comment-name span,
.pixora-dark .postbox__comment-text p,
.pixora-dark .sidebar-widget-author-content p,
.pixora-dark .tp-contact-us-info-details a {
    color: rgba(255, 255, 255, .7)
}

.pixora-dark .px-btn-black {
    color: var(--tp-common-px-black-2);
    background-color: var(--tp-common-px-white)
}

.pixora-dark .px-funfact-inner-style .ar-funfact-item {
    border-color: rgba(255, 255, 255, .15)
}

.pixora-dark .postbox-details-tag span:last-child::after {
    background-color: rgba(255, 255, 255, .6)
}

.pixora-dark .ar-testimonial-fraction-wrap .swiper-horizontal>.swiper-pagination-progressbar,
.pixora-dark .ar-testimonial-fraction-wrap .swiper-pagination-progressbar.swiper-pagination-horizontal,
.pixora-dark .ar-testimonial-fraction-wrap .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,
.pixora-dark .ar-testimonial-fraction-wrap .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.pixora-dark .postbox-details-meta>div:not(:first-child)::after {
    background: rgba(255, 255, 255, .2)
}

.pixora-dark .postbox-details-input input,
.pixora-dark .postbox-details-input textarea,
.pixora-dark .sidebar-search input {
    border-color: #1c1d20;
    background-color: #1c1d20;
    color: var(--tp-common-px-white)
}

.pixora-dark .sidebar-search input::placeholder {
    color: var(--tp-common-px-white)
}

.bf-btn-rounded:hover,
.bf-btn-white-border:hover,
.bf-contact-author-info .tp-btn span,
.bf-dark .bf-about-3-avatar p,
.bf-dark .bf-about-3-count-title,
.bf-dark .bf-about-3-subtile span,
.bf-dark .bf-about-4-item-title,
.bf-dark .bf-about-4-title,
.bf-dark .bf-about-us-subtitle,
.bf-dark .bf-about-us-title,
.bf-dark .bf-brands-title,
.bf-dark .bf-contact-us-title,
.bf-dark .bf-header-white.header-sticky .tp-header-search,
.bf-dark .bf-header-white.header-sticky .tp-main-menu nav>ul>li>a,
.bf-dark .bf-hero-2-title,
.bf-dark .bf-hero-3-title,
.bf-dark .bf-instagram-subtitle,
.bf-dark .bf-instagram-title,
.bf-dark .bf-portfolio-3-content .mb-50,
.bf-dark .bf-portfolio-3-content span,
.bf-dark .bf-portfolio-3-title,
.bf-dark .bf-portfolio-4-title,
.bf-dark .bf-portfolio-title,
.bf-dark .bf-portfolio-vp-maintitle,
.bf-dark .bf-service-step-item h4,
.bf-dark .bf-service-step-subtitle span,
.bf-dark .bf-service-step-title,
.bf-dark .bf-team-contact a,
.bf-dark .bf-team-info h4,
.bf-dark .bf-team-subtitle,
.bf-dark .bf-text-moving-item span,
.bf-dark .design-award-item.active .design-award-content h4,
.bf-dark .design-award-item.active .design-award-content span,
.bf-dark .homemenu-title,
.bf-dark .reveal-text .char.revealed,
.bf-dark .tp-blog-date,
.bf-dark .tp-blog-tittle,
.bf-footer-2-wrap .tp-footer-email,
.bf-footer-2-wrap .tp-hero-bigtext h2,
.bf-header-white .tp-header-search,
.bf-header-white .tp-main-menu nav>ul>li>a,
.bf-hero-right-content ul li a:hover,
.pixora-dark .cn-contactform-support-text span,
.pixora-dark .in-blog-hero-title,
.pixora-dark .in-blog-list-search-icon span,
.pixora-dark .in-blog-list-search-input input,
.pixora-dark .postbox-blockquote-paragraph p,
.pixora-dark .postbox-details-form-title,
.pixora-dark .postbox-details-input label,
.pixora-dark .postbox-details-quote p,
.pixora-dark .postbox__comment-name h5,
.pixora-dark .px-about-6-content p,
.pixora-dark .px-blog-category,
.pixora-dark .px-blog-title,
.pixora-dark .px-breadcrumb-title,
.pixora-dark .px-header-6-info a,
.pixora-dark .px-hero-6-info p,
.pixora-dark .px-hero-6-social a,
.pixora-dark .px-hero-6-text span,
.pixora-dark .px-pd-4-np-title,
.pixora-dark .px-project-6-item.is-active .px-project-6-content p,
.pixora-dark .px-project-6-item.is-active .px-project-6-content span,
.pixora-dark .px-project-6-item.is-active .px-project-6-title,
.pixora-dark .px-project-inner-6-text span,
.pixora-dark .rc-post-title,
.pixora-dark .sidebar-search input~button,
.pixora-dark .sidebar-widget-author-name,
.pixora-dark .sidebar-widget-author-social a span,
.pixora-dark .sidebar-widget-title,
.tp-footer-copyright p a,
.tp-footer-link:hover {
    color: var(--tp-common-px-white)
}

.pixora-dark .postbox__comment-reply a,
.pixora-dark .rc-post-category a {
    color: var(--tp-common-px-white);
    border-color: rgba(255, 255, 255, .1)
}

.pixora-dark .sidebar-widget-category ul li a span {
    color: rgba(255, 255, 255, .4)
}

.bf-dark .design-award-content h4,
.bf-dark .design-award-content span,
.pixora-dark .postbox-details-list ul li span {
    color: rgba(255, 255, 255, .3)
}

.pixora-dark .postbox-details-list ul li::before {
    background-color: rgba(255, 255, 255, .7)
}

.pixora-dark .postbox-details-remeber label::before {
    filter: invert(0);
    color: var(--tp-common-px-white)
}

.pixora-dark .postbox-author-name {
    color: rgba(255, 255, 255, .9)
}

.pixora-dark .basic-pagination ul li>a {
    color: var(--tp-common-px-white);
    border-color: rgba(255, 255, 255, .15)
}

.pixora-dark .in-blog-list-search-input input::placeholder {
    color: rgba(255, 255, 255, .6)
}

.pixora-dark .px-service-6-slide-wrap::after {
    background-image: linear-gradient(#1c1d20 10%, rgba(232, 233, 232, 0) 40% 60%, #1c1d20 90%)
}

.pixora-dark .px-project-6-item {
    border-color: rgba(255, 255, 255, .09)
}

.pixora-dark .px-project-6-content p,
.pixora-dark .px-project-6-content span,
.pixora-dark .px-project-6-title {
    color: #1c1d20
}

.pixora-dark .px-footer-3-social a {
    background-color: #ffffff0d
}

.pixora-dark .px-project-inner-5-tab .masonary-menu button {
    color: #bcbCBC85
}

.bf-dark .bf-about-3-count-item span,
.bf-dark .bf-about-4-dec,
.bf-dark .bf-about-dec,
.bf-dark .bf-about-us-dec,
.bf-dark .bf-contact-us-dec,
.bf-dark .bf-hero-3-dec p,
.bf-dark .bf-instagram-content p,
.bf-dark .bf-service-step-item ul li a,
.bf-dark .bf-team-info p {
    color: rgba(255, 255, 255, .6)
}

.bf-dark .bf-about-video video {
    filter: invert(1);
    mix-blend-mode: inherit
}

.bf-dark .bf-brands-item,
.bf-dark .bf-faq-wrap .accordion-item,
.bf-dark .bf-header-3-style .tp-main-menu-2 nav>ul,
.bf-dark .tp-black-bg {
    background: #1d1d1f
}

.bf-dark .bf-faq-wrap .tp-faq-btn {
    border: none
}

.bf-dark .bf-btn-rounded {
    border: 1px solid rgba(255, 255, 255, .12);
    color: var(--tp-common-px-white)
}

.bf-dark .bf-hero-3-dec {
    border-top: 1px solid rgba(255, 255, 255, .12)
}

.bf-dark .bf-about-3-avatar {
    border-bottom: 1px solid rgba(255, 255, 255, .12)
}

.bf-dark .bf-contact-author .tp-btn,
.bf-dark .bf-contact-form .tp-btn {
    color: var(--tp-common-px-white);
    background: var(--tp-common-px-black)
}

.bf-dark .bf-header-3-style .tp-header-menu-btn:hover span,
.bf-dark .bf-header-white.header-sticky .tp-header-menu-btn span,
.bf-dark.update-bg,
.bf-header-3-style .tp-header-menu-btn:hover,
.bf-header-white .tp-header-menu-btn:hover span,
.bf-header-white.header-sticky .tp-header-menu-btn {
    background: var(--tp-common-px-black)
}

.bf-dark .bf-header-3-style .tp-header-menu-btn:hover,
.bf-dark .bf-header-white.header-sticky .tp-header-menu-btn,
.bf-dark .bf-team-contact span,
.bf-header-3-style .tp-header-menu-btn,
.bf-header-3-style .tp-header-menu-btn:hover span,
.bf-header-3-style .tp-main-menu-2 nav>ul,
.bf-header-white .tp-header-menu-btn:hover,
.bf-header-white.header-sticky .tp-header-menu-btn span {
    background: var(--tp-common-px-white)
}

.bf-dark .bf-team-info {
    border-top: 1px solid rgba(255, 255, 255, .1)
}

.bf-dark .bf-header-logo .logo-dark,
.bf-dark .bf-header-white.header-sticky .bf-header-logo .logo-dark {
    display: none !important
}

.bf-dark .bf-header-white.header-sticky .tp-btn,
.bf-dark .tp-btn {
    color: var(--tp-common-px-black);
    background: var(--tp-common-px-white)
}

.bf-dark .bf-contact-us-form .tp-input {
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    color: var(--tp-common-px-white)
}

.bf-dark .bf-contact-us-form .tp-input::placeholder {
    color: rgba(255, 255, 255, .6)
}

.bf-dark .homemenu-btn .tp-btn,
.bf-header-white.header-sticky .bf-btn-white {
    background: var(--tp-common-px-black);
    color: var(--tp-common-px-white)
}

.bf-btn-white,
.bf-dark .homemenu-btn .bf-btn-white {
    background: var(--tp-common-px-white);
    color: var(--tp-common-px-black)
}

.bf-dark .reveal-text .char {
    color: #a8a8a8
}

.bf-dark .tp-text-content span {
    color: rgba(255, 255, 255, .2) !important
}

.bf-dark .bf-text-slider-style .tp-text-slide-bottom .tp-text-content span {
    color: var(--tp-common-px-red) !important
}

.bf-dark .design-award-item,
.bf-dark .design-award-item:hover {
    border-bottom: 1px solid rgba(255, 255, 255, .3)
}

.bf-dark .tp-blog-tag {
    color: var(--tp-common-px-white);
    background: rgba(255, 255, 255, .08)
}

.bf-dark .tp-btn-border {
    border: 1px solid rgba(255, 255, 255, .2);
    color: var(--tp-common-px-white);
    background: 0 0
}

.bf-hero-video video {
    width: 360px;
    height: 240px;
    object-fit: cover;
    border-radius: 16px
}

.bf-hero-top {
    margin-bottom: 150px
}

.bf-hero-spacing {
    padding-top: 160px;
    padding-bottom: 70px
}

.bf-hero-right-content ul {
    text-align: right
}

.bf-hero-right-content ul li a {
    font-weight: 500;
    font-size: 24px;
    line-height: 167%;
    letter-spacing: -.02em;
    color: rgba(255, 255, 255, .65)
}

.bf-hero-right-content ul li a .explore-text {
    position: relative;
    display: inline-block;
    padding: 0;
    transition: transform .5s;
    transform-origin: 50% 0;
    transform-style: preserve-3d;
    line-height: 1
}

.bf-hero-right-content ul li a .explore-text::before {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 100%;
    content: attr(data-text);
    transition: color .5s;
    transform: rotateX(-90deg);
    transform-origin: 50% 0;
    text-align: center;
    z-index: -1
}

.bf-hero-right-content ul li a:hover .explore-text {
    transform: rotateX(90deg) translateY(-12px);
    color: inhewrit
}

.bf-hero-bottom-content p {
    font-weight: 500;
    font-size: 24px;
    line-height: 125%;
    letter-spacing: -.03em;
    color: var(--tp-common-px-white)
}

.bf-hero-scrolling-words {
    height: 300px;
    margin: auto;
    overflow: hidden
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .tp-contact-us-wrap {
        padding: 50px
    }
    .bf-hero-scrolling-words {
        height: 260px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .tp-contact-us-wrap {
        padding: 30px
    }
    .bf-hero-scrolling-words {
        height: 230px
    }
}

.bf-hero-scrolling-words ul {
    animation: 8s infinite scrollUp
}

.bf-hero-scrolling-words ul li {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    list-style: none;
    font-weight: 500;
    font-size: 400px;
    line-height: 1;
    letter-spacing: -.01em;
    text-transform: uppercase;
    color: var(--tp-common-px-white);
    font-family: var(--tp-ff-thundermed)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .bf-hero-scrolling-words ul li {
        font-size: 350px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .bf-hero-scrolling-words ul li {
        font-size: 300px
    }
}

.bf-hero-3-spacing {
    padding-top: 222px
}

.bf-hero-3-title {
    font-weight: 400;
    font-size: 135px;
    line-height: 100%;
    letter-spacing: -.04em;
    text-transform: uppercase;
    text-align: center;
    color: var(--tp-common-px-black)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .bf-hero-3-title {
        font-size: 113px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .bf-hero-3-title {
        font-size: 90px
    }
}

.bf-hero-3-title-video {
    display: inline-block;
    margin-right: -13px
}

.bf-hero-3-title-video video {
    width: 170px;
    height: 98px;
    object-fit: cover;
    border-radius: 98px
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px),
only screen and (min-width:576px) and (max-width:767px),
(max-width:767px) {
    .bf-hero-3-spacing {
        padding-top: 180px
    }
    .bf-hero-3-title .spacing {
        padding-right: 0
    }
    .bf-hero-3-title-video video {
        height: 72px
    }
    .bf-hero-3-dec p br {
        display: none
    }
}

.bf-hero-3-video-wrap video {
    width: 100%;
    height: 730px;
    object-fit: cover;
    border-radius: 30px
}

.bf-hero-3-thumb {
    position: absolute;
    top: -75px;
    right: -154px;
    z-index: -1
}

.bf-hero-3-thumb-2 {
    position: absolute;
    top: -10px;
    right: -130px;
    z-index: -1
}

.bf-hero-3-dec {
    border-top: 1px solid #d9d9d9;
    padding-top: 34px;
    margin-top: 50px
}

.bf-contact-us-dec,
.bf-hero-3-dec p {
    font-weight: 400;
    font-size: 24px;
    line-height: 125%;
    letter-spacing: -.02em;
    color: var(--tp-common-px-black)
}

.bf-hero-2-spacing {
    padding-top: 267px;
    position: relative;
    height: 100vh;
    overflow: hidden
}

.bf-hero-2-title {
    font-weight: 500;
    font-size: 110px;
    line-height: 91%;
    letter-spacing: -.03em;
    text-align: center
}

.bf-hero-2-title .gif-1 {
    width: 204px;
    margin: -51px -64px -36px
}

.bf-hero-2-title .gif-2 {
    width: 160px;
    margin-left: -34px;
    margin-right: -44px;
    margin-top: -18px
}

.bf-hero-2-title .gif-3 {
    width: 160px;
    margin-right: -44px;
    margin-top: -50px
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px),
only screen and (min-width:576px) and (max-width:767px),
(max-width:767px) {
    .bf-hero-2-title .gif-3 {
        width: 113px;
        margin-right: -21px;
        margin-top: -32px
    }
}

.bf-hero-2-left-right {
    display: inline-block;
    width: 180px
}

.bf-hero-2-video {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 360px;
    height: 240px;
    overflow: hidden;
    transform-origin: bottom left;
    z-index: 1
}

.bf-hero-2-video video {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.tp-image-distortion {
    overflow: hidden;
    height: 100%;
    position: relative
}

@keyframes scrollUp {
    15%,
    25% {
        transform: translateY(-20%)
    }
    40%,
    50% {
        transform: translateY(-40%)
    }
    65%,
    75% {
        transform: translateY(-60%)
    }
    100%,
    90% {
        transform: translateY(-80%)
    }
}

.bf-header-style .tp-header-menu-btn {
    background: 0 0;
    border: 1px solid var(--tp-common-px-white)
}

.common-underline,
.common-underline:hover {
    background-image: linear-gradient(currentColor, currentColor), linear-gradient(currentColor, currentColor);
    background-position: 100% 100%, 0 100%;
    background-repeat: no-repeat;
    transition: background-size .3s linear
}

.bf-header-white .tp-main-menu-2 nav>ul {
    background: 0 0;
    padding-left: 0;
    padding-right: 0;
    border-radius: 0
}

@media (min-width:1400px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1510px
    }
    .container-1870 {
        max-width: 1870px
    }
    .container-1800 {
        max-width: 1800px
    }
    .container-1730 {
        max-width: 1730px
    }
    .container-1680 {
        max-width: 1680px
    }
    .container-1630 {
        max-width: 1630px
    }
    .container-1580 {
        max-width: 1580px
    }
    .container-1550 {
        max-width: 1550px
    }
    .container-1460 {
        max-width: 1460px
    }
    .container-1430 {
        max-width: 1430px
    }
    .container-1330 {
        max-width: 1330px
    }
    .container-1320 {
        max-width: 1320px
    }
    .container-1300 {
        max-width: 1300px
    }
    .container-1230 {
        max-width: 1230px
    }
    .container-1200 {
        max-width: 1200px
    }
    .container-1030 {
        max-width: 1030px
    }
    .container-1830 {
        max-width: 1830px
    }
    .container-1710 {
        max-width: 1710px
    }
    .container-1750 {
        max-width: 1750px
    }
    .container-1650 {
        max-width: 1650px
    }
    .container-1860 {
        max-width: 1860px
    }
    .container-1350 {
        max-width: 1350px
    }
}

.common-underline {
    background-size: 0 1px, 0 1px
}

.common-underline:hover {
    background-size: 0 1px, 100% 1px
}

.gx-5 {
    --bs-gutter-x: 5px
}

.bf-btn-red {
    background: var(--tp-common-px-red)
}

.bf-btn-white-border {
    background: 0 0;
    border: 1px solid var(--tp-common-px-white);
    color: var(--tp-common-px-white)
}

.bf-btn-rounded {
    width: 120px;
    height: 120px;
    font-weight: 500;
    font-size: 16px;
    color: var(--tp-common-px-black);
    border: 1px solid #dfdfdf;
    border-radius: 50%;
    display: inline-block;
    text-align: center;
    line-height: 137%;
    padding-top: 40px;
    position: relative;
    z-index: 1;
    overflow: hidden
}

.bf-btn-rounded:hover .bf-btn-circle-dot {
    width: 420px;
    height: 420px
}

.bf-btn-circle-dot {
    position: absolute;
    bottom: 0;
    left: 32px;
    width: 0;
    height: 0;
    -webkit-transition: .6s ease-out;
    -moz-transition: .6s ease-out;
    -ms-transition: .6s ease-out;
    -o-transition: .6s ease-out;
    transition: .6s ease-out;
    line-height: 20px;
    border-radius: 50%;
    background: #000;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border: 1px solid transparent;
    z-index: -1
}

.bf-section-title {
    font-weight: 500;
    font-size: 80px;
    font-family: var(--tp-ff-thundermed);
    text-transform: uppercase;
    line-height: 1
}

.bf-section-title.fs-75 {
    font-size: 75px
}

.bf-section-title-2 {
    font-size: 60px;
    font-family: var(--tp-ff-body);
    letter-spacing: -.03em
}

.bf-portfolio-title,
.des-footer-title,
.tp-porfolio-10-title,
.tp-portfolio-mix-slide-heading {
    font-family: var(--tp-ff-thundermed)
}

.bf-section-title-3 {
    font-weight: 500;
    font-size: 80px;
    line-height: 105%;
    letter-spacing: -.02em
}

.tp-section-tittle {
    font-weight: 500;
    font-size: 50px;
    line-height: 118%;
    letter-spacing: -.03em
}

.bf-about-3-avatar p,
.bf-about-dec {
    font-size: 18px;
    font-weight: 400;
    color: var(--tp-common-px-black)
}

.z-index-1 {
    z-index: 1
}

.reveal-text .char {
    color: #b6bcc6;
    transition: color .6s
}

.tp-black-bg {
    background: #000000c7
}

@keyframes marquee-horizontal {
    from {
        transform: translateX(0)
    }
    to {
        transform: translateX(-100%)
    }
}

.bf-about-video video {
    z-index: -1;
    width: 770px;
    margin-left: -55px;
    margin-top: -50px
}

.bf-about-dec {
    line-height: 167%;
    letter-spacing: -.02em
}

.bf-about-3-title {
    font-weight: 500;
    font-size: 20px;
    line-height: 120%;
    letter-spacing: -.03em
}

.bf-about-3-thumb {
    margin-top: -15px
}

@media screen and (min-device-width:1367px) and (max-device-width:1549px) {
    .smallscreen {
        height: 380px
    }
}

.bf-about-3-avatar {
    padding-bottom: 18px;
    margin-bottom: 0
}

.bf-about-3-avatar p {
    line-height: 144%;
    font-family: Montserrat !important
}

.bf-about-3-subtile span {
    color: var(--tp-common-px-black);
    font-size: 16px
}

.bf-about-3-count-title {
    font-weight: 500;
    font-size: 50px;
    letter-spacing: -.04em
}

.bf-about-3-count-item span {
    font-weight: 400;
    font-size: 18px;
    line-height: 133%;
    color: var(--tp-common-px-black)
}

.bf-about-us-spacing {
    padding-top: 185px;
    padding-bottom: 120px
}

.bf-about-us-subtitle,
.bf-team-subtitle {
    font-weight: 500;
    font-size: 16px;
    color: var(--tp-common-px-black)
}

.bf-about-us-title,
.bf-contact-us-title {
    font-weight: 600;
    font-size: 100px;
    line-height: 100%;
    letter-spacing: -.04em;
    text-transform: uppercase
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .bf-hero-3-title {
        font-size: 65px
    }
    .bf-about-us-title {
        font-size: 70px
    }
}

.bf-about-us-dec {
    font-size: 18px;
    line-height: 144%
}

.bf-about-us-dec-wrap {
    padding-left: 443px
}

.bf-about-us-gif img {
    max-width: 730px
}

.bf-about-us-video video {
    height: 930px;
    width: 100%;
    object-fit: cover
}

.bf-about-4-title {
    font-weight: 500;
    font-size: 48px;
    line-height: 120%;
    letter-spacing: -.03em
}

.bf-about-4-item {
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 10px;
    padding: 30px 23px 5px
}

.bf-about-4-item-title {
    font-weight: 500;
    font-size: 22px;
    letter-spacing: -.05em
}

.bf-about-4-dec {
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: #595959
}

.bf-brands-title {
    font-weight: 500;
    font-size: 16px;
    letter-spacing: -.02em;
    color: var(--tp-common-px-black)
}

.bf-brands-item {
    height: 180px;
    width: 100%;
    background: var(--tp-common-px-white);
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center
}

.bf-portfolio-title {
    font-weight: 500;
    font-size: 280px;
    letter-spacing: -.01em;
    text-transform: uppercase;
    line-height: 1
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .bf-brands-item {
        height: 90px
    }
    .bf-portfolio-title {
        font-size: 220px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .bf-portfolio-title {
        font-size: 160px
    }
}

.bf-portfolio-content {
    display: flex;
    justify-content: space-between;
    width: 100%;
    position: absolute;
    bottom: 50px;
    left: 0;
    padding: 0 70px
}

.bf-portfolio-content span {
    font-weight: 500;
    font-size: 30px;
    letter-spacing: -.02em;
    color: var(--tp-common-px-white)
}

.bf-portfolio-3-sectitle {
    font-weight: 500;
    font-size: 140px;
    line-height: 80%;
    letter-spacing: -.06em;
    text-transform: none
}

.bf-portfolio-3-title {
    font-weight: 500;
    font-size: 80px;
    line-height: 1;
    text-transform: uppercase
}

.bf-portfolio-3-title-box p {
    font-weight: 500;
    font-size: 18px;
    line-height: 125%;
    letter-spacing: -.02em;
    color: var(--tp-common-px-black)
}

.bf-portfolio-3-content span {
    font-weight: 400;
    font-size: 20px;
    line-height: 150%;
    letter-spacing: -.02em;
    color: var(--tp-common-px-black);
    display: block
}

.bf-portfolio-4-title {
    font-size: 50px;
    font-weight: 500;
    line-height: 60px;
    letter-spacing: -1.5px
}

.tp-portfolio-mix-slider {
    height: 100%;
    width: 100%
}

.tp-portfolio-mix-slider-wrap.mix {
    padding: 0;
    height: 100vh
}

.tp-portfolio-mix-slider-navigation,
.tp-portfolio-mix-slider-navigation .slider-nav-box {
    position: absolute;
    bottom: 0;
    width: 100%
}

.tp-portfolio-mix-slider-navigation .nav-icon {
    font-size: 16px;
    text-transform: uppercase;
    display: flex;
    gap: 20px;
    color: var(--tp-common-px-white);
    line-height: 1;
    position: relative;
    z-index: 2;
    cursor: pointer
}

.tp-portfolio-mix-slider-navigation .slider-nav {
    display: flex;
    height: 80px;
    justify-content: space-between;
    width: 100%;
    align-items: center
}

.tp-portfolio-mix-slider-image .popup-image {
    position: absolute;
    bottom: 200px;
    left: 72px;
    right: auto
}

.tp-portfolio-mix-slider-image .popup-image i {
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0, 0, 0, .2);
    backdrop-filter: blur(10px);
    color: var(--tp-common-px-white)
}

.tp-portfolio-mix-slider-content {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center
}

.tp-portfolio-mix-slider-content .tp-portfolio-mix-slide-text {
    transform: translateX(200px);
    transition: 2s
}

.tp-portfolio-mix-slider-content .tp-portfolio-mix-slide-heading {
    transform: translateX(-200px);
    transition: 2s
}

.bf-service-item-3:hover .row [class*=col-] .bf-service-item-3-wrap,
.tp-portfolio-mix-slider .swiper-slide-active .tp-portfolio-mix-slide-heading,
.tp-portfolio-mix-slider .swiper-slide-active .tp-portfolio-mix-slide-text {
    transform: translateX(0)
}

.tp-portfolio-mix-slide-heading {
    font-size: clamp(5rem, 15vw, 13rem);
    font-weight: 500;
    line-height: .8;
    color: var(--tp-common-px-white);
    letter-spacing: -4px
}

.bf-service-category span,
.bf-service-dec {
    letter-spacing: -.02em;
    color: var(--tp-common-px-white)
}

.tp-portfolio-mix-slide-text {
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 50px;
    display: inline-block;
    color: var(--tp-common-px-white);
    text-transform: uppercase
}

.tp-portfolio-mix-pagination {
    position: absolute;
    top: auto !important;
    bottom: 0;
    transform: none;
    height: 50px;
    left: 0 !important;
    right: 0 !important;
    display: inline-flex;
    gap: 20px;
    margin-inline: auto;
    align-items: center;
    justify-content: center;
    z-index: 1
}

.tp-portfolio-mix-pagination .swiper-pagination-bullet {
    width: 80px;
    height: 5px;
    display: inline-block;
    margin: 0 5px;
    overflow: hidden;
    transition: .4s;
    position: relative;
    border-radius: 5px;
    background: rgba(255, 255, 255, .3)
}

.tp-portfolio-mix-pagination .swiper-pagination-bullet .swiper-pagination-bullet-active {
    width: 80px
}

.tp-portfolio-mix-pagination .swiper-pagination-bullet::before {
    content: "";
    width: 80px;
    height: 100%;
    position: absolute;
    transition: .6s;
    z-index: 9;
    left: 0;
    border-radius: 5px;
    background: rgba(255, 255, 255, .3)
}

.tp-portfolio-mix-pagination .swiper-pagination-bullet::after {
    content: "";
    width: 0;
    height: 100%;
    position: absolute;
    transition: .6s;
    z-index: 8;
    left: 0;
    background-color: #fff
}

.tp-portfolio-mix-pagination .swiper-pagination-bullet-active::after {
    opacity: 1;
    width: 100%
}

.tp-portfolio-parallax-slider-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh
}

.tp-portfolio-parallax-slider-wrapper .parallax-slider {
    position: absolute;
    top: 0;
    left: 0;
    width: 4200px;
    height: 100%
}

.tp-portfolio-parallax-slider-wrapper .parallax-slider-inner {
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    display: flex;
    gap: 5px;
    left: 0;
    right: 0
}

.tp-portfolio-parallax-slider-wrapper .parallax-item {
    position: relative;
    width: 600px;
    height: 100%;
    overflow: hidden
}

.tp-portfolio-parallax-slider-wrapper .parallax-item:hover .parallax-content {
    bottom: 0;
    opacity: 1;
    visibility: visible
}

.tp-portfolio-parallax-slider-wrapper .parallax-item:hover .parallax-img::after {
    opacity: 1;
    height: 100%;
    visibility: visible
}

.tp-portfolio-parallax-slider-wrapper .parallax-content {
    position: absolute;
    bottom: -100px;
    left: 0;
    z-index: 55;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    margin: 40px 40px 30px 35px;
    transition: .4s
}

.tp-portfolio-parallax-slider-wrapper .parallax-content span {
    line-height: 1;
    display: block;
    font-size: 20px;
    margin-bottom: 10px;
    color: var(--tp-common-px-white);
    text-transform: capitalize
}

.tp-portfolio-parallax-slider-wrapper .parallax-content h4 {
    font-size: 50px;
    line-height: 1;
    padding-bottom: 7px;
    display: inline-block;
    color: var(--tp-common-px-white)
}

.tp-portfolio-parallax-slider-wrapper .parallax-img {
    position: absolute;
    height: 100%;
    width: 840px;
    background-size: cover;
    background-position: center;
    margin-left: -100px
}

.bf-service-item-3-slider::after,
.bf-service-item-3-slider::before {
    width: 160px;
    display: inline-block;
    height: 100%;
    position: absolute;
    top: 0;
    content: ""
}

.tp-portfolio-parallax-slider-wrapper .parallax-img::after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    opacity: 0;
    visibility: hidden;
    transition: .4s;
    background-color: rgba(0, 0, 0, .3)
}

.bf-service-dec {
    font-size: 18px;
    line-height: 167%
}

.bf-service-category span {
    border-radius: 16px;
    padding: 11px 18px;
    font-weight: 600;
    font-size: 13px;
    line-height: 1;
    margin-bottom: 6px;
    font-style: normal;
    display: inline-block;
    background: rgba(255, 255, 255, .08)
}

.bf-service-accordion-wrap .accordion-items {
    border-top: 1px solid rgba(255, 255, 255, .16);
    border-bottom: 1px solid rgba(255, 255, 255, .16)
}

.bf-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons {
    text-align: start;
    font-weight: 600;
    font-size: 30px;
    line-height: 1;
    padding: 24px 0;
    letter-spacing: -.03em;
    color: var(--tp-common-px-white)
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .bf-about-us-dec-wrap {
        padding-left: 200px
    }
    .tp-portfolio-mix-pagination {
        gap: 10px
    }
    .bf-service-category span {
        font-size: 12px
    }
    .bf-service-thumb {
        margin-right: 20px
    }
    .bf-service-content p {
        font-size: 15px
    }
    .bf-service-content p br {
        display: none
    }
    .bf-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons {
        font-size: 25px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .tp-portfolio-mix-pagination .swiper-pagination-bullet {
        width: 50px
    }
    .tp-portfolio-mix-pagination .swiper-pagination-bullet .swiper-pagination-bullet-active {
        width: 40px
    }
    .bf-service-category span {
        padding: 11px 14px
    }
    .bf-service-content p {
        font-size: 14px
    }
    .bf-service-content p br {
        display: none
    }
    .bf-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons {
        font-size: 22px
    }
}

.bf-service-accordion-wrap .accordion .accordion-items .accordion-body p {
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -.4px;
    color: rgba(255, 255, 255, .6)
}

.bf-service-item-3 {
    padding: 40px 0;
    border-top: 1px solid rgba(255, 255, 255, .15)
}

.bf-service-item-3:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, .15)
}

.bf-service-item-3-wrap {
    transition: .9s;
    transform: translateX(-340px)
}

.bf-service-item-3-thumb {
    flex: 0 0 auto;
    margin-right: 50px
}

.bf-service-item-3-title {
    margin: 0;
    line-height: 1;
    font-size: 50px;
    font-weight: 500;
    letter-spacing: -1px;
    color: var(--tp-common-px-white)
}

.bf-service-item-3-tags {
    flex: none;
    justify-content: flex-start;
    align-items: flex-start;
    display: flex;
    animation: 30s linear infinite marquee-horizontal
}

.bf-service-item-3-tags span {
    font-size: 14px;
    font-weight: 500;
    margin-right: 6px;
    padding: 1px 15px;
    border-radius: 20px;
    white-space: nowrap;
    display: inline-block;
    text-transform: uppercase;
    color: var(--tp-common-px-white);
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .2)
}

.bf-service-item-3-slider::after {
    right: 0;
    background: linear-gradient(-90deg, #151515 0, rgba(21, 21, 21, 0) 100%)
}

.bf-service-item-3-slider::before {
    left: 0;
    z-index: 1;
    background: linear-gradient(90deg, #151515 0, rgba(21, 21, 21, 0) 100%)
}

.bf-service-item-3-wrapper {
    height: 100%;
    text-align: end;
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.bf-service-item-3-btn a span {
    height: 60px;
    width: 60px;
    display: grid;
    border-radius: 30px;
    place-content: center;
    -webkit-transition: .3s ease-out;
    -moz-transition: .3s ease-out;
    -ms-transition: .3s ease-out;
    -o-transition: .3s ease-out;
    transition: .3s ease-out;
    color: #000;
    border: 1px solid #000
}

.bf-service-3-rounded {
    border-radius: 20px;
    margin-left: 30px;
    margin-right: 30px
}

.bf-service-3-dec {
    font-size: 18px;
    line-height: 167%;
    color: #0a0a0a
}

.bf-service-hero-spacing {
    padding-top: 225px;
    padding-bottom: 170px
}

.bf-banner-subtitle span,
.bf-service-hero-subtitle {
    font-weight: 500;
    font-size: 16px;
    letter-spacing: -.02em;
    color: var(--tp-common-px-white)
}

.bf-service-hero-title {
    font-weight: 500;
    font-size: 80px;
    line-height: 105%;
    letter-spacing: -.02em;
    color: var(--tp-common-px-white)
}

.bf-service-hero-bottom-title {
    font-weight: 500;
    font-size: 280px;
    letter-spacing: -.03em;
    color: rgba(255, 255, 255, .3);
    position: absolute;
    bottom: -75px;
    right: 0;
    line-height: 1;
    margin-bottom: 0
}

.bf-service-step-subtitle span {
    font-weight: 500;
    font-size: 16px;
    letter-spacing: -.02em;
    color: var(--tp-grey-px-1)
}

.bf-service-step-title {
    font-weight: 500;
    font-size: 50px;
    line-height: 120%;
    letter-spacing: -.03em
}

.des-footer-title,
.des-footer-top span {
    line-height: 1;
    color: var(--tp-common-px-white)
}

.bf-service-step-item h4 {
    font-weight: 500;
    font-size: 24px;
    letter-spacing: -.02em
}

.bf-service-step-item ul li a {
    font-weight: 400;
    font-size: 16px;
    color: var(--tp-common-px-black)
}

.bf-service-step-icon {
    position: absolute;
    top: 0;
    right: 45px
}

.des-footer-bg {
    padding: 60px 50px 45px;
    border-radius: 20px
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .bf-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons {
        font-size: 23px
    }
    .des-footer-bg {
        padding: 45px 30px
    }
}

.des-footer-title {
    font-weight: 500;
    font-size: 360px;
    margin-bottom: 0;
    letter-spacing: -.02em;
    text-transform: uppercase
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .bf-service-hero-title {
        font-size: 70px
    }
    .des-footer-title {
        font-size: 300px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .des-footer-title {
        font-size: 250px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .des-footer-title {
        font-size: 180px
    }
    .des-footer-bottom {
        flex-wrap: wrap
    }
}

@media only screen and (min-width:576px) and (max-width:767px) {
    .px-contact-title {
        font-size: 120px
    }
    .px-contact-wrapper {
        padding: 50px
    }
    .bf-hero-scrolling-words {
        height: 200px
    }
    .bf-hero-scrolling-words ul li {
        font-size: 250px
    }
    .bf-about-us-title {
        font-size: 50px
    }
    .bf-portfolio-title {
        font-size: 130px
    }
    .des-footer-title {
        font-size: 100px
    }
}

.des-footer-top {
    margin-bottom: 135px
}

.des-footer-top span {
    font-weight: 400;
    font-size: 18px;
    display: inline-block
}

.des-footer-middle {
    padding-bottom: 60px
}

.des-footer-middle>span {
    font-weight: 500;
    font-size: 18px;
    line-height: 1.3;
    margin-bottom: 45px;
    display: inline-block;
    letter-spacing: -.02em;
    color: rgba(249, 244, 232, .5)
}

.des-footer-bottom a,
.des-footer-bottom span {
    font-weight: 400;
    font-size: 18px;
    line-height: 1;
    color: var(--tp-common-px-white)
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .des-footer-bottom a,
    .des-footer-bottom span {
        margin-bottom: 15px
    }
}

.des-footer-bottom a {
    margin: 0 25px;
    position: relative
}

.des-footer-bottom a::after {
    position: absolute;
    content: "";
    bottom: 1px;
    left: 0;
    width: 0;
    height: 1px;
    transition: .3s ease-in-out;
    background-color: var(--tp-common-px-white)
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px),
only screen and (min-width:576px) and (max-width:767px),
(max-width:767px) {
    .bf-section-title {
        font-size: 60px
    }
    .bf-section-title br,
    .bf-service-3-dec br {
        display: none
    }
    .bf-about-3-title {
        font-size: 40px
    }
    .bf-about-3-info-wrap,
    .bf-about-3-thumb-2,
    .bf-footer-2-wrap .tp-footer-widget {
        margin-left: 0
    }
    .bf-about-us-dec-wrap {
        padding-left: 0
    }
    .bf-about-4-title,
    .bf-portfolio-wrapper .grid-item {
        margin-bottom: 30px
    }
    .bf-portfolio-3-sectitle {
        font-size: 150px
    }
    .bf-portfolio-3-content {
        margin-top: 30px
    }
    .tp-portfolio-mix-slider-content .tp-portfolio-mix-slide-heading,
    .tp-portfolio-mix-slider-content .tp-portfolio-mix-slide-text {
        transform: translateX(0)
    }
    .bf-service-title-box {
        padding-top: 0
    }
    .bf-service-accordion-wrap .accordion .accordion-items .accordion-body {
        padding-top: 0;
        padding-bottom: 20px
    }
    .bf-service-hero-bottom-title {
        font-size: 150px;
        bottom: -25px;
        right: -100px
    }
    .bf-service-step-icon {
        right: 0
    }
}

@media only screen and (min-width:1400px) and (max-width:1599px),
only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .bf-hero-3-video-wrap video {
        height: 600px
    }
    .bf-about-us-video video {
        height: 700px
    }
    .bf-service-3-rounded {
        margin-left: 15px;
        margin-right: 15px
    }
    .bf-footer-2-top-spacing {
        padding-bottom: 15px;
        padding-top: 310px
    }
}

.tp-footer-top-tittle {
    font-weight: 500;
    font-size: 60px;
    line-height: 118%;
    letter-spacing: -.03em;
    color: var(--tp-common-px-white)
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px),
only screen and (min-width:576px) and (max-width:767px) {
    .bf-section-title-2 {
        font-size: 50px
    }
    .bf-section-title-3 {
        font-size: 60px
    }
    .tp-footer-top-tittle {
        font-size: 45px
    }
}

.tp-footer-top-tittle span {
    color: rgba(255, 255, 255, .6)
}

.tp-footer-social {
    gap: 15px
}

.tp-footer-social span a {
    border: 1.5px solid rgba(255, 255, 255, .17);
    border-radius: 100px;
    width: 40px;
    height: 40px;
    color: var(--tp-common-px-white);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px
}

.tp-footer-social span a:hover {
    background: var(--tp-common-px-white);
    border-color: var(--tp-common-px-white);
    color: var(--tp-common-px-black)
}

.tp-footer-tittle {
    font-weight: 500;
    font-size: 24px;
    line-height: 125%;
    letter-spacing: -.02em;
    color: var(--tp-common-px-white)
}

.tp-footer-link {
    font-weight: 400;
    font-size: 16px;
    line-height: 187%;
    color: rgba(255, 255, 255, .6)
}

.tp-footer-subscribe-form .tp-input {
    font-weight: 400;
    font-size: 16px;
    letter-spacing: -.03em;
    color: var(--tp-common-px-white);
    background: 0 0;
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, .17);
    padding-left: 0;
    height: 40px
}

.tp-footer-subscribe-form .tp-input::-webkit-input-placeholder {
    font-size: 16px;
    letter-spacing: -.03em;
    color: rgba(255, 255, 255, .6)
}

.tp-footer-subscribe-form .tp-input::-moz-placeholder {
    font-size: 16px;
    letter-spacing: -.03em;
    color: rgba(255, 255, 255, .6)
}

.tp-footer-subscribe-form .tp-input:-moz-placeholder {
    font-size: 16px;
    letter-spacing: -.03em;
    color: rgba(255, 255, 255, .6)
}

.tp-footer-subscribe-form .tp-input:-ms-input-placeholder {
    font-size: 16px;
    letter-spacing: -.03em;
    color: rgba(255, 255, 255, .6)
}

.tp-footer-subscribe-form .tp-input::placeholder {
    font-size: 16px;
    letter-spacing: -.03em;
    color: rgba(255, 255, 255, .6)
}

.tp-footer-subscribe-form button {
    color: var(--tp-common-px-white);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0
}

.tp-footer-copyright p {
    letter-spacing: -.03em;
    color: rgba(255, 255, 255, .6)
}

.tp-footer-copyright-wrap {
    border-top: 1px solid rgba(255, 255, 255, .17);
    padding: 30px 0 17px
}

.tp-footer-shape {
    position: absolute;
    right: 0;
    top: 40px
}

.tp-footer-scroll a {
    font-weight: 400;
    font-size: 16px;
    letter-spacing: -.03em;
    color: var(--tp-common-px-white)
}

.bf-text-slider-style .tp-text-content span {
    font-family: var(--tp-ff-thundermed);
    font-size: 180px;
    text-transform: uppercase;
    line-height: 1;
    color: rgba(0, 0, 0, .1)
}

.bf-faq-wrap .accordion-item {
    background: var(--tp-common-px-white);
    border-radius: 10px
}

.bf-faq-wrap .tp-faq-btn {
    border: 1px solid transparent;
    border-radius: 0;
    background: 0 0;
    padding: 19px 30px
}

.bf-faq-wrap .tp-faq-details-para {
    padding-top: 0;
    padding-bottom: 25px
}

.tp-contact-form-input .tp-input {
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 50px;
    height: 50px;
    font-size: 14px;
    line-height: 50px;
    width: 100%;
    color: var(--tp-common-px-black)
}

.tp-contact-form-input .tp-textarea {
    height: 90px;
    border-radius: 10px;
    line-height: 1
}

.bf-contact-form {
    background: var(--tp-common-px-white);
    border-radius: 20px;
    padding: 55px 60px
}

@media only screen and (min-width:992px) and (max-width:1199px),
(max-width:767px) {
    .postbox-details-quote p {
        font-size: 25px
    }
    .postbox-details-quote p br {
        display: none
    }
    .bf-contact-form,
    .sidebar-widget-author {
        padding: 30px
    }
    .px-blog-title {
        font-size: 35px
    }
    .px-footer-widget-title {
        font-size: 50px
    }
    .aus-service-content h4 {
        font-size: 34px;
        letter-spacing: -2px
    }
}

.bf-contact-form .tp-contact-form-input .tp-label {
    font-weight: 500
}

.bf-contact-form .tp-contact-form-input .tp-input {
    background: #f8f8f9;
    border: 1px solid transparent
}

.bf-contact-form .tp-contact-form-input .tp-input:focus {
    border-color: rgba(0, 0, 0, .1);
    background: 0 0
}

.bf-contact-subtitle {
    color: rgba(0, 0, 0, .65)
}

.bf-contact-content-dec,
.bf-contact-content-title {
    color: var(--tp-common-px-white);
    letter-spacing: -.02em
}

.bf-contact-title {
    font-weight: 500;
    font-size: 30px;
    letter-spacing: -.02em
}

.bf-contact-content-title {
    font-weight: 500;
    font-size: 50px
}

.bf-contact-content-dec {
    font-size: 30px;
    line-height: 133%
}

.bf-instagram-subtitle,
.bf-instagram-title {
    color: var(--tp-common-px-black);
    line-height: 1
}

.bf-contact-content-dec span {
    color: rgba(255, 255, 255, .65)
}

.bf-contact-condition h4 {
    font-weight: 500;
    font-size: 24px;
    letter-spacing: -.02em;
    color: var(--tp-common-px-white)
}

.bf-contact-condition p {
    line-height: 175%;
    color: rgba(255, 255, 255, .65)
}

.bf-contact-condition-wrap {
    border-top: 1px solid #d9d9d9;
    padding-top: 65px;
    margin-top: 60px
}

.bf-contact-author {
    border-radius: 20px;
    width: 442px;
    backdrop-filter: blur(40px);
    padding: 15px;
    background: linear-gradient(209deg, rgba(255, 255, 255, .15) 0, rgba(255, 255, 255, .15) 100%);
    display: flex;
    align-items: center
}

.bf-instagram-thumb,
.bf-instagram-thumb img {
    background-position: center;
    background-size: cover
}

.bf-contact-author-thumb {
    width: 160px;
    flex: 0 0 auto;
    margin-right: 46px
}

.bf-contact-author-info h6 {
    font-weight: 500;
    font-size: 16px;
    color: var(--tp-common-px-white);
    line-height: 1;
    margin-bottom: 0
}

.bf-banner-author-info span,
.bf-contact-author-info span {
    font-weight: 400;
    font-size: 16px;
    color: rgba(255, 255, 255, .65)
}

.bf-contact-author-info h4 {
    font-weight: 500;
    font-size: 18px;
    color: var(--tp-common-px-white)
}

.bf-contact-author-info .tp-btn {
    font-weight: 500;
    padding: 5px 21px
}

@media only screen and (min-width:1400px) and (max-width:1599px),
only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px),
only screen and (min-width:576px) and (max-width:767px),
(max-width:767px) {
    .bf-contact-us-dec,
    .bf-hero-bottom-content,
    .bf-hero-video {
        margin-left: 0
    }
}

.bf-contact-us-shape {
    margin-left: -50px
}

.bf-contact-us-form .tp-input {
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    background: 0 0;
    padding-left: 0;
    color: var(--tp-common-px-black);
    font-weight: 400;
    font-size: 16px
}

.bf-contact-us-form .tp-input::placeholder {
    font-weight: 400;
    font-size: 16px;
    color: #595959
}

.bf-contact-us-form .tp-textarea {
    height: 180px
}

.bf-contact-map-box {
    line-height: 0
}

.bf-contact-map-box iframe {
    height: 760px;
    width: 100%;
    line-height: 1;
    filter: saturate(0)
}

.bf-footer-topspacing {
    margin-top: 440px
}

@media screen and (min-device-width:1360px) and (max-device-width:1549px) {
    .bf-footer-topspacing {
        margin-top: 0 !important
    }
}

.bf-instagram-area {
    height: 100vh
}

.bf-instagram-thumb {
    height: 100%;
    margin: 0 auto;
    position: relative
}

.bf-instagram-thumb img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    margin: 0 auto;
    border-radius: 30px !important
}

.bf-instagram-thumb-wrap {
    display: inline-block;
    margin: 0 auto
}

.bf-instagram-thumb-inner-1 {
    position: absolute;
    top: -41%;
    left: 50px
}

.bf-instagram-thumb-inner-2 {
    position: absolute;
    top: -41%;
    right: 0
}

.bf-instagram-thumb-inner-3 {
    position: absolute;
    bottom: 0;
    right: -74%
}

.bf-instagram-thumb-inner-4 {
    position: absolute;
    bottom: -42%;
    right: -42%
}

.bf-instagram-thumb-inner-5 {
    position: absolute;
    bottom: -26%;
    right: 0
}

.bf-instagram-thumb-inner-6 {
    position: absolute;
    bottom: 0;
    left: -25%
}

.bf-instagram-thumb-inner-7 {
    position: absolute;
    bottom: 25%;
    left: -59%
}

.bf-instagram-thumb-inner-8 {
    position: absolute;
    top: 7%;
    right: -25%
}

.bf-instagram-thumb-inner-8 a {
    height: 96px;
    width: 96px;
    font-size: 24px;
    line-height: 96px;
    border-radius: 50%;
    text-align: center;
    display: inline-block;
    color: #fff;
    background-color: #ec4f62
}

.bf-instagram-subtitle {
    font-size: 15px;
    font-weight: 500;
    text-transform: uppercase
}

.bf-instagram-title {
    font-size: 80px;
    font-weight: 500;
    letter-spacing: -2.4px;
    margin-bottom: 30px
}

.bf-instagram-content-wrap {
    position: absolute;
    bottom: -340px;
    left: -150px
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .tp-section-tittle {
        font-size: 46px
    }
    .bf-service-content {
        padding-bottom: 20px
    }
    .bf-service-hero-title {
        font-size: 60px
    }
    .bf-footer-topspacing {
        margin-top: 170px
    }
    .bf-instagram-content-wrap {
        left: 60px
    }
}

.bf-instagram-content p {
    color: #5d5d63;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px
}

.bf-team-info {
    border-top: 1px solid rgba(0, 0, 0, .1);
    padding-top: 50px;
    margin-top: 350px
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px) {
    .bf-hero-2-title {
        font-size: 80px
    }
    .bf-hero-2-left-right,
    .bf-hero-2-title .gif-2 {
        width: 120px
    }
    .bf-service-item-3-title {
        font-size: 44px
    }
    .bf-team-info {
        margin-top: 200px
    }
}

.bf-team-contact span {
    width: 52px;
    height: 52px;
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--tp-common-px-black)
}

.bf-team-contact a {
    font-weight: 600;
    font-size: 16px;
    color: var(--tp-common-px-black)
}

.bf-banner-author-info h5,
.bf-banner-title,
.bf-team-content-title {
    font-weight: 500;
    letter-spacing: -.02em
}

.bf-banner-author-info h5,
.bf-banner-title,
.bf-team-content-title,
.tp-porfolio-10-category,
.tp-porfolio-10-title,
.tp-port-slider-title:hover {
    color: var(--tp-common-px-white)
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px),
only screen and (min-width:576px) and (max-width:767px),
(max-width:767px) {
    .bf-hero-2-spacing {
        padding-top: 200px
    }
    .bf-hero-2-title .gif-1 {
        width: 160px;
        margin-bottom: 0
    }
    .bf-about-3-count-item span br,
    .bf-service-accordion-wrap .accordion .accordion-items .accordion-body p br {
        display: none
    }
    .bf-about-4-content,
    .bf-team-content-wrap {
        margin-right: 0
    }
    .bf-portfolio-3-content.pl-200,
    .bf-service-category {
        padding-left: 0
    }
    .tp-footer-shape {
        right: -40px
    }
    .bf-contact-content {
        margin-left: 0
    }
    .bf-contact-us-title {
        margin-bottom: 20px;
        font-size: 50px
    }
}

.bf-team-content-title {
    font-size: 24px;
    line-height: 125%;
    position: absolute;
    bottom: 15px;
    left: 30px;
    z-index: 2
}

.bf-team-thumb {
    border-radius: 20px;
    position: relative
}

.bf-team-thumb::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border-radius: 20px;
    transition: .6s;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .25);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .5) 100%)
}

.bf-team-thumb::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border-radius: 20px;
    backdrop-filter: blur(20px);
    opacity: 0;
    visibility: hidden;
    transition: .6s
}

.bf-banner-title {
    font-size: 36px;
    line-height: 111%
}

.bf-banner-author-info h5 {
    font-size: 20px
}

.bf-banner-spacing {
    padding-top: 480px;
    padding-bottom: 55px
}

@media only screen and (min-width:768px) and (max-width:991px),
only screen and (min-width:576px) and (max-width:767px),
(max-width:767px) {
    .bf-hero-video video {
        width: 100%
    }
    .bf-hero-top,
    .bf-service-item-3-btn {
        margin-bottom: 30px
    }
    .bf-hero-scrolling-words ul li {
        justify-content: flex-start
    }
    .bf-hero-3-title-video video {
        height: 51px;
        width: 113px
    }
    .bf-about-us-video video,
    .bf-hero-3-video-wrap video {
        height: 400px
    }
    .bf-hero-2-spacing {
        height: 100%;
        padding-top: 160px
    }
    .bf-hero-2-title {
        font-size: 55px
    }
    .bf-hero-2-title .gif-1 {
        width: 86px;
        margin-left: -33px;
        margin-right: -33px;
        margin-top: -10px
    }
    .bf-hero-2-title .gif-2 {
        width: 85px;
        margin-left: -25px;
        margin-right: -30px;
        margin-top: -10px
    }
    .bf-hero-2-title .gif-3 {
        width: 85px
    }
    .bf-hero-2-left-right {
        width: 100px
    }
    .bf-hero-2-video {
        width: 100%;
        height: 350px;
        position: inherit;
        margin-top: 40px
    }
    .bf-about-3-thumb,
    .bf-banner-subtitle {
        margin-top: 0
    }
    .bf-about-3-info-wrap {
        padding-top: 0
    }
    .bf-service-item-3-wrap {
        transform: translateX(0)
    }
    .bf-service-item-3-thumb {
        margin-right: 35px
    }
    .bf-service-item-3-title {
        font-size: 40px
    }
    .bf-service-3-rounded {
        margin-left: 0;
        margin-right: 0;
        border-radius: 0
    }
    .bf-service-hero-gif {
        padding-top: 30px
    }
    .bf-footer-2-top-spacing {
        padding-bottom: 0
    }
    .bf-team-info {
        margin-top: 50px
    }
    .bf-banner-spacing {
        padding-top: 150px
    }
}

.tp-porfolio-10-title-wrap ul li {
    list-style-type: none;
    display: inline-block;
    padding-right: 30px;
    padding-bottom: 25px;
    transition: .4s
}

.tp-porfolio-10-title-box,
.tp-porfolio-10-title-wrap ul li.active {
    transition: .4s
}

.tp-porfolio-10-title-wrap ul li.active a .tp-porfolio-10-category,
.tp-porfolio-10-title-wrap ul li.active a .tp-porfolio-10-title {
    color: var(--tp-common-px-white);
    opacity: 1
}

.tp-porfolio-10-title {
    font-size: 120px;
    font-weight: 600;
    line-height: 1;
    opacity: .06;
    transition: .4s;
    margin-bottom: 0;
    letter-spacing: 2.6px;
    z-index: 2
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .bf-service-content p br {
        display: none
    }
    .tp-porfolio-10-title {
        font-size: 100px
    }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
    .tp-porfolio-10-title {
        font-size: 90px
    }
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .des-footer-bottom a,
    .des-footer-bottom span {
        font-size: 16px
    }
    .des-footer-bottom a {
        margin: 0 10px
    }
    .tp-porfolio-10-title {
        font-size: 85px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .des-footer-bottom a {
        margin: 0 10px 10px
    }
    .bf-footer-topspacing {
        margin-top: 0
    }
    .tp-porfolio-10-title {
        font-size: 61px
    }
}

@media (max-width:767px) {
    .px-contact-wrapper .tp-contact-form-input input::-webkit-input-placeholder,
    .px-contact-wrapper .tp-contact-form-input textarea::-webkit-input-placeholder {
        font-size: 16px
    }
    .px-contact-wrapper .tp-contact-form-input input::-moz-placeholder,
    .px-contact-wrapper .tp-contact-form-input textarea::-moz-placeholder {
        font-size: 16px
    }
    .px-contact-wrapper .tp-contact-form-input input:-moz-placeholder,
    .px-contact-wrapper .tp-contact-form-input textarea:-moz-placeholder {
        font-size: 16px
    }
    .px-contact-wrapper .tp-contact-form-input input:-ms-input-placeholder,
    .px-contact-wrapper .tp-contact-form-input textarea:-ms-input-placeholder {
        font-size: 16px
    }
    .px-contact-wrapper .tp-contact-form-input input::placeholder,
    .px-contact-wrapper .tp-contact-form-input textarea::placeholder {
        font-size: 16px;
        text-transform: capitalize
    }
    .px-contact-info-title {
        font-size: 55px
    }
    .bf-portfolio-3-title-box p br,
    .tp-contact-us-heading .tp-section-title .shape-1,
    .tp-contact-us-text p br,
    .tp-portfolio-mix-slider-image .popup-image {
        display: none
    }
    .tp-contact-us-form-ptb {
        padding-top: 30px
    }
    .tp-contact-us-map {
        height: 450px;
        margin-bottom: 30px
    }
    .tp-contact-us-heading .tp-section-title {
        padding-bottom: 20px
    }
    .tp-contact-us-wrap {
        padding: 20px
    }
    .bf-hero-2-title,
    .bf-section-title-2,
    .bf-section-title-3,
    .cn-contactform-support-text span {
        font-size: 40px
    }
    .bf-hero-scrolling-words {
        height: 120px
    }
    .bf-hero-scrolling-words ul li {
        font-size: 160px
    }
    .bf-about-video video {
        width: 100%;
        margin-left: 0
    }
    .bf-about-3-title {
        font-size: 20px
    }
    .bf-about-us-title,
    .tp-footer-top-tittle {
        font-size: 35px
    }
    .bf-portfolio-title {
        font-size: 77px
    }
    .bf-portfolio-content span {
        font-size: 22px
    }
    .bf-portfolio-3-sectitle {
        font-size: 50px
    }
    .tp-portfolio-parallax-slider-wrapper .parallax-slider {
        width: 2600px
    }
    .tp-portfolio-parallax-slider-wrapper .parallax-item {
        width: 350px
    }
    .bf-service-heading {
        margin-bottom: 20px
    }
    .bf-service-hero-bottom-title {
        font-size: 100px
    }
    .des-footer-bg {
        padding: 45px 0
    }
    .des-footer-title {
        font-size: 80px
    }
    .bf-contact-content-title {
        font-size: 60px
    }
    .bf-contact-author {
        width: 100%;
        flex-direction: column;
        align-items: flex-start
    }
    .bf-contact-author-info {
        margin-top: 30px
    }
    .bf-instagram-content {
        padding-left: 0
    }
    .bf-team-contact-info {
        flex-wrap: wrap
    }
    .bf-team-contact-info .tp-btn {
        margin-bottom: 10px
    }
    .bf-banner-title {
        font-size: 28px
    }
    .tp-porfolio-10-title {
        font-size: 45px;
        letter-spacing: 0
    }
}

.tp-porfolio-10-category {
    font-size: 30px;
    font-weight: 500;
    line-height: 1;
    margin-left: 15px;
    transform: translateY(-12px);
    font-family: var(--tp-ff-teko);
    transition: .4s;
    opacity: .06
}

@media only screen and (min-width:768px) and (max-width:991px),
only screen and (min-width:576px) and (max-width:767px) {
    .tp-porfolio-10-category {
        font-size: 23px
    }
}

.tp-porfolio-10-height {
    height: 100vh;
    padding-top: 190px;
    padding-bottom: 100px
}

@media only screen and (min-width:1400px) and (max-width:1599px) {
    .tp-porfolio-10-height {
        padding-top: 140px
    }
}

.tp-porfolio-10-bg-1,
.tp-porfolio-10-bg-2,
.tp-porfolio-10-bg-3,
.tp-porfolio-10-bg-4,
.tp-porfolio-10-bg-5,
.tp-porfolio-10-bg-6,
.tp-porfolio-10-bg-7,
.tp-porfolio-10-bg-8 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    object-fit: cover;
    visibility: hidden;
    transition: .9s;
    transform: scale(1.04, 1.04)
}

#tp-porfolio-10-bg-box.tp-porfolio-10-bg-1,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-2,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-3,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-4,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-5,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-6,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-7,
#tp-porfolio-10-bg-box.tp-porfolio-10-bg-8,
#tp-port-slider-wrap.tp-port-1,
#tp-port-slider-wrap.tp-port-2,
#tp-port-slider-wrap.tp-port-3,
#tp-port-slider-wrap.tp-port-4,
#tp-port-slider-wrap.tp-port-5,
#tp-port-slider-wrap.tp-port-6,
#tp-port-slider-wrap.tp-port-7,
#tp-port-slider-wrap.tp-port-8,
#tp-port-slider-wrap.tp-port-9,
.design-award-item.active .design-award-content img,
.hover-reveal-item:hover .des-team-reveal-img,
.hover-reveal-item:hover .des-text-reveal-img,
.hover-reveal-item:hover .design-award-reveal-img,
.hover-reveal-item:hover .studio-service-reveal-img,
.hover-reveal-item:hover .tp-award-reveal-img {
    opacity: 1
}

.tp-port-slider-main {
    height: 100vh;
    overflow: hidden
}

.tp-port-slider-content-wrap {
    position: absolute;
    top: 0;
    left: 170px;
    height: 100%;
    width: 50%;
    overflow-y: scroll;
    scrollbar-width: none;
    padding-top: 150px
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .tp-port-slider-content-wrap {
        left: 120px
    }
}

@media (max-width:767px) {
    .tp-porfolio-10-category {
        font-size: 18px
    }
    .tp-port-slider-content-wrap {
        left: 20px;
        width: 100%
    }
}

@media only screen and (min-width:576px) and (max-width:767px) {
    .tp-porfolio-10-title {
        font-size: 58px
    }
    .tp-port-slider-content-wrap {
        left: 30px;
        width: 100%
    }
}

.tp-port-slider-title {
    font-size: 180px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 5px;
    text-transform: uppercase;
    color: transparent;
    transition: .3s;
    cursor: pointer;
    display: block;
    background-size: 0 100%;
    background-repeat: no-repeat;
    -webkit-background-clip: text;
    font-family: var(--tp-ff-morganite-bold);
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px rgba(255, 255, 255, 0.4);
    transition: background-size .6s cubic-bezier(.32, .55, .58, .76), -webkit-clip-path .6s cubic-bezier(.32, .55, .58, .76);
    background-image: linear-gradient(90deg, #fff 0, #fff 50%, transparent 50.1%);
    mix-blend-mode: luminosity
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .tp-port-slider-title {
        font-size: 120px
    }
}

.tp-blog-date,
.tp-blog-tag {
    font-weight: 400;
    font-size: 16px;
    color: var(--tp-common-px-black)
}

.tp-port-slider-title:hover {
    background-size: 200% 100%
}

.tp-port-1,
.tp-port-2,
.tp-port-3,
.tp-port-4,
.tp-port-5,
.tp-port-6,
.tp-port-7,
.tp-port-8,
.tp-port-9 {
    position: absolute;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100%;
    opacity: 0;
    object-fit: cover;
    transform: scale(1.04, 1.04);
    transform-origin: 50% 50%;
    transition: .9s
}

.tp-port-1 img,
.tp-port-2 img,
.tp-port-3 img,
.tp-port-4 img,
.tp-port-5 img,
.tp-port-6 img,
.tp-port-7 img,
.tp-port-8 img,
.tp-port-9 img {
    height: 100vh;
    width: 100%;
    object-fit: cover;
    transition: none
}

.hover-reveal-item .des-team-reveal-img,
.hover-reveal-item .tp-award-reveal-img {
    -webkit-transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1);
    -moz-transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1);
    -ms-transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1);
    -o-transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1)
}

#tp-port-slider-wrap.tp-port-1 .tp-port-1,
#tp-port-slider-wrap.tp-port-2 .tp-port-2,
#tp-port-slider-wrap.tp-port-3 .tp-port-3,
#tp-port-slider-wrap.tp-port-4 .tp-port-4,
#tp-port-slider-wrap.tp-port-5 .tp-port-5,
#tp-port-slider-wrap.tp-port-6 .tp-port-6,
#tp-port-slider-wrap.tp-port-7 .tp-port-7,
#tp-port-slider-wrap.tp-port-8 .tp-port-8,
#tp-port-slider-wrap.tp-port-9 .tp-port-9 {
    opacity: 1;
    transform: scale(1)
}

.hover-reveal-item .tp-award-reveal-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 210px;
    height: 250px;
    opacity: 0;
    z-index: 9;
    overflow: hidden;
    pointer-events: none;
    border-radius: 10px;
    margin: -150px 0 0 -150px;
    transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1);
    transform: scale(.4);
    background-repeat: no-repeat;
    background-size: cover
}

.hover-reveal-item .des-team-reveal-img,
.hover-reveal-item .des-text-reveal-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 300px;
    opacity: 0;
    z-index: 9;
    overflow: hidden;
    pointer-events: none;
    border-radius: 10px;
    margin: -150px 0 0 -150px;
    transform: scale(.4)
}

.hover-reveal-item .des-team-reveal-img {
    height: 400px;
    transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1)
}

.hover-reveal-item .des-text-reveal-img,
.hover-reveal-item .design-award-reveal-img {
    -webkit-transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1);
    -moz-transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1);
    -ms-transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1);
    -o-transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1)
}

.hover-reveal-item .des-text-reveal-img {
    height: 320px;
    transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1)
}

@media only screen and (min-width:1200px) and (max-width:1399px),
only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px) {
    .bf-contact-map-box iframe {
        height: 600px
    }
    .hover-reveal-item .des-text-reveal-img {
        width: 200px;
        height: 220px;
        margin: -120px 0 0 -120px
    }
}

.hover-reveal-item .design-award-reveal-img,
.hover-reveal-item .studio-service-reveal-img {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 9;
    overflow: hidden;
    pointer-events: none;
    margin: -150px 0 0 -150px;
    transform: scale(.4)
}

.hover-reveal-item .design-award-reveal-img {
    width: 120px;
    height: 156px;
    background-size: cover;
    border-radius: 20px;
    transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1)
}

.hover-reveal-item .studio-service-reveal-img {
    width: 360px;
    height: 360px;
    -webkit-transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1);
    -moz-transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1);
    -ms-transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1);
    -o-transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1);
    transition: opacity .3s, transform .5s cubic-bezier(.215, .61, .355, 1), -webkit-transform .5s cubic-bezier(.215, .61, .355, 1);
    object-fit: cover
}

.design-award-item::after,
.design-award-item::before {
    position: absolute;
    content: "";
    right: 0;
    height: 1px;
    width: 8px;
    background: rgba(0, 0, 0, .3)
}

.design-award-area {
    margin-top: -76px
}

@media only screen and (min-width:992px) and (max-width:1199px),
only screen and (min-width:768px) and (max-width:991px),
only screen and (min-width:576px) and (max-width:767px),
(max-width:767px) {
    .design-award-area {
        margin-top: -30px
    }
}

.design-award-title-box p {
    font-weight: 500;
    font-size: 24px;
    line-height: 1.25;
    color: #e0eeee;
    letter-spacing: -.02em;
    max-width: 470px;
    margin: 0 auto
}

.design-award-content h4 {
    font-weight: 500;
    font-size: 24px;
    line-height: 1.2;
    margin-bottom: 0;
    padding-right: 60px;
    letter-spacing: -.02em;
    color: rgba(0, 0, 0, .3)
}

.design-award-content span,
.tp-blog-date,
.tp-blog-tag {
    line-height: 1;
    letter-spacing: -.02em
}

.design-award-content span {
    flex: 0 0 auto;
    font-weight: 500;
    font-size: 18px;
    color: rgba(0, 0, 0, .3)
}

.design-award-content img {
    opacity: .3;
    will-change: transform;
    transition: 1s linear
}

@media (max-width:767px) {
    .hover-reveal-item .des-text-reveal-img {
        width: 120px;
        height: 140px;
        margin: -80px 0 0 -100px
    }
    .hover-reveal-item .studio-service-reveal-img {
        height: 200px;
        width: 200px
    }
    .design-award-content-xs {
        flex-direction: column
    }
}

.design-award-item {
    position: relative;
    width: 70%;
    margin: 0 auto;
    padding-bottom: 35px;
    transition-duration: .3s;
    transition-property: opacity;
    transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
    border-bottom: 1px solid rgba(0, 0, 0, .3)
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .design-award-item {
        width: 690px
    }
}

@media only screen and (min-width:576px) and (max-width:767px),
(max-width:767px) {
    .bf-hero-3-title,
    .bf-service-hero-title,
    .tp-section-tittle {
        font-size: 50px
    }
    .bf-hero-3-dec {
        margin-top: 0
    }
    .bf-about-3-thumb-2 {
        padding-top: 0
    }
    .bf-about-us-subtitle {
        margin-bottom: 20px;
        display: block
    }
    .bf-about-us-gif img,
    .bf-service-item-3-thumb,
    .bf-service-item-3-thumb img,
    .design-award-item {
        width: 100%
    }
    .bf-about-4-title,
    .bf-instagram-title,
    .bf-service-step-title {
        font-size: 40px
    }
    .bf-portfolio-content {
        padding: 0 20px
    }
    .bf-portfolio-3-title {
        font-size: 60px
    }
    .bf-portfolio-3-btn {
        padding-top: 20px
    }
    .bf-portfolio-4-title {
        font-size: 40px;
        line-height: 50px
    }
    .tp-portfolio-mix-slide-heading {
        letter-spacing: 0
    }
    .bf-contact-us-dec br,
    .tp-portfolio-mix-pagination {
        display: none
    }
    .bf-service-title h4,
    .des-footer-middle>span {
        font-size: 16px
    }
    .bf-service-thumb {
        margin-right: 0;
        margin-bottom: 15px
    }
    .bf-service-content {
        flex-wrap: wrap;
        padding-bottom: 10px
    }
    .bf-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons {
        font-size: 22px
    }
    .bf-service-accordion-wrap .accordion .accordion-items .accordion-header .accordion-buttons .accordion-icon {
        height: 30px;
        width: 30px
    }
    .bf-service-accordion-category span {
        font-size: 12px;
        padding: 4px 12px
    }
    .bf-service-item-3-wrap {
        flex-wrap: wrap
    }
    .bf-service-item-3-text {
        padding-top: 30px
    }
    .bf-service-hero-spacing {
        padding-top: 180px;
        padding-bottom: 140px
    }
    .des-footer-logo {
        padding: 15px 0
    }
    .des-footer-top {
        flex-direction: column;
        margin-bottom: 80px
    }
    .des-footer-middle {
        padding-bottom: 50px
    }
    .des-footer-bottom {
        flex-direction: column
    }
    .des-footer-bottom a,
    .des-footer-bottom span {
        font-size: 14px
    }
    .des-footer-bottom a {
        margin: 15px 4px;
        display: inline-block
    }
    .bf-text-slider-style .tp-text-content span {
        font-size: 80px
    }
    .bf-contact-map-box iframe {
        height: 400px
    }
    .bf-footer-topspacing {
        margin-top: 60px
    }
    .bf-instagram-area {
        height: 100%
    }
    .bf-instagram-content-wrap {
        position: static;
        margin-top: 40px;
        margin-left: 20px
    }
    .tp-porfolio-10-title-wrap ul li {
        padding: 16px
    }
    .tp-porfolio-10-height {
        padding-top: 120px
    }
    .tp-port-slider-title {
        font-size: 70px
    }
    .design-award-title-box p {
        font-size: 20px
    }
    .design-award-content-xs.design-award-content h4 {
        font-size: 16px;
        padding-right: 0;
        margin-bottom: 10px
    }
}

.design-award-item::after {
    bottom: 2px;
    transform: rotate(40deg)
}

.design-award-item::before {
    bottom: -4px;
    transform: rotate(-40deg)
}

.design-award-item:hover .design-award-content img {
    transform: rotate(360deg)
}

.design-award-wrap .row [class*=col]:not(:first-child) .design-award-item {
    padding-top: 40px
}

.tp-blog-thumb img {
    border-radius: 20px;
    -webkit-transition: .6s;
    -moz-transition: .6s;
    -ms-transition: .6s;
    -o-transition: .6s;
    transition: .6s
}

.tp-blog-tag {
    background: rgba(0, 0, 0, .08);
    display: inline-block;
    border-radius: 50px;
    padding: 4px 15px
}

.tp-blog-date {
    display: flex;
    align-items: center
}

.tp-blog-date svg {
    margin-right: 10px
}

.tp-blog-tittle {
    font-weight: 500;
    font-size: 26px;
    line-height: 138%;
    letter-spacing: -.02em
}