body {

    font-size: 15px;

    line-height: 1.3 !important;

    color: #101010;

    font-family: "Inter", serif;

    font-optical-sizing: auto;

    overflow-x: hidden;

}

body:not(:has(.mobile-nav-wrap.hidden)) {

    overflow: hidden;

}

div.container {

    margin: 0 auto;

    @media (max-width: 1199px) {

        padding: 0 18px;

    }

}

#main-content {

    min-height: 100svh;

    padding-top: 113px;

    background-color: #ffffff;

}

@media (max-width:1199px) {

    .home #main-content  {

        min-height: 100svh;

    }

}

/**/

.wpcf7-spinner {

    position: absolute;

    right: 0;

    top: 18px;

}

.wpcf7 form .wpcf7-response-output {

    margin: 2em 0 1em;

    padding: 0.4em 1em;

    border: 1px solid #00a0d2;

    border-radius: 8px;

}

/**/

/* Customize the label (the container) */

.custom-radio {

    display: block;

    position: relative;

    padding-left: 35px;

    margin-bottom: 12px;

    cursor: pointer;

    font-size: 22px;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

  }

  

  /* Hide the browser's default radio button */

  .custom-radio input {

    position: absolute;

    opacity: 0;

    cursor: pointer;

    height: 0;

    width: 0;

  }

  

  /* Create a custom radio button */

  .checkmark {

    position: absolute;

    top: 0;

    left: 0;

    height: 22px;

    width: 22px;

    background-color: transparent;

    border-radius: 50%;

    border: 1px solid #716E68;

  }

  

  /* On mouse-over, add a grey background color */

  .custom-radio:hover input ~ .checkmark {

    background-color: transparent;

  }

  

  /* When the radio button is checked, add a blue background */

  .custom-radio input:checked ~ .checkmark {

    background-color: #2196F3;

  }

  

  /* Create the indicator (the dot/circle - hidden when not checked) */

  .checkmark:after {

    content: "";

    position: absolute;

    display: none;

  }

  

  /* Show the indicator (dot/circle) when checked */

  .custom-radio input:checked ~ .checkmark:after {

    display: block;

  }

  

  /* Style the indicator (dot/circle) */

  .custom-radio .checkmark:after {

    top: 7px;

    left: 7px;

    width: 8px;

    height: 8px;

    border-radius: 50%;

    background: white;

  }

  

/**/

.single #main-content {

    padding-top: 0;

}

.single header {

    background-color: transparent;

    color: #fff;

}

.single header .mobile-wrap button svg{

    filter: brightness(0) invert(1);

}



.single header .main-menu ul li a {

    color: #fff;

}

.single header .text-logo{

    filter: brightness(0) invert(1);

}

.single header .main-menu ul li.current-menu-item a:before, .single header .main-menu ul li a:hover:before, .single header .main-menu ul li.current-menu-parent a:before {

    background-color: #fff;

    opacity: 1;

}



.single header.scrolled, .page-template-template-about header.scrolled {

    background-color: #000;

    color: #fff;

}



/* Header black style */

body:has(.page-content.menu-style-black) header  {

    color: #000;

}

body:has(.page-content.menu-style-black) .main-menu ul li a {

    color: #000;

}

body:has(.page-content.menu-style-black) header .text-logo {

    filter: none;

}



/* Menu */

header .main-menu ul li {

    display: inline-block;

}

header .main-menu ul li:not(:last-child) {

    margin-right: 20px;

}

header .main-menu ul li a {

    position: relative;

    display: block;

    padding: 10px;

    font-size: 14px;

    font-weight: 500;

    transition: transform .1s ease-in-out;

}

header .main-menu ul li a:before {

    width: 4px;

    height: 4px;

    position: absolute;

    background-color: #101010;

    content: '';

    left: 0;

    right: 0;

    margin: 0 auto;

    border-radius: 50%;

    bottom: 0;

    opacity: 0;

    transition: all .3s ease-in-out;

}

header .main-menu ul li a:hover {

    transform: translateY(-4px);

}

header .main-menu ul li a:hover:before {

    opacity: 1;

}

header.is-sticky  {

    top: 0;

    transform: translateY(-100%);

}



.single header.is-sticky, .page-template-template-about .header.is-sticky {

    background: #ffffff;

    color: #101010;

}

.single header.is-sticky .main-menu ul li a, .page-template-template-about .header.is-sticky .main-menu ul li a {

    color: #101010;

}

.single header.is-sticky .text-logo, .page-template-template-about .header.is-sticky .text-logo {

    filter: brightness(0) invert(0);

}

.single header.is-sticky, .page-template-template-about .header.is-sticky {



}



header.is-sticky.top-show  {

    transform: translateY(0);

}

header .text-logo {

    transition: all .3s;

}

header .text-logo img {

    transition: opacity 0.5s ease-in-out;

}

header.text-logo img:nth-child(2) {

    position: absolute;

    opacity: 0;

}



header.is-sticky.top-show .text-logo img:nth-child(1) {

    visibility: hidden;

    opacity: 0;

    position: absolute;

    height: 40px;

}

header.is-sticky.top-show .text-logo img:nth-child(2) {

    visibility: visible;

    opacity: 1;

    position: relative;

    height: 40px;

}

header.is-sticky.top-show .text-logo {

    height: 40px;

}





header.scrolled .text-logo a {

    height: 40px !important;

}





.mobile-nav ul.menu {

    text-align: center;

    flex-grow: 1;

    display: flex;

    flex-direction: column;

    justify-content: center;

}

.mobile-nav ul.menu li a {

    padding: 6px 0;

    font-size: 48px;

    line-height: 56px;

    display: block;

    font-weight: bold;

}
.mobile-nav ul.menu li a:focus, .mobile-nav ul.menu li a:active, .mobile-nav ul.menu li a:hover{
    text-decoration: underline;
}
#wp-admin-bar-site-name .ab-sub-wrapper {

    display: none !important;

}

.page-template-template-about header:not(.scrolled),

.postid-38 header:not(.scrolled),

.postid-36 header:not(.scrolled) {

    background-color: transparent;

    color: #fff;

}

.page-template-template-about header:not(.scrolled) img,

.postid-38 header:not(.scrolled) img,

.postid-36 header:not(.scrolled) img {

    filter: brightness(0) invert(1);

}

.page-template-template-about .mobile-wrap svg,

.postid-38 header:not(.scrolled) .mobile-wrap svg,

.postid-36 header:not(.scrolled) .mobile-wrap svg {

    filter: brightness(0) invert(1);

}





/* Home */

.home-intro span.dot {

    --size: 30px;

    width: 33px;

    height: 20px;

    --_g: no-repeat radial-gradient(circle closest-side,#000 90%,#0000);

    background: 

        var(--_g) 0%   50%,

        var(--_g) 50%  50%,

        var(--_g) 100% 50%;

    background-size: calc(var(--size)/3) 50%;

    animation: dot 1.2s infinite linear;

}

/* Home dot animation */

@keyframes dot {

    20%{background-position:0%   0%, 50%  50%,100%  50%}

    40%{background-position:0% -5%, 50%   0%,100%  50%}

    60%{background-position:0%  40%, 50% -5%,100%   0%}

    80%{background-position:0%  40%, 50%  50%,100% -5%}

}



.home-player #playlist li:not(.active) {

    display: none;

}

.home-words li::first-letter {

    text-transform: uppercase;

}





/* Footer */

.footer-menu ul li:not(:last-child) {

    margin-bottom: 6px;

}



.footer-menu ul li {

    text-align: right;

}

.footer-menu ul li a {

    position: relative;  

    &:hover {

        text-decoration: underline;

    }  

}

.footer-menu ul li.back-top a:before {

    position: absolute;

    content: '';

    width: 12px;

    height: 12px;

    background-image: url('../images/arrow-up.svg');

    top: 4px;

    left: -20px;

}

.footer-copy-email strong::after {

    content: " ";

    position: absolute;

    top: 100%;

    left: 50%;

    margin-left: -5px;

    border-width: 5px;

    border-style: solid;

    border-color: #ffffff transparent transparent transparent;

}



/* About */

.js-marquee {

    display: flex;

    align-items: center;

    gap: 80px;

}

.page-template-template-about header:not(.scrolled) ul li.current-menu-item a:before,

.page-template-template-about header:not(.scrolled) ul li a:hover:before {

    background-color: #fff;

}

.team-member .thoughtful:before,

.team-member .strategic:before {

    position: absolute;

    content: '';

    top: 82%;

    left: 0;

    background-size: contain;

    background-repeat: no-repeat;

}

.team-member .thoughtful:before {

    background-image: url('../images/about/thoughtful.svg');

    width: 100%;

    height: 23px;

    top: 74%;

    left: 0;

}

.team-member .strategic:before {

    background-image: url('../images/about/strategic.svg');

    width: 110%;

    height: 120%;

    top: 0;

    left: -5%;

}

.behind-slide .owl-stage {

    padding-left: 0 !important;

}

.philosophy .left-brain1:before, .philosophy .left-brain2:before, 

.philosophy .right-brain1:before, .philosophy .right-brain2:before {

    position: absolute;

    content: '';

    left: 0;

    top: 100%;

    background-size: contain;

    background-repeat: no-repeat;

}

.philosophy .left-brain1:before {

    width: 69px;

    height: 7px;

    background-image: url('../images/about/left-brain1.svg');

    background-size: 100%;

    background-repeat: no-repeat;

}

.philosophy .left-brain2:before {

    width: 104px;

    height: 9px;

    background-image: url('../images/about/left-brain2.svg');

    background-size: 100%;

    background-repeat: no-repeat;

    display: block;

}

.philosophy .right-brain1:before {

    width: 93px;

    height: 22px;

    background-image: url('../images/about/right-brain1.svg');

}

.philosophy .right-brain2:before {

    width: 120px;

    height: 16px;

    background-image: url('../images/about/right-brain2.svg');

}

.about-service ul li:before {

    position: absolute;

    content: '';

    left: 0;

    top: 0;

    background-size: cover;

    width: 12px;

    height: 12px;

    background-image: url('../images/about/arrow-right.svg');

    top: 50%;

    -webkit-transform: translateY(-50%);

    -ms-transform: translateY(-50%);

    transform: translateY(-50%);

}

.about-service .view-all:before {

    position: absolute;

    content: '';

    right: 0;

    top: 3px;

    background-size: cover;

    width: 13px;

    height: 13px;

    background-image: url('../images/about/arrow-top-right.svg');

}

.about-service .list-service .item:not(.open) .minus,

.about-service .list-service .item:not(.open) .box {

    display: none;

}

.about-service .list-service .item.open .plus {

    display: none;

}

.about-service .list-service .shape {

    position: absolute;

    display: none;

}

.about-service .list-service .item.topLeft .shape{

    top: -100%;

    left: -20%;

}

.about-service .list-service .item.topRight .shape{

    top: calc(-100% - 20px);

    left: 67%;

}

.about-service .list-service .item.left .shape{

    top:50%;

    right: 104%;

    transform: translateY(-50%);

}

.about-service .list-service .item.right .shape{

    top:50%;

    left: 105%;

    transform: translateY(-50%);

}

.about-service .list-service .item.bottomLeft .shape{

    top: calc(100% + 10px);

    left: -26px;

}

.about-service .list-service .item.photography .shape {

    top: auto;

    bottom: -18px;

    left: 50%;

    transform: translate(-50%, 0);

    width: 165px;

    height: 46px;

    object-fit: contain;

}

.about-service .list-service .shape2 {

    top: -3px;

    right: -65px;

}

.about-service .list-service .shape3 {

    top: 0;

    left: -65px;

}

.about-service .list-service .shape4 {

    top: -15px;

    right: -55px;

}

.about-service .list-service .shape5 {

    top: calc(16px + 100%);

    left: -4px;

} 

.about-service .list-service .item.open .shape {

    display: block;

}



/* Works */

.drop-us h4:before {

    position: absolute;

    content: '';

    right: -55px;

    bottom: 5px;

    background-size: cover;

    width: 50px;

    height: 50px;

    background-image: url('../images/works/arrow-top-right.svg');

}

.works-brand .works-brand__item.active, .works-brand .works-brand__item:hover {

    background-color: #101010;

    color: #fff;

    border-color: #101010;

}







/**** BREAK POINTS *****/

/* Min */

@media screen and (min-width: 767px) {

    .drop-us .first:before {

        position: absolute;

        content: '';

        left: -24px;

        top: 0.75rem;

        width: 1px;

        height: calc(100% - 0.75rem * 2);

        background-color: #B0ADA7;

    }

    .drop-us .first:after {

        position: absolute;

        content: '';

        right: -24px;

        top: 0.75rem;

        width: 1px;

        height: calc(100% - 0.75rem * 2);

        background-color: #B0ADA7;

    }

    .drop-us .last:after {

        position: absolute;

        content: '';

        right: -20px;

        top: 0.75rem;

        width: 1px;

        height: calc(100% - 0.75rem * 2);

        background-color: #B0ADA7;

    }

    .drop-us .first:hover:before,

    .drop-us .first:hover:after,

    .drop-us .last:hover:after {

        /* background-color: transparent; */

    }

}





/* Max */

@media screen and (max-width: 1280px) {



    .drop-us h4:before {

        width: 40px;

        height: 40px;

        right: -50px;

        bottom: 5px;

    }

    .philosophy .left-brain:before, .philosophy .right-brain:before {

        display: none;

    }

 

}



@media screen and (max-width: 840px) {

    header .main-menu ul li:not(:last-child) {

        margin-right: 30px;

    }

}



@media screen and (max-width: 1024px) {

    #main-content {

        padding-top: 90px;

    }

    .footer-menu ul li {

        text-align: center;

        margin-bottom: 10px;

    }

    .footer-menu ul li.back-top a {

        display: none;

    }

    .drop-us h4:before {

        width: 26px;

        height: 26px;

        right: 0;

        bottom: 0;

        position: relative;

        order: 2;

    }

    .team-member .team-text br {

        display: none;

    }



    .team-member p {

        margin-bottom: 5px;

    }

    .team-member p br {

        display: none;

    }

    .philosophy .left-brain:before, .philosophy .right-brain:before {

        display: none;

    }

    .philosophy h4 br {

        display: none;

    }

    .about-service .list-service .shape1 {

        left: 20px;

    }

    #wpadminbar {

        display: none !important;

    }

    html {

        margin-top: 0 !important;

    }

}



@media screen and (max-width: 640px) {

    .growth-section p.text {

        min-height: 110px;

    }

}



@media screen and (max-width: 600px) {

    header.fixed {

        top: 0;

    }

}



.works-tagline-text img{

    position: absolute;

    max-width: 100%;

    object-fit: contain;

}

.works-tagline-text.top img{

    bottom: 100%;

    left: 0;

    right: 0;

}

.works-tagline-text.top-right img{

    bottom: 100%;

    right: 0;

}

.works-tagline-text.right img{

    top: 0;

    left: calc(100% + 10px);

}

.works-tagline-text.bottom img{

    top: 100%;

}

.works-tagline-text.bottom-right img{

    bottom: 0;

    right: 0;

}

.works-tagline-text.left img{

    top: 0;

    left: 0;

}





/*Page contact form*/



/* Contact */

.contact .tab-nav .active {

    background-color: #101010;

    color: #fff;

}

.contact .job-wrap .item .head ul li::before {

    content: '';

    background-image: url('../images/contact/arrow-right.svg');

    background-size: cover;

    margin-right: 8px;

    width: 14px;

    height: 16px;

    display: inline-block;

    vertical-align: middle;

}

.contact .job-wrap .item .detail ul {

    list-style-type: disc;

    line-height: 1.8;

    margin-left: 28px;

    margin-bottom: 25px;

}

.contact .job-wrap .item .minus {

    display: none;

}

.contact .job-wrap .item.opened .plus {

    display: none;

}

.contact .job-wrap .item.opened .minus {

    display: block;

}

.contact .job-wrap .heart:before {

    background-image: url('../images/contact/uself.png');

    content: '';

    position: absolute;

    left: -100%;

    bottom: 110%;

    width: 192px;

    height: 244px;

    background-size: cover;

    display: none;

}

.contact .job-wrap .heart:hover:before {

    display: block;

}



.page-contact-form {



}

.page-contact-form input , .page-contact-form textarea{

    width: 100%;

    padding-bottom: 16px;

    font-size: 20px;

    line-height: 28px;

    font-weight: 500;

    color: #101010;

    border-bottom: 1px solid #B0ADA7;

    background: transparent;

}

.page-contact-form input::placeholder, .page-contact-form textarea::placeholder{

    color: #B0ADA7;

}

.page-contact-form input:focus , .page-contact-form textarea:focus {

    outline: none;

    box-shadow: none;

    border-color: #101010;

}

.page-contact-form textarea {

    height: 114px;

}

.checkbox-sing-up {

    margin-bottom: 58px;



    margin-top: 20px;

    font-size: 14px;

    line-height: 20px;

    font-weight: 500;

}

.checkbox-sing-up label {

    display: flex;

    align-items: center;

    gap: 10px;

}

.checkbox-sing-up label  input[type="checkbox"] {



}

.contact-works input {

    display: none;

}

.contact-works .wpcf7-list-item-label {

    display: block;

    padding: 7px 17px;

font-size: 20px;

line-height: 28px;

font-weight: 500;

color: #101010;

border: 1px solid #ADABA7;

border-radius: 6px;

cursor: pointer;

}

.contact-works input[type="checkbox"]:hover ~ .wpcf7-list-item-label {

    background-color: #EFECE5;

    color: #101010;

    border: 1px solid #101010;

}



.contact-works input[type="checkbox"]:checked ~ .wpcf7-list-item-label {

    background-color: #101010;

    color: #fff;

    border: 1px solid #101010;

}



.contact-works .wpcf7-checkbox {

    display: flex;

    flex-wrap: wrap;

    gap: 13px;

}

.contact-works .wpcf7-list-item {

    display: block;

    margin: 0;

}

.wpcf7-form-control {

    

}

.wpcf7-form-control-wrap {

    position: relative;

    display: block;

}

.wpcf7-not-valid-tip {

    margin-top: 10px;

}



.page-contact-form .wpcf7-submit{

    width: 100%;

background: #101010;

border-radius: 6px;

border: 0;

padding: 16px;

font-size: 20px;

line-height: 28px;

font-weight: 500;

color: #ffffff;cursor: pointer;

}



.about-banner .content.active-scale picture img {

    border-radius: 12px;

}



/* Works */

@media (max-width: 1024px) {

    .works-tagline-text.top-right img {

        bottom: 80%;

        max-height: 30px;

    }

    .works-tagline-text.right img {

        max-height: 40px;

    }

    header.is-sticky.top-show .text-logo img:nth-child(2) {

        max-height: 22px;

    }

}



.view-all2:before {

    position: absolute;

    content: '';

    right: 0;

    top: 3px;

    background-size: cover;

    width: 13px;

    height: 13px;

    background-image: url('../images/about/arrow-top-right.svg');

}



/*Layout*/

@media (max-width: 1024px) {

    header .text-logo {

        height: 40px;

    }

    header .text-logo {

        transition: all .3s;

    }

    header .text-logo img:nth-child(1) {

        display: none!important;

    }

    header .text-logo img:nth-child(2) {

        visibility: visible;

    }

    .about-service .list-service .item.photography .shape {

        top: auto;

        bottom: -17px;

        width: 140px;

        right: 0;

        margin: auto;

    }

}

/* Makerting Bunz */



.page-template-template-makerting-bunz #main-content {

    padding-top: 0;

}

.page-template-template-makerting-bunz header {

    background-color: transparent;

    color: #fff;

}

.page-template-template-makerting-bunz header .mobile-wrap button svg{

    filter: brightness(0) invert(1);

}



.page-template-template-makerting-bunz header .main-menu ul li a {

    color: #fff;

}

.page-template-template-makerting-bunz header .text-logo{

    filter: brightness(0) invert(1);

}

.page-template-template-makerting-bunz header .main-menu ul li.current-menu-item a:before, .page-template-template-makerting-bunz header .main-menu ul li a:hover:before, .page-template-template-makerting-bunz header .main-menu ul li.current-menu-parent a:before {

    background-color: #fff;

    opacity: 1;

}



.page-template-template-makerting-bunz header.scrolled, .page-template-template-makerting-bunz header.scrolled {

    background-color: #000;

    color: #fff;

}



.page-template-template-makerting-bunz header.is-sticky {

    background: #ffffff;

    color: #101010;

}

.page-template-template-makerting-bunz header.is-sticky .main-menu ul li a {

    color: #101010;

}

.page-template-template-makerting-bunz header.is-sticky .text-logo {

    filter: brightness(0) invert(0);

}

.page-template-template-makerting-bunz header.is-sticky .main-menu ul li.current-menu-item a:before,

.page-template-template-makerting-bunz header.is-sticky .main-menu ul li a:hover:before,

.page-template-template-makerting-bunz header.is-sticky .main-menu ul li.current-menu-parent a:before {

    background-color: #101010;

}

.page-template-template-makerting-bunz header.is-sticky .mobile-wrap button svg {

    filter: none;

}



.makerting-bunz-slider {

    --mb-slider-gap: 10px;

    --mb-slider-edge-after: 18px;

    overflow: hidden;

    width: 100%;

}



@media (min-width: 1024px) {

    .makerting-bunz-slider {

        --mb-slider-gap: 25px;

        --mb-slider-edge-after: 16px;

    }

}



.makerting-bunz-slider .swiper {

    overflow: visible;

    --mb-slider-edge: 18px;

    padding-left: var(--mb-slider-edge);

    padding-right: 0;

}



@media (min-width: 1200px) {

    .makerting-bunz-slider .swiper {

        --mb-slider-edge: max(18px, calc((100vw - 1160px) / 2));

        padding-left: var(--mb-slider-edge);

    }

}



@media (min-width: 1400px) {

    .makerting-bunz-slider .swiper {

        --mb-slider-edge: max(18px, calc((100vw - 1280px) / 2));

        padding-left: var(--mb-slider-edge);

    }

}



.page-makerting-bunz .js-makerting-bunz-content-videography,

.page-makerting-bunz .js-makerting-bunz-kol-koc-booking,

.page-makerting-bunz .js-makerting-bunz-community-activation {

    --mb-slider-gap: 12px;

}



@media (min-width: 1024px) {

    .page-makerting-bunz .js-makerting-bunz-content-videography,

    .page-makerting-bunz .js-makerting-bunz-kol-koc-booking,

    .page-makerting-bunz .js-makerting-bunz-community-activation {

        --mb-slider-gap: 16px;

    }

}



.page-makerting-bunz .makerting-bunz-media-slider .swiper-wrapper {

    align-items: stretch;

}



.page-makerting-bunz .makerting-bunz-media-slider__slide {

    flex-shrink: 0 !important;

    width: 200px !important;

    height: 420px;

    overflow: hidden;

    @media screen and (max-width: 1023px) {

        width: 164px !important;

        height: 292px;

    }

}

.page-makerting-bunz .makerting-bunz-media-slider__slide--2 {

    @media screen and (max-width: 1023px) {

        width: 112px !important;

    }

}



.page-makerting-bunz .makerting-bunz-media-slider__slide--3 {

    width: 240px !important;

    @media screen and (max-width: 1023px) {

        width: 233px !important;

    }

}



.page-makerting-bunz .makerting-bunz-media-slider__slide--4 {

    width: 280px !important;

    @media screen and (max-width: 1023px) {

        width: 249px !important;

    }

}



.page-makerting-bunz .makerting-bunz-media-slider__stack {

    display: grid;

    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);

    gap: 16px;

    height: 100%;

    min-width: 0;

}



.page-makerting-bunz .makerting-bunz-media-slider__media {

    overflow: hidden;

    border-radius: 4px;

    min-width: 0;

    min-height: 0;

    height: 100%;

}



.page-makerting-bunz .makerting-bunz-media-slider__media img,

.page-makerting-bunz .makerting-bunz-media-slider__media video {

    display: block;

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.page-makerting-bunz .makerting-bunz-media-slider__media--video {

    position: relative;

}



.page-makerting-bunz .makerting-bunz-media-slider__media--video .makerting-bunz-video-poster,

.page-makerting-bunz .makerting-bunz-media-slider__media--video video {

    position: absolute;

    inset: 0;

}



.page-makerting-bunz .makerting-bunz-media-slider__media--video .makerting-bunz-video-poster {

    z-index: 1;

    transition: opacity 0.2s ease;

}



.page-makerting-bunz .makerting-bunz-media-slider__media--video video {

    z-index: 0;

}



.page-makerting-bunz .makerting-bunz-media-slider__media--video.is-playing .makerting-bunz-video-poster {

    opacity: 0;

    pointer-events: none;

}



.page-makerting-bunz .makerting-bunz-media-slider__media .sbi_item,

.page-makerting-bunz .makerting-bunz-media-slider__media .sbi_photo_wrap,

.page-makerting-bunz .makerting-bunz-media-slider__media .sbi_photo {

    display: block;

    width: 100%;

    height: 100%;

}



.page-makerting-bunz .makerting-bunz-media-slider__media .sbi_photo {

    height: 100% !important;

}



@media (min-width: 1024px) {

    .page-makerting-bunz .makerting-bunz-media-slider__slide {

        width: 302px !important;

        height: 538px;

    }



    .page-makerting-bunz .makerting-bunz-media-slider__slide--2 {

        width: 208px !important;

    }



    .page-makerting-bunz .makerting-bunz-media-slider__slide--4 {

        width: 464px !important;

    }



    .page-makerting-bunz .makerting-bunz-media-slider--videography .makerting-bunz-media-slider__slide--3 {

        width: 430px !important;

    }



    .page-makerting-bunz .makerting-bunz-media-slider--videography .makerting-bunz-media-slider__slide--5 {

        width: 326px !important;

    }

}



.page-makerting-bunz .js-makerting-bunz-solutions {

    --mb-slider-gap: 12px;

}



@media (min-width: 1024px) {

    .page-makerting-bunz .js-makerting-bunz-solutions {

        --mb-slider-gap: 25px;

    }

}



.page-makerting-bunz .makerting-bunz-ads-performance__media img {

    display: block;

    width: 100%;

    height: auto;

}



@media (min-width: 1024px) {

    .page-makerting-bunz .makerting-bunz-ads-performance__layout {

        grid-template-columns: 411px minmax(0, 1fr);

    }



    .page-makerting-bunz .makerting-bunz-ads-performance__media {

        width: 411px;

        height: 100%;

    }



    .page-makerting-bunz .makerting-bunz-ads-performance__media img {

        width: 411px;

        height: 100%;

        object-fit: cover;

    }

}



.page-makerting-bunz .js-makerting-bunz-project-summary {

    --mb-slider-gap: 10px;

}



.page-makerting-bunz .makerting-bunz-project-summary__slide {

    height: auto;

    box-sizing: border-box;

}



.page-makerting-bunz .makerting-bunz-project-summary__card {

    overflow: hidden;

    border-radius: 4px;

    background-color: #101010;

}



.page-makerting-bunz .makerting-bunz-project-summary__media {

    width: 100%;

    overflow: hidden;

    border-radius: 4px;

}



.page-makerting-bunz .makerting-bunz-project-summary__media--pc {

    display: none;

    aspect-ratio: 925 / 556;

}



.page-makerting-bunz .makerting-bunz-project-summary__media--mobile {

    display: block;

}



.page-makerting-bunz .makerting-bunz-project-summary__media--pc:only-child,

.page-makerting-bunz .makerting-bunz-project-summary__media--mobile:only-child {

    display: block;

}



.page-makerting-bunz .makerting-bunz-project-summary__img {

    display: block;

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.page-makerting-bunz .makerting-bunz-project-summary__media--mobile .makerting-bunz-project-summary__img {

    height: auto;

    object-fit: contain;

}



@media (min-width: 1024px) {

    .page-makerting-bunz .makerting-bunz-project-summary__credit-grid {

        grid-template-columns: auto 1fr 1fr;

        max-width: 977px;

        margin-left: auto;

    }

}



@media (min-width: 1024px) {

    .page-makerting-bunz .js-makerting-bunz-project-summary {

        --mb-slider-gap: 32px;

    }



    .page-makerting-bunz .makerting-bunz-project-summary__media--pc {

        display: block;

    }



    .page-makerting-bunz .makerting-bunz-project-summary__media--mobile {

        display: none;

    }



    .page-makerting-bunz .makerting-bunz-project-summary__media--mobile:only-child {

        display: block;

    }

}



@media (max-width: 1023px) {

    .page-makerting-bunz .makerting-bunz-related .related__slider {

        margin-left: -18px;

        margin-right: -18px;

        width: calc(100% + 36px);

    }



    .page-makerting-bunz .makerting-bunz-related .related__slider .swiper {

        overflow: visible;

        padding-left: 18px;

        padding-right: 18px;

    }

}



/* Button custom link */

.button-custom-link {

    &:hover h4{

        text-decoration: underline;

    }

}



.animated.infinite {

    -webkit-animation-iteration-count: infinite;

    animation-iteration-count: infinite;

}



/* Two tada beats with a pause between them, then rest and loop. */

@keyframes tada-twice {

    0% { transform: scale(1); }

    2%, 4% { transform: scale(0.9) rotate(-3deg); }

    6%, 10%, 14%, 18% { transform: scale(1.1) rotate(3deg); }

    8%, 12%, 16% { transform: scale(1.1) rotate(-3deg); }

    20%, 50% { transform: scale(1) rotate(0); }

    52%, 54% { transform: scale(0.9) rotate(-3deg); }

    56%, 60%, 64%, 68% { transform: scale(1.1) rotate(3deg); }

    58%, 62%, 66% { transform: scale(1.1) rotate(-3deg); }

    70%, 100% { transform: scale(1) rotate(0); }

}



.tada-twice {

    animation-name: tada-twice;

    animation-duration: 5s;

    animation-iteration-count: infinite;

    animation-timing-function: ease;

}