@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');

@font-face {
    font-family: 'Gilroy-Regular';
    src: url('../fonts/Gilroy-Regular.eot');
    src: url('../fonts/Gilroy-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Gilroy-Regular.svg#Gilroy-Regular') format('svg'),
        url('../fonts/Gilroy-Regular.ttf') format('truetype'),
        url('../fonts/Gilroy-Regular.woff') format('woff'),
        url('../fonts/Gilroy-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy-Bold';
    src: url('../fonts/Gilroy-Bold.eot');
    src: url('../fonts/Gilroy-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Gilroy-Bold.svg#Gilroy-Bold') format('svg'),
        url('../fonts/Gilroy-Bold.ttf') format('truetype'),
        url('../fonts/Gilroy-Bold.woff') format('woff'),
        url('../fonts/Gilroy-Bold.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy-RegularItalic';
    src: url('../fonts/Gilroy-RegularItalic.eot');
    src: url('../fonts/Gilroy-RegularItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Gilroy-RegularItalic.svg#Gilroy-RegularItalic') format('svg'),
        url('../fonts/Gilroy-RegularItalic.ttf') format('truetype'),
        url('../fonts/Gilroy-RegularItalic.woff') format('woff'),
        url('../fonts/Gilroy-RegularItalic.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy-Light';
    src: url('../fonts/Gilroy-Light.eot');
    src: url('../fonts/Gilroy-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Gilroy-Light.svg#Gilroy-Light') format('svg'),
        url('../fonts/Gilroy-Light.ttf') format('truetype'),
        url('../fonts/Gilroy-Light.woff') format('woff'),
        url('../fonts/Gilroy-Light.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy-Medium';
    src: url('../fonts/Gilroy-Medium.eot');
    src: url('../fonts/Gilroy-Medium?#iefix') format('embedded-opentype'),
        url('../fonts/Gilroy-Medium.svg#Gilroy-Medium') format('svg'),
        url('../fonts/Gilroy-Medium.ttf') format('truetype'),
        url('../fonts/Gilroy-Medium.woff') format('woff'),
        url('../fonts/Gilroy-Medium.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

body,
html {
    padding: 0;
    margin: 0;
    font-family: 'Gilroy-Regular';
    /* overflow: hidden; */
    scroll-behavior: smooth;
    background-color: #000000;
    color: #ffffff;
}

#loader {
    width: 100%;
    height: 100vh;
}

.side {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    top: 50%;
    transform: translate(0, -50%);
}

.top,
.right,
.left,
.bottom {
    max-width: 100%;
    max-height: 100%;
    display: block;
}

.left {
    position: relative;
    /* background: #a55eea; */
    /* filter: blur(1px); */
    top: -15vw;
    animation: left 1.5s ease infinite;
    width: 15px;
    height: 15px;
    border: 2px solid #fff;
    left: -15px;
}

.right {
    position: relative;
    width: 30px;
    height: 30px;
    border: 2px solid #fff;
    margin-top: 5px;
    left: -10px;
    /* background: #f7b731; */
    /* filter: blur(1px); */
}

.bottom {
    /* filter: blur(1px); */
    /* background-color: #2bcbba; */
    bottom: 5vw;
    animation: bottom 1.5s ease infinite;
    position: relative;
    width: 50px;
    height: 15px;
    margin-top: 5px;
    border: 5px solid #fff;
}

@keyframes left {
    0% {
        top: -10vw;
    }

    25% {
        top: 0vw;
    }

    50% {
        top: 0vw;
    }

    75% {
        top: 0vw;
    }

    100% {
        top: -10vw;
    }
}

@keyframes bottom {
    0% {
        bottom: 0vw;
    }

    25% {
        bottom: 0vw;
    }

    50% {
        bottom: -10vw;
    }

    75% {
        bottom: 0vw;
    }

    100% {
        bottom: 0vw;
    }
}

.main-wrapper {
    display: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Gilroy-Regular';
    font-weight: 700;
    letter-spacing: 1px;
}

p {
    font-size: 14px;
    font-family: 'Gilroy-Regular';
    /* font-family: 'Inter', sans-serif; */
    letter-spacing: 0px;
    line-height: 1.7;
    color: #E8E8E9;
}

h3.work_title {
    color: #FFFFFF;
    font-size: 5em;
    line-height: 1;
    font-family: 'Gilroy-Bold';
    margin-bottom: 15px;
    letter-spacing: 1px;
    text-transform: capitalize;
}

h4 {
    font-size: 2.25em;
    font-family: 'Gilroy-Bold';
    line-height: 1;
}

/* Menu  */
.bar1,
.bar2,
.bar3 {
    height: 2px;
    background-color: #ffffff;
    transition: all 0.5s ease;
}

.bar1 {
    width: 20px;
    transform: translateX(10px);
}

.bar2 {
    width: 30px;
    transform: translateX(-5px);
    margin: 8px 0;
}

.bar3 {
    width: 35px;
    transform: translateX(0px);
}

.menu-bar {
    position: fixed;
    bottom: 20px;
    width: 200px;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 9;
    display: inline-flex;

}

.menubar-inner {
    margin: 0 auto;
    padding: 40px 10px 10px;
    background: #F84546;
    cursor: pointer;
}

.menubar-inner:hover .bar1 {
    transform: translateX(0px);
    transition: all 0.5s ease;
}

.menubar-inner:hover .bar2 {
    transform: translateX(5px);
    transition: all 0.5s ease;
}

.menubar-inner:hover .bar3 {
    transform: translateX(-5px);
    transition: all 0.5s ease;
}

.menu-content .navbar {
    opacity: 0;
    transform: translateY(-50px);
}

.menu-content {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 9999999;
    /* background-color: #2B2B2B; */
    display: none;
}

.get-in-touch {
    font-size: 18px;
}

.menu-content h3 {
    font-size: 75px;
    line-height: 1;
    font-weight: 100;
    color: #E8E8E9;
    font-family: 'Gilroy-Light';
    opacity: 0;
    transform: translateY(20px);
}

.menu-content p {
    color: #E8E8E9;
    font-style: italic;
    font-size: 32px;
    opacity: 0.4;
    line-height: 1.2;
    font-weight: 100;
    margin: 30px 0;
    font-family: 'Gilroy-RegularItalic';
    opacity: 0;
    transform: translateY(20px);
}

.menunavitems li {
    opacity: 0;
    transform: translateX(40px);
}

.menunavitems li a {
    color: #F84546;
    font-size: 6em;
    font-weight: 700;
    line-height: 1;
    position: relative;
    display: inline-block;
    cursor: pointer;
    background: linear-gradient(to right, #ffffff, #ffffff 50%, #F84546 50%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 200% 100%;
    background-position: 100%;
    transition: background-position 0.5s ease;
}

.menunavitems li a:hover {
    background-position: 0 100%;
    transition: all 0.5s;
}

.menunavitems li a:before,
.menunavitems li a:after {
    content: '';
    position: absolute;
    width: 0%;
    height: 5px;
    bottom: 0%;
    margin-top: -0.5px;
    background: #fff;
}

.menunavitems li a:before {
    left: -2.5px;
}

.menunavitems li a:after {
    right: 2.5px;
    background: #fff;
    transition: width 0.8s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.menunavitems li a:hover:before {
    background: #fff;
    width: 100%;
    transition: width 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.menunavitems li a:hover:after {
    background: transparent;
    width: 100%;
    transition: 0s;
}

.menu-opening {
    position: fixed;
    width: 100%;
    height: 0;
    bottom: 0;
    left: 0;
    z-index: 99999;
    background-color: #FF4547;
}

.menu-opening-2 {
    z-index: 999999;
    background-color: #000000;
}

.menu-opening-3 {
    z-index: 999999;
    background-color: #2B2B2B;
}

.menu-close img,
.video-close img {
    width: 25px;
    transition: all 0.3s ease;
}

.menu-close:hover img,
.video-close img:hover {
    width: 30px;
    transition: all 0.3s ease;
}

h3.menu_title {
    color: #FFFFFF;
    font-size: 30px;
    line-height: 1;
    font-family: 'Gilroy-Bold';
    margin-bottom: 0px;
    letter-spacing: 1px;
    text-transform: capitalize;
}

p.menu-text {
    font-size: 21px;
    margin: 10px 0;
    font-style: normal;
    font-family: 'Gilroy-Regular';
}

p.menu-text a {
    color: inherit;
    text-decoration: none;
    outline: inherit;
}

.get-in-touch {
    padding: 0 !important;
}

/* HOme Slider  */
.slide {
    height: 100vh;
}

.h-100 {
    height: 100%;
}

#flickity_slider {
    background-color: #000000;
}

.slide-1 {
    background-color: #F84546;
}

.slide-1 h1 {
    color: #000000;
    font-size: 13em;
    font-weight: 400;
    font-family: 'Gilroy-Bold';
    letter-spacing: -10px;
    line-height: 1;
}

.slide-2 {
    background-color: #000000;
}

.slide-2 h2 {
    color: #E8E8E9;
    font-family: 'Gilroy-Regular';
    font-size: 73px;
    line-height: 1.2;
    font-weight: 400;
}

.slide-2 h2 .italic {
    font-family: 'Gilroy-RegularItalic';
}

/* .slide-3 {
    background-image: url(../assets/wrong.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
} */

.slide-img {
    overflow: hidden;
    width: 100%;
    height: 100vh;
}

.slide-img img {
    min-width: 100%;
    height: 100vh;
    width: auto;
}

.slider-img-copy {
    position: absolute;
    height: 100vh;
    width: 100%;
    left: 0;
    top: 0;
    background: url(../assets/bg_gradiiant.svg) no-repeat;
    background-position: bottom left;
    background-size: cover;
}

.slider-img-copy a {
    display: block;
    width: 100%;
    height: 100%;
}

.zoom {
    -webkit-animation: scale 20s linear infinite;
    animation: scale 20s linear infinite;
}

@-webkit-keyframes scale {

    from,
    to {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }
}

@keyframes scale {

    from,
    to {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }
}

.slider-featured-project {
    top: 45px;
    position: absolute;
    left: 10%;
}

.slider-featured-project p {
    font-family: 'Gilroy-Regular';
    color: #E8E8E9;
    font-size: 20px;
    position: relative;
    line-height: 1;
}

.slider-featured-project p:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: -28px;
    width: 20px;
    height: 20px;
    border: 3px solid #F84546;
}

.slider-project-title {
    position: absolute;
    bottom: 100px;
    left: 0px;
    max-width: 100%;
}

.slider-project-title h5 {
    color: #FF4547;
    font-size: 67px;
    margin: 0;
}

.slider-project-title p {
    color: #E8E8E9;
    font-size: 14px;
    line-height: 1.2;
    margin: 0;
}

.flickity-button {
    background: transparent;
    /* top: unset;
    bottom: 20px; */
    top: 35%;
    outline: inherit;
}

.flickity-button:hover {
    background: transparent;
}

.flickity-button svg {
    display: none;
}

.flickity-button.previous {
    background-image: url(../assets/left.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 40px;
    width: 50px;
    height: 30%;
    border-radius: 0;
    left: unset;
    left: 2.5%;
    z-index: 99;
    transform: translateX(0px);
    transition: all 0.5s ease;
}

.flickity-button.previous:hover {
    transform: translateX(-10px);
    transition: all 0.5s ease;
}

.flickity-button.next {
    background-image: url(../assets/right.svg);
    background-repeat: no-repeat;
    background-size: 40px;
    width: 50px;
    height: 30%;
    border-radius: 0;
    right: 2.5%;
    z-index: 99;
    transform: translateX(0px);
    transition: all 0.5s ease;
    background-position: center;
}

.flickity-button.next:hover {
    transform: translateX(10px);
    transition: all 0.5s ease;
}

.wavy {
    opacity: 0;
}

.is-selected .wavy,
.banner-section .wavy {
    opacity: 1;
}

.splitting .word {
    position: relative;
    top: 20vh;
    opacity: 0;
}

.splitting .char {
    position: relative;
    top: 10vh;
    opacity: 0;
}

.slide-2 .splitting .word {
    position: relative;
    top: 10vh;
    opacity: 0;
}

.slide-2 h2.splitting .char {
    position: relative;
    top: 0vh;
    opacity: 1;
}

#flickity_slider .flickity-page-dots {
    width: auto;
    bottom: 20px;
    right: 2.5%;
}

.flickity-page-dots .dot {
    width: 6px;
    height: 6px;
    background: #ffffff;
    border-radius: 0;
}

#flickity_slider .flickity-page-dots .dot.is-selected {
    opacity: 1;
    width: 8px;
    height: 8px;
}


/* Works  */

/* Background Color  */
.bg-grey {
    background-color: #2B2B2B;
}

.rhinoshield_bg {
    background-color: #FFCE00;
}

.ratnaakar_bg {
    background-color: #FFCE00;
}

.bounce_bg {
    background-color: #E02286;
}

/* Text-color  */
.rhinoshield_text {
    color: #FFCE00;
}

.bounce_text {
    color: #E02286;
}

.ratnaakar_text {
    color: #F84546;
}

.banner-image {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    min-height: 75vh;

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.rhinoshield_banner {
    background-image: url("../assets/rhinoshield/banner.jpg");
}

.ratnaakar_banner {
    background-image: url("../assets/ratnaakar/banner.jpg");
}

.banner-section {
    width: 100%;
    position: relative;
    height: 75vh;
    overflow: hidden;
}

.banner-content-title {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: url(../assets/gradient_bg.png) no-repeat;
    background-position: bottom left;
    background-size: cover;
    padding-top: 200px;
}

.banner-content-title h1 {
    font-size: 11em;
    line-height: 0.65;
    font-family: 'Gilroy-Bold';
    letter-spacing: -7px;
}

p.banner-content-p {
    font-size: 28px;
    line-height: 1.5;
    margin: 0;
    /* padding: 1.2% 30% 5% 0; */
    color: #E8E8E9;
}

ul.service-tags {
    padding: 0;
    margin: 0;
}

ul.service-tags li {
    list-style-type: none;
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    color: #E8E8E9;
    padding: 0 20px 0 0;
    margin-bottom: 10px;
    /* border-right: 1px solid #E8E8E9; */
    position: relative;
}

ul.service-tags li:first-child {
    padding-left: 0;
}

ul.service-tags li:after {
    content: '';
    width: 1px;
    height: 100%;
    background-color: #E8E8E9;
    position: absolute;
    top: 0;
    right: 10px;
}

ul.service-tags li:last-child::after {
    width: 0px;
}

.service-video {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    /* overflow: hidden; */
}

.play_btn {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 80px;
    height: 80px;
    cursor: pointer;
}

.service-video:before {
    content: '';
    width: 50%;
    height: 30px;
    position: absolute;
    top: -10px;
    left: 0;
    background-color: #FFCE00;
    z-index: -1;
}

.service-video:after {
    content: '';
    width: 50%;
    height: 30px;
    position: absolute;
    bottom: -10px;
    left: 0;
    background-color: #FFCE00;
    z-index: -1;
}

.video-ads img,
.service-video img {
    opacity: 1;
    transition: all 0.5s ease;
}

.video-ads:hover img {
    opacity: 0.7;
    transition: all 0.5s ease;
}

.video-ads:hover .play_btn img,
.service-video:hover .play_btn img {
    opacity: 1;
    transform: scale(1.2);
    transition: all 0.5s ease;
}

.mock-images img {
    transition: all 0.3s ease;
}

.mock-img-2 {
    position: absolute;
    bottom: 15%;
    left: 0;
}

.bounce-rate {
    color: #FFCE00;
    font-size: 4.5em;
    font-family: 'Gilroy-Regular';
    font-weight: 100;
    line-height: 1;
}

#flickity_mock_slider .slide {
    width: 25%;
    margin-right: 15px;
    height: auto;
}

#flickity_mock_slider .flickity-prev-next-button,
#flickity_video_slider .flickity-prev-next-button {
    top: -50px;
    height: 40px;
}

#flickity_mock_slider .flickity-prev-next-button.previous,
#flickity_video_slider .flickity-prev-next-button.previous {
    left: 70px;
}

.convertion-text p {
    font-size: 24px;
    color: #E8E8E9;
    line-height: 1.3;
}

.video-ads {
    position: relative;
    /* overflow: hidden; */
}

#flickity_video_slider,
#flickity_mock_slider {
    padding: 0;
    padding-left: 6%;
}

#flickity_video_slider .slide {
    width: 90%;
    margin-right: 15px;
    height: auto;
}

.brand-campaign-slider {
    padding: 0 15px !important;
}

.brand-campaign-slider .slide {
    width: 100% !important;
    margin-right: 0 !important;
    height: auto;

}

.brand-campaign-slider#flickity_video_slider .flickity-prev-next-button.previous {
    left: 10px;
}

.brand-campaign-slider#flickity_video_slider .flickity-prev-next-button.next {
    right: 10px;
}

/* Bounce  */
.bounce_banner {
    background-image: url(../assets/bounce/banner.jpg);
}

.svg-code svg {
    width: 100%;
    height: auto;
}

.text-percentage h3 {
    font-size: 13em;
    font-weight: 100;
}

.text-percentage p {
    font-size: 32px;
    line-height: 1.2;
}

.image-style-bounce img {
    padding: 2px;
}

.pr-20 {
    padding-right: 20%;
}

h4.work_inner_title {
    font-size: 32px;
    color: #ffffff;
    font-family: 'Gilroy-Regular';
    font-weight: 100;
}

.bg_darkgrey {
    background-color: #272625;
}

.social-design {
    z-index: 99;
}

.social-design h4 {
    position: relative;
    z-index: 9;
    transform: translateY(250px);
}

.unisex-logo {
    position: absolute;
    top: 20%;
    left: 6%;
}

.unisex-logo img {
    width: 400px;
}

.social-design-images img {
    display: inline-flex;
    max-width: 33%;
    padding: 3px;
}

.webdesign-images img {
    display: inline-flex;
    max-width: 49.5%;
    padding: 3px;
}

/* popsockets  */
.popsockets_banner {
    background-image: url(../assets/popsocket/banner.png);
}

.popsockets_text {
    color: #1B52F4;
}

.popsockets_text_2 {
    color: #AEDD3C !important;
}

.popsockets_banner_main {
    overflow: inherit;
}

.bg_popsockets {
    background-color: #000B2B;
}

.image-padding img {
    padding: 0 8px;
}

.animate-this {
    opacity: 0;
    transform: translateY(100px);
}

/* Listing Page  */
.mt-120 {
    margin-top: 120px;
}

h3.work_title_listing {
    color: #E8E8E9;
    font-family: 'Gilroy-Regular';
    font-size: 5em;
    line-height: 1.1;
    font-weight: 100;
    text-transform: inherit;
}

#work_listing a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

#work_listing a img {
    opacity: 1;
    transform: scale(1);
    transition: all 0.3s ease;
}

.listing_hov_title {
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 20px 30px;
    transform: translateY(100px);
    transition: all 0.5s ease;
}

.listing_hov_title h5 {
    color: #FFFFFF;
    font-size: 32px;
    font-weight: 700;
    position: relative;
    display: inline-block;
}

.listing_hov_title h5:after {
    content: '';
    background-image: url(../assets/right.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 40px;
    width: 50px;
    position: absolute;
    top: 7px;
    right: -55px;
    bottom: 0;
}

#work_listing a:hover .listing_hov_title {
    transform: translateY(0px);
    transition: all 0.5s ease;
}

#work_listing a:hover img {
    opacity: 0.2;
    transform: scale(1.1);
    transition: all 0.3s ease;
}

#work_listing a:hover img.work-inner-img {
    opacity: 1;
    transform: scale(1);
    transition: all 0.3s ease;
}

.img-mobile {
    display: none;
}

.flickity-button:disabled {
    opacity: 0;
}

.link-next-prev a {
    outline: inherit;
    color: inherit;
    text-decoration: none;
}

.link-next-prev p {
    margin-bottom: 0;
    font-size: 14px;
}

.link-next-prev h4 {
    font-size: 20px;
    line-height: 1;
    position: relative;
    color: #ffffff;
    transition: all 0.5s ease;
}

.link-next-prev:hover h4 {
    color: #F84546;
    transition: all 0.5s ease;
}

.link-next-prev h4 svg {
    width: 30px;
    display: inline-block;
    position: absolute;
    right: -40px;
    top: 0px;
    transform: translateX(0px);
    transition: all 0.5s ease;
}

.link-next-prev h4:hover svg {
    transform: translateX(10px);
    transition: all 0.5s ease;
}

.link-prev h4:hover svg {
    transform: translateX(-10px);
    transition: all 0.5s ease;
}

.link-prev h4 svg {
    left: -40px;
}

.link-prev:hover h4 svg .b {
    stroke: #F84546;
    transition: all 0.5s ease;
}

.link-next-prev:hover h4 svg .a {
    stroke: #F84546;
    transition: all 0.5s ease;
}

/* Ratnaakar  */
.building_bg {
    background: url(../assets/ratnaakar/building.svg) no-repeat;
    background-size: 700px;
    background-position: center right;
}

.rat-solutions-img-1 {
    margin-top: -100px;
}

.ratnaakar_bg_2 {
    background-color: #120A3B;
}

.video_logo_hover {
    position: absolute;
    top: -200px;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.div-logo-collab-main {
    justify-content: space-between;
}

.div-logo-collab {
    min-height: 80px;
    position: relative;
    display: flex;
}

.div-logo-collab:before {
    content: '+';
    position: absolute;
    font-size: 54px;
    top: 0;
    bottom: 0;
    left: -50%;
    margin: auto;
    color: #E8E8E9;
}

.div-logo-collab:first-child::before {
    content: '';
}

.div-logo-collab p {
    position: absolute;
    bottom: -50px;
    left: 0;
    right: 0;
}

.logos img {
    width: 33%;
}

.logo-marks img {
    width: 49.8%;
    padding: 0;
    margin: 0;
}

#video-popup .modal-dialog {
    max-width: 100%;
    width: 100%;
    height: 100vh;
    margin: 0;
    border-radius: 0;
    background-color: #2B2B2B;
}

#video-popup .modal-content {
    width: 100%;
    height: 100%;
    border-radius: 0;
    margin: 0;
    padding: 0;
    background-color: #2B2B2B;
}

.modal#video-popup {
    width: 100vw;
    height: 100vh;
    padding: 0 !important;
}

#video-popup .modal-body {
    padding: 0;
}

#video-popup .row {
    height: 100vh;
    padding: 15px;
}

.video-close {
    position: absolute;
    right: 30px;
    top: 30px;
    z-index: 999;
}

/* iconica */
.iconica_banner {
    background-image: url(../assets/iconica/banner.jpg);
}

.iconica_text {
    color: #FCE2D6;
}

.bg_iconica {
    background-color: #04342D;
}

.bg_second_iconic {
    background-color: #003D34;
}

.plr-30 {
    padding-left: 30px;
    padding-right: 30px;
}

/* Single  */

.single_banner {
    background-image: url(../assets/single/banner.jpg);
}

.single_text {
    color: #00CEFF;
}

.mood-gif-slider#flickity_mock_slider .flickity-prev-next-button,
.mood-gif-slider#flickity_video_slider .flickity-prev-next-button {
    top: 110%;
}

/* beaumonde */
.beaumonde_banner {
    background-image: url(../assets/beaumonde/banner.jpg);
}

.bg_beaumonde {
    background-color: #070C35;
}

.campaign_idea_h4 {
    color: #EAB146;
    font-size: 36px;
    font-weight: 100;
    font-family: 'Gilroy-Regular';
    margin: 20px 0;
}

.mt-off-100 {
    margin-top: -170px;
}

.mt-off-50 {
    margin-top: -50px;
}

/* wrogn */
.wrogn_banner {
    background-image: url(../assets/wrogn/banner.jpg);
}

.wrogn_text {
    color: #F84546;
}

.bg_wrogn {
    background-color: #151515;
}

.dg-text-design h4 {
    color: #FF4547;
    font-size: 6em;
    margin: 15px 0;
}

.dg-text-design h4 span {
    font-size: 32px;
    color: #FFFFFF;
    text-transform: uppercase;
    font-family: 'Gilroy-RegularItalic';
}

.dg-text-design p {
    color: #E8E8E9;
    font-size: 44px;
    line-height: 1.2;
}

.dg-text-design-2 {
    position: relative;
}

.dg-text-design-2:before {
    content: '';
    width: 1px;
    height: 100%;
    position: absolute;
    left: -30%;
    top: 0;
    background-color: #151515;
}

.influencer-amplifier-stats .dg-text-design-2:before {
    background-color: #707070;
}

.dg-text-design-3 {
    margin-top: 20px;
}

.dg-text-design-3:before {
    content: '';
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0%;
    top: -20px;
    background-color: #707070;
}

.dg-text-design-inline {
    display: flex;
    align-items: baseline;
}

.dg-text-design-inline p,
.dg-text-design-inline h4 {
    margin-left: 15px;
}

.dg-text-design-inline-minus h4 {
    margin-left: 0px;
}

.wrogn-social-slider .flickity-prev-next-button {
    top: 105% !important;
    left: 45% !important;
}

.wrogn-social-slider .flickity-prev-next-button.next {
    left: 55% !important;
}

.wrogn-social-slider .flickity-button:disabled {
    opacity: 0.3;
}

/* Imara  */
.imara_banner {
    background-image: url("../assets/imara/banner.jpg");
}

.bg_imara {
    background-color: #4A0001;
}

.images-imara .image-bottom {
    margin-top: 30px;
}

.work_title_imara {
    font-size: 52px;
}

.imara-stats {
    margin-top: 100px;
}

.imara-stats h4 {
    color: #FE6900;
    font-size: 8em;
    font-weight: 100;
    font-family: 'Gilroy-Regular';
}

.imara-stats p {
    color: #F4EFE2;
    font-size: 40px;
}

.imara-stats-2 {
    margin-top: -80px;
}

.mt-top-50 {
    margin-top: -100px;
}

.imara-tabs {
    margin: 0 5px;
    padding: 0;
    margin-bottom: 30px;
    border-bottom: 1px solid #C9BCAC;
}

.imara-tabs li {
    list-style-type: none;
    display: inline-block;
    width: 24%;
    text-align: center;
    padding-bottom: 20px;
    cursor: pointer;
}

.imara-tabs li img {
    transform: translateX(10px);
}

.imara-tabs li span {
    display: block;
    margin-top: -51px;
    color: #E2C59B;
    font-size: 42px;
    line-height: 1;
}

.imara-slider img {
    padding: 0 5px;
}

.imara-slider .flickity-button.next {
    right: -50px;
    opacity: 1 !important;
}

.imara-slider .flickity-button.previous {
    left: -50px;
    opacity: 1 !important;
}

#imara-slider {
    padding: 0;
}

.imara-tabs li.active {
    border-bottom: 4px solid #E2C59B;
}

/* Nova  */
.nova_banner {
    background-image: url(../assets/nova/banner.png);
}

.dg-text-design-nova h4 {
    color: #F24387;
}

.bg_nova {
    background-color: #405B65;
}

.dg-text-design-nova-2 img,
.dg-text-design-nova-inner {
    float: left;
}

.dg-text-design-nova-2 {
    display: flex;
    align-items: flex-end;
}

.dg-text-design-nova-inner {
    margin-left: 15px;
    ;
}

.dg-text-design-nova-inner p {
    margin: 0;
    line-height: 1;
}

h3.text-nova {
    color: #F24387;
}

.lead-text-nova {
    font-size: 80px;
    line-height: 1.2;
}

#flickity_nova_slider_small {
    padding: 250px 0;
    position: relative;
}

#flickity_nova_slider_small:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../assets/nova/mobile.png);
    background-repeat: no-repeat;
    background-size: 440px;
    background-position: center;

}

#flickity_nova_slider_small .flickity-button {
    top: 85%;
    height: 30px;
    position: absolute;
}

#flickity_nova_slider_small .flickity-button::before {
    content: '';
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    right: -4px;
    border: 3px solid #FF4547;
}

#flickity_nova_slider_small .flickity-button.previous::before {
    top: 0;
    right: unset;
    left: -4px;
}

.whatsapp-1 {
    display: flex;
    align-items: flex-end;
}

/* About Us  */
.about_banner {
    background-image: url(../assets/about-banner.jpg?v=1);
}

.about-content-p {
    font-size: 6em;
    font-weight: 400;
    font-family: 'Gilroy-Bold';
    letter-spacing: -4px;
    line-height: 1;
    width: 70%;
}

.about-us-section {
    height: 100vh;
}

.about-us-section .banner-content-title {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: transparent;
    padding-top: 0;
    height: 100%;
    display: flex;
    align-items: center;
}

.about-image img {
    position: absolute;
}

.brands-slider img {
    max-height: 50px;
    width: auto;
    max-width: 70%;
}

.brands-slider .flickity-button.previous {
    bottom: -60px;
    top: unset !important;
    left: 40% !important;
}

.brands-slider .flickity-button.next {
    bottom: -60px;
    top: unset !important;
    left: unset;
    right: 40% !important;
}

.brands-slider .flickity-button:disabled {
    opacity: 1;
}

.brands-slider .flickity-slider {
    display: flex;
    align-items: center;
}

.know-more-text {
    color: #FF4547;
    ;
    font-size: 5.5em;
    line-height: 1.2;
}

.know-more-btn {
    color: #ffffff;
    font-size: 24px;
    text-decoration: none;
    outline: inherit;
    display: block;
}

.know-more-btn img {
    margin-right: 20px;
    transform: translateX(0px);
    transition: all 0.3s ease;
}

.know-more-btn:hover img {
    transform: translateX(10px);
    transition: all 0.3s ease;
}

.know-more-btn:hover {
    color: #ffffff;
    text-decoration: none;
}

/* Our Services  */
.services_banner {
    background-image: url(../assets/services/banner.jpg);
}

.services-content-p {
    width: 100%;
}

p.services-banner-content-p {
    font-size: 42px;
}

.services-copy h3.work_title {
    font-size: 4em;
}

/* Licious  */
.licious_banner {
    background-image: url(../assets/licious/banner.jpg);
}

.bg_white {
    background-color: #ffffff;
}

.text_black h3.work_title {
    color: #000000;
}

.text_black p {
    color: rgba(0, 0, 0, 0.6);
}

.readyto {
    margin-top: 35px;
    font-size: 4.2em;
    letter-spacing: 0;
    color: #F01E32;
    font-weight: 100;
    font-family: 'Gilroy-Regular';
}

.dg-text-design-licious-main {
    display: flex;
    align-items: center;
}

.dg-text-design-licious-main img {
    float: left;
}

.dg-text-design-licious {
    float: left;
    margin-left: 25px;
}

.dg-text-design-licious h4 {
    font-family: 'Gilroy-Regular';
    margin: 0;
}

.dg-text-design-licious h4 span,
.dg-text-design-licious p {
    color: #000000;
}

.bg_grey {
    background-color: #F0F0F0;
}

.flickity-licious-slider .flickity-button.next {
    background-image: url(../assets/right-black.svg);
}

.flickity-licious-slider .flickity-button.previous {
    background-image: url(../assets/left-black.svg);
}

/* zodiac */

.zodiac_banner {
    background-image: url(../assets/preethi/banner.jpg?v=5);
}

.bg_zodiac {
    background-color: #001B2F;
}

.text_zodiac {
    color: #0DF40A;
}

.zodiac_h4 {
    font-size: 4.5em;
    font-family: 'Gilroy-Regular';
    font-weight: 100;
    margin: 40px 0;
}

.zodiac_h4 span {
    display: inline-block;
    margin-left: 50px;
}

.dg-text-design-zodiac-main {
    display: flex;
    align-items: center;
}

.dg-text-design-zodiac {
    margin-left: 25px;
}

.dg-text-design-zodiac h4 {
    color: #0DF40A;
    margin: 0;

    font-family: 'Gilroy-Regular';

}

.preethi-media-slider {
    padding-left: 1% !important;
}

.flickity_video_slider_corner#flickity_video_slider .flickity-button.previous {
    left: 0;
}

/* Riddlerrom */

.riddle_banner {
    background-image: url(../assets/riddleroom/banner.jpg);
}

/*halcyon*/

.halcyon.banner-section {
    overflow: initial;
}

.halcyon_banner {
    background-image: url(../assets/halcyon/main-banner.jpg);
}

.halcyon.banner-section .banner-content-title h1 {
    text-align: left;
    margin-bottom: -30px;
}

.halcyon_bg {
    background-color: #09043C;
}

/*knockaround_banner*/

.knockaround_banner {
    background-image: url(../assets/knockaround/banner.jpg);
}

/*bounceback_banner*/

.bounceback_banner {
    background-image: url(../assets/bounceback/banner.jpg);
}

.bounceback_bg {
    background-color: #891A71;
}

@media only screen and (min-width: 1300px) {}

@media only screen and (min-width: 1600px) {
    .banner-content-title {
        padding-top: 400px;
    }

    .get-in-touch {
        font-size: 1.5rem;
    }

    .slide-1 h1 {
        font-size: 16em;
    }

    .container {
        max-width: 1350px;
    }

    .slide-2 h2 {
        font-size: 90px;
    }

    .slider-project-title h5 {
        font-size: 95px;
    }

    .slider-project-title p {
        font-size: 20px;
    }

    .menubar-inner {
        padding: 70px 23px 21px;
    }

    .bar1,
    .bar2,
    .bar3 {
        height: 4px;
    }

    .flickity-button.next,
    .flickity-button.previous {
        background-size: 60px;
        width: 60px;
    }

    .navbar-brand img {
        width: 50px;
    }

    .slider-featured-project {
        top: 60px;
    }

    .slider-featured-project p {
        font-size: 1.5rem;
    }
}

@media only screen and (max-width: 1024px) {
    .slide-1 h1 {
        font-size: 8em;
    }

    #flickity_slider .flickity-page-dots {
        display: none;
    }

    .flickity-button {
        top: unset;
        bottom: 20px;
        position: fixed;
    }

    .flickity-button.next:hover,
    .flickity-button.previous:hover {
        transform: translateX(0px);
    }

    .flickity-button.next {
        right: 4%;
        height: 23px;
    }

    .flickity-button.previous {
        left: 4%;
        height: 23px;
    }

    .menunavitems li a {
        font-size: 5em;
    }

    .slider-featured-project {
        top: 31px;
        left: 25%;
    }

    .slider-project-title {
        bottom: 150px;
        left: 10px;
    }

    .banner-content-title h1 {
        font-size: 7em;
    }

    .text-percentage h3 {
        font-size: 8em;
    }

    .social-design h4 {
        transform: translateY(100px);
    }

    .listing_hov_title {
        transform: translateY(0px);
        transition: all 0.5s ease;
    }

    .img-desktop {
        display: none;
    }

    .img-mobile {
        display: block;
    }

    .slide-img img {
        height: auto;
        width: 100%;
    }

    .listing_hov_title {
        padding: 10px
    }

    .listing_hov_title h5 {
        font-size: 24px;
    }

    .container {
        width: 84%;
    }

    #flickity_slider .container {
        width: 100%;
    }

    .get-in-touch {
        display: none;
    }

    #work_listing a img {
        opacity: 0.8;
        transform: scale(1);
        transition: all 0.3s ease;
    }

    #work_listing a:hover img {
        opacity: 0.8;
        transform: scale(1);
        transition: all 0.3s ease;
    }

    .unisex-logo {
        left: 10%;
    }

    .unisex-logo img {
        width: 190px;
    }

    .social-design-images img {
        max-width: 32.5%;
    }

    .div-logo-collab:before {
        left: -50px;
    }

    .div-logo-collab:last-child img {
        width: 150px;
    }

    .logos img {
        width: 32.5%;
    }

    .building_bg {
        background-size: 380px;
    }

    .rat-solutions-img-1 {
        margin-top: 0;
    }

    .logo-marks img {
        width: 49%;
    }

    p.menu-text {
        font-size: 16px;
    }

    .imara-stats h4 {
        font-size: 4em;
    }

    .imara-tabs li img {
        width: 100px;
    }

    .imara-tabs li span {
        font-size: 32px;
    }

    #flickity_nova_slider_small:after {
        background-size: 340px;
    }

    .services-copy h3.work_title {
        font-size: 3em;
    }
}

@media only screen and (max-width: 768px) {
    #flickity_nova_slider_small:after {
        background-size: 250px;
    }
}

@media only screen and (max-width: 767px) {
    .banner-logo img {
        width: 150px;
    }

    .banner-logo p {
        font-size: 21px;
    }

    .container {
        width: 80%;
    }

    #flickity_slider .container {
        width: 100%;
    }

    .flickity-button:disabled {
        opacity: 0.3;
    }

    .slide-1 h1 {
        /* font-size: 5em; */
        letter-spacing: -5px;
    }

    .slide-2 h2 {
        font-size: 52px;
    }

    .flickity-button.previous {
        right: 20%;
    }

    .menunavitems li a {
        /* font-size: 4em; */
    }

    .menu-content {
        overflow: scroll;
        padding: 50px 0;
    }

    .menu-content h3 {
        margin-top: 30px;
        font-size: 55px;
    }

    h3.menu_title {
        font-size: 24px;
    }

    .menu-content p {
        font-size: 24px;
    }

    p.menu-text {
        font-size: 16px;
    }

    .mail-enquiries .text-right,
    .mail-enquiries .text-center {
        text-align: left !important;
    }

    /* .navbar-nav {
        padding-left: 20px;
    } */

    .navbar {
        padding: 0 6px;
    }

    .banner-section {
        height: 70vh;
    }

    .banner-image {
        min-height: 70vh;
    }

    .banner-content-title h1 {
        font-size: 3.5em;
        padding-left: 10px;
        letter-spacing: -2px;
        margin-bottom: 0;
        font-family: 'Gilroy-Medium';
    }

    #flickity_video_slider {
        margin-top: 30px;
    }

    .banner-content-p p {
        line-height: 1.2;
        padding: 20px 0;
        font-size: 21px;
    }

    h3.work_title {
        font-size: 2.6em;
        letter-spacing: -1px;
        font-family: 'Gilroy-Medium';
    }

    .bounce-rate {
        font-size: 3em;
    }

    #flickity_mock_slider .slide {
        width: 40%;
    }

    .masnory-images .pl-0,
    .masnory-images .pl-1 {
        padding-left: 15px !important;
    }

    .masnory-images .pr-0,
    .masnory-images .pr-1 {
        padding-right: 15px !important;
    }

    .masnory-images .p-0 {
        padding: 15px !important;
    }

    .masnory-images .pr-2 {
        padding-right: 15px !important;
    }

    .masnory-images .pl-2 {
        padding-left: 15px !important;
    }

    .masnory-images .pt-2 {
        padding-top: 15px !important;
    }

    .masnory-images.pt-3 {
        padding-bottom: 0;
    }

    .image-padding img {
        padding: 0;
    }

    #flickity_video_slider .flickity-prev-next-button {
        /* top: -20px; */
    }

    .text-percentage h3 {
        font-size: 6em;
    }

    .social-design h4 {
        transform: translateY(0px);
    }

    .pop-logo img {
        width: 100%;
    }

    .masnory-images {
        padding-bottom: 50px;
    }

    #work_listing .animate-this {
        margin-bottom: 20px !important;
    }

    .slider-featured-project {
        top: 31px;
        left: 17%;
    }

    .slider-featured-project p:before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto;
        left: -28px;
        width: 0;
        height: 0;
        border: 0px solid #F84546;
    }

    .slider-featured-project p {
        font-family: 'Gilroy-Regular';
        color: #E8E8E9;
        font-size: 18px;
        position: relative;
        margin: 0;
    }

    .menu-content .h-100 {
        height: auto !important;
    }

    #flickity_video_slider,
    #flickity_mock_slider {
        padding-left: 15%;
    }

    #flickity_video_slider .flickity-button.previous,
    #flickity_mock_slider .flickity-button.previous {
        left: 14%;
    }

    .link-next-prev {
        width: 50%;
    }

    .link-next-prev h4 svg {
        display: none;
    }

    .link-next-prev-main,
    .pop-logo {
        width: 95%;
        margin: auto;
    }

    .bounce_banner {
        background-image: url(../assets/bounce/banner-mob.jpg);
    }

    .popsockets_banner {
        background-image: url(../assets/popsocket/banner-mob.jpg);
    }

    .rhinoshield_banner {
        background-image: url(../assets/rhinoshield/banner-mob.jpg);
    }

    .ratnaakar_banner {
        background-image: url(../assets/ratnaakar/banner-mob.jpg);
    }

    .social-design-images img {
        max-width: 49%;
    }

    .unisex-logo img {
        width: 130px;
    }

    .bounce-positioning-img {
        padding-top: 140px;
    }

    .unisex-logo {
        top: 40px;
        left: 0;
        right: 0;
        margin: auto;
        text-align: center;
    }

    .container-full {
        width: 100%;
        overflow: hidden;
    }

    .container-full-inner {
        padding: 10px !important;
    }

    .container-full-inner img {
        width: 105%;
    }

    #bounce-hording,
    #image-style-slider {
        width: 100%;
        display: block;
        -ms-flex-wrap: inherit;
        flex-wrap: inherit;
        position: relative;
        margin: 0;
        margin-top: 50px;
        margin-bottom: -50px;
    }

    #bounce-hording .animate-this,
    #image-style-slider .animate-this {
        padding: 0 !important;
    }

    #bounce-hording .flickity-prev-next-button,
    #image-style-slider .flickity-prev-next-button {
        position: absolute;
        top: -50px;
        height: 40px;
        left: 0;
    }

    #bounce-hording .flickity-button.next,
    #image-style-slider .flickity-button.next {
        left: unset;
        right: 0;
    }

    /* Ratnaakar  */
    .video_logo_hover {
        display: none;
    }

    .div-logo-collab {
        min-height: unset;
        position: relative;
        display: block;
        margin-bottom: 40px;
        text-align: center;
        width: 100%;
    }

    .div-logo-collab p {
        position: relative;
        bottom: 0;
        left: 0;
        right: 0;
    }

    #flickity_mock_slider p {
        line-height: 1.2;
    }

    .play_btn {
        width: 50px;
        height: 50px;
    }

    .play_btn img {
        width: 50px;
    }

    .logos img {
        width: 100%;
    }

    .div-logo-collab:before {
        left: 0;
        right: 0;
        top: -70px;
    }

    .building_bg {
        background: none;
    }

    .ratnaakar-masnory .animate-this {
        padding: 5px 15px !important;
    }

    .dg-text-design-inline {
        display: block;
    }

    .dg-text-design h4 {
        font-size: 4em;
    }

    .dg-text-design-inline p,
    .dg-text-design-inline h4 {
        margin-left: 0px;
    }

    .imara-logo {
        width: 250px;
    }

    .imara-tabs li {
        width: 23%;
    }

    .imara-tabs li img {
        width: 50px;
    }

    .imara-tabs li span {
        margin-top: -20px;
        font-size: 11px;
        line-height: 1;
    }

    .imara-stats h4 {
        font-size: 3em;
    }

    #flickity_nova_slider_small {
        padding: 0 0 100px;
    }

    #flickity_nova_slider_small:after {
        background-image: url();
    }

    .lead-text-nova {
        font-size: 40px;
    }

    .mobile-logo-nova {
        width: 200px;
    }

    .dg-text-design-nova-2 {
        margin-top: 30px;
    }

    #flickity_nova_slider .flickity-button.previous {
        left: -7%;
    }

    #flickity_nova_slider .flickity-button.next {
        right: -7%;
    }

    .about-content-p {
        font-size: 3em !important;
    }

    .brands-slider .flickity-button.next {
        right: 20% !important;
    }

    .brands-slider .flickity-button.previous {
        left: 20% !important;
    }

    .know-more-text {
        font-size: 2.5em;
    }

    p.services-banner-content-p {
        font-size: 24px;
    }

    .services-copy h3.work_title {
        font-size: 2em;
        margin-top: 20px;
    }

    .know-more-btn {
        font-size: 21px;
    }

    .readyto {
        font-size: 2em;
    }

    .dg-text-design-licious-main,
    .dg-text-design-zodiac-main {
        margin-top: 20px;
    }

    .dg-text-design-licious-main p,
    .dg-text-design-zodiac-main p {
        font-size: 24px;
    }

    .zodiac_h4 {
        font-size: 2.5em;
    }

    .wrogn-social-slider .flickity-prev-next-button.next {
        left: 65% !important;
    }

    .wrogn-social-slider .flickity-prev-next-button {
        left: 35% !important;
    }

}

@media only screen and (max-width: 350px) {
    h3.work_title {
        font-size: 2em;
    }
}