@font-face {
    font-family: 'DM Sans';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/DM-Sans-400-Normal.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+20AC, U+00A3;
    font-display: swap;
}

@font-face {
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url(../fonts/fa-solid-900.woff2) format("woff2"),
    url(../fonts/fa-solid-900.woff) format("woff");
}

@font-face {
    font-family: "Font Awesome 5 Brands";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/fa-brands-400.woff2) format("woff2"),
    url(../fonts/fa-brands-400.woff) format("woff");
}



@font-face {
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/fa-regular-400.woff2) format("woff2"),
    url(../fonts/fa-regular-400.woff) format("woff");
}

@font-face {
    font-family: 'DM Sans';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/DM-Sans-500-Normal.woff2') format('woff2');
    unicode-range: U+0000-00FF;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/DM-Sans-700-Normal.woff2') format('woff2');
    unicode-range: U+0000-00FF;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    font-style: italic;
    font-weight: 500;
    src: url('../fonts/DM-Sans-500.woff2') format('woff2');
    unicode-range: U+0000-00FF;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    font-style: italic;
    font-weight: 700;
    src: url('../fonts/DM-Sans-700.woff2') format('woff2');
    unicode-range: U+0000-00FF;
    font-display: swap;
}


@font-face {
    font-family: 'DM Sans';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/DM-Sans-400.woff2') format('woff2');
    unicode-range: U+0000-00FF;
    font-display: swap
}



.btn, a, button {
    text-decoration: none
}

dl, h1, h2, h3, h4, h5, h6, p, ul {
    margin-top: 0
}

*, .slick-slider, ::after, ::before {
    box-sizing: border-box
}

.slick-slider, body {
    -webkit-tap-highlight-color: transparent
}

.slick-list:focus, a, button {
    outline: 0
}

.menu-backdrop, .slick-loading .slick-slide, .slick-loading .slick-track {
    visibility: hidden
}

body {
    margin: 0;
    font-family: var(--bs-body-font-family);
    font-size: var(--bs-body-font-size);
    font-weight: var(--bs-body-font-weight);
    line-height: var(--bs-body-line-height);
    color: var(--bs-body-color);
    text-align: var(--bs-body-text-align);
    background-color: var(--bs-body-bg);
    -webkit-text-size-adjust: 100%
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: .5rem;
    font-weight: 500;
    line-height: 1.2
}

body, p {
    line-height: var(--tg-body-line-height)
}

.h1, h1 {
    font-size: calc(1.375rem + 1.5vw)
}

.h2, h2 {
    font-size: calc(1.325rem + .9vw)
}

.h3, h3 {
    font-size: calc(1.3rem + .6vw)
}

ul {
    padding-left: 2rem
}

dl, ul {
    margin-bottom: 1rem
}

a {
    color: #0d6efd
}

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

img, svg {
    vertical-align: middle
}

button {
    border-radius: 0;
    text-transform: none
}

button, input {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit
}

[type=button], [type=reset], [type=submit], button {
    -webkit-appearance: button
}

[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) {
    cursor: pointer
}

.container, .container-lg, .container-md, .container-sm, .container-xl {
    width: 100%;
    padding-right: var(--bs-gutter-x, .75rem);
    padding-left: var(--bs-gutter-x, .75rem);
    margin-right: auto;
    margin-left: auto
}

.row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x));
    --bs-gutter-x: 30px
}

.row > * {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-top: var(--bs-gutter-y)
}

.accordion-body, .accordion-button {
    padding: 1rem 1.25rem
}

.col-12 {
    flex: 0 0 auto;
    width: 100%
}

.btn {
    color: #212529;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    border: 1px solid transparent
}

.collapse:not(.show), .mobile-menu .navigation li > ul, .mobile-menu .navigation li > ul > li > ul, .slick-arrow.slick-hidden, .slick-slide.slick-loading img {
    display: none
}

.accordion-button {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    background-color: #fff;
    border: 0;
    border-radius: 0;
    overflow-anchor: none;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out, border-radius .15s
}

.btn, .sr-only {
    overflow: hidden
}

.accordion-button:not(.collapsed) {
    color: #0c63e4;
    background-color: #e7f1ff;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125)
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    transform: rotate(-180deg)
}

.accordion-button::after {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: auto;
    content: "";
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-size: 1.25rem;
    transition: transform .2s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
    .accordion-button, .accordion-button::after, .btn {
        transition: none
    }
}

.accordion-header, .faq-content .accordion-body p, .fw-link-list .list-wrap li:last-child, .introduction-content p {
    margin-bottom: 0
}

.accordion-item {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .125)
}

.accordion-item:first-of-type {
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem
}

.accordion-item:first-of-type .accordion-button {
    border-top-left-radius: calc(.25rem - 1px);
    border-top-right-radius: calc(.25rem - 1px)
}

.accordion-item:not(:first-of-type) {
    border-top: 0
}

.accordion-item:last-of-type, .accordion-item:last-of-type .accordion-collapse {
    border-bottom-right-radius: .25rem;
    border-bottom-left-radius: .25rem
}

.accordion-item:last-of-type .accordion-button.collapsed {
    border-bottom-right-radius: calc(.25rem - 1px);
    border-bottom-left-radius: calc(.25rem - 1px)
}

.clearfix::after {
    display: block;
    clear: both;
    content: ""
}

.d-none {
    display: none !important
}

.justify-content-center {
    justify-content: center !important
}

.align-items-center {
    align-items: center !important
}

.text-center {
    text-align: center !important
}


.sr-only {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    width: 1px
}

.sr-only-focusable:active, .sr-only-focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto
}





.fa-lg {
    font-size: 1.33333em;
    line-height: .75em;
    vertical-align: -.0667em
}

.btn, .fa, .fab, .fad, .fal, .far, .fas {
    display: inline-block;
    line-height: 1
}

.fa-youtube:before {
    content: "\f167"
}

.fa-envelope:before {
    content: "\f0e0"
}

.fa-map-marker-alt:before {
    content: "\f3c5"
}

.fa-phone-volume:before {
    content: "\f2a0"
}

.fab {
    font-family: "Font Awesome 5 Brands"
}

.fab, .far {
    font-weight: 400
}

.fa, .far, .fas {
    font-family: "Font Awesome 5 Free"
}

.fa, .fas {
    font-weight: 900
}

.fa, .fab, .fad, .fal, .far, .fas {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto
}

.fa-calendar-alt:before {
    content: "\f073"
}

.fa-user:before {
    content: "\f007"
}

.fa-angle-down:before {
    content: "\f107"
}

.fa-check-circle:before {
    content: "\f058"
}

.fa-bars:before {
    content: "\f0c9"
}

.fa-phone-alt:before {
    content: "\f879"
}

.fa-times:before {
    content: "\f00d"
}

.fa-facebook-f:before {
    content: "\f39e"
}

.fa-twitter:before {
    content: "\f099"
}

.fa-instagram:before {
    content: "\f16d"
}

.fa-linkedin-in:before {
    content: "\f0e1"
}

.fa-search:before {
    content: "\f002"
}

body::-webkit-scrollbar {
    width: 12px
}

body::-webkit-scrollbar-thumb {
    background-color: #82cc09;
    border-radius: 5px;
    border: 3px solid #82cc09
}

:root {
    --tg-body-font-family: 'DM Sans', sans-serif;
    --tg-heading-font-family: 'DM Sans', sans-serif;
    --tg-primary-color: #222;
    --tg-secondary-color: #82CC09;
    --tg-body-font-color: #7B7D83;
    --tg-heading-font-color: #1239AC;
    --tg-paragraph-color: #717379;
    --tg-body-font-size: 16px;
    --tg-body-font-weight: 400;
    --tg-heading-font-weight: 700;
    --tg-body-line-height: 1.87;
    --tg-heading-line-height: 1.2;
    --tg-section-background: #F3F9FF;
    --tg-section-background-two: #ECF3FB;
    --tg-blue: #222;
    --tg-blue-two: #EAF4FF;
    --tg-blue-three: #06184C;
    --tg-blue-four: #091E5A;
    --tg-blue-five: #001857;
    --tg-lavender-blue: #D0DBF8;
    --tg-indigo: #6610f2;
    --tg-purple: #6f42c1;
    --tg-pink: #d63384;
    --tg-red: #dc3545;
    --tg-orange: #fd7e14;
    --tg-yellow: #ffc107;
    --tg-green: #B1FF33;
    --tg-teal: #B1FF33;
    --tg-cyan: #0dcaf0;
    --tg-white: #ffffff;
    --tg-black: #1D212E;
    --tg-black-two: #3E3E3E;
    --tg-alice-blue: #F4FAFF;
    --tg-alice-blue-two: #F2F6FF;
    --tg-alice-blue-three: #F4F7FF;
    --tg-gray: #D9D9D9;
    --tg-gray-two: #868686;
    --tg-gray-three: #AEAEAE;
    --tg-gray-four: #5A5A5A;
    --tg-gray-five: #EDF6FF;
    --tg-gray-six: #F7F8FD;
    --tg-gray-seven: #D8D8D8;
    --facebook: #1877F2;
    --twitter: #1DA1F2;
    --linkedin: #0077B5;
    --instagram: #E1306C;
    --youtube: #c4302b;
    --skype: #00aff0
}

body {
    font-family: var(--tg-body-font-family);
    font-weight: var(--tg-body-font-weight);
    font-size: var(--tg-body-font-size);
    color: var(--tg-body-font-color);
    font-style: normal
}

.img, img {
    max-width: 100%;
    transition: .3s ease-out
}

a, button {
    -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: var(--tg-primary-color)
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--tg-heading-font-family);
    color: #222;
    margin-bottom: .7rem;
    font-style: normal;
    line-height: var(--tg-heading-line-height);
    font-weight: var(--tg-heading-font-weight);
    text-transform: inherit
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    color: inherit
}

h1 {
    font-size: 2.5rem
}

h2 {
    font-size: 2rem
}

h3 {
    font-size: 1.75rem
}

.list-wrap {
    margin: 0;
    padding: 0
}

.list-wrap li {
    list-style: none
}

p {
    font-size: var(--tg-body-font-size);
    font-weight: var(--tg-body-font-weight);
    color: var(--tg-paragraph-color);
    margin-bottom: 15px
}

.container {
    padding-left: 15px;
    padding-right: 15px
}

.btn {
    user-select: none;
    -moz-user-select: none;
    background: #448039;
    border: none;
    border-radius: 14px;
    color: var(--tg-white);
    cursor: pointer;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: .5px;
    margin-bottom: 0;
    padding: 18px 24px;
    text-align: center;
    text-transform: uppercase;
    touch-action: manipulation;
    transition: .5s cubic-bezier(.76, .49, .25, 1);
    vertical-align: middle;
    white-space: nowrap;
    position: relative;
    z-index: 1
}

.introduction-bottom .call-now i, .menu-area {
    background: var(--tg-primary-color)
}

.menu-backdrop, .mobile-menu, .search-popup-wrap {
    position: fixed;
    height: 100%
}

.btn::before {
    content: "";
    background-color: #12822d;
    position: absolute;
    display: block;
    height: 100%;
    top: 0;
    -webkit-transform: translateX(-100%) skew(-30deg);
    -moz-transform: translateX(-100%) skew(-30deg);
    transform: translateX(-100%) skew(-30deg);
    -webkit-transition: .5s cubic-bezier(.76, .49, .25, 1);
    -moz-transition: .5s cubic-bezier(.76, .49, .25, 1);
    transition: .5s cubic-bezier(.76, .49, .25, 1);
    left: -25px;
    width: 135%;
    z-index: -1
}

.btn.btn-two, .menu-area.menu-style-four {
    background: #222
}

.btn.btn-two::before {
    background: #565e64
}

.custom-container-two {
    max-width: 1400px
}

.logo img {
    max-width: 245px
}

.menu-nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-start
}

.navbar-wrap {
    display: flex;
    flex-grow: 1
}

.nav-logo img {
    width: 150px
}

.mobile-menu {
    right: 0;
    top: 0;
    width: 300px;
    padding-right: 30px;
    max-width: 100%;
    z-index: 99;
    border-radius: 0;
    transition: .3s cubic-bezier(.785, .135, .15, .86);
    -moz-transition: .3s cubic-bezier(.785, .135, .15, .86);
    -webkit-transition: .3s cubic-bezier(.785, .135, .15, .86);
    -o-transition: .3s cubic-bezier(.785, .135, .15, .86);
    -webkit-transform: translateX(101%);
    -ms-transform: translateX(101%);
    transform: translateX(101%)
}

.mobile-menu .nav-logo {
    position: relative;
    padding: 30px 25px;
    text-align: left
}

.menu-backdrop {
    right: 0;
    top: 0;
    width: 100%;
    z-index: 2;
    transition: .7s;
    -moz-transition: .7s;
    -webkit-transition: .7s;
    -ms-transition: .7s;
    -o-transition: .7s;
    opacity: 0;
    background: rgba(0, 0, 0, .5)
}

.mobile-menu .menu-box {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    max-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    background: var(--tg-white);
    padding: 0;
    z-index: 5;
    box-shadow: -9px 0 14px 0 rgb(0 0 0 / 6%)
}

.mobile-menu .close-btn {
    position: absolute;
    right: 15px;
    top: 28px;
    line-height: 30px;
    width: 35px;
    text-align: center;
    font-size: 20px;
    color: #292b37;
    cursor: pointer;
    z-index: 10;
    -webkit-transition: .9s;
    -o-transition: .9s;
    transition: .9s
}

.mobile-menu .navigation {
    position: relative;
    display: block;
    width: 100%;
    float: none;
    margin: 0;
    padding: 0
}

.mobile-menu .navigation ul {
    padding: 0;
    margin: 0
}

.mobile-menu .navigation li {
    position: relative;
    display: block;
    border-top: 1px solid
}

.mobile-menu .navigation:last-child {
    border-bottom: 1px solid
}

.mobile-menu .navigation li > a {
    position: relative;
    display: block;
    line-height: 24px;
    padding: 10px 60px 10px 25px;
    font-size: 16px;
    font-weight: 700;
    color: var(--tg-heading-font-color);
    text-transform: capitalize;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    border: none
}

.mobile-menu .navigation li > a:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 0;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s
}

.mobile-menu .navigation li.menu-item-has-children .dropdown-btn {
    position: absolute;
    right: 15px;
    top: 6px;
    width: 32px;
    height: 32px;
    text-align: center;
    font-size: 16px;
    line-height: 32px;
    color: var(--tg-white);
    background: var(--tg-blue);
    cursor: pointer;
    border-radius: 2px;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    z-index: 5
}

.mobile-menu .social-links ul {
    display: flex;
    position: relative;
    text-align: center;
    padding: 30px 20px 20px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap
}

.mobile-menu .social-links li {
    position: relative;
    display: inline-block;
    margin: 0 6px 10px
}

.mobile-menu .social-links li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    position: relative;
    line-height: 32px;
    font-size: 16px;
    color: var(--tg-heading-font-color);
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    border: 1px solid var(--tg-gray);
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px
}

.menu-area .mobile-nav-toggler {
    position: relative;
    float: right;
    font-size: 30px;
    cursor: pointer;
    line-height: 1;
    color: var(--tg-white);
    display: none;
    margin-top: 9px
}

.search-popup-wrap {
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, .95);
    width: 100%;
    z-index: 99;
    padding: 100px 0;
    display: none
}

.banner-btn {
    display: flex;
    align-items: center;
    gap: 15px 25px;
    flex-wrap: wrap
}

.banner-bg-three {
    background-size: cover;
    background-position: center;
    padding: 120px 0 150px;
    position: relative;
    z-index: 1
}

.banner-bg-three::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 100%;
    height: 150px;
    z-index: 99;
    background: var(--tg-white);
    clip-path: polygon(0 0, 0% 100%, 100% 100%)
}

.banner-bg-three::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, .2);
    z-index: -2
}

.banner-content-three .title {
    font-size: 70px;
    letter-spacing: -2px;
    margin-bottom: 15px;
    color: var(--tg-white)
}

.banner-content-three p {
    margin-bottom: 45px;
    color: var(--tg-white)
}

.services-area-three {
    position: relative
}

.services-item-wrap-two .row {
    margin: 0 -20px
}

.services-item-wrap-two [class*=col-] {
    padding: 0 20px
}

.services-item-three {
    margin-bottom: 40px
}

.blog-item-two, .introduction-list, .project-details-content p {
    margin-bottom: 30px
}

.services-thumb-three {
    border-radius: 20px;
    overflow: hidden
}

.services-thumb-three img {
    transform: scale(1);
    transition: .3s
}

.faq-content .accordion-item:first-of-type, .faq-content .accordion-item:first-of-type .accordion-button {
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.faq-content .accordion-item {
    background-color: var(--tg-white);
    border: none;
    box-shadow: 0 0 50px rgba(0, 0, 0, .05);
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 20px
}

.faq-content .accordion-item:last-child {
    margin-bottom: 60px
}

.faq-content .accordion-button {
    font-size: 18px;
    color: var(--tg-blue);
    font-weight: 700;
    padding: 24px 85px 24px 35px
}

.faq-content .accordion-button:not(.collapsed) {
    color: var(--tg-blue);
    background-color: var(--tg-white);
    box-shadow: none
}

.faq-content .accordion-body {
    padding: 0 85px 25px 35px
}

.faq-content .accordion-button::after {
    position: absolute;
    content: "\f067";
    top: 18px;
    right: 35px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    color: var(--tg-blue);
    background: var(--tg-gray-five);
    transition: .3s linear;
    border-radius: 50%;
    font-family: "Font Awesome 5 Free";
    line-height: 0
}

.faq-content .accordion-button:not(.collapsed)::after {
    content: "\f068";
    background: var(--tg-blue);
    transform: rotate(0);
    background: var(--tg-blue);
    background-image: none;
    color: var(--tg-white);
    font-family: "Font Awesome 5 Free"
}

.faq-img img {
    margin-left: 60px;
    max-width: 550px
}

.introduction-img-wrap {
    position: relative;
    padding-top: 60px
}

.introduction-img-wrap img:first-child {
    max-width: 570px;
    object-fit: cover;
    max-height: 570px;
    border: 10px solid var(--tg-primary-color);
    border-radius: 50%
}

.introduction-img-wrap img:nth-child(2) {
    max-width: 240px;
    max-height: 240px;
    border: 10px solid var(--tg-secondary-color);
    border-radius: 50%;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0
}

.introduction-content {
    margin-left: 50px
}

.section-title-two .sub-title {
    font-weight: 700;
    font-size: 18px;
    color: #448039;
    display: block;
    margin-bottom: 5px
}

.section-title-two .title {
    font-size: 30px;
    margin-bottom: 0
}

.introduction-content .info-one {
    font-weight: 500;
    margin-bottom: 10px;
    color: #448039
}

.introduction-list {
    border-top: 1px solid var(--tg-gray);
    border-bottom: 1px solid var(--tg-gray);
    margin-top: 30px;
    padding-top: 30px;
    padding-bottom: 30px
}

.introduction-list .list-wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px 0
}

.introduction-list .list-wrap li {
    width: 50%;
    font-weight: 700;
    font-size: 16px;
    color: var(--tg-blue);
    line-height: 1.4
}

.introduction-list .list-wrap li i {
    margin-right: 8px
}

.introduction-bottom {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px 35px
}

.introduction-bottom .call-now {
    display: flex;
    align-items: center
}

.introduction-bottom .call-now i {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--tg-white);
    border-radius: 50%;
    font-size: 15px;
    margin-right: 12px
}

.introduction-bottom .call-now a {
    font-size: 24px;
    color: var(--tg-blue);
    font-weight: 700;
    display: block
}

.brand-item {
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center
}

.brand-active [class*=col-] {
    padding: 15px
}

.brand-item img {
    opacity: .5;
    cursor: pointer;
    transition: .3s linear
}

.blog-meta .list-wrap {
    display: flex;
    align-items: center;
    gap: 25px;
    margin-bottom: 10px
}

.blog-meta .list-wrap li {
    display: flex;
    align-items: center;
    font-weight: 400;
    font-size: 15px;
    color: var(--tg-gray-four)
}

.blog-meta .list-wrap li i {
    font-size: 14px;
    color: var(--tg-primary-color);
    margin-right: 8px
}

.blog-thumb-two {
    border-radius: 10px;
    overflow: hidden
}

.blog-thumb-two img {
    transform: scale(1);
    transition: .3s ease-out
}

.blog-content-two {
    box-shadow: 0 0 50px rgba(0, 0, 0, .06);
    border-radius: 0 5px 5px;
    background: var(--tg-white);
    margin: -62px 35px 0;
    position: relative;
    padding: 30px 25px 55px
}

.blog-content-two .tag {
    font-weight: 700;
    font-size: 15px;
    color: var(--tg-white);
    background: #565e64;
    display: inline-block;
    padding: 12px 22px;
    border-radius: 5px 5px 0 0;
    line-height: 1;
    position: absolute;
    left: 0;
    top: -39px
}

.blog-content-two .title {
    font-size: 30px;
    margin-bottom: 30px
}

.blog-content-two .btn {
    background: var(--tg-gray-five);
    color: var(--tg-blue)
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -10;
    background-color: rgba(0, 0, 0, .3)
}

.fw-link-list .list-wrap li {
    margin-bottom: 12px
}

.fw-link-list .list-wrap li a {
    font-size: 16px;
    line-height: 1.4;
    color: var(--tg-lavender-blue);
    position: relative
}

.fw-link-list .list-wrap li a::before {
    content: "";
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: var(--tg-white);
    -webkit-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top;
    -webkit-transform: scale(0, 1);
    -ms-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transition: transform .4s cubic-bezier(1, 0, 0, 1);
    transition: transform .4s cubic-bezier(.74, .72, .27, .24)
}

@media (max-width: 991.98px) {
    .banner-content, .banner-content-three, .banner-content-two, .faq-content .section-title-two, .faq-img, .faq-img-two, .more-project-wrap > .title {
        text-align: center
    }

    .order-sm-1 {
        order: 1
    }

    .order-sm-2 {
        order: 2
    }

    .banner-area-two .container-fluid, .container, .custom-container {
        max-width: 720px
    }

    .menu-area {
        padding: 20px 0
    }

    .contact-img img, .header-action > ul li.header-btn, .header-logo-area, .header-top-left, .inner-introduction-area .section-title .title br, .section-title-two .title br, .work-line-shape {
        display: none
    }

    .menu-nav {
        justify-content: space-between
    }

    .header-action {
        margin-right: 30px
    }

    .logo.d-none, .menu-outer .navbar-wrap {
        display: block !important
    }

    .menu-area .mobile-nav-toggler {
        display: block
    }

    .banner-btn, .banner-content-two .banner-content-bottom, .header-top-right span, .project-nav-wrap .nav-tabs {
        justify-content: center
    }

    .slider-content .title {
        margin-bottom: 35px;
        font-size: 60px
    }

    .slider-bg {
        min-height: 520px
    }

    .slider-active .slick-dots {
        right: 4%
    }

    .about-img-wrap img:nth-child(2) {
        width: 290px;
        height: 290px
    }

    .about-content, .about-content-three, .about-content-two, .video-content {
        margin-top: 50px
    }

    .about-content .section-title {
        margin-bottom: 40px
    }

    .about-content .section-title .title span svg {
        bottom: -20px
    }

    .services-area .section-title, .team-area .section-title, .team-details-img, .work-area .section-title-two {
        margin-bottom: 50px
    }

    .banner-content-two p, .footer-logo-area {
        margin-bottom: 30px
    }

    .services-area .section-title .title span svg {
        bottom: -22px
    }

    .services-item {
        padding: 30px
    }

    .services-content-top .title {
        font-size: 22px
    }

    .counter-inner {
        border-radius: 50px
    }

    .swiper-container.project-active {
        margin-right: -100px
    }

    .testimonial-item {
        padding: 30px 25px
    }

    .footer-social-menu .list-wrap {
        gap: 30px
    }

    .footer-bottom-menu .list-wrap {
        gap: 35px
    }

    .footer-bottom-menu .list-wrap li::before {
        right: -20px
    }

    .footer-logo-area {
        padding-bottom: 30px
    }

    .banner-bg {
        padding: 120px 0 170px
    }

    .introduction-img-wrap img:first-child {
        max-width: 100%;
        max-height: unset
    }

    .introduction-content {
        margin-left: 0;
        margin-top: 50px
    }

    .introduction-bottom {
        gap: 15px 35px
    }

    .services-content-three {
        margin: -90px 20px 0;
        padding: 50px 20px 35px
    }

    .services-content-three .icon {
        width: 65px;
        height: 65px;
        font-size: 20px;
        left: 25px;
        top: -35px
    }

    .faq-img {
        margin-top: 50px
    }

    .project-area-two .section-title-two {
        text-align: center;
        margin-bottom: 30px
    }

    .project-item-two.big-item .project-thumb-two img {
        height: 280px;
        object-fit: cover;
        width: 100%
    }

    .header-style-two .menu-area .mobile-nav-toggler, .menu-area.menu-style-three .mobile-nav-toggler {
        margin-top: 9px
    }

    .banner-bg-two::before {
        width: 100%;
        height: 100%
    }

    .banner-content-two {
        padding: 0
    }

    .banner-bg-two {
        min-height: 600px
    }

    .banner-content-two .list-wrap {
        width: 100%;
        margin: 0 auto 40px;
        gap: 20px;
        justify-content: center
    }

    .banner-content-two .list-wrap li {
        width: auto
    }

    .banner-content-two .banner-content-bottom .banner-contact .content span {
        text-align: left
    }

    .services-thumb-four img, .shop-details-content, .shop-thumb img, .work-content p {
        width: 100%
    }

    .video-img-wrap img:first-child {
        max-width: 100%;
        max-height: 100%
    }

    .breadcrumb-content .breadcrumb-item, .rc-post-item .content .title, .video-content .list-wrap .list-item a {
        font-size: 18px
    }

    .team-thumb-two {
        width: 250px;
        height: 250px
    }

    .footer-info-inner {
        padding: 40px 50px 10px
    }

    .banner-content-three {
        margin-top: 40px
    }

    .banner-bg-three::before {
        height: 100%;
        clip-path: none;
        background: #000;
        opacity: .5;
        bottom: 0
    }

    .banner-content-three p {
        margin-bottom: 25px
    }

    .banner-content-three .title {
        font-size: 60px
    }

    .banner-bg-three {
        padding: 80px 0 120px
    }

    .about-img-wrap-two {
        padding-bottom: 80px
    }

    .faq-img-two {
        margin-bottom: 50px
    }

    .menu-area.menu-style-four .mobile-nav-toggler {
        margin-top: 10px
    }

    .breadcrumb-content .title {
        font-size: 38px
    }

    .breadcrumb-bg {
        padding: 85px 0
    }

    .blog-sidebar {
        margin-top: 100px
    }

    .blog-sidebar .widget {
        padding: 35px 30px
    }

    .contact-content {
        padding: 50px 30px
    }

    #contact-map {
        height: 500px
    }

    .shop-details-images-wrap {
        width: 80%;
        margin: 0 0 50px
    }

    .team-details-img img {
        width: 100%;
        height: 420px;
        object-fit: cover
    }

    .estimate-form {
        padding: 50px 40px;
        margin-left: 0
    }

    .project-info-wrap {
        padding: 35px 30px;
        width: 300px;
        right: 50px
    }

    .more-project-wrap > .title, .project-details-content .title {
        font-size: 34px
    }

    .services-sidebar .download-wrap a {
        font-size: 20px
    }

    .services-sidebar .download-wrap {
        padding: 55px 30px
    }

    .services-cat-list .list-wrap li a, .services-cat-list .title {
        padding: 15px 30px
    }

    .services-content-three .icon svg {
        width: 22px
    }
}

.slick-list, .slick-slider, .slick-track {
    position: relative;
    display: block
}

.slick-slider {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.slick-list {
    overflow: hidden;
    margin: 0;
    padding: 0
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand
}

.slick-slider .slick-list, .slick-slider .slick-track {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.slick-track {
    top: 0;
    left: 0;
    margin-left: auto;
    margin-right: auto
}

.slick-track:after, .slick-track:before {
    display: table;
    content: ''
}

.slick-track:after {
    clear: both
}

.slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px
}

[dir=rtl] .slick-slide {
    float: right
}

.slick-initialized .slick-slide, .slick-slide img {
    display: block
}

.slick-slide.dragging img {
    pointer-events: none
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent
}
