/* ===================================
    Crafto - Web agency
====================================== */


@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100..900&display=swap');


/* font */
@import url('../../css2-8');

/* variable website old #BEFF01;*/
@font-face {
    font-family: 'Muli';
    src: url('font/MULI.TTF') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Muli';
    src: url('font/MULI-LIGHT.TTF') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Muli';
    src: url('font/MULI-EXTRALIGHT.TTF') format('truetype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Muli';
    src: url('font/MULI-SEMIBOLD.TTF') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Muli';
    src: url('font/MULI-BOLD.TTF') format('truetype');
    font-weight: 700;
    font-style: normal;
}

body {
    font-family: "Nunito", sans-serif;
}

:root {
    --base-color: #174038;
    --medium-gray: #6F7071;
    --dark-gray: #184039;
    --alt-font: "Montserrat", serif;
    --primary-font: "Montserrat", serif;
}

body {
    font-size: 20px;
    line-height: 32px;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
}

.top-space-margin {
    margin-top: 120px;
}

/* header */
.navbar .navbar-nav .nav-link {
    font-weight: 300;
    font-size: 16px;
}

header .navbar-brand img {
    max-height: 56px;
}

header .btn.btn-switch-text.btn-medium>span {
    padding: 11px 30px;
}

.navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a img {
    border-radius: 0;
}

/* btn  */
.btn.btn-base-color {
    color: var(--dark-gray);
}

.btn.btn-box-shadow.btn-base-color:hover,
.btn.btn-box-shadow.btn-base-color:active {
    color: var(--dark-gray);
}

/* letter spacing */
.bg-base-color-transparent {
    background-color: rgba(204, 255, 0, 0.9);
}

/* banner title */
.banner-title {
    font-size: 650px;
    word-break: normal;
    letter-spacing: -40px;
}

/* letter spacing */
.ls-minus-20px {
    letter-spacing: -20px;
}

.ls-minus-13px {
    letter-spacing: -13px;
}

.mt-minus-12 {
    margin-top: -12%;
}

/* word break normal */
.word-break-normal {
    word-break: normal;
}

/* bg color */
.bg-sherpa-blue {
    background-color: #333436;
}

/* page title */
.page-title-extra-large h1 {
    font-size: 5rem;
    line-height: 5rem;
}

/* team style */
.team-style-05 img {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
}

.team-style-05:hover img {
    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
}

.team-style-08 figure img {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
}

.team-style-08:hover figure img {
    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
}

.team-style-08 figure figcaption .social-icon a {
    background-color: var(--base-color);
}

.team-style-08 figure figcaption .social-icon a:hover {
    color: var(--dark-gray);
}

/* blog comment */
.blog-classic .card .blog-image img {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
}

.blog-comment li .btn-reply:hover {
    color: var(--text-dark-gray);
}

/* tag */
.tag-cloud a {
    background-color: var(--white);
}

/* portfolio-image */
.portfolio-simple .grid-item .portfolio-image img {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
}

.portfolio-simple .portfolio-box:hover .portfolio-image img {
    opacity: 1;
    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
}

/* popular post sidebar */
.popular-post-sidebar li figure {
    width: 190px;
    height: auto;
}

.popular-post-sidebar li .media-body {
    padding-left: 40px;
}

/* social icon style 06 */
.social-icon-style-06 li {
    position: relative;
}

.social-icon-style-06 li:before {
    width: 6px;
    height: 6px;
    border-radius: 100%;
    background-color: var(--medium-gray);
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
    opacity: .5;
}

.social-icon-style-06 li:last-child:before {
    display: none;
}

/* footer */
footer .footer-logo img {
    max-height: 56px;
}

footer .nav-link {
    color: var(--dark-gray);
}

.footer-navbar li a:hover {
    color: var(--dark-gray);
}

/* media query responsive */
@media (min-width: 992px) {
    .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu {
        padding: 15px 25px;
    }
}

@media (min-width: 768px) {

    /* heading tag */
    h1 {
        font-size: 5rem;
        line-height: 5rem;
    }

    h2 {
        font-size: 3.75rem;
        line-height: 3.75rem;
    }

    h3 {
        font-size: 3.125rem;
        line-height: 3.125rem;
    }
}

@media (max-width: 1399px) {
    .banner-title {
        font-size: 500px;
    }

    header .btn.btn-switch-text.btn-medium>span {
        padding: 11px 22px;
    }
}

@media (max-width: 1199px) {
    .banner-title {
        font-size: 380px;
        letter-spacing: -25px;
    }

    .ls-minus-20px {
        letter-spacing: -15px;
    }

    header .btn.btn-switch-text.btn-medium>span {
        padding: 6px 11px;
    }

    .navbar .navbar-nav .nav-link {
        padding: 10px 12px;
    }

    footer .nav-link {
        padding: 2px 8px;
    }
}

@media (max-width: 991px) {
    .banner-title {
        font-size: 270px;
        letter-spacing: -15px;
    }

    .ls-minus-20px {
        letter-spacing: -10px;
    }

    .top-space-margin {
        margin-top: 100px;
    }

    header .btn.btn-switch-text.btn-medium>span {
        padding: 9px 24px;
    }
}

@media (max-width: 767px) {
    .banner-title {
        font-size: 200px;
        letter-spacing: -15px;
    }

    .process-step-style-10.hover-box:hover .hover-content {
        bottom: 0;
    }

    .ls-minus-20px {
        letter-spacing: -4px;
    }

    .ls-minus-13px {
        letter-spacing: -5px;
    }
}

.tpspc {
    margin-top: 80px;
}

@media (max-width: 575px) {
    .banner-title {
        font-size: 110px;
        letter-spacing: -3px;
    }

    .popular-post-sidebar li figure {
        width: 100%;
    }

    .popular-post-sidebar li .media-body {
        padding-left: 0;
        padding-top: 25px;
    }

    .tpspc {
        margin-top: 40px;
    }

    .left-right-content {
        padding: 50px 0px 71px !important;
    }

    .left-content {
        left: 67% !important;
    }

    .right-content {
        left: 58% !important;
    }

    .scramble {
        margin: 176px 0px 50px !important;
    }

    .mbl-tp {
        margin-top: 30px;
    }

}

.h-about p {
    text-align: justify;
}

.bg-dark-green {
    background-color: #07362d;
}

.bg-base-gry {
    background-color: #dfdfdf;
}

.footer-navbar a {
    font-size: 18px;
    font-weight: 500;
}

.ftr-top {
    padding: 40px 0 15px !important;
}

.text-da-white {
    color: #ffff !important;
}

.thank-you-arrange {
    display: flex;
    justify-content: center;


}

.demo-button-wrapper {
    display: none !important;
}

.mapc iframe {
    width: 100%;
}

.swiper-width-auto .swiper-slide {
    width: 600px !important;
}

#banner-title {
    opacity: 0.2;
    font-weight: 600 !important;
}

#avarya {
    padding: 50px;
}

#avarya .portfolio-image {
    background: #463e71;
}

#binge {
    padding: 50px;
}

#binge .portfolio-image {
    background: #463e71;
}

#doh {
    padding: 50px;
}

#doh .portfolio-image {
    background: #463e71;
}

#brainy {
    padding: 50px;
}

#brainy .portfolio-image {
    background: #4a8d88;
}

#ekkam {
    padding: 50px;
}

#ekkam .portfolio-image {
    background: #463e71;

}

#virtue {
    padding: 50px;
}

#virtue .portfolio-image {
    background: #4a8d88;
}

#gaurav {
    padding: 50px;
}

#gaurav .portfolio-image {
    background: #4a8d88;
}

#thanks {
    padding: 50px;
}

#thanks .portfolio-image {
    background: #4a8d88;
}

#flo {
    padding: 50px;
}

#flo .portfolio-image {
    background: #ae5965;
}

#dipp {
    padding: 50px;
}

#dipp .portfolio-image {
    background: #bd4a4d;
}

#oven {
    padding: 50px;
}

#oven .portfolio-image {
    background: #8e4371;
}

#falcon {
    padding: 50px;
}

#falcon .portfolio-image {
    background: #47478e;
}

#sonari {
    padding: 50px;
}

#sonari .portfolio-image {
    background: #4c8ba5;
}

#assian-paints {
    padding: 50px;
}

#assian-paints .portfolio-image {
    background: #b15d3b;
}

#rashmi {
    padding: 50px;
}

#rashmi .portfolio-image {
    background: #df7554;
}

#sabra {
    padding: 50px;
}

#sabra .portfolio-image {
    background: #539868;

}

#turnext {
    padding: 50px;
}

#turnext .portfolio-image {
    background: #539868;

}

#dazzle {
    padding: 50px;
}

#dazzle .portfolio-image {
    background: #539868;

}

#trusted h2 {
    color: #f6f6f6;
}

.back-btn {
    position: fixed;

    bottom: 20px;
    /* distance from bottom */
    right: 20px;
    background: #174038;
    color: #ffff;
    /* distance from right */

    padding: 6px 15px;
    border-radius: 30px;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    transition: all 0.3s ease;
}

.back-btn:hover {
    background: #dfdfdf;
    /* button color */
    color: #000;
    transform: translateY(-2px);
}

.objs p {
    margin-bottom: 0px;
}

.scramble-arrange {
    margin: 60px 0px 50px !important;
}

.dash-brd {
    border: 1px dashed #dee2e6;
}

.logopallate h3 {
    margin-bottom: 0px;
}

.masonry {
    column-count: 3;

    column-gap: 1rem;

}

.masonry-item {
    break-inside: avoid;

    margin-bottom: 1rem;
}

.masonry-item img {
    width: 100%;
    display: block;
    border-radius: 6px;
}


@media (max-width: 992px) {
    .masonry {
        column-count: 2;
    }
}

@media (max-width: 576px) {
    .masonry {
        column-count: 1;
    }
}

.logopallate .bg-brown {
    background-color: #9c7a3c;
}

.txtadd h3 {
    font-size: 6rem;
    line-height: 1.1;
}

.txtad h3 {
    font-size: 5rem;
}

/* Questionaries */

.heading h3 {
    color: #174038;
    font-size: 34px;
    font-weight: 600;
    margin-bottom: 0px;
}

.fs-from .card-body {
    padding: 26px;
}

.fs-from .card {
    margin-bottom: 32px;
}

#multi_step_form p {
    font-size: 25px;
    color: #6a6a6a;
    font-weight: 400;
}

.dm-form h3 {
    color: #174038;
    font-size: 50px;
    font-weight: 600;
}

.dm-form h4 {
    font-weight: 600;
    color: #464646;
}

#multi_step_form label {
    font-size: 25px;
    color: #464646;
    margin-bottom: 18px;
}

.contactus {
    border: 1px solid #d7d7d7;
    padding: 31px;
}

#logotb .container-fluid {
    border-bottom: 1px solid #e9e9e9;
    width: 100%;
}

.navbar .navbar-nav .nav-item .nav-link.active,
.navbar .navbar-nav .nav-item.active .nav-link,
.navbar .navbar-nav .nav-item:hover .nav-link {
    color: var(--dark-gray);
}

.header-light .header-icon .icon>a,
.header-light .navbar-nav .nav-link {
    color: #000;
}