@charset "UTF-8";
/************ TABLE OF CONTENTS ***************

		01. Common CSS
		02. Header CSS 
		03. Sidebar CSS
		04. Banner CSS
		05. Services CSS
		06. About Us CSS
		07. CTA CSS
		08. Work Process CSS
		09. Testimonial CSS
		10. Brand CSS
		11. Price CTA CSS
		12. Blog CSS
		13. Team CSS
		14. Accordion CSS
		15. Contact CSS
		16. Portfolio CSS
		17. Approach CSS
		18. Mission CSS
		19. Pricing CSS
		20. footer CSS


**********************************************/

/*

/*----------------------------------------
    01. common CSS
----------------------------------------*/

@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;500;600;700&family=Roboto:wght@400;500&display=swap");
html,
body {
    scroll-behavior: smooth;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: var(--clr-common-text);
    line-height: 26px;
}

a {
    text-decoration: none;
}

.w-img img {
    width: 100%;
}

.m-img img {
    max-width: 100%;
}

a,
.btn,
button,
span,
p,
i,
input,
select,
textarea,
li,
img,
svg path,
*::after,
*::before,
.transition-5,
h1,
h2,
h3,
h4,
h5,
h6 {
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

input {
    outline: 0;
}

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

a:focus,
a:hover {
    color: inherit;
    text-decoration: none;
}

a,
button {
    color: inherit;
    outline: none;
    border: none;
    background: transparent;
}

button:hover {
    cursor: pointer;
}

button:focus {
    outline: 0;
    border: 0;
}

.uppercase {
    text-transform: uppercase;
}

.capitalize {
    text-transform: capitalize;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Oswald", sans-serif;
    color: #039746;
    margin-top: 0px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.3px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

h1 {
    font-size: 80px;
}

h2 {
    font-size: 50px;
}

h3 {
    font-size: 30px;
}

h4 {
    font-size: 20px;
}

h5 {
    font-size: 16px;
}

h6 {
    font-size: 14px;
}

ul {
    margin: 0px;
    padding: 0px;
}

li {
    list-style: none;
}

p {
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: var(--clr-common-text);
    margin-bottom: 15px;
    line-height: 26px;
}

a:hover {
    color: var(--clr-common-color-red);
}

*::-moz-selection {
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
    text-shadow: none;
}

::-moz-selection {
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
    text-shadow: none;
}

::selection {
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
    text-shadow: none;
}

/*-----------------------------------------
    - Input Placeholder
-----------------------------------------*/

*::-moz-placeholder {
    color: var(--clr-common-placeholder);
    font-size: 16px;
    opacity: 1;
    text-transform: uppercase;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
}

*::placeholder {
    color: var(--clr-common-placeholder);
    font-size: 16px;
    opacity: 1;
    text-transform: uppercase;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
}

/*-----------------------------------------
    - Common Classes
-----------------------------------------*/

.fix {
    overflow: hidden;
}

.clear {
    clear: both;
}

.f-left {
    float: left;
}

.f-right {
    float: right;
}

.t-right {
    text-align: right;
}

.z-index-1 {
    z-index: 1;
}

.z-index-11 {
    z-index: 11;
}

.lh-1 {
    line-height: 1;
}

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

.p-relative {
    position: relative;
}

.p-absolute {
    position: absolute;
}

.pos-rel {
    position: relative;
}

.pos-abs {
    position: absolute;
}

.content-para {
    margin-bottom: 10px;
}

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

/*------------------------------------------
    - Background color
-----------------------------------------*/

.theme-bg {
    background: var(--clr-theme-1);
}

.red-bg {
    background: var(--clr-common-color-red);
}

.grey-bg {
    background: var(--clr-bg-gray);
}

.grey-bg-2 {
    background: var(--clr-bg-gray-2);
}

.grey-bg-3 {
    background: var(--clr-bg-gray-3);
}

.grey-bg-4 {
    background: var(--clr-bg-gray-4);
}

.green-bg {
    background: #039746;
}

.pink-bg {
    background: var(--clr-common-black);
}

.white-bg {
    background: var(--clr-common-white);
}

.black-bg {
    background: var(--clr-common-black);
}

.footer-bg-1 {
    background: var(--clr-theme-1);
}

/*---------------------------------------
    - color
-----------------------------------------*/

.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white p,
.text-white span,
.text-white li,
.text-white a {
    color: var(--clr-common-white) !important;
}

.white-color {
    color: var(--clr-common-white);
}

.theme-color {
    color: var(--clr-common-black) !important;
}

.black-color {
    color: var(--clr-common-black);
}

.body-overlay {
    background-color: rgba(0, 0, 0, 0.5);
    height: 100%;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 900;
    left: 0;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.body-overlay:hover {
    cursor: pointer;
}

.body-overlay.opened {
    opacity: 1;
    visibility: visible;
}

@media (max-width: 575px) {
    .progress-wrap {
        right: 15px;
        bottom: 15px;
    }
}

.play-btn {
    width: 120px;
    height: 120px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    line-height: 120px;
    color: var(--clr-theme-1);
    display: inline-block;
    text-align: center;
    font-size: 18px;
    animation: pulse 2s infinite;
}

.play-btn:hover {
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
}

.play-btn-white {
    background: var(--clr-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px) {
    .play-btn {
        width: 95px;
        height: 95px;
        line-height: 95px;
    }
}

@media (max-width: 575px) {
    .play-btn {
        width: 80px;
        height: 80px;
        line-height: 80px;
        font-size: 16px;
    }
}

@media (max-width:450px) {
    .play-btn {
        width: 70px;
        height: 70px;
        line-height: 70px;
    }
}

/* pulse btn */

.pulse-btn {
    display: inline-block;
    width: 80px;
    height: 80px;
    line-height: 84px;
    text-align: center;
    background-color: var(--clr-common-white);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    color: var(--clr-common-black);
    animation: pulse 2s infinite;
}

.pulse-btn:hover {
    background-color: var(--clr-common-black);
    color: var(--clr-common-white);
}

.pulse-btn i {
    padding-left: 2px;
}

@-webkit-keyframes pulse {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    }
    70% {
        -webkit-box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}

@keyframes pulse {
    0% {
        -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    }
    70% {
        -moz-box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
        box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
    }
    100% {
        -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}

:root {
    /**
     @color declaration
     */
    --clr-common-white: #fff;
    --clr-common-black: #000;
    --clr-common-blue: #2785ff;
    --clr-common-heading: #2e3192;
    --clr-common-text: #777777;
    --clr-common-border: #eaebee;
    --clr-common-border-2: #F3F3F3;
    --clr-common-border-3: #a4abbc;
    --clr-common-border-4: #ebebeb;
    --clr-common-border-5: #3d5375;
    --clr-common-border-6: #575757;
    --clr-common-border-7: #214170;
    --clr-common-border-8: #395173;
    --clr-common-border-9: #e0e3ed;
    --clr-common-border-10: #ffffff12;
    --clr-common-placeholder: #bcbcbc;
    --clr-common-color-red: #db1c29;
    --clr-common-color-red-2: #bc101c;
    --clr-common-color-red-3: #d51b28;
    --clr-common-color-1: #8a9db9;
    --clr-common-color-2: #012863;
    --clr-common-color-3: #999999;
    --clr-common-color-4: #99abc6;
    --clr-common-color-5: #113771;
    --clr-common-color-6: #7e94b5;
    --clr-common-color-7: #001f4f;
    --clr-common-color-8: #8799b4;
    --clr-common-color-9: #465e82;
    --clr-common-color-10: #a2b0c7;
    --clr-common-color-11: #607696;
    --clr-common-color-12: #f2f2f2;
    --clr-common-color-13: #08306c;
    --clr-common-color-14: #f09aa0;
    --clr-common-color-15: #ffefef;
    --clr-common-color-16: #ffffff17;
    --clr-common-color-17: #99abc61c;
    --clr-common-color-18: #f1f1f1;
    --clr-common-color-19: #eeeeee;
    --clr-common-color-20: #d4d4d4;
    --clr-common-color-21: #f5f6f9;
    --clr-common-color-22: #eeeeee1f;
    --clr-common-gray: #f8f8f8;
    --clr-common-placeholder-color: #bcbcbc;
    --clr-common-input-border: #f6f6f6;
    --clr-common-gradient: linear-gradient(to left, #db1c29, #db1c29);
    --clr-theme-1: #2e3192;
    --clr-theme-2: #fb5050;
    --clr-bg-gray: #f3f4f6;
    --clr-bg-gray-2: #f5f5f5;
    --clr-bg-gray-3: #f8f8f8;
    --clr-bg-gray-4: #f7f7f7;
    --clr-bg-gray-5: #f7f7f780;
    --clr-bg-black: #000;
    --clr-bg-footer: #f6f6f6;
}

.bg-gray {
    background-color: var(--clr-bg-gray);
}

.fill-btn {
    font-size: 16px;
    color: var(--clr-common-white);
    font-weight: 600;
    background: var(--clr-common-color-red);
    height: 60px;
    display: inline-flex;
    line-height: 60px;
    padding: 0 38px;
    position: relative;
    overflow: hidden;
    text-align: center;
    text-transform: uppercase;
    font-family: "Oswald", sans-serif;
}

.fill-btn:hover {
    color: var(--clr-common-white);
    background: #039746;
}

.fill-btn-white {
    background: var(--clr-common-white);
    color: #039746;
}

.fill-lg-btn {
    padding: 0 50px;
}

.fill-xl-btn {
    padding: 0 53px;
}

.fill-border-btn {
    background: transparent;
    border: 2px solid var(--clr-common-white);
}

.border-btn {
    font-size: 16px;
    color: var(--clr-common-white);
    font-weight: 600;
    background: transparent;
    border: 1px solid var(--clr-common-white);
    height: 60px;
    display: inline-block;
    line-height: 58px;
    padding: 0 43px;
    position: relative;
    overflow: hidden;
    text-align: center;
    text-transform: uppercase;
}

.border-btn-lg {
    padding: 0 50px;
}

.border-btn-xl {
    padding: 0 53px;
}

.border-btn:hover {
    color: var(--clr-common-white);
    background: #039746;
}

.clip-btn {
    clip-path: polygon(11% 0, 100% 0, 89% 100%, 0 100%);
}

.clip-sm-btn {
    clip-path: polygon(2% 0, 100% 0, 98% 100%, 0 100%);
}

.clip-md-btn {
    clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%);
}

.skew-btn {
    background: transparent;
    height: 60px;
    padding: 0px 55px;
    line-height: 60px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--clr-common-white);
    font-family: "Oswald", sans-serif;
    position: relative;
    display: inline-flex;
    z-index: 2;
}

.skew-btn::before {
    position: absolute;
    content: "";
    width: calc(100% - 20px);
    height: 100%;
    border: 2px solid var(--clr-common-border-2);
    -webkit-transform: skew(-18deg);
    -moz-transform: skew(-18deg);
    -ms-transform: skew(-18deg);
    transform: skew(-18deg);
    z-index: -1;
    left: 10px;
}

.skew-btn:hover {
    color: #039746;
}

.skew-btn:hover::before {
    background: var(--clr-common-white);
    border-color: var(--clr-common-white);
}

.btn-round {
    -webkit-box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.1);
    width: 60px;
    height: 60px;
    line-height: 60px;
    display: inline-block;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    color: #039746;
    font-size: 18px;
    background: var(--clr-common-white);
}

.bounce {
    -moz-animation: bounce 3s infinite;
    -webkit-animation: bounce 3s infinite;
    animation: bounce 3s infinite;
}

.border-tb {
    border-top: 1px solid var(--clr-common-border-2);
    border-bottom: 1px solid var(--clr-common-border-2);
}

.overlay {
    position: relative;
    z-index: 1;
}

.overlay::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: var(--clr-common-color-red);
    mix-blend-mode: multiply;
}

.section__title .sub-title,
.section__title span {
    color: var(--clr-common-color-red-3);
    text-transform: uppercase;
    margin-bottom: 14px;
    display: block;
    font-weight: 400;
    font-size: 16px;
    font-family: "Oswald", sans-serif;
    line-height: 1;
    margin-top: -2px;
}

.section__title .sub-title.white,
.section__title span.white {
    color: var(--clr-common-white);
}

.section__title .title {
    font-size: 50px;
    margin-bottom: 0;
}

.section__title .title-sm {
    font-size: 30px;
}

@media (max-width: 575px) {
    .section__title .title-sm {
        font-size: 26px;
    }
}

.section__title .title.white {
    color: var(--clr-common-white);
}

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

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
    .section__title .title {
        font-size: 34px;
    }
    .section__title .title br {
        display: none;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .section__title .title {
        font-size: 34px;
    }
    .section__title .title br {
        display: none;
    }
}

@media (max-width:450px) {
    .section__title .title {
        font-size: 28px;
    }
}

.lh-1 {
    line-height: 1;
}

.clip-box {
    clip-path: polygon(4% 0, 100% 0, 96% 100%, 0 100%);
}

.clip-box-common {
    position: relative;
    background: transparent;
    z-index: 2;
}

.clip-box-common::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--clr-common-white);
    z-index: -1;
}

.clip-box-xxs {
    clip-path: polygon(1.4% 0, 100% 0, 98.6% 100%, 0 100%);
}

.clip-box-xs {
    clip-path: polygon(1.5% 0, 100% 0, 98.5% 100%, 0 100%);
}

.clip-box-sm {
    clip-path: polygon(7% 0, 100% 0, 93% 100%, 0 100%);
}

.clip-box-md {
    clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%);
}

.clip-box-md-before {
    clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%);
}

.clip-box-lg-before {
    clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%);
}

.clip-box-sm-before {
    clip-path: polygon(2% 0, 100% 0, 98% 100%, 0 100%);
}

.mt--35 {
    margin-top: -35px;
}

.mt--40 {
    margin-top: -40px;
}

.mt--45 {
    margin-top: -45px;
}

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

.mt--60 {
    margin-top: -60px;
}

.mt--62 {
    margin-top: -62px;
}

.mt--85 {
    margin-top: -85px;
}

.mt--65 {
    margin-top: -65px;
}

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

.hr1 {
    border-bottom: 1px solid #dcdcdc;
}

.breadcrumb-spacing {
    padding: 70px 0px;
    background-size: cover;
    position: relative;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: 2;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .breadcrumb-spacing {
        padding: 80px 0;
    }
}

.breadcrumb-spacing::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #012863c4 0%, rgba(1, 40, 99, 0.6) 100%);
    z-index: -1;
}

.breadcrumb-menu li {
    display: inline-block;
    padding: 0 15px;
    position: relative;
}

.breadcrumb-menu li span {
    color: var(--clr-common-white);
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
}

.breadcrumb-menu li a:hover span {
    color: var(--clr-common-color-red);
}

.breadcrumb-menu li:not(:last-child)::after {
    display: inline-block;
    color: var(--clr-common-white);
    content: "";
    position: absolute;
    right: -6px;
    top: 0px;
    font-family: "Font Awesome 5 Pro";
}

.page-title {
    color: var(--clr-common-white);
    font-size: 60px;
    font-weight: 700;
    font-family: "Oswald", sans-serif;
    line-height: 1;
    text-transform: uppercase;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .page-title {
        font-size: 50px;
        margin-bottom: 20px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .page-title {
        font-size: 45px;
        margin-bottom: 10px;
    }
}

@media (max-width:450px) {
    .page-title {
        font-size: 35px;
    }
}

.vert-move {
    -webkit-animation: mover 1s infinite alternate;
    animation: mover 1s infinite alternate;
}

@-webkit-keyframes mover {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    100% {
        -webkit-transform: translateY(-50px);
        -moz-transform: translateY(-50px);
        -ms-transform: translateY(-50px);
        transform: translateY(-50px);
    }
}

@keyframes mover {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    100% {
        -webkit-transform: translateY(-50px);
        -moz-transform: translateY(-50px);
        -ms-transform: translateY(-50px);
        transform: translateY(-50px);
    }
}

.hori-move {
    -webkit-animation: mover 1s infinite alternate;
    animation: mover-hori 1s infinite alternate;
}

@-webkit-keyframes mover-hori {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    100% {
        -webkit-transform: translateX(-50px);
        -moz-transform: translateX(-50px);
        -ms-transform: translateX(-50px);
        transform: translateX(-50px);
    }
}

@keyframes mover-hori {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    100% {
        -webkit-transform: translateX(-50px);
        -moz-transform: translateX(-50px);
        -ms-transform: translateX(-50px);
        transform: translateX(-50px);
    }
}

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

.row {
    --bs-gutter-x: 30px;
}

@media (min-width: 1400px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1320px;
    }
}

/*----------------------------------------
    02. Header CSS
----------------------------------------*/

.header__top {
    background: var(--clr-theme-1);
}

.header__text {
    color: var(--clr-common-color-1);
}

.header__text span {
    font-family: "Oswald", sans-serif;
    font-weight: 400;
}

.header__text span b {
    color: var(--clr-common-white);
    font-weight: 600;
    font-family: "Oswald", sans-serif;
}

.header__social-link {
    padding: 6px 20px;
    background: var(--clr-common-color-red);
    display: inline-block;
}

.header__social-link li {
    display: inline-block;
    margin-right: 13px;
}

.header__social-link li:last-child {
    margin-right: 0;
}

.header__social-link li a {
    color: var(--clr-common-white);
    font-size: 14px;
}

.header__social-link li:hover a {
    color: var(--clr-common-color-2);
}

.header__info {
    padding: 17px 0;
    display: flex;
    justify-content: end;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px),
only screen and (min-width: 576px) and (max-width: 767px) {
    .header__info {
        display: none;
    }
}

.header__info-item {
    display: flex;
    margin-right: 38px;
    margin-bottom: 15px;
}

.header__info-item:last-child {
    margin-right: 0;
}

.header__info-icon {
    margin-right: 10px;
}

.header__info-icon i {
    font-size: 26px;
    color: var(--clr-common-color-red);
}

.header__info-text {
    line-height: 1;
}

.header__info-text span {
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 5px;
    display: block;
    color: var(--clr-common-color-3);
    font-family: "Oswald", sans-serif;
}

.header__info-text h5 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0px;
}

.header__toggle-btn {
    cursor: pointer;
    margin-top: 9px;
}

.header__bar {
    display: inline-block;
}

.header__bar span {
    width: 30px;
    height: 3px;
    background: #039746;
    display: block;
    margin: 5px 0;
}

.header__bar span:nth-child(2) {
    width: 25px;
}

.header__bar:hover span {
    width: 30px;
}

.header__transparent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    display: block;
    z-index: 500;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .header__bottom-wrapper {
        padding: 18px 0;
    }
}

.header__two-space {
    padding: 17px 0 0 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .header__two {
        padding: 18px 0px;
    }
}

.header__two-btn .fill-btn {
    padding: 0 43px;
}

.header__two-space.menu-sticky.sticky {
    padding: 0;
}

.header__top-3 {
    padding: 0 15px;
    line-height: 1;
}

.header__top-3-text {
    padding: 13px 35px 12px 30px;
    margin-right: -125px;
    margin-left: 0px;
    clip-path: polygon(1.4% 0, 100% 0, 98.6% 100%, 0 100%);
}

@media only screen and (min-width: 1800px) and (max-width: 1850px) {
    .header__top-3-text {
        margin-right: -110px;
        clip-path: polygon(1.6% 0, 100% 0, 98.4% 100%, 0 100%);
    }
}

@media only screen and (min-width: 1600px) and (max-width: 1799px) {
    .header__top-3-text {
        margin-right: -75px;
        clip-path: polygon(1.6% 0, 100% 0, 98.4% 100%, 0 100%);
    }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .header__top-3-text {
        margin-right: -30px;
        margin-left: 0px;
        clip-path: polygon(1.6% 0, 100% 0, 98.4% 100%, 0 100%);
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .header__top-3-text {
        margin-right: -95px;
        margin-left: 0px;
        clip-path: polygon(1.6% 0, 100% 0, 98.4% 100%, 0 100%);
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .header__top-3-text {
        margin-right: -40px;
        margin-left: 0px;
        clip-path: polygon(2.6% 0, 100% 0, 97.4% 100%, 0 100%);
    }
}

.header__top-3-link {
    text-align: right;
}

.header__top-3-link li {
    display: inline-block;
    margin-left: 15px;
}

.header__top-3-link li a {
    color: var(--clr-common-white);
}

.header__top-3-link li:hover a {
    color: var(--clr-common-color-red);
}

.header__top-3-btn .fill-btn {
    height: 43px;
    line-height: 38px;
    padding: 0 43px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .header__top-3 {
        display: none;
    }
}

.header__bottom-3-wrapper {
    display: flex;
    justify-content: end;
}

.header__bottom-3-text h5 {
    margin-bottom: 0;
}

.header__bottom-3-item {
    display: flex;
    align-items: center;
    margin-right: 30px;
}

.header__bottom-3-info {
    display: flex;
    align-items: center;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
    .header__bottom-3-info {
        display: none;
    }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .header__bottom-3-info .header__bottom-3-item:first-child {
        display: none;
    }
}

.header__bottom-3-ecom {
    display: flex;
    align-items: center;
    margin-left: 20px;
}

.header__bottom-3-ecom div {
    position: relative;
    padding-left: 25px;
}

.header__bottom-3-ecom div::before {
    content: "";
    position: absolute;
    top: 50%;
    width: 1px;
    height: 20px;
    background: var(--clr-common-border-3);
    left: 11px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.header__bottom-3-ecom div i {
    color: #039746;
}

.header__bottom-3-ecom div:hover i {
    color: var(--clr-common-color-red);
}

.header__bottom-3-icon {
    color: var(--clr-common-color-red);
    font-size: 28px;
}

.header__bottom-3-squre.sidebar-toggle-btn a {
    padding-top: 5px;
    display: inline-block;
}

.header__bottom-3 {
    padding: 0 16px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .header__bottom-3.sticky {
        padding: 18px 10px;
    }
}

.logo-transform {
    -webkit-transform: translateY(7px);
    -moz-transform: translateY(7px);
    -ms-transform: translateY(7px);
    transform: translateY(7px);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .logo-transform {
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        transform: translateY(0px);
    }
}

.menu-area.position {
    position: absolute;
    bottom: -45px;
    z-index: 100;
    width: 100%;
    right: 0;
}

.main-menu ul li {
    position: relative;
    display: inline-block;
    margin-right: 59px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .main-menu ul li {
        margin-right: 50px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .main-menu ul li {
        margin-right: 35px;
    }
}

.main-menu ul li:last-child {
    margin-right: 0;
}

.main-menu ul li a {
    font-size: 15px;
    color: var(--clr-common-white);
    font-weight: 600;
    padding: 17px 0;
    display: block;
    text-transform: uppercase;
    font-weight: 600;
    font-family: "Oswald", sans-serif;
}

.main-menu ul li .sub-menu {
    background: var(--clr-common-white) none repeat scroll 0 0;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
    left: 0;
    opacity: 0;
    position: absolute;
    top: 120%;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    visibility: hidden;
    width: 240px;
    z-index: 9;
    border-top: 4px solid #039746;
    text-align: left;
    padding: 20px;
}

.main-menu ul li .sub-menu li {
    display: block;
    margin-bottom: 7px;
}

.main-menu ul li .sub-menu li:last-child {
    margin-bottom: 0px;
}

.main-menu ul li .sub-menu li:hover {
    padding-left: 10px;
}

.main-menu ul li .sub-menu li:hover a {
    color: var(--clr-common-color-red);
}

.main-menu ul li .sub-menu li a {
    color: #039746;
    padding: 0;
}

.main-menu ul li:hover>a {
    color: #ffffff8f;
}

.main-menu ul li:hover>.sub-menu {
    opacity: 1;
    visibility: visible;
    top: 100%;
}

.main-menu ul li:hover>.sub-menu li:hover>.sub-menu {
    top: 0;
}

.main-menu-1 {
    padding-left: 50px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .main-menu-1 {
        padding-left: 40px;
    }
    .main-menu-1 ul li a {
        font-size: 15px;
    }
}

.main-menu-2 ul li {
    margin: 0 29px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .main-menu-2 ul li {
        margin: 0 16px;
    }
}

.main-menu-2 ul li a {
    color: #039746;
}

.main-menu-2 ul li ul li {
    margin: 0;
}

.main-menu-3 {
    margin-left: -63px;
}

@media only screen and (min-width: 1800px) and (max-width: 1850px) {
    .main-menu-3 {
        margin-left: -42px;
    }
}

@media only screen and (min-width: 1600px) and (max-width: 1799px) {
    .main-menu-3 {
        margin-left: -2px;
    }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .main-menu-3 {
        text-align: center;
        margin-left: 0;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .main-menu-3 {
        margin-left: 0;
        text-align: center;
    }
}

.main-menu-3 ul li {
    margin-right: 60px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .main-menu-3 ul li {
        margin-right: 40px;
    }
}

.main-menu-3 ul li a {
    color: #039746;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
screen and (max-width: 575px) {
    .menu-none {
        display: none !important;
    }
}

.menu-bg {
    background: transparent;
    position: relative;
    margin-left: 20px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .menu-bg {
        margin-left: 80px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .menu-bg {
        margin-left: 65px;
    }
}

.menu-bg::before {
    content: "";
    position: absolute;
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 1% 100%);
    left: 0;
    right: 0;
    top: 0;
    background: var(--clr-common-color-red);
    width: 100%;
    height: 100%;
    z-index: -1;
}

.menu-btn a {
    background: var(--clr-common-color-red-2);
    display: block;
    padding: 17px 40px;
    text-transform: uppercase;
    color: var(--clr-common-white);
    font-weight: 600;
    font-family: "Oswald", sans-serif;
    display: inline-block;
}

.menu-btn a:hover {
    background: #039746;
    color: var(--clr-common-white);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .menu-sticky.sticky {
        padding: 18px 0;
    }
}

.menu-sticky .main-menu-1 {
    margin: auto;
    padding-left: 0;
}

.menu-sticky ul li a {
    color: #039746;
    padding: 32px 0;
}

.menu-sticky ul li:hover a {
    color: var(--clr-common-color-red);
}

.menu-hidden {
    opacity: 0;
    visibility: hidden;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
}

.sticky {
    position: fixed;
    top: 0;
    background: var(--clr-common-white);
    z-index: 800;
    right: 0;
    left: 0;
    width: 100%;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    box-shadow: 0 0 60px 0 rgba(53, 57, 69, 0.15);
    animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    border: none;
    opacity: 1;
    visibility: visible;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .header__two.menu-sticky.sticky {
        padding: 18px 0px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px),
(max-width:450px) {
    .header__bottom.menu-sticky {
        padding: 10px 0;
    }
}

.menu-sticky.sticky.menu-area {
    margin-top: 0 !important;
}

.menu-sticky.sticky .logo {
    display: block !important;
}

.menu-sticky.sticky .menu-bg {
    position: inherit;
}

.menu-sticky.sticky .menu-bg::before {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}

.menu-sticky.sticky .main-menu li a {
    padding: 32px 0;
    display: block;
}

.menu-sticky.sticky .main-menu li li a {
    padding: 0px;
}

.menu-sticky.sticky .menu-btn a {
    padding: 15px 40px;
}

.header__bottom-3 .logo img {
    margin-top: 0px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .header__bottom-3 .logo img {
        margin-top: 0px;
    }
}

.header__bottom-3.sticky .logo img {
    margin-top: 0px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .header__bottom-3.sticky .logo img {
        margin-top: 0px;
    }
}

.header__bottom-3.menu-sticky ul li a {
    padding: 27px 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .header__bottom-3 {
        padding: 18px 10px;
    }
}

/*----------------------------------------
    03. Sidebar CSS
----------------------------------------*/

.sidebar__area {
    position: fixed;
    right: -485px;
    top: 0;
    width: 445px;
    height: 100%;
    background: var(--clr-common-white) none repeat scroll 0 0;
    overflow-y: scroll;
    -webkit-box-shadow: -5px 0 20px -5px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: -5px 0 20px -5px rgba(0, 0, 0, 0.5);
    box-shadow: -5px 0 20px -5px rgba(0, 0, 0, 0.5);
    z-index: 999;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .sidebar__area {
        width: 315px;
    }
}

.sidebar__area.sidebar-opened {
    right: 0px;
}

.sidebar__wrapper {
    position: relative;
    padding: 45px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .sidebar__wrapper {
        padding: 20px;
    }
}

.sidebar__close {
    position: absolute;
    right: 45px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .sidebar__close {
        right: 20px;
    }
}

.sidebar__close-btn {
    display: inline-block;
    font-size: 16px;
    height: 45px;
    width: 45px;
    line-height: 46px;
    color: var(--clr-common-white);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    background: #039746;
}

.sidebar__close-btn:hover {
    background: var(--clr-common-color-red);
    color: var(--clr-common-white);
}

.sidebar__search {
    position: relative;
}

.sidebar__search input {
    width: 100%;
    height: 50px;
    line-height: 40px;
    padding-right: 20px;
    background: var(--clr-theme-1);
    border: none;
    outline: none;
    color: var(--clr-common-white);
    font-size: 14px;
    padding: 0px 45px 0 20px;
    display: block;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

.sidebar__search button {
    position: absolute;
    top: 50%;
    right: 20px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 14px;
    color: var(--clr-common-white);
}

.sidebar__search .single-input-field {
    margin-bottom: 0;
}

.sidebar__social ul li {
    display: inline-block;
}

.sidebar__social ul li :not(:last-child) {
    margin-right: 5px;
}

.sidebar__social ul li a {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 42px;
    text-align: center;
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.sidebar__social ul li:hover a {
    background: var(--clr-common-color-red);
}

.mean-container .mean-bar {
    padding: 0;
    min-height: auto;
    background: none;
}

.mean-container .mean-nav {
    background: none;
    margin-top: 0;
}

.mean-container .mean-nav ul {
    display: block;
}

.mean-container .mean-nav ul li a {
    display: block;
    float: left;
    width: 90%;
    padding: 10px 5%;
    margin: 0;
    text-align: left;
    color: var(--clr-common-white);
    border-top: 1px solid var(--clr-common-border-9);
    text-decoration: none;
    text-transform: uppercase;
    color: #039746;
    font-weight: 600;
    font-family: "Oswald", sans-serif;
}

.mean-container .mean-nav ul li a.mean-expand.mean-clicked i {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    color: #039746;
}

.mean-container .mean-nav>ul {
    padding: 0;
    margin: 0;
    width: 100%;
    list-style-type: none;
    display: block !important;
}

.mean-container .mean-nav>ul>li:first-child>a {
    border-top: 1px solid transparent;
}

.mean-container a.meanmenu-reveal span {
    display: none;
}

.sidebar__contact {
    margin-bottom: 10px;
}

.sidebar__info-item {
    margin-bottom: 30px;
    display: flex;
    align-items: center;
}

.sidebar__info-icon {
    font-size: 35px;
    color: var(--clr-common-color-red);
    margin-right: 25px;
}

@media (max-width:450px) {
    .sidebar__info-icon {
        font-size: 30px;
    }
}

.sidebar__info-text span {
    color: var(--clr-common-text);
    margin-bottom: 2px;
    display: block;
    font-weight: 400;
    font-family: "Oswald", sans-serif;
}

.sidebar__info-text h5 {
    color: #039746;
    font-size: 20px;
}

/*----------------------------------------
    05. Banner CSS
----------------------------------------*/

.banner-830 {
    min-height: 830px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
    .banner-830 {
        min-height: 760px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
    .banner-830 {
        min-height: 550px;
        display: flex;
        align-items: center;
    }
}

@media (max-width: 575px) {
    .banner-830 {
        min-height: 500px;
        display: flex;
        align-items: center;
    }
}

.banner-840 {
    min-height: 840px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .banner-840 {
        min-height: 650px;
    }
}

.banner-970 {
    min-height: 970px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .banner-970 {
        min-height: 620px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .banner-970 {
        min-height: 550px;
    }
}

.banner-overlay::before {
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #012863 0%, rgba(1, 40, 99, 0) 100%);
    top: 0;
    left: 0;
    content: "";
}

.banner-overlay-3::before {
    position: absolute;
    width: 100%;
    height: 100%;
    background: var(--clr-common-black);
    top: 0;
    left: 0;
    content: "";
    opacity: 0.302;
}

.banner-overlay-white {
    z-index: 2;
}

.banner-overlay-white::before {
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, #cacaca3d 0%, rgba(202, 202, 202, 0.8) 100%);
    top: 0;
    left: 0;
    content: "";
    z-index: 0;
}

.banner-content .banner-btn {
    display: flex;
    align-content: center;
    flex-wrap: wrap;
    gap: 20px 10px;
}

.banner-content .banner-btn .skew-btn {
    padding: 0 39px;
}

.banner-content .banner-btn .skew-btn:hover::before {
    border-color: var(--clr-common-white);
}

.banner-content .banner-btn .skew-btn::before {
    border-color: var(--clr-common-border-8);
}

.banner-content1 {
    padding-top: 167px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .banner-content1 {
        padding-top: 0px;
    }
}

.banner-content2 .banner-title {
    color: #039746;
}

.banner-content3-round1 {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background: var(--clr-common-color-2);
    position: absolute;
    left: 0;
    top: 0;
    width: 600px;
    height: 600px;
    right: 0;
    margin: auto;
    bottom: 0;
    z-index: -1;
    opacity: 0.902;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .banner-content3-round1 {
        width: 400px;
        height: 400px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .banner-content3-round1 {
        width: 300px;
        height: 300px;
    }
}

.banner-content3-round2 {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background: var(--clr-common-color-2);
    position: absolute;
    left: -31%;
    top: -70%;
    width: 100px;
    height: 100px;
    right: 0;
    margin: auto;
    bottom: 0;
    z-index: -1;
    opacity: 0.902;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .banner-content3-round2 {
        width: 80px;
        height: 80px;
    }
}

.slider__active-3 .slider-nav div {
    position: absolute;
    top: 0;
    left: 60px;
    display: inline-block;
    z-index: 100;
    width: 64px;
    height: 64px;
    line-height: 64px;
    text-align: center;
    bottom: 0;
    margin: auto;
    cursor: pointer;
    position: absolute;
    -webkit-transform: skew(-14deg);
    -moz-transform: skew(-14deg);
    -ms-transform: skew(-14deg);
    transform: skew(-14deg);
    background: transparent;
    border: 2px solid var(--clr-common-border-10);
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.slider__active-3 .slider-nav div i {
    color: var(--clr-common-white);
}

.slider__active-3 .slider-nav div.slider-button-next {
    left: auto;
    right: 60px;
}

.slider__active-3 .slider-nav div:hover {
    background: var(--clr-common-color-red);
    border: 2px solid var(--clr-common-color-red);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .slider__active-3 .slider-nav div {
        display: none;
    }
}

.banner-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: -1;
    background-color: var(--clr-common-white);
}

.banner-meta-text {
    margin-bottom: 10px;
}

@media (max-width:450px) {
    .banner-meta-text {
        margin-bottom: 5px;
    }
}

.banner-meta-text span {
    color: var(--clr-common-white);
    text-transform: uppercase;
    font-weight: 400;
    font-size: 20px;
    font-family: "Oswald", sans-serif;
}

@media (max-width:450px) {
    .banner-meta-text span {
        font-size: 16px;
    }
}

.banner-title {
    color: var(--clr-common-white);
    font-size: 80px;
    line-height: 1.12;
    margin-bottom: 42px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .banner-title {
        font-size: 60px;
    }
    .banner-title br {
        display: none;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .banner-title {
        font-size: 52px;
    }
    .banner-title br {
        display: none;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .banner-title {
        font-size: 42px;
    }
    .banner-title br {
        display: none;
    }
}

@media (max-width:450px) {
    .banner-title {
        font-size: 32px;
    }
    .banner-title br {
        display: none;
    }
}

.banner-btn .clip-btn {
    clip-path: polygon(12% 0, 100% 0, 88% 100%, 0 100%);
}

.banner-btn .border-btn {
    height: 60px;
    padding: 0 52px;
    line-height: 58px;
}

.banner-content1 {
    max-width: 1000px;
}

@media (max-width: 575px) {
    .banner-content1 {
        max-width: 400px;
    }
}

@media (max-width: 575px) {
    .banner-content2 {
        max-width: 400px;
    }
}

.banner-content2-3 {
    max-width: 780px;
    margin-left: auto;
}

@media (max-width: 575px) {
    .banner-content2-3 {
        max-width: 450px;
        margin-left: 0;
    }
}

.slider-pagination.slider1-pagination {
    position: absolute;
    right: 30px;
    top: 50%;
    display: flex;
    flex-direction: column;
    left: auto;
    width: inherit;
    z-index: 10;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 100%;
    justify-content: center;
    gap: 20px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .slider-pagination.slider1-pagination {
        display: none;
    }
}

.slider-pagination.slider1-pagination .swiper-pagination-bullet {
    width: 15px;
    height: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background: #039746;
    opacity: 1;
    margin-left: auto;
}

.slider-pagination.slider1-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 30px;
}

/*----------------------------------------
    05. Services CSS
----------------------------------------*/

.services-one .services__box {
    background: transparent;
    z-index: 200;
    position: relative;
    padding-top: 25px;
    padding-left: 40px;
    padding-right: 40px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .services-one .services__box {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .services-one .services__box {
        padding-top: 60px;
        padding-bottom: 13px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-one .services__box {
        padding-top: 55px;
        padding-bottom: 13px;
    }
}

.services-one .services__box--space {
    margin-top: -140px;
    position: relative;
    z-index: 100;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-one .services__box--space {
        margin-top: 0px;
    }
}

.services-one .services__box::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 98.5%;
    display: block;
    height: 10px;
    background: var(--clr-common-color-red);
    -webkit-transform: skew(-10deg);
    -moz-transform: skew(-10deg);
    -ms-transform: skew(-10deg);
    transform: skew(-10deg);
}

.services-one .services__box::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    background: var(--clr-common-white);
    width: 102%;
    height: 100%;
    z-index: -1;
    clip-path: polygon(2% 0, 100% 0, 98% 100%, 0% 100%);
}

.services-one .services__item {
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    padding: 0 15px;
}

.services-one .services__item-content {
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-one .services__item-content {
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        transform: translateY(0px);
        margin-bottom: 50px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .services-one .services__item {
        padding: 0 10px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .services-one .services__item {
        padding: 0 20px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-one .services__item {
        padding: 0 10px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-one .services__item {
        margin-bottom: 30px;
    }
}

.services-one .services__item-btn {
    text-align: center;
    margin-top: 25px;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-one .services__item-btn {
        opacity: 1;
        visibility: visible;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-one .services__item-btn {
        margin-top: 18px;
    }
}

.services-one .services__item-btn a {
    font-size: 14px;
    text-transform: uppercase;
    color: #039746;
    font-weight: 600;
    font-family: "Oswald", sans-serif;
}

.services-one .services__item-btn a:hover {
    color: var(--clr-common-color-red);
}

.services-one .services__item-icon {
    width: 133px;
    height: 133px;
    background: var(--clr-common-white);
    border: 4px solid transparent;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    margin: auto;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    font-size: 70px;
    color: var(--clr-common-color-red);
    padding-top: 30px;
    font-size: 60px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-one .services__item-icon {
        border: 0;
        width: unset;
        height: unset;
        margin-bottom: 30px;
        padding-top: 0px;
    }
}

.services-one .services__item:hover {
    -webkit-transform: translateY(-95px);
    -moz-transform: translateY(-95px);
    -ms-transform: translateY(-95px);
    transform: translateY(-95px);
}

.services-one .services__item:hover .services__item-icon {
    border: 4px solid var(--clr-common-color-red);
}

.services-one .services__item:hover .services__item-content {
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
}

.services-one .services__item:hover .services__item-btn {
    opacity: 1;
    visibility: visible;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-one .services__item:hover {
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        transform: translateY(0px);
    }
    .services-one .services__item:hover .services__item-icon {
        border: 0;
    }
    .services-one .services__item:hover .services__item-content {
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        transform: translateY(0px);
    }
    .services-one .services__item:hover .services__item-btn {
        opacity: 1;
        visibility: visible;
    }
}

.services-one .services__item-content h3 {
    margin-bottom: 20px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .services-one .services__item-content h3 {
        font-size: 26px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-one .services__item-content h3 {
        font-size: 22px;
    }
}

.services-one .services__item-content h3:hover {
    color: var(--clr-common-color-red);
}

.services-one .services__item-content p {
    margin-bottom: 0px;
    font-size: 14px;
    line-height: 24px;
}

.services-one .services__item-content-2 h3 {
    margin-bottom: 20px;
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
    .services__item-content {
        padding: 0 62px;
    }
}

@media (max-width: 575px) {
    .services__item-content {
        padding: 0 10px;
    }
}

.services-two-active {
    margin-right: -600px !important;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services__section .section__title {
        margin-bottom: 60px;
    }
}

.services-two {
    margin-left: 20px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-two {
        margin-left: 0px;
    }
}

.services-two .services__item {
    padding: 55px 50px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%);
    position: relative;
    background: var(--clr-common-white);
    z-index: 2;
}

.services-two .services__item h3 {
    margin-bottom: 23px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-two .services__item h3 {
        font-size: 25px;
    }
}

@media (max-width:450px) {
    .services-two .services__item h3 {
        font-size: 22px;
    }
}

.services-two .services__item h3:hover {
    color: var(--clr-common-color-red) !important;
}

.services-two .services__item p {
    font-size: 14px;
    margin-bottom: 0;
    line-height: 24px;
}

.services-two .services__item-icon {
    font-size: 72px;
    color: var(--clr-common-color-red);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-two .services__item {
        padding: 40px 30px 40px 30px;
    }
}

.services-two .services__item:hover {
    background: var(--clr-theme-1);
}

.services-two .services__item:hover h3 {
    color: var(--clr-common-white);
}

.services-two .services__item:hover p {
    color: var(--clr-common-color-10);
}

.services-two .services__item:hover-shape {
    opacity: 1;
    visibility: visible;
}

.services-two .services__item:hover .services__item-shape {
    opacity: 1;
    visibility: visible;
}

.services-two .services__item-shape {
    position: absolute;
    top: 0;
    left: 0;
    width: 190px;
    height: 190px;
    background: var(--clr-common-color-13);
    bottom: 0;
    right: 0;
    margin: auto;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.services-two-nav {
    display: flex;
    align-items: center;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services-two-nav {
        margin-bottom: 50px;
    }
}

.services-two-nav div {
    width: 80px;
    height: 60px;
    text-align: center;
    background: var(--clr-common-white);
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    color: #039746;
    cursor: pointer;
    clip-path: polygon(25% 0, 100% 0, 75% 100%, 0 100%);
    padding-top: 18px;
}

.services-two-nav div:hover {
    background: var(--clr-common-color-red);
}

.services-two-nav div:hover i {
    color: var(--clr-common-white);
}

@media (max-width: 575px) {
    .services-two-nav div {
        width: 60px;
        height: 50px;
        padding-top: 12px;
    }
}

.swiper-container {
    margin-right: 4px;
}

.services__3-item {
    background: var(--clr-common-white);
    position: relative;
    padding: 50px 50px 46px 50px;
    clip-path: polygon(7% 0, 100% 0, 93% 100%, 0 100%);
}

@media (max-width:450px) {
    .services__3-item {
        padding: 50px 30px 46px 30px;
    }
}

.services__3-item-num {
    padding: 28px 32px;
    background: var(--clr-common-color-15);
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    clip-path: polygon(7% 0, 100% 0, 93% 100%, 0 100%);
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

@media (max-width:450px) {
    .services__3-item-num {
        padding: 20px;
    }
}

.services__3-item-num h3 {
    color: #039746;
    line-height: 1;
    margin-bottom: 0;
}

.services__3-item-icon {
    margin-bottom: 35px;
    font-size: 70px;
    color: var(--clr-common-color-red);
}

.services__3-item-icon i {
    display: inline-block;
}

@media (max-width:450px) {
    .services__3-item-icon {
        font-size: 60px;
    }
}

.services__3-item-title {
    position: relative;
    margin-bottom: 16px;
    display: inline-block;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services__3-item-title {
        font-size: 24px;
    }
}

.services__3-item-title::before {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0%;
    height: 2px;
    background: #039746;
}

.services__3-item-text {
    margin-bottom: 0;
}

.services__3-item:hover .services__3-item-num {
    background: var(--clr-common-color-red);
}

.services__3-item:hover .services__3-item-num h3 {
    color: var(--clr-common-white);
}

.services__3-item:hover .services__3-item-icon i {
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
}

.services__3-item:hover .services__3-item-title::before {
    width: 100%;
}

@media (max-width: 575px) {
    .services-overview-space {
        margin-bottom: 20px;
    }
}

.services__details-img img,
.service__details-content img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0% 100%);
}

/*----------------------------------------
    06. About Us CSS
----------------------------------------*/

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .about__area-padding {
        padding-bottom: 55px;
    }
}

.about__content {
    padding-left: 150px;
    padding-right: 53px;
    line-height: 1;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .about__content {
        padding-left: 120px;
        padding-right: 20px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .about__content {
        padding-left: 60px;
        padding-right: 40px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__content {
        padding-left: 15px;
        padding-right: 0px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__content {
        padding-left: 0px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__content-tab-2 {
        margin-right: 0;
    }
}

.about__content-tab-2 li button {
    background: var(--clr-common-color-12);
    padding: 8px 41px;
    font-size: 16px;
    font-weight: 600;
    color: #039746;
    text-transform: uppercase;
    margin-bottom: 20px;
    font-family: "Oswald", sans-serif;
    clip-path: polygon(21px 0, 100% 0, calc(100% - 21px) 100%, 0 100%);
}

.about__content-tab-2 li button.active {
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__content-tab-2 li button {
        padding: 12px 30px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__content-tab-2 li button {
        padding: 12px 25px;
    }
}

.about__img img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0 100%);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__img img {
        width: 100%;
    }
}

.about__time-img {
    right: -135px;
    bottom: 60px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__time-img {
        width: 200px;
        right: -85px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__time-img {
        display: none;
    }
}

.about__btn-2 {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    text-align: center;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.about__img-2 {
    clip-path: polygon(3% 0, 100% 0, 97% 100%, 0% 100%);
}

.about__img-2 img {
    clip-path: polygon(3% 0, 100% 0, 97% 100%, 0% 100%);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__img-2 {
        margin-left: 0;
    }
}

.about__content-2 {
    padding-right: 10px;
}

.about__content-2 .section__title h2 {
    letter-spacing: -1px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .about__area-2 {
        padding-bottom: 50px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__img-2 {
        margin-left: 0px;
    }
}

.about__3.about__gray-bg::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 500px;
    height: 500px;
    background: var(--clr-bg-gray-4);
    content: "";
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__3.about__gray-bg::before {
        display: none;
    }
}

.about__3-img-wrapper {
    padding-bottom: 50px;
    padding-top: 100px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px) {
    .about__3-img-wrapper {
        padding-bottom: 40px;
    }
}

@media (max-width: 575px) {
    .about__3-img-wrapper {
        padding-bottom: 40px;
        padding-top: 60px;
    }
}

.about__3-top {
    width: 200px;
    height: auto;
    position: absolute;
    top: 0;
    left: -77px;
    z-index: 1;
    background: var(--clr-common-white);
    padding: 10px;
    clip-path: polygon(9% 0, 100% 0, 92% 100%, 0% 100%);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__3-top {
        left: -35px;
    }
}

@media (max-width: 575px) {
    .about__3-top {
        width: 120px;
        left: -16px;
        padding: 5px;
    }
}

@media (max-width:450px) {
    .about__3-top {
        width: 100px;
        left: -8px;
        padding: 5px;
    }
}

.about__3-text {
    background: var(--clr-common-color-red);
    padding: 29px 53px;
    display: flex;
    align-items: center;
    position: absolute;
    right: -38px;
    bottom: 0;
    clip-path: polygon(7% 0, 100% 0, 93% 100%, 0 100%);
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.about__3-text i {
    color: var(--clr-common-white);
    font-size: 40px;
    margin-right: 20px;
}

@media (max-width: 575px) {
    .about__3-text i {
        font-size: 35px;
        margin-right: 15px;
    }
}

.about__3-text:hover {
    background: var(--clr-theme-1);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__3-text {
        padding: 19px 40px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__3-text {
        left: 0;
        right: auto;
    }
}

@media (max-width:450px) {
    .about__3-text {
        padding: 20px 25px;
    }
}

.about__3-title {
    color: var(--clr-common-white);
    display: inline-block;
    margin-bottom: 0;
    font-size: 24px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__3-title {
        font-size: 20px;
    }
}

@media (max-width: 575px) {
    .about__3-title {
        font-size: 18px;
    }
}

.about__3-content {
    margin-left: 87px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
    .about__3-content {
        margin-left: 30px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__3-content {
        margin-left: 0px;
    }
}

.about__3-content-left {
    padding-right: 200px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
    .about__3-content-left {
        padding-right: 160px;
    }
}

@media (max-width:450px) {
    .about__3-content-left {
        padding-right: 0px;
    }
}

.about__3-content-inner {
    display: flex;
    margin-top: -2px;
}

.about__3-content-right {
    position: absolute;
    top: 0;
    right: -5px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .about__3-content-right .about__3-shadow:last-child {
        display: none;
    }
}

@media (max-width:450px) {
    .about__3-content-right {
        display: none;
    }
}

.about__3-content-num {
    background: var(--clr-common-white);
    margin-bottom: 15px;
    text-align: center;
    margin-bottom: 15px;
    padding: 25px 43px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    clip-path: polygon(14% 0, 100% 0, 86% 100%, 0% 100%);
}

@media (max-width:450px) {
    .about__3-content-num {
        padding: 20px 25px;
    }
}

.about__3-content-num h2 {
    font-size: 60px;
    color: var(--clr-common-color-red);
    margin-top: 0px;
    line-height: 1;
}

@media (max-width:450px) {
    .about__3-content-num h2 {
        font-size: 30px;
    }
}

.about__3-content-num h6 {
    font-size: 14px;
    display: block;
    color: var(--clr-common-color-3);
    margin-bottom: 0;
}

.about__3-content-num:hover {
    background: var(--clr-theme-1);
}

.about__3-content-num:hover h2 {
    color: var(--clr-common-white);
}

.about__3-content-num:hover h6 {
    color: var(--clr-common-white);
}

.about__3-content-btn .skew-btn {
    color: #039746;
}

.about__3-content-btn .skew-btn:hover {
    color: var(--clr-common-white);
}

.about__3-content-btn .skew-btn:hover::before {
    background: var(--clr-theme-1);
    border-color: var(--clr-theme-1);
}

.about__3-shadow {
    filter: drop-shadow(2px 2px 10px rgba(0, 0, 0, 0.06));
}

.about__3-main {
    clip-path: polygon(4% 0, 100% 0, 97% 100%, 0 100%);
}

.about__3-main img {
    clip-path: polygon(4% 0, 100% 0, 97% 100%, 0 100%);
}

/*----------------------------------------
    07. CTA CSS 
----------------------------------------*/

.services__cta-wrapper {
    display: grid;
    grid-template-columns: 1fr 120px 1fr;
    align-items: center;
}

@media (max-width:450px) {
    .services__cta-wrapper {
        display: block;
    }
    .services__cta-wrapper .services__cta-item {
        text-align: center !important;
    }
    .services__cta-wrapper .services__cta-item i {
        margin: auto;
    }
}

.services__cta-box {
    z-index: 1;
    padding-top: 30px;
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 15px;
    clip-path: polygon(1.5% 0%, 100% 0%, 98.5% 100%, 0% 100%);
}

.services__cta-overlay::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--clr-common-color-red);
    opacity: 0.9;
    z-index: -1;
}

.services__cta-item h3 {
    margin-bottom: 0;
    color: var(--clr-common-white);
}

.services__cta-item h3 a:hover {
    color: #039746;
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
    .services__cta-item h3 a {
        display: block;
    }
}

@media (max-width: 575px) {
    .services__cta-item h3 a {
        display: inline-block;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .services__cta-item h3 {
        font-size: 25px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services__cta-item h3 {
        font-size: 20px;
    }
}

.services__cta-item i {
    width: 60px;
    height: 60px;
    background: var(--clr-common-white);
    line-height: 60px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    text-align: center;
    color: var(--clr-common-color-red);
    font-size: 35px;
    display: block;
    line-height: 73px;
    margin: 0 30px;
}

.services__cta-3-play {
    display: inline-block;
    background: var(--clr-common-color-16);
    padding: 10px;
    border: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    margin-bottom: 27px;
}

.services__cta-3-title {
    color: var(--clr-common-white);
    margin-bottom: 43px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .services__cta-3-title {
        font-size: 30px;
    }
    .services__cta-3-title br {
        display: none;
    }
}

.services__cta-3-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px 6px;
}

@media (max-width:450px) {
    .services__cta-3-btn {
        flex-direction: column;
    }
}

.services__cta-3-btn .fill-btn {
    clip-path: polygon(11% 0%, 100% 0, 89% 100%, 0% 100%);
    padding: 0 53px;
    background: var(--clr-common-white);
    color: #039746;
}

.services__cta-3-btn .fill-btn:hover {
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
}

.services__cta-3-btn .border-btn {
    -webkit-transform: skew(-17deg);
    -moz-transform: skew(-17deg);
    -ms-transform: skew(-17deg);
    transform: skew(-17deg);
}

.help__cta-btn .skew-btn::before {
    border: 2px solid var(--clr-common-border-2);
}

.help__cta-title h2 {
    color: var(--clr-common-white);
    margin-bottom: 0px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .help__cta-title h2 {
        font-size: 34px;
    }
}

.call__cta.position {
    top: -50px;
    width: 100%;
    left: 0;
    right: 0;
}

.call__cta-icon {
    font-size: 54px;
    color: var(--clr-common-white);
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .call__cta-icon {
        font-size: 35px;
    }
}

.call__cta-padd {
    padding: 23px 49px;
}

@media (max-width:450px) {
    .call__cta-padd {
        padding: 25px;
    }
}

.call__cta-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .call__cta-wrapper {
        margin-bottom: 35px;
    }
}

.call__cta-content-small-title {
    color: var(--clr-common-white);
    font-size: 12px;
}

.call__cta-content-title {
    margin-bottom: 0;
    line-height: 1;
    color: var(--clr-common-white);
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
    .call__cta-content-title {
        font-size: 25px;
    }
}

@media (max-width: 575px) {
    .call__cta-content-title {
        font-size: 22px;
    }
}

.call__cta-content-title a:hover {
    color: var(--clr-common-white);
    opacity: 0.8;
}

.contact__cat-btn .fill-btn {
    background: var(--clr-common-white);
    color: #039746;
}

.contact__cat-btn .fill-btn:hover {
    background: #039746;
    color: var(--clr-common-white);
}

/*----------------------------------------
    08. Work Process CSS 
----------------------------------------*/

.work {
    padding-top: 190px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .work {
        padding-top: 175px;
        padding-bottom: 60px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .work {
        padding-top: 180px;
        padding-bottom: 30px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .work {
        padding-top: 170px;
        padding-bottom: 120px;
    }
}

.work__content {
    padding-bottom: 105px;
    padding-top: 8px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
    .work__content {
        padding: 0px;
        margin-bottom: 60px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .work__content {
        padding-bottom: 30px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .work__content-list {
        padding-right: 0px;
    }
}

@media (max-width: 575px) {
    .work__content-list {
        padding-right: 0px;
    }
}

.work__item {
    display: flex;
    padding-bottom: 15px;
    position: relative;
}

.work__item-text h4 {
    margin-bottom: 9px;
}

.work__item-num {
    min-width: 60px;
    height: 50px;
    background: var(--clr-common-color-red);
    text-align: center;
    margin-right: 45px;
    clip-path: polygon(15% 0, 100% 0, 85% 100%, 0 100%);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .work__item-num {
        margin-right: 25px;
    }
}

@media (max-width: 575px) {
    .work__item-num {
        margin-right: 20px;
    }
}

.work__item-num h5 {
    color: var(--clr-common-white);
    line-height: 49px;
    position: relative;
}

.work__item::before {
    content: "";
    position: absolute;
    width: 2px;
    height: 70%;
    background: var(--clr-common-color-red);
    top: 50px;
    left: 26px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px) {
    .work__item::before {
        left: 28px;
    }
}

@media (max-width: 575px) {
    .work__item::before {
        left: 30px;
    }
}

@media (max-width: 575px) {
    .work__item::before {
        left: 26px;
    }
}

.work__img {
    padding-top: 30px;
    clip-path: polygon(3% 0px, 100% 34px, 93% 100%, 0% 100%);
    position: absolute;
    bottom: 0;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .work__img img {
        width: 100%;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
    .work__img {
        margin-bottom: 60px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .work__img {
        position: relative;
        bottom: auto;
        margin-left: 0;
    }
}

.work__img img {
    clip-path: polygon(5% 0, 100% 4px, 95% 100%, 0% 100%);
}

.work__btn {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.work__content-list .work__item:last-child::before {
    display: none;
}

/*----------------------------------------
    09. Testimonial CSS 
----------------------------------------*/

.testimonial-one .testimonial-shadow {
    filter: drop-shadow(0px 0px 13px rgba(0, 0, 0, 0.06));
}

.testimonial-one .testimonial-items {
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    background: var(--clr-common-white);
    box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.06);
    padding: 45px 47px 50px 47px;
    position: relative;
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0 100%);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .testimonial-one .testimonial-items {
        padding: 45px 30px 50px 30px;
    }
}

@media (max-width: 575px) {
    .testimonial-one .testimonial-items {
        padding: 27px 50px 30px 50px;
    }
}

@media (max-width:450px) {
    .testimonial-one .testimonial-items {
        padding: 27px 18px 30px 25px;
    }
}

.testimonial-one .testimonial__icon {
    margin-bottom: 17px;
}

.testimonial-one .testimonial__icon i {
    color: var(--clr-common-red);
}

.testimonial-one .testimonial__text {
    margin-bottom: 35px;
}

.testimonial-one .testimonial__text p {
    font-size: 20px;
    line-height: 34px;
}

.testimonial-one .testimonial__auth {
    display: flex;
    align-items: center;
}

.testimonial-one .testimonial__auth-img img {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 60px;
    height: 60px;
}

.testimonial-one .testimonial__auth-text h4 {
    margin-bottom: 1px;
}

.testimonial-one .testimonial__auth-text span {
    font-size: 14px;
    text-transform: uppercase;
    color: var(--clr-common-color-red);
    font-weight: 600;
}

.testimonial-one .testimonial__quote-icon {
    position: absolute;
    top: 25px;
    right: 45px;
    opacity: 0;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.testimonial-one .testimonial__quote-icon i {
    font-size: 150px;
}

@media (max-width:450px) {
    .testimonial-space {
        padding-bottom: 65px;
    }
}

.testimonial-active .swiper-slide-active .testimonial-items {
    background: var(--clr-common-color-red);
}

.testimonial-active .swiper-slide-active .testimonial-items p,
.testimonial-active .swiper-slide-active .testimonial-items h4,
.testimonial-active .swiper-slide-active .testimonial-items span,
.testimonial-active .swiper-slide-active .testimonial-items .rate i {
    color: var(--clr-common-white);
}

.testimonial-active .swiper-slide-active .testimonial-items .testimonial__quote-icon {
    opacity: 0.2;
}

.testimonial-box .swiper-container {
    padding: 20px 0;
}

.testimonial-two {
    margin-left: 72px;
    margin-right: 3px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .testimonial-two {
        margin-left: 40px;
        margin-right: 0px;
    }
}

.testimonial-two .testimonial__item-img {
    width: 120px;
    height: 120px;
    position: absolute;
    top: -22px;
    left: -53px;
    z-index: 200;
}

.testimonial-two .testimonial__item-img img {
    width: 100%;
    -webkit-transition: all 1s ease-out 0s;
    -moz-transition: all 1s ease-out 0s;
    -ms-transition: all 1s ease-out 0s;
    -o-transition: all 1s ease-out 0s;
    transition: all 1s ease-out 0s;
    clip-path: polygon(16% 0, 100% 0, 84% 100%, 0 100%);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .testimonial-two .testimonial__item-img {
        width: 90px;
        height: 90px;
    }
}

@media (max-width:450px) {
    .testimonial-two .testimonial__item-img {
        width: 80px;
        height: 80px;
    }
}

.testimonial-two .testimonial__item-rate i {
    color: var(--clr-common-color-red);
}

@media (max-width:450px) {
    .testimonial-two .testimonial__item-rate i {
        font-size: 13px;
    }
}

.testimonial-two .testimonial__item-auth h6 {
    color: var(--clr-common-color-red);
}

.testimonial-two .testimonial__item-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.testimonial-two .testimonial__item-content {
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    padding: 35px 37px 30px 66px;
    clip-path: polygon(3% 0, 100% 0, 97% 100%, 0 100%);
}

.testimonial-two .testimonial__item-content p {
    margin-bottom: 13px;
    font-size: 18px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .testimonial-two .testimonial__item-content {
        padding: 35px 20px 30px 40px;
    }
}

@media (max-width:450px) {
    .testimonial-two .testimonial__item-content {
        padding: 30px;
    }
}

.testimonial-two .testimonial__item:hover .testimonial__item-content {
    background: var(--clr-theme-1);
}

.testimonial-two .testimonial__item:hover .testimonial__item-content p {
    color: var(--clr-common-white);
}

.testimonial-two .testimonial__item:hover .testimonial__item-content h4 {
    color: var(--clr-common-white);
}

.testimonial-two .testimonial__item:hover .testimonial__item-content h6 {
    color: var(--clr-common-white);
}

.testimonial-two .testimonial__item:hover .testimonial__item-img img {
    transform: rotateY(360deg);
}

/*----------------------------------------
    10. Brand CSS 
----------------------------------------*/

.brand-items a img {
    opacity: 0.4;
}

.brand-items a img:hover {
    opacity: 1;
}

.brand-items {
    text-align: center;
}

.brand-items-2 {
    text-align: center;
}

.brand-padd {
    padding: 35px 0 35px;
}

.brand.two {
    padding: 33px 0;
}

.brand-active-2 {
    padding: 0 65px;
    overflow: hidden;
}

.brand-items-2 img {
    max-width: 100%;
}

.brand__3-items {
    text-align: center;
}

/*----------------------------------------
    11. Price CTA CSS 
----------------------------------------*/

.price__cta-content {
    padding: 80px 82px 80px 80px;
    clip-path: polygon(3% 0, 100% 0, 97% 100%, 0 100%);
    background: var(--clr-common-white);
    margin-left: 40px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .price__cta-content {
        margin-left: 0px;
        padding: 70px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .price__cta-content {
        margin-left: 0px;
        padding: 60px 40px;
    }
}

@media (max-width:450px) {
    .price__cta-content {
        margin-left: 0px;
        padding: 40px 25px;
    }
}

.price__cta-content-shadow {
    filter: drop-shadow(0px 30px 10px rgba(0, 0, 0, 0.06));
}

.price__cta-3 {
    margin-top: -190px;
    padding-top: 310px;
    padding-bottom: 120px;
}

.price__cta-3::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #039746;
    height: 190px;
    width: 100%;
    z-index: -1;
}

.price__cta-3-img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 50%;
    z-index: -1;
}

.price__cta-3-img::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: #039746;
    opacity: 0.2;
    height: 190px;
}

.price__cta-3-img img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.price__cta-content-3 {
    padding-left: 85px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px) {
    .price__cta-content-3 {
        padding-left: 50px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px),
(max-width:450px) {
    .price__cta-content-3 {
        padding-left: 0px;
    }
}

.price__range-wrapper {
    padding-top: 30px;
    margin-bottom: 48px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .price__range-wrapper {
        padding-top: 5px;
        margin-bottom: 58px;
    }
}

.price__range-text h5 {
    margin-bottom: 0px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .price__range-text {
        margin-bottom: 30px;
    }
}

.price__range-area {
    margin-left: -40px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .price__range-area {
        margin-left: 0px;
    }
}

.price__range-area .ui-slider-handle {
    width: 80px;
    height: 60px;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    background: #039746;
    color: var(--clr-common-white);
    cursor: pointer;
    top: 0;
    margin: auto;
    text-align: center;
    line-height: 60px;
    clip-path: polygon(10% 0, 100% 0, 90% 100%, 0% 100%);
    font-size: 20px;
    font-weight: 600;
}

@media (max-width: 575px) {
    .price__range-area .ui-slider-handle {
        width: 60px;
        height: 50px;
        line-height: 50px;
        font-size: 17px;
    }
}

.price__range-area .ui-widget {
    font-family: "Oswald", sans-serif;
    font-size: 20px;
    color: var(--clr-common-white);
    font-weight: 600;
}

.price__range-area .ui-widget.ui-widget-content {
    border: none;
    background: var(--clr-common-color-18);
    height: 4px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

/*----------------------------------------
    12 . Blog CSS
----------------------------------------*/

.blog__more-btn {
    display: inline-block;
}

.blog__more-btn a {
    text-transform: uppercase;
    color: var(--clr-common-color-red);
    font-weight: 400;
    font-family: "Oswald", sans-serif;
    position: relative;
}

.blog__more-btn a::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: var(--clr-common-color-red);
}

.blog__more-btn:hover a {
    color: #039746;
}

.blog__more-btn:hover a::before {
    background: #039746;
}

.blog__item {
    position: relative;
}

.blog__item-content h2 {
    font-size: 24px;
    margin-bottom: 11px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .blog__item-content h2 {
        font-size: 20px;
    }
}

.blog__item-date {
    position: absolute;
    background: var(--clr-common-color-red);
    width: 80px;
    height: 80px;
    text-align: center;
    padding-top: 15px;
    top: 20px;
    right: 20px;
    clip-path: polygon(10% 0, 100% 0%, 90% 100%, 0% 100%);
    mix-blend-mode: multiply;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .blog__item-date {
        width: 70px;
        height: 70px;
        padding-top: 10px;
    }
}

.blog__item-date span {
    color: var(--clr-common-white);
    font-weight: 700;
    text-transform: uppercase;
    font-family: "Oswald", sans-serif;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .blog__item-date span {
        font-size: 16px;
    }
}

.blog__item-date span b {
    font-size: 40px;
    display: block;
    font-weight: 600;
    color: var(--clr-common-white);
    margin-bottom: 6px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .blog__item-date span b {
        font-size: 25px;
        margin-bottom: 0px;
    }
}

.blog__item-img {
    overflow: hidden;
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0% 100%);
}

.blog__item-img img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0% 100%);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.blog__item-content {
    padding-right: 20px;
}

.blog__item-content h2:hover a {
    color: var(--clr-common-color-red);
}

.blog__item:hover .blog__item-img img {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
}

.blog__meta {
    margin-bottom: 17px;
}

.blog__meta span {
    margin-right: 25px;
    position: relative;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .blog__meta span {
        margin-right: 10px;
    }
}

.blog__meta span i {
    color: var(--clr-common-color-red);
    margin-right: 5px;
}

.blog__meta span:hover a {
    color: #039746;
}

.blog__meta span:hover a i {
    color: #039746;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .blog__padding1 {
        padding-top: 180px;
    }
}

.blog-two .blog__item-date {
    top: -20px;
}

.blog-two .blog__item-img {
    position: relative;
}

.blog-two .blog__item-img img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0% 100%);
}

.blog-two .blog__title-wrapper {
    margin-top: -47px;
    padding-left: 30px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .blog-two .blog__title-wrapper {
        margin-top: -30px;
        padding-left: 0px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
    .blog-two .blog__title-wrapper {
        padding-left: 0;
    }
}

.blog-two .blog__title-inner {
    display: flex;
    align-items: center;
    padding: 26px 0;
    border-bottom: 1px solid var(--clr-common-border-2);
}

.blog-two .blog__title-inner :last-child {
    border-bottom: 1px solid transparent;
}

.blog-two .blog__title-inner .blog__item-date {
    height: 80px;
    background: var(--clr-common-color-red);
    position: inherit;
    margin-right: 20px;
    min-width: 80px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .blog-two .blog__title-inner .blog__item-date {
        min-width: 70px;
        height: 70px;
        margin-right: 14px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .blog-two .blog__title-inner .blog__item-date {
        min-width: 70px;
        height: 70px;
        margin-right: 14px;
    }
}

.blog-two .blog__title-inner .blog__item-title h4 {
    font-size: 24px;
    line-height: 34px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .blog-two .blog__title-inner .blog__item-title h4 {
        font-size: 20px;
        line-height: 30px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .blog-two .blog__title-inner .blog__item-title h4 {
        font-size: 20px;
        line-height: 25px;
    }
}

@media (max-width:450px) {
    .blog-two .blog__title-inner .blog__item-title h4 {
        font-size: 18px;
    }
}

.blog-two .blog__title-inner:hover .blog__item-date {
    background: var(--clr-theme-1);
}

.blog-two .blog__title-inner:hover h4 {
    color: var(--clr-common-color-red);
}

.blog-two .blog__meta {
    position: absolute;
    z-index: 1;
    bottom: -17px;
    padding: 15px 20px;
    color: var(--clr-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .blog-two .blog__meta {
        padding: 7px 15px;
        left: -2px;
    }
}

.blog-two .blog__meta:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    clip-path: polygon(2% 0, 100% 0%, 97% 100%, 0% 100%);
    mix-blend-mode: multiply;
    background: var(--clr-common-color-red);
}

.blog-two .blog__meta a i {
    color: var(--clr-common-white);
}

.blog__title-wrapper article:last-child .blog__title-inner {
    border-bottom: 1px solid transparent;
}

.postbox__wrapper {
    margin-right: 30px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .postbox__wrapper {
        margin-right: 0px;
    }
}

.postbox__shadow {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    overflow: hidden;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(10, 0, 58, 0.14);
    -moz-box-shadow: 0px 1px 2px 0px rgba(10, 0, 58, 0.14);
    box-shadow: 0px 1px 2px 0px rgba(10, 0, 58, 0.14);
}

.postbox__thumb {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0% 100%);
}

.postbox__thumb img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0% 100%);
}

.postbox__thumb .play-btn {
    background: var(--clr-common-white);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    position: absolute;
}

.postbox__thumb .play-btn:hover {
    background: #039746;
    color: var(--clr-common-white);
}

.postbox__thumb:hover img {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
    .postbox__title {
        font-size: 24px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .postbox__title {
        font-size: 20px;
    }
}

.postbox-nav button {
    position: absolute;
    left: 0px;
    top: 50%;
    z-index: 1;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background: var(--clr-common-white);
    color: #039746;
    display: inline-block;
    clip-path: polygon(13% 0, 100% 0, 87% 100%, 0% 100%);
}

.postbox-nav button.postbox-slider-button-next {
    left: auto;
    right: 0px;
}

.postbox-nav button i {
    height: 60px;
    width: 75px;
    line-height: 60px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .postbox-nav button i {
        height: 50px;
        width: 50px;
        line-height: 50px;
    }
}

.postbox-nav button:hover {
    background: #039746;
    color: var(--clr-common-white);
}

.postbox-slider-button-prev i {
    margin-left: 15px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .postbox-slider-button-prev i {
        margin-left: 5px;
    }
}

.postbox-slider-button-next i {
    margin-right: 15px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .postbox-slider-button-next i {
        margin-right: 5px;
    }
}

.basic-pagination ul {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.basic-pagination ul li a,
.basic-pagination ul li span {
    display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    border: 1px solid var(--clr-common-border-3);
    font-size: 14px;
    font-weight: 500;
    color: #039746;
}

@media (max-width: 575px) {
    .basic-pagination ul li a,
    .basic-pagination ul li span {
        width: 45px;
        height: 45px;
        line-height: 45px;
    }
}

.basic-pagination ul li a:hover,
.basic-pagination ul li span:hover {
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
}

.basic-pagination ul li span.current {
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
}

.postbox__content blockquote {
    padding: 30px 40px 5px 40px;
    color: var(--clr-body-text);
    position: relative;
    background: var(--clr-bg-gray);
    font-style: normal;
    text-align: left;
    clear: both;
    font-weight: 400;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    box-shadow: 0px 1px 2px 0px rgba(10, 0, 58, 0.14);
    border: 1px solid var(--clr-common-color-12);
    margin-bottom: 25px;
}

@media (max-width: 575px) {
    .postbox__content blockquote {
        padding: 30px 25px 5px 25px;
    }
}

.postbox__content blockquote::before {
    content: "";
    position: static;
    font-family: "Font Awesome 5 Pro";
    font-size: 32px;
    color: var(--clr-theme-1);
    line-height: 1;
    margin-bottom: 18px;
    display: inline-block;
}

.postbox__content blockquote cite::before {
    content: "";
    display: inline-block;
    background: var(--clr-theme-1);
    height: 2px;
    width: 40px;
    top: -4px;
    margin-right: 10px;
    position: relative;
}

.blog__author {
    padding: 30px 30px 0 30px;
    -webkit-box-shadow: 0px 1px 4px 0px rgba(10, 0, 58, 0.14);
    -moz-box-shadow: 0px 1px 4px 0px rgba(10, 0, 58, 0.14);
    box-shadow: 0px 1px 4px 0px rgba(10, 0, 58, 0.14);
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.blog__author p {
    margin-bottom: 0px;
}

.post-comment-form h3 {
    margin-bottom: 30px;
}

.comments-avatar {
    float: left;
    margin-right: 20px;
}

.comments-avatar img {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.comments-text {
    overflow: hidden;
    border-bottom: 1px solid var(--clr-common-color-12);
    padding-bottom: 30px;
    margin-bottom: 30px;
}

.comments-text p {
    margin-bottom: 20px;
}

.avatar-name {
    margin-bottom: 10px;
    overflow: hidden;
    position: relative;
}

.avatar-name h5 {
    font-size: 16px;
    margin-bottom: 5px;
    font-weight: 600;
}

.avatar-name span {
    font-size: 14px;
    font-weight: 500;
}

.latest-comments li.children {
    margin-left: 105px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .latest-comments li.children {
        margin-left: 0;
    }
}

.comment-reply {
    font-weight: 500;
    font-size: 14px;
    color: var(--clr-body-heading);
}

.latest-comments li:first-child .comments-box {
    border-top: 0;
    padding-top: 0;
}

.sidebar__widget {
    padding: 45px 35px 50px 35px;
    box-shadow: 0px 12px 10px rgba(238, 239, 240, 0.25);
    border: 1px solid var(--clr-common-color-12);
    background: var(--clr-bg-gray-4);
}

.sidebar__widget.sidebar-contact {
    padding-top: 50px;
    padding-bottom: 45px;
}

.sidebar__widget.sidebar-contact h2 {
    font-size: 30px;
    color: var(--clr-common-color-red);
    font-weight: 700;
    line-height: 1;
    display: inline-block;
    margin-bottom: 0px;
}

.sidebar__widget.sidebar-contact p {
    color: #039746;
}

.sidebar__widget img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0% 100%);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .sidebar__widget {
        padding: 43px 15px 48px 15px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .sidebar__widget {
        padding: 43px 30px 48px 30px;
    }
}

@media (max-width: 575px) {
    .sidebar__widget {
        padding: 43px 15px 48px 15px;
    }
}

.sidebar__widget .single-input-field::before {
    background: var(--clr-common-white);
}

.sidebar__widget-title {
    font-size: 24px;
}

.sidebar__widget ul li {
    margin-bottom: 15px;
    position: relative;
    z-index: 2;
    background: transparent;
}

.sidebar__widget ul li:last-child {
    margin-bottom: 0px;
}

.sidebar__widget ul li a {
    padding: 17px 30px;
    font-weight: 500;
    display: block;
    clip-path: polygon(3% 0, 100% 0, 97% 100%, 0 100%);
    color: #039746;
    background: var(--clr-common-white);
    text-transform: uppercase;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width:450px) {
    .sidebar__widget ul li a {
        padding: 17px 20px;
    }
}

.sidebar__widget ul li a i {
    margin-right: 15px;
}

.sidebar__widget ul li a span {
    float: right;
}

.sidebar__widget ul li:hover a {
    color: var(--clr-common-white);
    background: var(--clr-theme-1);
}

.rc__post-content {
    overflow: hidden;
}

.rc__post-thumb {
    width: 100px;
    float: left;
    margin-right: 10px;
    overflow: hidden;
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0% 100%);
}

.rc__post-thumb img {
    max-width: 100%;
}

.rc__post-thumb:hover img {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
}

.rc__post-title {
    font-size: 16px;
}

.rc__meta {
    margin-top: -7px;
}

.rc__meta span {
    font-size: 14px;
}

.tagcloud>h3 {
    font-size: 30px;
    margin-bottom: 25px;
}

.tagcloud a {
    font-weight: 500;
    font-size: 12px;
    text-transform: uppercase;
    color: #039746;
    padding: 12px 26px;
    display: inline-grid;
    line-height: 1;
    margin: 7px 10px 7px 0;
    position: relative;
    background: transparent;
    z-index: 2;
}

@media (max-width: 575px) {
    .tagcloud a {
        margin: 7px 7px 7px 0;
    }
}

.tagcloud a::before {
    content: "";
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: var(--clr-common-white);
    -webkit-transform: skew(-4deg);
    -moz-transform: skew(-4deg);
    -ms-transform: skew(-4deg);
    transform: skew(-4deg);
    z-index: -1;
}

.tagcloud a:hover {
    color: var(--clr-common-white);
}

.tagcloud a:hover::before {
    background: var(--clr-theme-1);
    border-color: var(--clr-theme-1);
}

.tagcloud.details a::before {
    background: var(--clr-common-border-2);
}

.tagcloud.details a:hover {
    color: var(--clr-common-white);
}

.tagcloud.details a:hover::before {
    background: var(--clr-theme-1);
}

/*----------------------------------------
    13. Team CSS
----------------------------------------*/

.team__item {
    overflow: hidden;
}

.team__item-text {
    opacity: 0;
    visibility: hidden;
    bottom: 0;
    z-index: 1;
    left: 50px;
    bottom: -100px;
    margin-top: 100px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.team__item-text span {
    font-size: 14px;
    text-transform: uppercase;
    margin-bottom: 8px;
    display: block;
    color: var(--clr-common-white);
    opacity: 0.5;
}

.team__item-text h3 {
    font-size: 24px;
    color: var(--clr-common-white);
    margin-bottom: 30px;
}

.team__item-text h3:hover {
    color: var(--clr-common-color-red);
}

@media (max-width:450px) {
    .team__item-auth h4 {
        font-size: 18px;
    }
}

.team__overlay {
    z-index: 1;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.team__overlay::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    background: var(--clr-theme-1);
    z-index: 1;
    opacity: 0;
    mix-blend-mode: multiply;
}

.team__overlay:hover .team__item-text {
    opacity: 1;
    visibility: visible;
    bottom: 40px;
}

.team__overlay:hover .team__item-img img {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.team__overlay:hover::before {
    opacity: 0.9;
    height: 100%;
}

.team__social a {
    color: var(--clr-common-color-11);
    margin-right: 10px;
    text-transform: uppercase;
    font-family: "Oswald", sans-serif;
}

.team__social a:hover {
    color: var(--clr-common-white);
}

.team__3-item {
    margin-left: 35px;
    margin-right: 35px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .team__3-item {
        margin-left: 5px;
        margin-right: 5px;
    }
}

.team__3-item-img {
    position: relative;
}

.team__3-item-img img {
    clip-path: polygon(5% 0, 100% 0, 96% 100%, 0% 100%);
}

.team__3-item-content {
    background: var(--clr-theme-1);
    padding: 19px 30px;
    clip-path: polygon(1.2% 0, 100% 0, 98.8% 100%, 0 100%);
    margin-left: -5px;
    margin-right: 16px;
    margin-top: -2px;
}

.team__3-item-title {
    font-size: 24px;
    color: var(--clr-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .team__3-item-title {
        font-size: 20px;
    }
}

.team__3-item-subtitle {
    font-size: 14px;
    color: var(--clr-common-white);
    text-transform: uppercase;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
}

.team__3-item-social {
    position: absolute;
    width: 106%;
    padding: 87px 50px;
    bottom: -30px;
    left: -35px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.team__3-item-social:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    clip-path: polygon(0px 0px, 100% 30%, 96% 80%, 0 60%);
    background: var(--clr-common-color-red);
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.team__3-item-social ul {
    margin-top: -50px;
    position: relative;
}

.team__3-item-social ul li {
    display: inline-block;
    margin-right: 10px;
}

.team__3-item-social ul li a {
    display: block;
    color: var(--clr-common-white);
    font-size: 14px;
}

.team__3-item-social ul li:hover a {
    color: #039746;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .team__3-item-social {
        padding: 65px 50px;
        left: -29px;
    }
    .team__3-item-social ul {
        margin-top: -38px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .team__3-item-social {
        padding: 65px 50px;
        left: 0px;
        width: 95%;
    }
    .team__3-item-social ul {
        margin-top: -38px;
    }
}

.team__3-item:hover .team__3-item-social {
    bottom: 0px;
    visibility: visible;
    opacity: 1;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .team__3-item:hover .team__3-item-social {
        bottom: 25px;
    }
}

.team-img img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0 100%);
}

.tmd__content {
    padding: 0px 30px 0 50px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .tmd__content {
        padding: 0px;
    }
}

.tmd__content ul li {
    margin-bottom: 8px;
}

.tmd__content ul li span {
    color: var(--clr-common-black);
}

.tmd__qualification .progress {
    height: 10px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .tmd__qualification {
        padding-left: 0;
    }
}

.tmd__skill-wrapper {
    margin-bottom: 30px;
}

.tmd__skill .progress-bar {
    background-color: var(--clr-theme-1);
}

.tmd__education ul li {
    margin-bottom: 25px;
}

.tmd img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0 100%);
}

.skill-title {
    display: flex;
    justify-content: space-between;
}

.skill-title span {
    float: right;
    color: var(--clr-common-black);
}

.edu-icon {
    float: left;
    margin-right: 20px;
}

.edu-icon i {
    font-size: 30px;
    color: #039746;
}

.edu-text {
    overflow: hidden;
}

.edu-text h5 {
    margin-bottom: 2px;
}

.edu-text p {
    margin-bottom: 0;
}

.edu__education li {
    margin-bottom: 15px;
}

/*----------------------------------------
    14. Accordion CSS
----------------------------------------*/

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .acc-testi {
        padding-bottom: 35px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
    .accordion__wrapper-1 {
        margin-right: 20px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .accordion__wrapper-1 {
        margin-right: 0px;
    }
}

.accordion__wrapper-1 .accordion-header {
    filter: drop-shadow(0px 0px 105px rgba(0, 0, 0, 0.17));
}

.accordion__wrapper-1 .accordion-body {
    padding: 25px 25px 7px 25px;
}

.accordion__wrapper-1 .accordion-body p {
    margin-bottom: 0;
}

.accordion__wrapper-1 .accordion-item {
    margin-bottom: 20px;
}

.accordion__wrapper-1 .accordion-button {
    background: var(--clr-common-white);
    border: 1px solid transparent;
    font-size: 18px;
    font-weight: 600;
    color: #039746;
    clip-path: polygon(2% 0, 100% 0, 98% 100%, 0 100%);
    -webkit-box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.04);
    -moz-box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.04);
    box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.04);
    padding: 19px 29px;
    -webkit-border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    border-radius: 0px !important;
    text-transform: uppercase;
}

@media (max-width:450px) {
    .accordion__wrapper-1 .accordion-button {
        font-size: 16px;
    }
}

.accordion__wrapper-1 .accordion-button:focus {
    box-shadow: none;
}

.accordion__wrapper-1 .accordion-button:not(.collapsed) {
    color: var(--clr-common-white);
    background-color: var(--clr-common-color-red);
}

.accordion__wrapper-1 .accordion-button.collapsed::after {
    font-family: "Font Awesome 5 Pro";
    content: "";
    background-image: none;
    font-weight: 400;
}

.accordion__wrapper-1 .accordion-button::after {
    font-family: "Font Awesome 5 Pro";
    content: "";
    background-image: none;
}

.accordion__wrapper-1 .accordion-button:not(.collapsed)::after {
    background-image: none;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    transform: none;
    font-weight: 400;
}

@media (max-width:450px) {
    .accordion__wrapper-1 .accordion-button {
        padding: 16px 16px;
    }
}

.accordion__wrapper-1 .accordion-collapse {
    border: none;
}

/*----------------------------------------
    15. Contact CSS
----------------------------------------*/

.contact__shadow {
    filter: drop-shadow(-1px 6px 3px rgba(0, 0, 0, 0.04));
}

.contact__info-item {
    display: flex;
    justify-content: space-between;
    background: var(--clr-common-white);
    padding: 30px 35px;
    align-items: center;
    clip-path: polygon(4% 0, 100% 0, 96% 100%, 0% 100%);
    position: relative;
    overflow: hidden;
}

.contact__info-item::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 0%;
    height: 100%;
    background: #039746;
    z-index: 1;
    clip-path: polygon(4% 0, 100% 0, 96% 100%, 0% 100%);
    z-index: -1;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
    transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}

.contact__info-item:hover::before {
    width: 100%;
}

.contact__info-item:hover .contact__info-text h3,
.contact__info-item:hover .contact__info-text span {
    color: var(--clr-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
    .contact__info-item {
        padding: 25px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .contact__info-item {
        padding: 25px 45px;
    }
}

@media (max-width: 575px) {
    .contact__info-item {
        padding: 20px 50px;
    }
}

@media (max-width: 575px) {
    .contact__info-item {
        padding: 20px 40px;
    }
}

@media (max-width:450px) {
    .contact__info-item {
        padding: 20px;
    }
}

.contact__info-text span {
    font-size: 14px;
    line-height: 1;
    text-transform: capitalize;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .contact__info-text h3 {
        font-size: 24px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .contact__info-text h3 {
        font-size: 22px;
    }
}

.contact__info-img {
    margin-top: 140px;
}

.contact__info-icon {
    font-size: 56px;
    color: var(--clr-common-color-red);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .contact__info-icon {
        font-size: 45px;
    }
}

.contact__content {
    padding-right: 40px;
}

.contact__content .section__title h2 {
    margin-bottom: 26px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .contact__content .section__title h2 {
        font-size: 40px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .contact__content .section__title h2 {
        font-size: 30px;
    }
}

.contact__content-btn .fill-btn {
    clip-path: polygon(11% 0%, 100% 0, 89% 100%, 0% 100%);
    padding: 0 42px;
}

.contact__bg {
    background-position: center right;
    background-repeat: no-repeat;
}

@media (max-width: 575px) {
    .coverage__area {
        padding-top: 50px;
        padding-bottom: 50px;
    }
}

.coverage__division {
    padding: 0 62px;
    overflow: hidden;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
    .coverage__division {
        padding: 0;
    }
}

.coverage__division>div {
    width: 50%;
    float: left;
}

.coverage__division>div ul {
    padding-top: 25px;
}

.coverage__division>div ul li {
    line-height: 1;
    margin-bottom: 33px;
}

.coverage__division>div ul li a {
    position: relative;
    padding-left: 26px;
}

.coverage__division>div ul li a:before {
    position: absolute;
    content: "";
    top: 5px;
    left: 0;
    width: 10px;
    height: 10px;
    background: var(--clr-common-color-red);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.coverage__division>div ul li a.cont-1:before,
.coverage__division>div ul li a.cont-5:before {
    background: var(--clr-common-color-red);
}

.coverage__division>div ul li a.cont-2:before,
.coverage__division>div ul li a.cont-6:before {
    background: var(--clr-common-color-red);
}

.coverage__division>div ul li a.cont-3:before,
.coverage__division>div ul li a.cont-7:before {
    background: var(--clr-common-color-red);
}

.coverage__division>div ul li a.cont-4:before {
    background: var(--clr-common-color-red);
}

.coverage__text p {
    padding-right: 140px;
    margin-bottom: 0;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .coverage__text p {
        padding-right: 70px;
    }
}

@media (max-width: 575px) {
    .coverage__text p {
        padding-right: 0;
    }
}

.dot {
    position: absolute;
    width: 10px;
    height: 10px;
    background: var(--clr-common-color-red);
    box-shadow: 0px 4px 8px 0px rgba(219, 28, 41, 0.3);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-transform: 0.3s;
    -moz-transform: 0.3s;
    -ms-transform: 0.3s;
    transform: 0.3s;
    cursor: pointer;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .dot {
        width: 15px;
        height: 15px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
    .dot {
        display: none;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
    .dot {
        display: none;
    }
}

.dot:hover .dot-inner {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}

.dot.active .dot-inner {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}

.dot-1 {
    top: -127px;
    left: 17%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .dot-1 {
        left: 35.9%;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .dot-1 {
        left: 36%;
    }
}

@media (max-width: 575px) {
    .dot-1 {
        display: none;
    }
}

.dot-2 {
    top: 130px;
    left: 44%;
}

.dot-3 {
    top: -155px;
    right: 2%;
}

.dot-4 {
    top: -194px;
    right: -74%;
}

@media only screen and (min-width: 1600px) and (max-width: 1799px) {
    .dot-4 {
        right: -50%;
    }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .dot-4 {
        right: -30%;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .dot-4 {
        display: none;
    }
}

.dot-5 {
    top: 130px;
    right: -26%;
}

.dot-inner {
    position: absolute;
    bottom: 10px;
    left: -140px;
    box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.04);
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    -ms-transform: translateY(10px);
    transform: translateY(10px);
    z-index: 3;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.dot-inner.dot-inner-team {
    visibility: visible;
    opacity: 1;
    bottom: 10px;
}

.dot-inner img {
    clip-path: polygon(8% 0px, 100% 0, 92% 100%, 0% 100%);
}

.single-contact-info {
    border-bottom: 1px solid var(--clr-common-color-17);
    padding-top: 30px;
    padding-bottom: 28px;
}

.single-contact-info:last-child {
    border-bottom: none;
    padding-bottom: 0px;
}

.single-contact-info .contact-info-icon {
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.single-contact-info .contact-info-icon:hover i {
    color: var(--clr-common-white);
}

.single-contact-info .contact-info-icon:hover a {
    background: var(--clr-common-color-red);
    color: var(--clr-common-white);
}

.contact-info-icon {
    margin-right: 20px;
}

.contact-info-icon a {
    height: 65px;
    width: 65px;
    background: var(--clr-common-color-17);
    display: inline-block;
    line-height: 70px;
    text-align: center;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    font-size: 20px;
    color: var(--clr-common-color-red);
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.contact-info-text span {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 500;
    display: inline-block;
}

.contact-info-text h5 {
    font-size: 20px;
}

.single-input-field {
    margin-bottom: 20px;
    position: relative;
    background: transparent;
}

.single-input-field input,
.single-input-field textarea {
    display: block;
    width: 100%;
    height: 64px;
    padding: 0 50px 0 27px;
    border: 2px solid transparent;
    outline: 0;
    background: transparent;
    color: #039746;
}

.single-input-field textarea {
    height: 200px;
    padding: 20px 50px 20px 28px;
    resize: none;
}

.single-input-field i {
    position: absolute;
    top: 50%;
    right: 26px;
    color: #039746;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.single-input-field::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    border: 2px solid var(--clr-common-border-2);
    -webkit-transform: skew(-4deg);
    -moz-transform: skew(-4deg);
    -ms-transform: skew(-4deg);
    transform: skew(-4deg);
    z-index: -1;
}

.single-input-field .nice-select {
    width: 100%;
    height: 64px;
    line-height: 64px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    float: none;
    border: none;
    padding: 0;
}

.single-input-field .nice-select::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    border: 2px solid var(--clr-common-border-2);
    -webkit-transform: skew(-4deg);
    -moz-transform: skew(-4deg);
    -ms-transform: skew(-4deg);
    transform: skew(-4deg);
    z-index: 1;
}

.single-input-field .nice-select span {
    color: #039746;
    font-family: "Oswald", sans-serif !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    margin-left: 29px;
}

.single-input-field .nice-select::after {
    border-bottom: 2px solid #039746;
    border-right: 2px solid #039746;
    height: 10px;
    right: 30px;
    width: 10px;
    top: 0;
    bottom: 0;
    margin: auto;
}

.single-input-field .nice-select .list {
    width: 100%;
    z-index: 100;
}

.single-input-field.textarea i {
    top: 25px;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
}

/*----------------------------------------
    16. Portfolio CSS
----------------------------------------*/

.portfolio-menu {
    text-align: center;
}

.portfolio-menu button {
    font-size: 16px;
    font-weight: 700;
    padding: 0 35px;
    height: 60px;
    color: #039746;
    border: none;
    background: none;
    margin: 6px 2px;
    font-family: "Oswald", sans-serif;
    clip-path: polygon(15px 0, 100% 0, calc(100% - 15px) 100%, 0 100%);
    text-transform: uppercase;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .portfolio-menu button {
        font-size: 14px;
        padding: 0 20px;
        height: 50px;
        margin: 5px auto;
    }
}

.portfolio-menu button.active,
.portfolio-menu button:hover {
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
}

.portfolio__item {
    position: relative;
    overflow: hidden;
}

.portfolio__content {
    background: var(--clr-common-white);
    position: absolute;
    left: -100px;
    bottom: 0px;
    padding: 43px 45px 43px;
    width: calc(100% - 15px);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    -webkit-transform: scale(0.7);
    -moz-transform: scale(0.7);
    -ms-transform: scale(0.7);
    transform: scale(0.7);
    clip-path: polygon(0% 0, 100% 0, 97% 100%, 0 100%);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .portfolio__content {
        clip-path: polygon(0% 0, 100% 0, 96% 100%, 0 100%);
    }
}

@media (max-width:450px) {
    .portfolio__content {
        padding: 20px 13px 50px 19px;
    }
}

.portfolio__content-thumb {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: -1;
    width: 125px;
}

.portfolio__content-title {
    position: relative;
    z-index: 2;
}

.portfolio__content-title h5 {
    font-size: 16px;
    color: var(--clr-common-color-red);
    line-height: 28px;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.portfolio__content-title h2 {
    font-size: 24px;
    line-height: 34px;
    color: #039746;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: -1px;
    margin-bottom: 14px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .portfolio__content-title h2 {
        font-size: 20px;
    }
}

.portfolio__content-data {
    position: relative;
    z-index: 2;
}

.portfolio__content-data span a {
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    color: #039746;
}

.portfolio__content-data span i {
    color: var(--clr-common-color-red);
    font-size: 14px;
    margin-right: 5px;
}

.portfolio__content-data span:first-child {
    margin-right: 10px;
}

.portfolio__content-data span:hover a {
    color: var(--clr-common-color-red);
}

.portfolio__img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0 100%);
}

.portfolio__img img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0 100%);
    width: 100%;
}

.portfolio__item:hover .portfolio__content {
    opacity: 1;
    visibility: visible;
    left: 0px;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.portfolio__details-img img,
.service-details-content img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0% 100%);
}

.overview-list ul li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 5px;
}

.overview-list ul li::before {
    position: absolute;
    content: "";
    font-size: 16px;
    color: #039746;
    font-family: "Font Awesome 5 Pro";
    left: 0;
    top: 0;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .row.portfolio__sd-box {
        --bs-gutter-x: 18px;
    }
}

.portfolio__sd-box-content {
    padding: 25px 20px;
    position: relative;
    display: inline-grid;
    width: 100%;
}

.portfolio__sd-box-content::before {
    content: "";
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    border: 2px solid var(--clr-common-border-2);
    transform: skew(-4deg);
    z-index: -1;
}

.portfolio__sd-box-content i {
    margin-bottom: 25px;
    display: block;
    color: var(--clr-common-color-red);
    font-size: 45px;
}

.portfolio__sd-box-content p {
    margin-bottom: 0;
    line-height: 20px;
}

.portfolio__sd-box-content h6 {
    font-size: 22px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 576px) and (max-width: 767px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .portfolio__sd-box-content h6 {
        font-size: 18px;
    }
}

.portfolio-slider img {
    width: 100%;
}

.portfolio-slider-pagination {
    text-align: center;
}

.portfolio-slider-pagination .swiper-pagination-bullet {
    width: 30px;
    height: 4px;
    display: inline-block;
    background: var(--clr-common-color-3);
    margin: 0 3px;
    opacity: 1;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

.portfolio-slider-pagination .swiper-pagination-bullet-active {
    background: var(--clr-theme-1);
}

.portfolio-form h4 {
    margin-bottom: 25px;
}

/*----------------------------------------
    17. Approach CSS
----------------------------------------*/

.approach__area {
    position: relative;
}

.approach__img {
    width: 50%;
    float: left;
    height: 100%;
    position: absolute;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .approach__img {
        width: 100%;
        float: none;
        position: static;
    }
}

.approach__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.approach__content {
    padding-top: 120px;
    padding-left: 120px;
    padding-bottom: 90px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .approach__content {
        padding-left: 50px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .approach__content .section__title {
        margin-bottom: 25px;
    }
    .approach__content .section__title .title {
        font-size: 34px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .approach__content {
        padding-left: 25px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .approach__content .section__title .title {
        margin-bottom: 17px;
        font-size: 30px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px) {
    .approach__content {
        padding-left: 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .approach__content {
        padding-left: 0;
    }
}

.approach__text p {
    padding-right: 35px;
    margin-bottom: 35px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .approach__text p {
        margin-bottom: 15px;
    }
}

.approach__text ul {
    padding-right: 60px;
    display: inline-block;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .approach__text ul {
        padding-right: 0px;
    }
}

.approach__text ul li {
    width: 50%;
    float: left;
    margin-bottom: 16px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .approach__text ul li {
        margin-bottom: 8px;
    }
}

@media (max-width:450px) {
    .approach__text ul li {
        width: 100%;
        float: none;
    }
}

.approach__text ul li i {
    color: #039746;
    font-size: 16px;
    margin-right: 14px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.approach__text ul li:hover i {
    color: var(--clr-common-color-red);
}

/*----------------------------------------
    18. Mission CSS
----------------------------------------*/

.mission__img {
    width: 50%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .mission__img {
        width: 100%;
        float: none;
        position: static;
    }
}

.mission__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mission__content {
    padding-top: 120px;
    padding-right: 90px;
    padding-bottom: 120px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
    .mission__content {
        padding-right: 65px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .mission__content {
        padding-right: 30px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .mission__content .section__title {
        margin-bottom: 25px;
    }
    .mission__content .section__title .title {
        font-size: 34px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .mission__content {
        padding-right: 0;
    }
}

.mission__text p {
    padding-right: 60px;
    margin-bottom: 45px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .mission__text p {
        margin-bottom: 20px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .mission__text p {
        padding-right: 10px;
        margin-bottom: 20px;
    }
}

@media (max-width:450px) {
    .mission__text p {
        padding-right: 0px;
        margin-bottom: 15px;
    }
}

@media (max-width:450px) {
    .mission__text-icon {
        display: none;
    }
}

.mission__text-inner {
    display: flex;
    align-items: center;
    row-gap: 40px;
}

.mission__text-inner img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0 100%);
    margin-right: 35px;
}

@media (max-width:450px) {
    .mission__text-inner img {
        margin-right: 15px;
    }
}

@media (max-width:450px) {
    .mission__text-inner {
        flex-wrap: wrap;
        margin-top: 40px;
    }
}

.mission__text-inner .single-contact-info {
    padding-top: 0;
}

.mission__text-contact li i {
    color: var(--clr-common-color-red);
    margin-right: 9px;
}

/*----------------------------------------
    19. Pricing CSS
----------------------------------------*/

.pricing__box {
    background: var(--clr-common-white);
    padding: 80px 20px;
    text-align: center;
    border: 1px solid transparent;
    position: relative;
    overflow: hidden;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .pricing__box {
        padding: 60px 20px;
    }
}

.pricing__box.active {
    border-color: #039746;
    -webkit-transform: scale(1.04);
    -moz-transform: scale(1.04);
    -ms-transform: scale(1.04);
    transform: scale(1.04);
}

.pricing__box:hover {
    border-color: #039746;
    -webkit-transform: scale(1.04);
    -moz-transform: scale(1.04);
    -ms-transform: scale(1.04);
    transform: scale(1.04);
}

.pricing__badge {
    font-size: 13px;
    font-weight: 700;
    background: #039746;
    color: var(--clr-common-white);
    text-transform: uppercase;
    width: 200px;
    height: 185px;
    display: flex;
    align-items: end;
    justify-content: center;
    padding-bottom: 5px;
    position: absolute;
    top: -106px;
    right: -116px;
    transform: rotate(46deg);
}

.pricing__package-price {
    font-size: 70px;
    font-weight: 700;
    color: #039746;
    line-height: 0.7;
    display: flex;
    justify-content: center;
}

.pricing__package-name {
    color: var(--clr-common-black);
    margin-bottom: 30px;
}

.pricing__package-currency {
    font-size: 20px;
    font-weight: 500;
    color: var(--clr-common-black);
}

.pricing__package-period {
    font-size: 20px;
    font-weight: 500;
    color: var(--clr-common-black);
    margin-top: auto;
    margin-left: -10px;
}

.pricing__features-list {
    border-top: 2px solid var(--clr-common-border-2);
    padding-top: 40px;
    margin-top: 45px;
    margin-bottom: 42px;
}

.pricing__features-list ul li {
    margin-bottom: 8px;
    display: block;
}

.pricing__features-list ul li:last-child {
    margin-bottom: 0px;
}

.pricing-tab .nav-tabs {
    border: none;
}

.pricing-tab .nav-tabs .nav-link {
    margin-bottom: 0;
    border: 0;
}

.pricing-tab .nav .nav-item {
    padding-left: 0px;
}

.pricing-tab .nav .nav-item .nav-link {
    padding: 7px 60px;
    background: transparent;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    font-weight: 600;
    text-transform: capitalize;
    color: var(--clr-common-black);
    position: relative;
    outline: none;
    font-size: 16px;
    border: none;
    z-index: 2;
}

.pricing-tab .nav .nav-item .nav-link::before {
    position: absolute;
    content: "";
    right: 0px;
    top: 50%;
    -webkit-transform: translateY(-50%) translateX(50%);
    -moz-transform: translateY(-50%) translateX(50%);
    -ms-transform: translateY(-50%) translateX(50%);
    transform: translateY(-50%) translateX(50%);
    background: var(--clr-common-color-21);
    width: 80px;
    height: 40px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    border: 1px solid #039746;
}

.pricing-tab .nav .nav-item .nav-link::after {
    position: absolute;
    content: "";
    right: -32px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background: #039746;
    z-index: 1;
}

.pricing-tab .nav .nav-item .nav-link.active {
    color: #039746;
}

.pricing-tab .nav .nav-item .nav-link.active::after {
    right: 10px;
}

.pricing-tab .nav .nav-item:last-child .nav-link {
    padding-right: 0;
}

.pricing-tab .nav .nav-item:last-child .nav-link::after {
    display: none;
}

.pricing-tab .nav .nav-item:last-child .nav-link::before {
    display: none;
}

.pricing-tab .nav .nav-item:first-child .nav-link {
    padding-left: 0;
}

/*----------------------------------------
    20. footer CSS
----------------------------------------*/

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .footer__padd-1 {
        padding-top: 280px;
    }
}

@media (max-width: 575px) {
    .footer__padd-1 {
        padding-top: 265px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .footer__padd-2 {
        padding-bottom: 50px;
    }
}

.footer-area1-bg {
    background: var(--clr-theme-1);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .footer-area1 {
        padding-bottom: 80px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .footer-area--86 {
        margin-top: -86px;
    }
}

.footer-widget-title {
    margin-bottom: 30px;
}

.footer-widget-title h4 {
    color: var(--clr-common-white);
    font-size: 20px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .footer-widget-title {
        margin-bottom: 30px;
    }
}

.footer-photo-gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 15px;
    max-width: 400px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px) {
    .footer-photo-gallery {
        grid-gap: 10px;
    }
}

@media (max-width: 575px) {
    .footer-photo-gallery {
        grid-gap: 15px;
    }
}

@media (max-width:450px) {
    .footer-photo-gallery {
        grid-gap: 10px;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
    .footer-photo-gallery {
        grid-template-columns: repeat(2, 1fr);
    }
}

.footer-widget {
    margin-top: -5px;
}

.footer-widget p {
    color: var(--clr-common-color-4);
}

.footer-widget .footer-widget-link {
    display: grid;
    grid-template-columns: 110px 1fr;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .footer-widget .footer-widget-link {
        grid-template-columns: 140px 1fr;
    }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
    .footer-widget .footer-widget-link {
        grid-template-columns: 100px 1fr;
    }
}

@media (max-width: 575px) {
    .footer-widget .footer-widget-link {
        grid-template-columns: 170px 1fr;
    }
}

@media (max-width:450px) {
    .footer-widget .footer-widget-link {
        grid-template-columns: 135px 1fr;
    }
}

.footer-widget .footer-widget-link li {
    margin-bottom: 22px;
    line-height: 1;
}

.footer-widget .footer-widget-link li:last-child {
    margin-bottom: 0;
}

.footer-widget .footer-widget-link li a {
    font-size: 16px;
    color: var(--clr-common-color-4);
    position: relative;
}

.footer-widget .footer-widget-link li a::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 2px;
    background: var(--clr-common-border-3);
}

.footer-widget .footer-widget-link li:hover {
    color: var(--clr-common-white);
}

.footer-widget .footer-widget-link li:hover a {
    color: var(--clr-common-white);
}

.footer-widget .footer-widget-link li:hover a::before {
    width: 100%;
}

.footer-widget .footer-widget-link-2 {
    display: block;
    line-height: 1;
}

.footer-widget .footer-widget-link-2 li {
    margin-bottom: 20px;
}

.footer-widget .footer-widget-link-2 li:last-child {
    margin-bottom: 0px;
}

.footer-widget .footer-widget-link-2 li a {
    color: var(--clr-common-white);
    position: relative;
}

.footer-widget .footer-widget-link-2 li a::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 2px;
    background: var(--clr-common-border-3);
}

.footer-widget .footer-widget-link-2 li i {
    color: var(--clr-common-white);
    opacity: 0.2;
    margin-right: 20px;
}

.footer-widget .footer-widget-link-2 li:hover i {
    opacity: 1;
}

.footer-widget .footer-widget-link-2 li:hover a::before {
    width: 100%;
}

.footer-widget .footer-photo-item img {
    width: 100%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .footer-widget {
        padding: 0px;
    }
}

@media (max-width: 575px) {
    .footer1-widget1,
    .footer2-widget1,
    .footer3-widget1,
    .footer1-widget3,
    .footer2-widget3,
    .footer3-widget3 {
        margin-bottom: 55px;
    }
}

.subscribe-form {
    position: relative;
}

.subscribe-form .s-clip {
    background: var(--clr-common-white);
    clip-path: polygon(3% 0, 100% 0, 97% 100%, 0% 100%);
}

.subscribe-form .s-input i {
    color: #039746;
    position: absolute;
    top: 22px;
    left: 24px;
    bottom: 0;
}

@media (max-width: 575px) {
    .subscribe-form .s-input i {
        left: 40px;
    }
}

@media (max-width:450px) {
    .subscribe-form .s-input i {
        left: 20px;
    }
}

.subscribe-form input {
    width: 100%;
    height: 50px;
    background: var(--clr-common-white);
    border: 1px solid var(--clr-common-white);
    height: 60px;
    padding-left: 50px;
    padding-right: 20px;
}

@media (max-width: 575px) {
    .subscribe-form input {
        padding-left: 70px;
        padding-right: 40px;
    }
}

@media (max-width:450px) {
    .subscribe-form input {
        padding-left: 50px;
        padding-right: 20px;
    }
}

.subscribe-form button {
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    color: var(--clr-common-white);
    background: var(--clr-common-color-red);
    height: 60px;
    line-height: 60px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    clip-path: polygon(3% 0, 100% 0, 97% 100%, 0% 100%);
    text-transform: uppercase;
    padding: 0px 36px;
}

.subscribe-form button:hover {
    color: #039746;
    border-color: #039746;
    background: var(--clr-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .footer-social-link {
        margin-top: 25px;
    }
}

.footer-social-link ul {
    display: flex;
    gap: 3px;
    flex-wrap: wrap;
    row-gap: 7px;
}

.footer-social-link li a {
    display: block;
    background: var(--clr-common-color-5);
    width: 60px;
    height: 50px;
    line-height: 52px;
    text-align: center;
    clip-path: polygon(10% 0, 100% 0, 90% 100%, 0% 100%);
    color: var(--clr-common-color-6);
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.footer-social-link li a:hover {
    background: var(--clr-common-color-red);
    color: var(--clr-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
    .footer-social-link li a {
        width: 55px;
        height: 50px;
        line-height: 50px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .footer-social-link li a {
        width: 45px;
        height: 45px;
        line-height: 46px;
    }
}

.footer-menu-area.position {
    width: 100%;
    left: 0;
    left: 0;
    right: 0;
    top: -40px;
}

.footer-menu-box {
    padding: 27px 50px 13px 50px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .footer-menu-box {
        text-align: center;
    }
}

@media (max-width: 575px) {
    .footer-menu-box {
        padding: 20px 15px 13px 15px;
    }
}

.footer-menu-box.two {
    padding: 26px 0 12px 0;
}

.footer-menu-bg {
    background: var(--clr-common-color-red);
}

.footer-menu li {
    display: inline-block;
    margin-right: 42px;
}

.footer-menu li:last-child {
    margin-right: 0;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .footer-menu li {
        margin-right: 25px;
    }
}

.footer-menu li a {
    text-transform: uppercase;
    color: var(--clr-common-white);
    font-weight: 600;
    font-family: "Oswald", sans-serif;
}

@media (max-width:450px) {
    .footer-menu li a {
        font-size: 14px;
    }
}

.footer-menu li:hover a {
    opacity: 0.8;
}

.footer-brand-item {
    display: inline-block;
    width: 20%;
}

.footer-brand-item img {
    width: 100%;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px) {
    .copy-right-area {
        padding-top: 109px;
    }
}

@media (max-width: 575px) {
    .copy-right-area {
        padding-top: 100px;
    }
}

.copy-right-text {
    padding-bottom: 27px;
    padding-top: 67px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .copy-right-text {
        padding-top: 0;
    }
}

.copy-right-text p {
    line-height: 1;
    color: var(--clr-common-color-8);
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 0;
    font-family: "Oswald", sans-serif;
}

.copy-right-text p a {
    color: var(--clr-common-white);
}

.copy-right-text-2 p {
    color: var(--clr-common-color-14);
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 0;
}

.copy-right-text-2 a {
    color: var(--clr-common-white);
}

.copy-right-text-3 p {
    color: #039746;
}

.copy-right-text-3 p a {
    color: var(--clr-common-color-red);
}

.copy-right-text-2 {
    text-align: right;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
    .copy-right-text-2 {
        text-align: center;
    }
}

.copy-bg-1 {
    background: var(--clr-common-color-7);
}

.footer3-widget .footer-widget-title h4 {
    color: #039746;
}

.footer3-widget .footer-widget-link a {
    color: var(--clr-common-text) !important;
}

.footer3-widget p {
    color: var(--clr-common-text) !important;
}

.footer3-widget .subscribe-form input {
    background: var(--clr-bg-gray-4);
}

.footer3-widget .subscribe-form button:hover {
    color: var(--clr-common-white);
    background: var(--clr-theme-1);
}

.footer3-widget .footer-social-link ul li a {
    background: var(--clr-common-color-12);
    color: #039746;
}

.footer3-widget1 ul li:hover a {
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
}

/*# sourceMappingURL=style.css.map */

.searchboxselect {
    width: 400px;
    height: 40px;
    padding: 0;
    margin: 0 auto;
    margin-top: 14px;
}

.searchboxselect .nice-select {
    line-height: 30px;
}

.searchboxselect .form-select,
.searchboxselect .form-select ul {
    width: 100%;
}

.searchbox {
    width: 400px;
    height: 40px;
    border-radius: 10px;
    background-color: #fff;
    border: solid 1px #e8e8e8;
    padding: 0;
    padding-left: 0px;
    padding-left: 15px;
    margin: 0 auto;
    margin-top: 14px;
}

.searchbox #tracking-no {
    display: block;
    margin-top: 0;
    background: 0 0;
    padding-top: 0px;
    padding-bottom: 1px;
    padding-left: 2px;
    padding-right: 2px;
    border-width: 0 0 1px 0;
    line-height: 26px;
    height: 40px;
    border-radius: 0;
    border-style: solid;
    width: 100%;
    box-sizing: border-box;
    float: left;
    color: #000;
    width: 80%;
    border: 0;
}

.searchbox .icon {
    width: 40px;
    height: 40px;
    border-radius: 0px 10px 10px 0px;
    line-height: 0;
    float: right;
    background-color: #039746;
    border: solid 1px #039746;
    position: relative;
    color: #fff;
    display: flex;
    top: -1px;
    right: -2px;
    padding: 12px 10px;
}

.tracking-display-block .consignmentsloc div {
    float: left;
    font-size: 16px;
    padding: 10px 0 0 10px;
}

.tracking-display-block .tracknotitle {
    font-size: 22px;
    padding: 10px 0 10px 30px;
    text-align: center;
}

.tracking-display-block .consignmentsinfo {
    text-align: right;
    padding-right: 30px;
    font-size: 16px;
    color: #000;
    padding-top: 12px;
}

.tracking-display-block .main-block,
.tracking-display-block .sub-block {
    background: #FFFFFF;
    box-sizing: border-box;
    color: #000;
    border: 2px solid #e0e0e0;
    margin: 15px 0px;
}

.tracking-display-block .sub-block .consignmentsinfo {
    text-align: center;
    font-size: 14px;
    color: #000;
    padding: 10px 0;
}

.tracking-display-block .transitstatustable {
    background-color: #fff;
    box-shadow: 0 1px 4px 0 rgb(0 0 0 / 7%);
    border: solid 1.2px #e8e8e8;
    margin-top: 10px;
    margin-bottom: 10px;
}

.tracking-display-block .transitstatustable .tabletitle {
    text-transform: uppercase;
    font-size: 14px;
    color: #134da1;
}

.tracking-display-block .transitstatustable th {
    font-size: 13px;
    color: #a2a2a2;
}

.tracking-display-block .transitstatustable td {
    font-size: 13px;
}

.tracking-display-block .support-number {
    font-size: 12px;
    font-weight: bold;
}

#franchise-request-form .form-label,
#career-form .form-label {
    padding-left: 27px;
    padding-top: 10px;
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    letter-spacing: normal;
    word-spacing: normal;
    font-weight: 400;
}

#franchise-request-form .form-control[type=file],
#career-form .form-control[type=file] {
    height: 40px;
    color: #333333;
}

.fill-btn.disabled {
    background-color: var(--clr-common-color-3);
}

.photogallery #buttons {
    text-align: center;
    margin: 20px 0;
}

.photogallery button {
    background-color: #f2f2f2;
    border: 1px solid #ccc;
    padding: 3px 10px 4px 10px;
    margin: 0 1px;
    border-radius: 4px;
    color: #333;
    font-size: 100%;
}

.photogallery button:hover,
.photogallery button.active {
    background-color: #039746;
    color: #fff;
    cursor: pointer;
}

.photogallery #gallery {
    text-align: center;
    max-width: 1920px;
    margin: 0 auto;
}

.photogallery #gallery img {
    width: 200px;
    border-radius: 3px;
    border: 8px solid #fff;
    margin: 6px;
    -webkit-box-shadow: 0 0 3px 3px #ebebeb;
    box-shadow: 0 0 3px 3px #ebebeb;
    float: left;
}

.btn.fixed-vertical-btn {
    background: #039746;
    border-radius: 0;
    color: var(--clr-common-white);
    display: inline-block;
    font-size: 12px;
    height: 40px;
    line-height: 40px;
    position: fixed;
    right: 0;
    top: 30%;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform-origin: bottom right;
    width: 160px;
    padding: 0;
    z-index: 1000;
    border-top-left-radius: 20px 20px;
    border-top-right-radius: 20px 20px;
    font-weight: 500;
    /* Hover styles, 
    media queries */
}

.btn.fixed-vertical-btn:hover {
    background: var(--clr-common-color-red);
}

#todaysdate {
    color: var(--clr-common-white);
}

.chosen-container-single .chosen-single {
    height: 35px;
    line-height: 35px;
}

.chosen-container-single .chosen-single div b {
    background-position-y: 8px;
}

.testimonial-one .testimonial__text p {
    font-size: 15px;
    line-height: 32px;
}

.testimonial-active .swiper-slide-active .testimonial-items {
    background: var(--clr-common-white);
}

.testimonial-active .swiper-slide-active .testimonial-items p,
.testimonial-active .swiper-slide-active .testimonial-items h4,
.testimonial-active .swiper-slide-active .testimonial-items span,
.testimonial-active .swiper-slide-active .testimonial-items .rate i {
    color: unset;
}

.testimonial-active .swiper-slide-active .testimonial-items h4 {
    color: #039746;
}

.news-marquee-container * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.news-marquee-container {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    height: 40px;
    position: relative;
    cursor: pointer;
    background-color: #e7e973;
}

.news-marquee-container .marquee,
.news-marquee-container *[class^="marquee"] {
    display: inline-block;
    white-space: nowrap;
    position: absolute;
}

.news-marquee-container .marquee-content-items {
    display: inline-block;
    padding: 5px;
    margin: 0;
    height: 40px;
    position: relative;
}

.news-marquee-container .marquee-content-items li {
    display: inline-block;
    line-height: 30px;
    color: #000;
    font-size: 14px;
    font-weight: 500;
}

.news-marquee-container .marquee-content-items li:after {
    content: "|";
    margin: 0 1em;
}