/*--------------------- Copyright (c) 2021 ----------------------- 

[Master Stylesheet] 

Template Name: Catering HTML Template 

Version: 1.0.0

Author: Kamleshyadav

Website: https://www.pixelnx.com/

Purchase: http://themeforest.net/user/kamleshyadav

 ------------------------------------------------------------------- 

[Table of contents] 

	01. Global CSS Start

	02. Comman CSS Start

    -- Scroll To Top Button

	-- Header CSS Start

	-- Footer CSS Start

	03. Demo CSS Start

        

	06. Responsive CSS Start

    12. Animation CSS Start

	

-------------------------------------------------------------------*/





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

 	1. Global CSS Start 

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

 @font-face {
    font-family: 'glaser_stencil_dregular';
    src: url('../fonts/glaser_stencil_d_regular-webfont.woff2') format('woff2'),
         url('../fonts/glaser_stencil_d_regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'holidayfreeregular';
    src: url('../fonts/fontsfree-net-holidayfree-webfont.woff2') format('woff2'),
         url('../fonts/fontsfree-net-holidayfree-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

 :root {

    --cat-title-family: 'glaser_stencil_dregular', sans-serif;

    --cat-theme-family: 'Poppins', sans-serif;

    --cat-links-family: 'holidayfreeregular', sans-serif;

    --cat-main-bg: #ffffff;

    --cat-alternate-bg: rgba(236, 236, 236, 0.4);

    --cat-font-color: #44566c;

    --cat-title-color: #212529;

    --cat-white: #ffffff;

    --cat-primary-color: #099547;

    --cat-red-color: #f06e28;

    --cat-border-color: #efefef;

    --cat-input-border: #efefef;

    --cat-input-bg: #ffffff;

    --cat-footer-bg: #141519;

    --cat-placeholder: #b1b1b1;

    --cat-black: #111111;

    --cat-radius0: 0;

    --cat-radius-comman: 3px;

    --cat-radius10: 10px;

    --cat-circle-radius: 50%;

    --cat-page-title-font: 50px;

    --cat-font-size: 16px;

    --cat-font18: 18px;

    --cat-font12: 12px;

    --cat-font14: 14px;

    --cat-font24: 24px;

    --cat-page-title-size: 52px;

    --cat-title-size: 42px;

    --cat-sub-title-size: 26px;

    --cat-widgets-title-size: 22px;

    --cat-shadow: 0 0 30px rgb(0 0 0 / 3%);

    --cat-transition: all 0.3s;

}



* {

    outline: 0 !important;

}



body {

    font-family: var(--cat-theme-family);

    font-weight: 400;

    font-size: var(--cat-font-size);

    line-height: 1.5;

    -webkit-font-smoothing: antialiased;

    overflow-x: hidden;

    background: var(--cat-main-bg);

    color: var(--cat-font-color);

}



body::-webkit-scrollbar {

    width: 6px;

    box-shadow: none;

}



body::-webkit-scrollbar-track {

    background-color: var(--cat-alternate-bg);

    box-shadow: none;

}



body::-webkit-scrollbar-thumb {

    background-color: var(--cat-primary-color);

    box-shadow: none;

}



a {

    color: var(--cat-font-color);

}



a:visited:hover,

a:hover,

a:focus,

button,

button:hover {

    color: var(--cat-primary-color);

}



a,

a:hover,

a:focus,

button,

button:hover {

    text-decoration: none;

    -webkit-transition: var(--cat-transition);

    -moz-transition: var(--cat-transition);

    -ms-transition: var(--cat-transition);

    -o-transition: var(--cat-transition);

    transition: var(--cat-transition);

}



img {

    max-width: 100%;

    height: auto;

}



input,

textarea,

select,

button,

button:focus,

button:hover,

label,

.form-control:focus {

    box-shadow: none;

}



.h1,

.h2,

.h3,

.h4,

.h5,

.h6,

h1,

h2,

h3,

h4,

h5,

h6 {

    margin-bottom: 10px;

    color: var(--cat-title-color);

    text-transform: capitalize;

    font-family: var( --cat-theme-family);

    line-height: 1.2;

    /* font-size: 18px; */

}

.font-size-18px{
    font-size: 18px;
}

strong {

    font-weight: 600;

}



iframe {

    width: 100%;

    border: none;

}



a:visited {

    color: inherit;

}



input,

textarea,

select {

    color: var(--cat-font-color);

    border: 1px solid var(--cat-input-border);

    background: var(--cat-input-bg);

    width: 100%;

    padding: 0 20px;

    height: 40px;

    line-height: 40px;

    border-radius: var(--cat-radius-comman);

    font-size: var(--cat-font14);

}



.input-wrap textarea {

    height: 150px;

    border-radius: var(--cat-radius-comman);

    padding: 20px;

}



input:focus,

textarea:focus,

select:focus {

    border-color: var(--cat-primary-color);

    color: var(--cat-font-color);

}



input:focus,

textarea {

    -webkit-transition: var(--cat-transition);

    -moz-transition: var(--cat-transition);

    -ms-transition: var(--cat-transition);

    -o-transition: var(--cat-transition);

    transition: var(--cat-transition);

}



input::-webkit-input-placeholder,

.input-wrap input::-webkit-input-placeholder,

.input-wrap textarea::-webkit-input-placeholder,

textarea::-webkit-input-placeholder {

    color: var(--cat-placeholder);

}



.input-wrap input::-moz-placeholder,

.input-wrap textarea::-moz-placeholder,

input::-moz-placeholder,

textarea::-moz-placeholder {

    color: var(--cat-font-color);

    opacity: .6;

}



.input-wrap input:-ms-input-placeholder,

input:-ms-input-placeholder,

.input-wrap textarea:-ms-input-placeholder,

textarea:-ms-input-placeholder {

    color: var(--cat-font-color);

    opacity: .6;

}



.input-wrap input:-moz-placeholder,

input:-moz-placeholder,

.input-wrap textarea:-moz-placeholder,

textarea:-moz-placeholder {

    color: var(--cat-font-color);

    opacity: .6;

}



input::-webkit-outer-spin-button,

input::-webkit-inner-spin-button {

    -webkit-appearance: none;

    margin: 0;

}



.input-wrap label {

    font-weight: 600;

    color: var(--cat-title-color);

    margin: 0 0 10px;

}



.display-flex {

    display: flex;

    flex-wrap: wrap;

}



textarea {

    resize: none;

    height: 100px;

}



.cat-input-wrap input::-webkit-calendar-picker-indicator {

    filter: invert(1);

}





/* Go to Top button */





/* Go to top Button*/



.scroll-to-topp {

    position: fixed;

    right: 15px;

    bottom: 15px;

    cursor: pointer;

    width: 50px;

    height: 50px;

    text-align: center;

    line-height: 50px;

    -webkit-border-radius: var(--cat-radius10);

    -moz-border-radius: var(--cat-radius10);

    border-radius: var(--cat-radius10);

    z-index: 9;

    visibility: hidden;

    -webkit-transform: translateY(150px);

    -ms-transform: translateY(150px);

    transform: translateY(150px);

    background: var(--cat-red-color);

    color: var(--cat-white);

    font-size: var(--cat-sub-title-size);

}



.scroll-to-topp:hover,

.scroll-to-topp:visited,

.scroll-to-topp:visited:hover,

.scroll-to-topp:focus {

    color: var(--cat-white);

}



.scroll-to-topp.active {

    visibility: visible;

    -webkit-transform: translateY(0);

    -ms-transform: translateY(0);

    transform: translateY(0);

    animation: bounceInDown 2s;

    -webkit-animation: bounceInDown 2s;

    -moz-animation: bounceInDown 2s;

}



@keyframes bounce {

    0%,

    100% {

        transform: translateY(-20px);

    }

    50% {

        transform: translateY(0px);

    }

}





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

 	Comman CSS Start

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



.cat-btn {

    position: relative;

    display: inline-block;

    color: var(--cat-white);

    background-color: var(--cat-primary-color);

    border-radius: 30px;

    overflow: hidden;

    transition: all 500ms ease;

    z-index: 1;

    padding: 13px 15px;

    text-align: center;

    font-size: 14px;

    font-weight: 600;

    text-transform: capitalize;

    min-width: 150px;

}



.cat-btn::before {

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    content: "";

    border-radius: 30px;

    background-color: var(--cat-primary-color);

    transform: scale(2, 2);

    -webkit-transform-origin: right center;

    transform-origin: left center;

    transition: transform 500ms linear;

    transition-timing-function: ease-out;

    z-index: -1;

}



.cat-btn:hover {

    color: var(--cat-white);

    background-color: var(--cat-black);

}



.cat-btn:hover,

.cat-btn:focus,

.cat-btn:visited,

.cat-btn:active,

a.cat-btn:hover,

a.cat-btn:focus,

a.cat-btn:visited,

a.cat-btn:active {

    color: var(--cat-white);

    background-color: var(--cat-black);

}



.cat-btn:hover:before {

    -webkit-transform: scale(0, 1);

    transform: scale(0, 1);

    -webkit-transform-origin: right center;

    transform-origin: right center;

    -webkit-transition-timing-function: ease-out;

    transition-timing-function: ease-out;

}



.btn-black {

    background: var(--cat-red-color);

}



.btn-black:before {

    background: var(--cat-red-color);

}



.btn-black:hover,

.btn-black:focus,

.btn-black:visited,

.btn-black:active,

a.btn-black:hover,

a.btn-black:focus,

a.btn-black:visited,

a.btn-black:active {

    color: var(--cat-white);

    background: var(--cat-primary-color);

}





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

 	Preloader CSS

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



.cat-preloader {

    background-color: var(--cat-white);

    bottom: 0;

    left: 0;

    position: fixed;

    right: 0;

    top: 0;

    z-index: 2147483647;

    width: 100%;

    height: 100%;

}



.cat-preloader-inner {

    background-position: center center;

    background-repeat: no-repeat;

    height: auto;

    position: absolute;

    left: 50%;

    top: 50%;

    text-align: center;

    transform: translate(-50%, -50%);

    -webkit-transform: translate(-50%, -50%);

    -ms-transform: translate(-50%, -50%);

    -moz-transform: translate(-50%, -50%);

    -o-transform: translate(-50%, -50%);

}





/* Animation */



@keyframes shake {

    10%,

    90% {

        transform: translate3d(1px, -1px, 0);

    }

    20%,

    80% {

        transform: translate3d(-2px, 2px, 0);

    }

    30%,

    50%,

    70% {

        transform: translate3d(3px, -4px, 0);

    }

    40%,

    60% {

        transform: translate3d(0px, 4px, 0);

    }

}





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



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

.banner-head-op{
    font-family: var(--cat-links-family);
    /* margin-top: 100px; */
    position: absolute;
    top: 70px;
}

.cat-link {

        font-weight: 500 !important;
    display: inline-block;
    color: var(--cat-red-color);
    position: relative;
    padding: 0 0 3px;
    font-family: var(--cat-links-family);
    font-size: 50px;

}
.cat-link2 {

    font-weight: 500 !important;
display: inline-block;
color: var(--cat-red-color);
position: relative;
padding: 0 0 3px;
font-family: var(--cat-links-family);
font-size: 18px;

}


.cat-link svg {

    height: 12px;

    fill: var(--cat-title-color);

}



.cat-link:hover svg {

    fill: var(--cat-primary-color);

}



.cat-link:hover svg,

.cat-link svg {

    -webkit-transition: var(--cat-transition);

    -moz-transition: var(--cat-transition);

    -ms-transition: var(--cat-transition);

    -o-transition: var(--cat-transition);

    transition: var(--cat-transition);

}





/*  Header */



.menu-btn-wrap {

    display: flex;

    flex-wrap: wrap;

}



.header-wrapper {

    padding: 10px 0px 10px;

    min-height: 80px;

    display: flex;

    align-items: center;

    flex-wrap: wrap;

}



.main-menu-container {

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    justify-content: flex-end;

}



.header-wrapper .row {

    align-items: center;

}



.ext-logo img {

    max-height: 50px;

}



.main-menu>ul {

    position: relative;

}



.main-menu ul {

    padding: 0;

    margin: 0;

    display: flex;

    flex-wrap: wrap;

}



.main-menu ul li {

    position: relative;

    list-style: none;

}



.has-sub-menu .sub-menu li {

    width: 100%;

}



.main-menu ul>li>a {

    padding: 10px 5px;

    display: inline-block;

    font-weight: 700;

    color: var(--cat-title-color);

    text-transform: capitalize;

    font-size: var(--cat-font14);

}



.main-menu ul>li>a:hover,

.main-menu ul>li.active>a {

    color: var(--cat-primary-color);

}



.main-menu .sub-menu>li>a {

    width: 100%;

    padding: 10px 20px;

    position: relative;

}



.has-sub-menu>.sub-menu>li>a:before {

    content: "";

    position: absolute;

    left: 0;

    height: 1px;

    width: 0px;

    background: var(--cat-primary-color);

    top: 0;

    bottom: 0;

    margin: auto;

}



.has-sub-menu>.sub-menu>li:hover>a,

.main-menu ul>li>a.active {

    color: var(--cat-primary-color);

}



.has-sub-menu>.sub-menu>li:hover>a:before {

    color: var(--cat-primary-color);

    width: 10px;

}



.has-sub-menu .sub-menu li:hover a:before,

.has-sub-menu .sub-menu li a:before {

    -webkit-transition: var(--cat-transition);

    -moz-transition: var(--cat-transition);

    -ms-transition: var(--cat-transition);

    -o-transition: var(--cat-transition);

    transition: var(--cat-transition);

}





/* Menu Button*/



.menu-btn-wrap .menu-btn {

    margin: 0 0 0 20px;

}



.menu-btn-wrap>a {

    width: 50px;

    height: 50px;

    display: flex;

    text-align: left;

    padding: 15px 15px;

    flex-wrap: wrap;

    align-items: center;

    justify-content: center;

    color: var(--cat-white);

    margin: 0 0 0 20px;

    background: var(--cat-primary-color);

    border-radius: 50%;

}



.menu-btn span {

    display: block;

    width: 18px;

    height: 2px;

    -webkit-transition: var(--cat-transition);

    -moz-transition: var(--cat-transition);

    -ms-transition: var(--cat-transition);

    -o-transition: var(--cat-transition);

    transition: var(--cat-transition);

    margin: 3px 0;

    background: var(--cat-white);

}



.menu-btn span:nth-child(2) {

    width: 15px;

}



.menu-btn-wrap.open .menu-btn span:nth-child(2) {

    opacity: 0;

    visibility: hidden;

}



.menu-btn-wrap.open .menu-btn span:nth-child(1) {

    transform: translate(0px, 4px) rotate(-48deg);

}



.menu-btn-wrap.open .menu-btn span:nth-child(3) {

    transform: translate(0px, -6px) rotate(48deg);

}



.header-wrapper {

    position: absolute;

    top: 0;

    left: 0;

    z-index: 9;

    right: 0;

}



.main-menu-container {

    position: relative;

    padding: 10px 0;

}



.cat-logo-wrapper {}





/* Search CSS Start */



.search-box {

    position: fixed;

    right: 0;

    bottom: 0;

    top: 0;

    width: 100%;

    left: 0%;

    background: rgba(0, 0, 0, 0.85);

    z-index: 99;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    align-items: center;

    cursor: url(../images/main/close-search.png), auto;

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

    -moz-transform: translateY(-100%);

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

    -o-transform: translateY(-100%);

    transform: translateY(-100%);

}



.search-box.show {

    -webkit-transform: translateY(0%);

    -moz-transform: translateY(0%);

    -ms-transform: translateY(0%);

    -o-transform: translateY(0%);

    transform: translateY(0%);

}



.search-box.show,

.search-box {

    -webkit-transition: all 0.5s;

    -moz-transition: all 0.5s;

    -ms-transition: all 0.5s;

    -o-transition: all 0.5s;

    transition: all 0.5s;

}



.search-box-container {

    width: 50%;

    position: relative;

    text-align: end;

    -webkit-transform: translateY(200px);

    -moz-transform: translateY(200px);

    -ms-transform: translateY(200px);

    -o-transform: translateY(200px);

    transform: translateY(200px);

    visibility: hidden;

}



.search-box.show .search-box-container {

    -webkit-transform: translateY(0px);

    -moz-transform: translateY(0px);

    -ms-transform: translateY(0px);

    -o-transform: translateY(0px);

    transform: translateY(0px);

    visibility: visible;

}



.search-box.show .search-box-container,

.search-box-container {

    -webkit-transition: all 2s;

    -moz-transition: all 2s;

    -ms-transition: all 2s;

    -o-transition: all 2s;

    transition: all 2s;

}



.search-bar-inner {

    position: relative;

    height: 50px;

}



.search-bar-inner input {

    width: 100%;

    height: 50px;

    padding: 12px 55px 12px 0;

    border: none;

    border-radius: 0;

    background: transparent;

    border-bottom: 2px solid var(--cat-white);

    color: var(--cat-white);

}



.search-bar-inner input::-webkit-input-placeholder {

    color: var(--cat-white);

    opacity: 90%;

}



.search-bar-inner input::-moz-placeholder {

    color: var(--cat-white);

    opacity: 90%;

}



.search-bar-inner input:-ms-input-placeholder {

    color: var(--cat-white);

    opacity: 90%;

}



.search-bar-inner input:-moz-placeholder {

    color: var(--cat-white);

    opacity: 90%;

}



.search-bar-inner button {

    position: absolute;

    right: 3px;

    top: 3px;

    bottom: 3px;

    border: none;

    background: transparent;

    color: var(--cat-white);

    width: 45px;

    font-size: 20px;

    border-radius: 26px;

}



.close-btn {

    margin: 0 0 20px 0;

    display: inline-block;

    padding: 0 15px;

}



.close-btn svg {

    width: 20px;

    fill: var(--cat-white);

}





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

 	Banner CSS

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



.cat-banner-wrapper {

    background: var(--cat-alternate-bg);

    position: relative;

    min-height: 98vh;

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    justify-content: center;

    padding: 150px 80px;

}



.cat-banner-wrapper:before {

    position: absolute;

    content: "";

    background-image: url(../images/main/sahp2.png);

    background-repeat: no-repeat;

    background-position: center;

    right: 100px;

    top: 150px;

    width: 100px;

    height: 100px;

    animation: rotateIndefinitely 8s infinite linear;

    opacity: .08;

}



.cat-banner-wrapper:after {

    position: absolute;

    content: "";

    background-image: url(../images/main/sahp2.png);

    background-repeat: no-repeat;

    background-position: center;

    left: 100px;

    bottom: 150px;

    width: 100px;

    height: 100px;

    animation: rotateIndefinitely 8s infinite linear;

    opacity: .08;

}



.cat-banner-section {

    position: relative;

}



.cat-banner-social {

    position: absolute;

    right: 20px;

    top: 0;

    bottom: 0;

    margin: auto;

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    z-index: 999;

}



.cat-banner-social ul {

    padding: 0;

    margin: 0;

}



.cat-banner-social ul li {

    list-style: none;

    writing-mode: vertical-lr;

}



.cat-banner-social ul li+li {

    margin: 30px 0 0;

}



.cat-banner-social ul li a {

    font-weight: 700;

}



.cat-banner-social ul li a:hover {

    color: var(--cat-primary-color);

}



.cat-banner-text {

    padding: 0 30px 0 0;

}



.cat-banner-text-inner {

    margin: 30px 0;

}



.cat-banner-text h4 {

    font-size: 18px;

    font-family:var(--cat-theme-family);

    font-weight: 700;

    margin: 0px;

    display: inline-block;

    padding: 8px 30px;

    border-radius: 50px;

    color: var(--cat-primary-color);

    position: relative;

}



.cat-banner-text h4::before {

    content: "";

    position: absolute;

    left: 0;

    right: 0;

    top: 0;

    /* background-color: var(--cat-primary-color); */

    bottom: 0;

    opacity: .1;

}



.cat-banner-text h4 span {

    position: relative;

    z-index: 1;

}



.cat-banner-title {

    font-size: 52px;

    margin: 18px 0 21px;

    font-weight: 900;
    font-family: 'glaser_stencil_dregular', Courier, monospace;

}



.cat-banner-text-inner p {

    font-size: 18px;

    max-width: 700px;

    margin: 0 auto 11px;

    font-weight: 700;

}



.cat-banner-contact {

    color: var(--cat-white);

    background: var(--cat-primary-color);

    position: absolute;

    bottom: 0;

    left: 0;

    padding: 20px 15px;

    top: 0;

    margin: auto;

    height: fit-content;

    writing-mode: tb;

    -webkit-transform: rotate( 180deg);

    -moz-transform: rotate(180deg);

    -ms-transform: rotate(180deg);

    -o-transform: rotate(180deg);

    transform: rotate( 180deg);

    border-radius: 20px 0 0 20px;

    font-weight: 600;

    font-size: 14px;

    letter-spacing: 2px;

}



.cat-banner-contact i {

    -webkit-transform: rotate( 120deg);

    -moz-transform: rotate( 120deg);

    -ms-transform: rotate( 120deg);

    -o-transform: rotate( 120deg);

    transform: rotate( 120deg);

}



.cat-banner-contact:hover,

.cat-banner-contact:visited,

.cat-banner-contact:focus {

    color: var(--cat-white);

    background: var(--cat-primary-color);

}



.zooming {

    animation: 5s zooming infinite linear;

    -webkit-animation: 5s zooming infinite linear;

    -moz-animation: 5s zooming infinite linear;

    -ms-animation: 5s zooming infinite linear;

    -o-animation: 5s zooming infinite linear;

}



@-webkit-keyframes zooming {

    0% {

        -webkit-transform: scale(0.9);

        transform: scale(0.9);

    }

    50% {

        -webkit-transform: scale(1);

        transform: scale(1);

    }

    100% {

        -webkit-transform: scale(0.9);

        transform: scale(0.9);

    }

}



@keyframes zooming {

    0% {

        -webkit-transform: scale(0.9);

        transform: scale(0.9);

    }

    50% {

        -webkit-transform: scale(1);

        transform: scale(1);

    }

    100% {

        -webkit-transform: scale(0.9);

        transform: scale(0.9);

    }

}



.cat-banner-btn-wrap {

    margin: 32px 0 0; 
    /* display: none; */

}



.cat-banner-btn-wrap .cat-btn:first-of-type {

    margin-right: 16px;

}



.header-btn {

    margin: 0 0 0 20px;

}





/**/



@keyframes rotateIndefinitely {

    0% {

        transform: rotate(0deg);

    }

    25% {

        transform: rotate(90deg);

    }

    50% {

        transform: rotate(180deg);

    }

    75% {

        transform: rotate(270deg);

    }

    100% {

        transform: rotate(360deg);

    }

}





/* Banner Scroll Down */



.scroll-down-section {

    position: absolute;

    z-index: 99;

    left: 0;

    right: 0;

    margin: auto;

    bottom: 50px;

}



.scroll-down-section:before {

    background: var(--cat-title-color);

    width: 1px;

    height: 20px;

    position: absolute;

    bottom: 40px;

    left: -1px;

    right: 0;

    margin: 0 auto;

    content: '';

}



.scroll-down-section span {

    position: absolute;

    bottom: 0;

    left: 50%;

    width: 23px;

    height: 40px;

    margin-left: -12px;

    border: 2px solid var(--cat-title-color);

    -webkit-border-radius: var(--cat-radius10);

    -moz-border-radius: var(--cat-radius10);

    border-radius: var(--cat-radius10);

}



.scroll-down-section span:before {

    position: absolute;

    top: 4px;

    left: 50%;

    content: '';

    width: 5px;

    height: 9px;

    margin-left: -3px;

    border: 2px solid var(--cat-title-color);

    -webkit-border-radius: 3px;

    border-radius: 3px;

    -webkit-animation: down 2s infinite;

    animation: down 2s infinite;

    box-sizing: border-box;

}



@-webkit-keyframes down {

    0% {

        -webkit-transform: translate(0, 0);

        opacity: 0;

    }

    40% {

        opacity: 1;

    }

    80% {

        -webkit-transform: translate(0, 20px);

        opacity: 0;

    }

    100% {

        opacity: 0;

    }

}



@keyframes down {

    0% {

        transform: translate(0, 0);

        opacity: 0;

    }

    40% {

        opacity: 1;

    }

    80% {

        transform: translate(0, 20px);

        opacity: 0;

    }

    100% {

        opacity: 0;

    }

}





/* Banner Slider */



.cat-banner-img {

    display: flex;

    flex-wrap: wrap;

    position: relative;

    background-image: url(../images/main/banner-img.png);

    background-repeat: no-repeat;

    background-position: center;

    background-size: auto;

    margin: 0 0 70px;

    border: 10px solid var(--cat-border-color);

}

.banner-img{
    margin-top: -40px;
}
.mail-icon-link{
    margin-top: 5px;
    margin-bottom: 10px;
    margin-right: 18px;
    color: #159a50;
}
.cat-banner-slider {

    max-width: 100%;

    box-shadow: 0 0 20px rgb(0 0 0 / 8%);

}



.cat-banner-slides img {

    width: 100%;

    max-height: 500px;

    min-height: 500px;

    object-fit: cover;

}



body .search-field {

    box-shadow: 0 0 10px rgb(137 137 137 / 10%);

    height: 50px;

    position: relative;

    display: flex;

    flex-wrap: wrap;

    align-items: center;

}



.search-field input {

    height: 50px;

    position: relative;

    padding: 0 60px 0 20px;

}



.search-field .cat-search-btn {

    position: absolute;

    right: 0;

    color: var(--cat-primary-color);

    width: 60px;

    text-align: center;

    height: 50px;

    line-height: 50px;

}



.cat-banner-single-img {

    height: 165px;

    width: 250px;

    position: absolute;

    left: 0;

    bottom: -70px;

    margin: auto;

    z-index: 2;

    right: 0;

    border: 8px solid var(--cat-border-color);

}



.cat-banner-single-img img {

    height: 150px;

    width: 100%;

    object-fit: cover;

}





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

 	Dish Offer CSS Start

     

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



.cat-top-dish-section {

    position: relative;

    background: var(--cat-white);

    box-shadow: 0 0 30px rgb(0 0 0 / 8%);

    border-radius: 10px;

    overflow: hidden;

    margin: 0 0 30px;

}



.cat-top-dish-info {

    padding: 16px 20px 14px;
    background: var(--cat-red-color);

}



.cat-top-dish-img img {

    height: 250px;

    object-fit: cover;

    width: 100%;

}



.cat-top-dish-info h4 {

    font-size: 18px;

    font-weight: 600;

    padding-right: 80px;

    position: relative;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;
    color: var(--cat-white);

}



.cat-top-dish-info h4 span {

    position: absolute;

    right: 0;

    color: var(--cat-primary-color);

    font-weight: 700;

}



.cat-top-dish-info ul {

    padding: 0;

    margin: 0;

}



.cat-top-dish-info ul li {

    list-style: none;

    color: #f7a032;

    display: inline-flex;

}


/* 
.cat-top-dish-section:hover h4 {

    color: var(--cat-primary-color);

} */



.cat-top-dish-section h4,

.cat-top-dish-section:hover h4,

.cat-top-dish-section:hover,

.cat-top-dish-section {

    -webkit-transition: var(--cat-transition);

    -moz-transition: var(--cat-transition);

    -ms-transition: var(--cat-transition);

    -o-transition: var(--cat-transition);

    transition: var(--cat-transition);

}



.cat-top-dish-img {

    overflow: hidden;

    position: relative;

}



.cat-top-dish-img::before {

    content: "";

    position: absolute;

    z-index: 1;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    opacity: 0;

    background: #ffffff;

    -webkit-transform: scaleX(1);

    -ms-transform: scaleX(1);

    transform: scaleX(1);

    -webkit-transform-origin: 90%;

    -ms-transform-origin: 90%;

    transform-origin: 90%;

    -webkit-transition-property: -webkit-transform;

    transition-property: -webkit-transform;

    -o-transition-property: transform;

    transition-property: transform;

    transition-property: transform, -webkit-transform;

    -webkit-transition-duration: 0.3s;

    -o-transition-duration: 0.3s;

    transition-duration: 0.3s;

    -webkit-transition-timing-function: ease-out;

    -o-transition-timing-function: ease-out;

    transition-timing-function: ease-out;

    -webkit-transition: 0.5s;

    -o-transition: 0.5s;

    transition: 0.5s;

}



.cat-top-dish-img::after {

    content: "";

    position: absolute;

    z-index: 1;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    opacity: 0;

    background: #ffffff;

    -webkit-transform: scaleY(1);

    -ms-transform: scaleY(1);

    transform: scaleY(1);

    -webkit-transform-origin: 90%;

    -ms-transform-origin: 90%;

    transform-origin: 90%;

    -webkit-transition-property: -webkit-transform;

    transition-property: -webkit-transform;

    -o-transition-property: transform;

    transition-property: transform;

    transition-property: transform, -webkit-transform;

    -webkit-transition-duration: 0.3s;

    -o-transition-duration: 0.3s;

    transition-duration: 0.3s;

    -webkit-transition-timing-function: ease-out;

    -o-transition-timing-function: ease-out;

    transition-timing-function: ease-out;

    -webkit-transition: 0.5s;

    -o-transition: 0.5s;

    transition: 0.5s;

}



.cat-top-dish-section:hover .cat-top-dish-img::before {

    -webkit-transform: scaleX(0);

    -ms-transform: scaleX(0);

    transform: scaleX(0);

    opacity: 0.5;

}



.cat-top-dish-section:hover .cat-top-dish-img::after {

    -webkit-transform: scaleY(0);

    -ms-transform: scaleY(0);

    transform: scaleY(0);

    opacity: 0.5;

}





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

 	Service CSS Start

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



.cat-service-section {

    background: var(--cat-white);

    box-shadow: 0 0 30px rgb(0 0 0 / 8%);

    margin: 0 0 30px;

    padding: 40px 20px 30px;

    text-align: center;

    border-radius: 10px;

}

.cat-service-section:hover {
    background: #10cf65;
    /* background: var(--cat-red-color); */
    color: var(--cat-white); 
    cursor: pointer;
}

.cat-service-img {

    text-align: center;

    margin: 0 0 30px;

    position: relative;

    height: 130px;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    align-items: center;

}



.cat-service-img img {

    height: 80px;

    width: 80px;

    object-fit: contain;

    position: relative;

}



.cat-service-img:before {

    content: "";

    position: absolute;

    left: 0;

    right: 0;

    bottom: 0;

    top: 0;

    background: var(--cat-primary-color);

    width: 130px;

    margin: auto;

    border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;

    animation: morphing 3s infinite;

    height: 130px;

    opacity: .06;

}



@-moz-keyframes morphing {

    0% {

        border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;

        box-shadow: 15px 15px 50px rgba(0, 0, 0, 0.2);

    }

    25% {

        border-radius: 58% 42% 75% 25%/76% 46% 54% 24%;

    }

    50% {

        border-radius: 50% 50% 33% 67%/55% 27% 73% 45%;

        box-shadow: -10px -5px 50px rgba(0, 0, 0, 0.2);

    }

    75% {

        border-radius: 33% 67% 58% 42%/63% 68% 32% 37%;

    }

}



@-webkit-keyframes morphing {

    0% {

        border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;

        box-shadow: 15px 15px 50px rgba(0, 0, 0, 0.2);

    }

    25% {

        border-radius: 58% 42% 75% 25%/76% 46% 54% 24%;

    }

    50% {

        border-radius: 50% 50% 33% 67%/55% 27% 73% 45%;

        box-shadow: -10px -5px 50px rgba(0, 0, 0, 0.2);

    }

    75% {

        border-radius: 33% 67% 58% 42%/63% 68% 32% 37%;

    }

}



@-o-keyframes morphing {

    0% {

        border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;

        box-shadow: 15px 15px 50px rgba(0, 0, 0, 0.2);

    }

    25% {

        border-radius: 58% 42% 75% 25%/76% 46% 54% 24%;

    }

    50% {

        border-radius: 50% 50% 33% 67%/55% 27% 73% 45%;

        box-shadow: -10px -5px 50px rgba(0, 0, 0, 0.2);

    }

    75% {

        border-radius: 33% 67% 58% 42%/63% 68% 32% 37%;

    }

}



@keyframes morphing {

    0% {

        border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;

        box-shadow: 15px 15px 50px rgba(0, 0, 0, 0.2);

    }

    25% {

        border-radius: 58% 42% 75% 25%/76% 46% 54% 24%;

    }

    50% {

        border-radius: 50% 50% 33% 67%/55% 27% 73% 45%;

        box-shadow: -10px -5px 50px rgba(0, 0, 0, 0.2);

    }

    75% {

        border-radius: 33% 67% 58% 42%/63% 68% 32% 37%;

    }

}



.cat-service-info h4 {

    margin: 0;

    font-size: 18px;

    font-weight: 600;

}



.cat-service-info p {

    margin: 0 0 17px;

}



.cat-service-info h4 {

    position: relative;

    padding: 0 0 10px;

    margin: 0 0 20px;

    display: inline-block;

}



.cat-service-info h4:before {

    content: "";

    position: absolute;

    left: 0;

    right: 0;

    margin: auto;

    bottom: 0;

    background: var(--cat-primary-color);

    width: 50%;

    height: 2px;

    border-radius: 20px;

}



/* .cat-service-section:hover .cat-service-info h4 {

    color: var(--cat-primary-color);

} */



.cat-service-section:hover .cat-service-info h4,

.cat-service-section .cat-service-info h4 {

    -webkit-transition: var(--cat-transition);

    -moz-transition: var(--cat-transition);

    -ms-transition: var(--cat-transition);

    -o-transition: var(--cat-transition);

    transition: var(--cat-transition);

}





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

 	Booking CSS Start

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



.cat-section-spacer {

    padding: 76px 0 50px;

}



.cat-section-spacer-equal {

    padding: 76px 0 80px;

}





/* Heading */



.cat-heading-wrapper {

    position: relative;

    margin: 0 0 42px;

    text-align: center;

}



.cat-heading-wrapper h4 {

    font-size: var(--cat-font18);

    position: relative;

    display: inline-block;

    padding: 0 30px;

    font-family: var(--cat-theme-family);

    color: var(--cat-primary-color);

    font-weight: 700;

}



.cat-heading-wrapper h2::first-letter {

    color: var(--cat-primary-color);

}



.cat-heading-wrapper h4::before,

.cat-heading-wrapper h4::after {

    content: "";

    position: absolute;

    width: 20px;

    height: 4px;

    border-radius: 10px;

    background: var(--cat-primary-color);

    top: 0;

    bottom: 0;

    margin: auto;

}



.cat-heading-wrapper h4::before {

    left: 0;

}



.cat-heading-wrapper h4::after {

    right: 0;

}



.cat-heading-wrapper h2 {

    margin: 0;

    font-weight: 700;

    font-size: 36px;

}





/* Input */



.input-wrap {

    margin: 0 0 30px;

    display: inline-block;

    width: 100%;

}



.nice-select {

    width: 100%;

    border-color: var(--cat-input-border);

}



.nice-select .list {

    width: 100%;

}



.nice-select.open,

.nice-select:active,

.nice-select:focus {

    border-color: var(--cat-primary-color);

}





/* Booking*/



.cat-booking-wrapper {

    background-image: url(../images/main/booking-bg.jpg);

    background-position: center bottom;

    background-size: cover;

}



.cat-booking-form {

    background: var(--cat-white);

    box-shadow: 0 0 20px rgb(0 0 0 / 8%);

    padding: 50px 50px 48px;

    border-radius: 10px;

    position: relative;

    margin-top: 5px;

}



.cat-booking-form:before {

    content: "";

    position: absolute;

    bottom: 0;

    left: 0;

    width: 10px;

    background-image: url(../images/main/shape.png);

    background-position: center;

    background-repeat: repeat-y;

    height: 100%;

}



.cat-booking-form:after {

    content: "";

    position: absolute;

    bottom: 0;

    right: 0;

    width: 10px;

    background-image: url(../images/main/shape.png);

    background-position: center;

    background-repeat: repeat-y;

    height: 100%;

    transform: rotate( 180deg);

}



.has-bg {

    background: var(--cat-alternate-bg);

    position: relative;

}



.has-bg:before {

    content: "";

    position: absolute;

    left: 0;

    right: 0;

    bottom: 0;

    top: 0;

    background: url(../images/main/bg-pattern.png);

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    opacity: .04;

}



.has-bg .container {

    position: relative;

    z-index: 1;

}



.cat-booking-wrapper {

    margin: -35px 0 80px;

}



.cat-booking-form .cat-shapp {

    position: absolute;

    top: 0;

    left: -19px;

    width: 0;

    height: 0;

    border-bottom: 30px solid var(--cat-primary-color);

    border-left: 20px solid transparent;

}



.cat-booking-form .cat-shapp2 {

    position: absolute;

    top: 0;

    right: -19px;

    width: 0;

    height: 0;

    border-bottom: 30px solid var(--cat-primary-color);

    border-right: 20px solid transparent;

}





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

 	Menu Section  CSS Start

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



.cat-menu-wrapper {

    position: relative;

}





/* Tab CSS */



.nav-pills .nav-link.active,

.nav-pills .show>.nav-link {

    background: var(--cat-primary-color);

    color: var(--cat-white);

}



.nav li.nav-item {

    padding: 0;

    margin: 0 10px 10px;

}



.nav-pills .nav-link {

    padding: 12px 15px;

    font-weight: 700;

    position: relative;

    color: var(--cat-primary-color);

    background: var(--cat-white);

    border-radius: 40px;

    border: 1px solid var(--cat-primary-color);

    min-width: 150px;

}



.nav-pills .nav-link:hover {

    color: var(--cat-primary-color);

}



.nav-pills .nav-link.active:hover {

    color: var(--cat-white);

}



.nav-pills .nav-link.active,

.nav-pills .show>.nav-link {

    -webkit-transition: all 0.3s;

    -moz-transition: all 0.3s;

    -ms-transition: all 0.3s;

    -o-transition: all 0.3s;

    transition: all 0.3s;

}



.cat-nav-tabs {

    width: 100%;

}



.cat-menu-section {}



.cat-menu-section::-webkit-scrollbar {

    width: 3px;

    box-shadow: none;

}



.cat-menu-section::-webkit-scrollbar-track {

    background-color: var(--cat-black);

    box-shadow: none;

}



.cat-menu-section::-webkit-scrollbar-thumb {

    background-color: var(--cat-primary-color);

    box-shadow: none;

}



.cat-page-row {

    width: 100%;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

}



.cat-nav-tabs .nav {

    width: 100%;

    justify-content: center;

    margin: 0 0 30px;

}



.tab-content {

    width: 100%;
    text-align: left;
}



.cat-menu-section {

    margin: 0 0 30px;

}





/* Pricing */



.cat-pricing-title h4 {

    color: var(--cat-title-color);

    font-size: 22px;

    padding-right: 100px;

    margin-bottom: 5px;

    font-weight: 600;

}



.cat-pricing-list:hover .cat-pricing-title h4 {

    color: var(--cat-primary-color);

}



.cat-pricing-list p {

    margin: 0;

}



.cat-pricing-title .cat-price {

    position: absolute;

    top: 0;

    right: 0;

    font-weight: 800;

    color: var(--cat-primary-color);

    font-size: 22px;

}



.cat-pricing-list {

    display: flex;

    width: 100%;

    border-bottom: 1px solid rgb(0 0 0 / 12%);

    margin-bottom: 20px;

    position: relative;

    padding: 0 15px 20px;

    flex-wrap: wrap;

    align-items: center;

}



.cat-pricing-list:last-of-type {

    border-bottom: none;

    margin-bottom: 0;

    padding-bottom: 0;

}



.cat-pri-icon {

    width: 80px;

    display: flex;

    height: 80px;

    text-align: center;

    flex-wrap: wrap;

    align-items: center;

    justify-content: center;

}



.cat-price-info {

    padding: 0 0 0 20px;

    width: calc(100% - 80px);

}
.cat-pricing-title{

    
    font-family: var(--cat-title-family);

}



.cat-pri-icon img {

    height: 80px;

    object-fit: cover;

    border-radius: 10px;

    width: 80px;

}



.cat-pricing-list:hover,

.cat-pricing-list,

.cat-pricing-list:hover .cat-pricing-title h4,

.cat-pricing-title h4,

.cat-pricing-list:hover .cat-pricing-title h4,

.cat-pricing-list .cat-pricing-title h4 {

    transition: all .3s ease-out;

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

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

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

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

}



.cat-pricing-title {

    position: relative;

}





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

 	Story Section  CSS Start

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



.cat-story-info .cat-heading-wrapper {

    text-align: left;

    margin: 0 0 20px;

}



.cat-story-list {

    padding: 0;

    margin: 0;

}

.cat-story-list p{
    color: var(--cat-font-color);
    font-weight: 400;
}


.cat-story-list li span svg {

    height: 20px;

    fill: var(--cat-red-color);

    margin: 0 10px 0 0;

}



.cat-story-list li {

    list-style: none;

    position: relative;

    background: var(--cat-white);

    padding: 10px 20px;

    box-shadow: 0 0 20px 0 rgb(0 0 0 / 8%);

    margin: 20px 0 0;

    border-radius: 3px;

    color: var(--cat-primary-color);

    font-weight: 600;

}



.cat-story-list li:hover,

.cat-story-list li {

    transition: var(--cat-transition);

    -moz-transition: var(--cat-transition);

    -o-transition: var(--cat-transition);

    -webkit-transition: var(--cat-transition);

    -ms-transition: var(--cat-transition);

}



.cat-story-list li:hover {

    transform: translateX(15px);

    -moz-transform: translateX(15px);

    -o-transform: translateX(15px);

    -webkit-transform: translateX(15px);

    -ms-transform: translateX(15px);

}



.cat-store-imgs {

    text-align: center;

}



.cat-story-img,

.cat-story-info {

    margin: 0 0 30px;

}



.cat-about-wrapper {

    padding: 56px 0 35px;

}





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

 	Event CSS Start

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



.cat-event-wrapper {

    position: relative;

}



.cat-porfolio-wrapper {

    overflow: hidden;

}



.cat-porfolio-section {

    position: relative;

    border-radius: 10px;

    overflow: hidden;

    margin: 0 0 15px 0px ;
    padding: 15px;
    text-align: center;
    background: var(--cat-white);
    min-height: 80px;
    height: auto;

}
.cat-porfolio-section h4{
    font-family: var( --cat-theme-family);
}

.cat-monile-app-info h3, .cat-monile-app-info h4{
    font-family: var( --cat-theme-family);
}
.cat-porfolio-section img {

    /*width: 100%;*/
    width: 250px;
    height: 114px;

    border: none;

   /* max-height: 350px;

    min-height: 350px;*/


    object-fit: cover;

    object-position: center;

}



.cat-filter-menu {

    text-align: center;

    margin-bottom: 30px;

}



.cat-filter-menu button {

    border: 1px solid var(--cat-primary-color);

    padding: 12px 15px;

    font-weight: 700;

    position: relative;

    color: var(--cat-primary-color);

    background: var(--cat-white);

    border-radius: 40px;

    min-width: 150px;

    margin: 0 10px 10px;

}



.cat-filter-menu button.active,

.cat-filter-menu button:hover {

    background: var(--cat-primary-color);

    color: var(--cat-white);

}



.cat-filter-menu button,

.cat-filter-menu button.active,

.cat-filter-menu button:hover {

    -webkit-transition: all 0.5s;

    -moz-transition: all 0.5s;

    -ms-transition: all 0.5s;

    -o-transition: all 0.5s;

    transition: all 0.5s;

}


.cat-filter .mix {

    display: none;

}
.cat-filter {

    height: 350px;
    overflow-y: scroll;

}



.cat-overlay {

    position: absolute;

    width: auto;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    background: hsl(0deg 61% 50% / 60%);

    opacity: 0;

    text-align: center;
    padding: 15px;
    text-align: center;

}



.cat-overlay-text {

    position: absolute;

    bottom: 20px;

    left: 20px;

}



.cat-overlay-text h4 {

    color: var(--cat-white);

    text-transform: capitalize;

    font-weight: 600;

    margin: 0;

    font-size: 20px;

    font-family: var(--cat-theme-family);

}



.cat-overlay>a {

    width: 50px;

    height: 50px;

    display: inline-block;

    color: var(--cat-white);

    line-height: 50px;

    text-align: center;

    top: calc(50%);

    position: relative;

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

    -moz-transition: translateY(-50%);

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

    -o-transition: translateY(-50%);

    transform: translateY(-50%);

}



.cat-overlay a span {

    display: inline-block;

    font-size: 24px;

}



.cat-overlay a:hover {

    color: var(--cat-primary-color);

}



.cat-porfolio-section:hover .cat-overlay {

    opacity: 1;

}



.cat-overlay a,

.cat-overlay a:hover,

.cat-porfolio-section,

.cat-porfolio-section .cat-overlay,

.cat-porfolio-section:hover .cat-overlay {

    -webkit-transition: all 0.5s;

    -moz-transition: all 0.5s;

    -ms-transition: all 0.5s;

    -o-transition: all 0.5s;

    transition: all 0.5s;

}



.cat-overlay .popup-gallery:hover {

    color: var(--cat-white);

}





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

 	Team CSS Start

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



.cat-team-wrapper {

    padding: 76px 0 72px;

}



.mlf-team-section {

    position: relative;

    background: var(--cat-white);

    border: none;

    border-radius: 6px;

    overflow: hidden;

    margin-bottom: 30px;

}



.mlf-team-identity span {

    height: 50px;

    width: 50px;

    display: inline-block;

    background: var(--cat-red-color);

    border: 3px solid var(--cat-white);

    border-radius: 50%;

    text-align: center;

    line-height: 43px;

    position: relative;

    z-index: 1;

}



.mlf-team-img img {

    width: 100%;

}



.mlf-team-identity {

    display: flex;

    margin-top: -25px;

    padding: 0 15px;

    align-items: center;

    justify-content: center;

}



.mlf-team-identity svg {

    fill: var(--cat-white);

    height: 25px;

    width: 25px;

}



.mlf-team-identity h6 {

    background: var(--cat-primary-color);

    color: var(--cat-white);

    font-size: 14px;

    font-weight: 400;

    padding: 5px 20px 5px 45px;

    border: none;

    border-radius: 0 30px 30px 0;

    margin: 0 auto 0 -30px;

    min-width: 140px;

    text-align: center;

    width: calc(100% - 60px);

}



.mlf-team-info>a {

    color: var(--cat-title-color);

    font-weight: 700;

    padding: 0;

    font-size: 18px;

    position: relative;

    display: inline-block;

}



.cat-team-social {

    display: flex;

    justify-content: center;

    margin: 0;

    padding: 0;

    position: absolute;

    top: 20px;

    right: 20px;

    width: 30px;

    flex-wrap: wrap;

}



.cat-team-social li {

    list-style: none;

}



.cat-team-social li+li {

    margin-top: 10px;

}



.cat-team-social li a {

    display: inline-block;

    padding: 0;

    width: 35px;

    text-align: center;

    font-size: 15px;

    background: var(--cat-black);

    color: var(--cat-white);

    border-radius: 50%;

    height: 35px;

    line-height: 35px;

    opacity: 0;

    visibility: hidden;

}



.cat-team-social li a:hover {

    color: var(--cat-white);

    background-color: var(--cat-primary-color);

}



.mlf-team-section,

.mlf-team-section:hover .cat-team-social,

.mlf-team-section .cat-team-social {

    -webkit-transition: var(--cat-transition);

    -moz-transition: var(--cat-transition);

    -ms-transition: var(--cat-transition);

    -o-transition: var(--cat-transition);

    transition: var(--cat-transition);

}



.mlf-team-section:hover .cat-team-social li a {

    -webkit-transition: var(--cat-transition);

    -moz-transition: var(--cat-transition);

    -ms-transition: var(--cat-transition);

    -o-transition: var(--cat-transition);

    transition: var(--cat-transition);

}



.mlf-team-section:hover .cat-team-social li:nth-child(2) a {

    -webkit-transition: all 0.5s;

    -moz-transition: all 0.5s;

    -ms-transition: all 0.5s;

    -o-transition: all 0.5s;

    transition: all 0.5s;

}



.mlf-team-section:hover .cat-team-social li:nth-child(3) a {

    -webkit-transition: all 0.8s;

    -moz-transition: all 0.8s;

    -ms-transition: all 0.8s;

    -o-transition: all 0.8s;

    transition: all 0.8s;

}



.mlf-team-info a:hover {

    color: var(--cat-primary-color);

}



.team-swiper-wrapper {

    position: relative;

    padding-bottom: 30px;

}



.swiper-pagination {

    bottom: 0;

    left: 0;

    right: 0;

    margin: auto;

}



.swiper-pagination span {

    background: var(--cat-primary-color);

    opacity: .6;

    height: 10px;

    width: 30px;

    transform: scale(.8);

    cursor: pointer;

    border-radius: 10px;

}



.swiper-pagination span.swiper-pagination-bullet-active {

    background: var(--cat-primary-color);

    transform: scale(1);

    opacity: 1;

}



.cat-team-social li.share {

    padding: 0;

    width: 35px;

    text-align: center;

    font-size: 15px;

    background: var(--cat-black);

    color: var(--cat-white);

    border-radius: 50%;

    height: 35px;

    line-height: 35px;

    display: inline-block;

    min-width: 35px;

    cursor: pointer;

}



.mlf-team-section:hover .cat-team-social li a {

    opacity: 1;

    visibility: visible;

}





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

 	12. Testimonials CSS Start

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



.cat-testimonials-wrapper {

    padding: 76px 0 72px;

}



.testimonial-swiper-wrapper {

    position: relative;

    padding-bottom: 57px;

}



.mlf-testimonials-section {

    position: relative;

    padding: 30px 30px;

    background: var(--cat-white);

    border-radius: 10px;

}



.mlf-testimonials-section:before {

    content: "";

    position: absolute;

    height: 60px;

    width: 60px;

    top: 50px;

    right: 30px;

    background: url(../images/main/quote.svg);

    background-position: center;

    background-size: initial;

    z-index: 1;

    background-repeat: no-repeat;

    transform: rotate( 180deg);

    opacity: .2;

}



.mlf-testimonials img {

    width: 100px;

    height: 100px;

    object-fit: cover;

    border-radius: 50%;

    box-shadow: 0 0 30px rgb(0 0 0 / 8%);

    border: 4px solid var(--cat-border-color);

}



.cat-rating ul {

    padding: 0;

    margin: 0;

}



.cat-rating ul li {

    list-style: none;

    color: #f7a032;

    display: inline-flex;

}



.mlf-testimonials {

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    margin: 0 0 21px;

}



.mlf-testimonials div {

    width: calc(100% - 100px);

    padding: 0 0 0 20px;

}



.mlf-testimonials div p {

    margin: 0;

    font-weight: 600;

    font-size: 14px;

    color: var(--cat-primary-color);

}



.mlf-testimonials div h4 {

    font-weight: 600;

    font-size: 20px;

    margin: 0 0 5px;

}





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

    Blog  CSS Start

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



.cat-blog-section {

    background: var(--cat-white);

    box-shadow: 0 0 30px rgb(0 0 0 / 6%);

    border-radius: 10px;

    overflow: hidden;

    margin: 0 0 30px;

}



.cat-blog-section:hover .blog-info h4 {

    color: var(--cat-primary-color);
    font-family: var(--cat-theme-family);

}



.blog-info h4 {

    width: 100%;

    font-weight: 700;

    font-size: 22px;

    margin: 0;

    line-height: 1.4;
    font-family: var(--cat-theme-family);

}



.cat-blog-img img {

    width: 100%;

}



.blog-info {

    padding: 30px 20px;

}



.blog-effect {

    position: relative;

    overflow: hidden;

}



.blog-effect:hover:before {

    transition-delay: 225ms;

}



.blog-effect:hover:after,

.blog-effect:hover:before {

    transform: translateY(0);

}



.blog-effect:before {

    content: "";

    background: linear-gradient(transparent, var(--cat-primary-color));

    height: 100%;

    width: 25%;

    transform: translateY(-110%);

    position: absolute;

    left: 0;

    top: 0;

    z-index: 1;

    transition: all .4s;

}



.blog-effect:hover:after {

    transition-delay: 75ms;

}



.blog-effect:hover:after,

.blog-effect:hover:before {

    transform: translateY(0);

}



.blog-effect:after {

    left: 25%;

}



.blog-effect:after {

    content: "";

    background: linear-gradient(transparent, var(--cat-primary-color));

    height: 100%;

    width: 25%;

    transform: translateY(-110%);

    position: absolute;

    left: 1px;

    top: 0;

    z-index: 1;

    transition: all .4s;

}



.blog-effect:after {

    left: 25%;

}



.blog-effect .blog-effect-inner:before {

    left: 50%;

}



.blog-effect .blog-effect-inner:after {

    left: 75%;

}



.blog-effect-inner:after,

.blog-effect-inner:before {

    content: "";

    background: linear-gradient(transparent, var(--cat-primary-color));

    height: 100%;

    width: 25%;

    transform: translateY(-110%);

    position: absolute;

    left: 0;

    top: 0;

    z-index: 1;

    transition: all .4s;

}



.blog-effect .blog-effect-inner {

    width: 100%;

    height: 100%;

    position: absolute;

    bottom: 0;

    left: 0;

    transition: all .2s;

}



.blog-effect:hover .blog-effect-inner:before {

    transition-delay: 0.15s;

}



.blog-effect:hover .blog-effect-inner:after,

.blog-effect:hover .blog-effect-inner:before {

    transform: translateY(0);

}



.blog-date {

    position: absolute;

    top: 0;

    z-index: 2;

    background: var(--cat-white);

    left: 20px;

    width: 70px;

    text-align: center;

    border-radius: 0px 0px 10px 10px;

    padding: 6px 0 10px;

    font-weight: 700;

    color: var(--cat-title-color);

}



.blog-date span {

    display: block;

    font-size: 30px;

    font-weight: 900;

    line-height: 1;

}



.cat-blog-section:hover .blog-info h4,

.cat-blog-section .blog-info h4 {

    -webkit-transition: var(--cat-transition);

    -moz-transition: var(--cat-transition);

    -ms-transition: var(--cat-transition);

    -o-transition: var(--cat-transition);

    transition: var(--cat-transition);

}





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

 	Footer CSS Start

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



.main-footer {

    background: var(--cat-alternate-bg);

}



.cat-footer-wrapper {

    padding: 75px 0 50px;

}



.cat-widget {

    margin: 0 0 30px;

}



.footer-title {

    position: relative;

    font-weight: 700;

    font-size: 22px;

    padding: 0 0 5px;

    margin: 0 0 30px;

    color: var(--cat-primary-color);

    display: inline-block;

}



.footer-title:before {

    position: absolute;

    content: "";

    height: 2px;

    width: 80%;

    background: var(--cat-primary-color);

    bottom: 0;

}



.cat-footer-social {

    padding: 0;

    margin: 0;

    display: flex;

    flex-wrap: wrap;

}



.cat-footer-social li {

    list-style: none;

}



.cat-footer-social li+li {

    margin-left: 15px;

}



.cat-footer-social a {

    width: 30px;

    height: 30px;

    display: inline-block;

    text-align: center;

    background: var(--cat-primary-color);

    color: var(--cat-white);

    line-height: 30px;

    border-radius: 50%;

}



.cat-footer-social a:hover {

    background: var(--cat-black);

    color: var(--cat-white);

}



.footer-menu ul {

    padding: 0;

    margin: 0;

    display: flex;

    flex-wrap: wrap;

}



.footer-menu ul li {

    list-style: none;

    margin: 0 0 20px;

    font-weight: 600;

    display: flex;

    flex-wrap: wrap;

    width: 100%;

}



.footer-menu ul li a {

    display: flex;

    flex-wrap: wrap;

    width: 100%;

}



.footer-menu ul li span svg {

    height: 12px;

    fill: var(--cat-primary-color);

}



.footer-img {

    margin: 0 0 20px;

    position: relative;

    box-shadow: 0 0 20px rgb(0 0 0 / 6%);

}



.footer-img img {

    width: 100%;

    height: 70px;

    object-fit: cover;

    border-radius: 3px;

}



.contact-menu ul li span svg {

    height: 20px;

}



.footer-menu ul li span {

    width: 30px;

    display: inline-block;

}



.footer-menu ul li p {

    width: calc(100% - 30px);

    margin: 0;

    padding: 0 0 0 8px;

}





/**/



.cat-footer-copyright {

    background: var(--cat-primary-color);

    text-align: center;

    color: var(--cat-white);

    padding: 14px 0 13px;

    position: relative;
    font-size: 12px;

}



.cat-footer-copyright::before {

    content: "";

    position: absolute;

    background-image: url(../images/main/shapee.png);

    background-repeat: repeat-x;

    background-position: center;

    height: 10px;

    left: 0;

    right: 0;

    top: -8px;

}



.cat-footer-copyright p {

    margin: 0;

}





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

    Video CSS Start

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



.cat-counter-info .cat-heading-wrapper {

    text-align: left;

    margin: 0 0 20px;

}



.cat-counter-section-inner span img {

    height: 60px;

    width: 50px;

}



.cat-counter-section {

    width: 100%;

    background: var(--cat-white);

    box-shadow: 0 0 60px rgb(0 0 0 / 8%);

    padding: 20px 20px;

    margin: 30px auto 30px;

    border-radius: 10px;

    max-width: 230px;

    position: relative;

    text-align: center;

    z-index: 3;

}



.cat-counter-section h4 {

    font-size: 32px;

    font-weight: 700;

    margin: 0;

}



.cat-counter-section p {

    margin: 0;

    font-weight: 600;

    color: var(--cat-title-color);

}



.cat-counter-section span {

    display: block;

    margin: 0 0 10px;

}



.counter1 .cat-counter-section {

    margin: 20px auto 20px;

}



.counter3 .cat-counter-section {

    margin: 0px auto 20px;

}



.counter2 .cat-counter-section {

    margin: 40px auto 20px;

}



.counter4 .cat-counter-section {

    margin: 40px auto 20px;

}



.cat-main-video {

    position: relative;

    border: none;

    overflow: hidden;

}



.cat-play-btn {

    position: absolute;

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    justify-content: center;

    width: 100px;

    height: 100px;

    background: var(--cat-white);

    border-radius: 50%;

    text-align: center;

    line-height: 112px;

    position: absolute;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    margin: auto;

    z-index: 2;

}



.popup-youtube {

    position: relative;

    color: var(--cat-primary-color);

    width: 100px;

    height: 100px;

    line-height: 100px;

    text-align: center;

    background: transparent;

    border-radius: var(--cat-circle-radius);

    font-size: 30px;

}



.popup-youtube i {

    color: var(--cat-primary-color);

}



.relative {

    position: relative;

}





/** Shap */



.top-left-shap,

.top-right-shap,

.bottom-left-shap,

.bottom-right-shap {

    position: absolute;

    z-index: 2;

}



.top-left-shap {

    top: 30%;

    left: 0;

}



.top-right-shap {

    top: -100px;

    right: 0;

}



.bottom-left-shap {

    bottom: 100px;

    left: 0;

}



.bottom-right-shap {

    bottom: 30%;

    right: 0;

}





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

 	Page Title CSS Start

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



.cat-page-title-section {

    /* background: var(--cat-alternate-bg); */
    background: rgba(236, 236, 236, 1);
    padding: 120px 30px 20px;

    position: relative;

    color: var(--cat-white);

    text-align: center;

}



.cat-page-title-section:before {

    background-image: url(../images/main/page-title.png);

    background-repeat: no-repeat;

    background-position: top center;

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

}



.cat-page-title-section h1 {

    font-size: var(--cat-page-title-size);

    margin: 0 0 9px;

    font-weight: 700;

}



.cat-page-title-section ul {

    padding: 0;

    margin: 0;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    font-weight: 700;

}



.cat-page-title-section ul li {

    list-style: none;

    position: relative;

    margin: 0 0 0 20px;

    color: var(--cat-title-color);

    padding: 0 0 0 20px;

}



.cat-page-title-section ul li:first-child {

    margin: 0;

    padding: 0;

}



.cat-page-title-section ul li a {

    color: var(--cat-title-color);

}



.cat-page-title-section ul li a:hover {

    color: var(--cat-primary-color);

}



.cat-page-title-section ul li:before {

    content: "";

    position: absolute;

    width: 5px;

    height: 5px;

    background: var(--cat-primary-color);

    left: 0;

    top: 0;

    border-radius: 50%;

    bottom: 0;

    margin: auto;

}



.cat-page-title-section ul li:first-child:before {

    content: unset;

}





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

 	Contact CSS Start

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



.cat-map-section {

    padding: 0;

    display: flex;

    flex-wrap: wrap;

}



.cat-contact-section .cat-input-wrap {

    margin: 0 0 30px;

}



.cat-contact-wrapper {

    background-image: url(https://dummyimage.com/1920x800/787878/666);

    background-position: center bottom;

    background-size: cover;

}



.cat-contact-section {

    max-width: 850px;

    margin: auto;

    background: var(--cat-white);

    box-shadow: 0 0 30px rgb(0 0 0 / 6%);

    padding: 50px 50px;

    border-radius: 10px;

    position: relative;

}



.cat-contact-section:before {

    content: "";

    position: absolute;

    bottom: 0;

    left: 0;

    width: 10px;

    background-image: url(../images/main/shape.png);

    background-position: center;

    background-repeat: repeat-y;

    height: 100%;

}



.cat-contact-section:after {

    content: "";

    position: absolute;

    bottom: 0;

    right: 0;

    width: 10px;

    background-image: url(../images/main/shape.png);

    background-position: center;

    background-repeat: repeat-y;

    height: 100%;

    transform: rotate( 180deg);

}





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

 	Error CSS Start

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



.cat-error-info div {

    margin: 20px 0 0;

}



.cat-error-info h4 {

    font-weight: 700;

}





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

 	Faq CSS Start

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



.cat-faq-wrapper .accordion-item {

    background-color: var(--cat-alternate-bg);

    border-radius: var(--cat-radius10);

    margin: 0 0 30px;

    border: 0;

}



.cat-faq-wrapper .accordion-item button.btn.btn-link {

    color: var(--cat-font-color);

    font-size: var(--cat-font18);

    padding: 0;

    text-decoration: none;

    outline: none;

    width: 100%;

    text-align: left;

    border: 0;

    box-shadow: none;

}



.cat-faq-wrapper .accordion-body {

    padding: 20px;

    font-size: var(--cat-font-size);

    border-top: 1px solid var(--cat-border-color);

}



.cat-faq-wrapper .accordion-header h2 {

    margin-bottom: 0;

}



.cat-faq-wrapper .accordion-body p {

    margin: 0;

}



.accordion-button:not(.collapsed) {

    color: var(--cat-primary-color);

    background-color: transparent;

    box-shadow: none;

}



.accordion-button {

    background: transparent;

    color: var(--cat-title-color);

    font-family: var(--cat-theme-family);

    font-weight: 700;

}



.accordion-button:focus {

    border: 0;

    box-shadow: none;

}



.accordion-button:not(.collapsed)::after,

.accordion-button::after {

    background-image: url(../images/main/down-arrow.svg);

}





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

 	12. Responsive CSS Start

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



@media (min-width: 1200px) {

    .container {

        max-width: 1170px;

        padding: 0;

    }

    .close-btn {

        display: none;

    }

    /*Header*/

    .menu-btn-wrap>a.menu-btn {

        display: none;

    }

    .main-menu .sub-menu {

        position: absolute;

        top: 50px;

        left: 0;

        right: 0;

        margin: auto;

        background: var(--cat-white);

        padding: 10px 0;

        box-shadow: var(--cat-shadow);

        transform: scaleY(0);

        transform-origin: top;

        visibility: hidden;

        opacity: 0;

        z-index: 9;

        display: block;

        min-width: 200px;

        border-top: 2px dotted var(--cat-white);

    }

    .has-sub-menu:hover .sub-menu {

        transform: scaleY(1);

        visibility: visible;

        opacity: 1;

    }

    .has-sub-menu .sub-menu .sub-menu {

        left: unset;

        right: 190px;

        top: 0;

        transform: scaleY(0);

        transform-origin: top;

        visibility: hidden;

        opacity: 0;

    }

    .has-sub-menu .sub-menu .has-sub-menu:hover .sub-menu {

        transform: scaleY(1);

        visibility: visible;

        opacity: 1;

    }

    .has-sub-menu .sub-menu .sub-menu:before {

        content: "";

        position: absolute;

        width: 0;

        height: 0;

        border-top: 10px solid transparent;

        border-left: 12px solid var(--cat-alternate-bg);

        border-bottom: 10px solid transparent;

        right: -12px;

    }

    .has-sub-menu .sub-menu,

    .has-sub-menu:hover .sub-menu {

        -webkit-transition: var(--cat-transition);

        -moz-transition: var(--cat-transition);

        -ms-transition: var(--cat-transition);

        -o-transition: var(--cat-transition);

        transition: var(--cat-transition);

    }

    .main-menu>ul>li+li {

        margin: 0 0 0 10px;

    }

}



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



@media (min-width: 1440px) {

    .main-menu ul>li>a {

        font-size: 16px;
        font-family: var(--cat-title-family);

    }

}



@media (max-width: 1439.98px) {

    .main-menu ul>li>a {

        padding: 10px 12px;

    }

    .top-left-shap,

    .top-right-shap,

    .bottom-left-shap,

    .bottom-right-shap {

        display: none;

    }

}



@media (min-width: 1800px) {

    .header-wrapper .container-fluid {

        max-width: 1800px;

    }

}



@media (max-width: 1199.98px) {

    .main-menu>ul {

        background: var(--cat-white);

        position: fixed;

        left: -340px;

        top: 0;

        bottom: 0;

        width: 300px;

        height: 100%;

        text-align: left;

        z-index: 98;

        background-attachment: fixed;

        transition: 0.3s;

        overflow-y: auto;

        overflow-x: hidden;

        border-right: 1px solid #bf1f1f;

        display: block;

        box-shadow: 0 0 20px rgb(0 0 0 / 45%);

    }

    .main-menu.open-menu>ul {

        left: 0;

    }

    .main-menu .has-sub-menu:before,

    .main-menu .has-sub-menu:after {

        position: absolute;

        bottom: 0;

        content: '';

        background: var(--cat-primary-color);

    }

    .main-menu .has-sub-menu:after {

        right: 21px;

        width: 12px;

        height: 2px;

        top: 23px;

    }

    .main-menu .has-sub-menu:before {

        right: 26px;

        width: 2px;

        height: 12px;

        top: 18px;

    }

    .main-menu>ul::-webkit-scrollbar {

        width: 3px;

    }

    .main-menu>ul::-webkit-scrollbar-track {

        background-color: var(--cat-border-color);

    }

    .main-menu>ul::-webkit-scrollbar-thumb {

        background-color: var(--cat-primary-color);

    }

    .main-menu .sub-menu {

        display: none;

    }

    .main-menu ul>li>a {

        padding: 15px 20px;

    }

    .main-menu>ul>li {

        border-bottom: 1px solid var(--cat-border-color);

    }

    .main-menu .sub-menu>li>a {

        width: auto;

    }

    .has-sub-menu>.sub-menu>li>a:before {

        content: unset;

    }

    .main-menu .sub-menu {

        background: var(--cat-alternate-bg);

        padding-left: 20px;

    }

    .main-menu>ul>li.has-sub-menu.open:before {

        content: unset;

    }

    .cat-banner-text {

        max-width: 800px;

    }

    .cat-banner-title {

        font-size: 40px;

    }

    .cat-booking-form {

        padding: 30px 20px 40px;

    }

}



@media (max-width: 991.98px) {

    .cat-banner-title {

        font-size: 42px;

        margin: 20px 0;

    }

    .cat-banner-social {

        right: 0;

    }

    .nav-pills .nav-link,

    .cat-filter-menu button {

        padding: 8px 10px;

        min-width: 120px;

        font-size: 14px;

    }

    .nav li.nav-item,

    .cat-filter-menu button {

        margin: 0 10px 10px 0;

    }

    .cat-page-title-section h1 {

        font-size: 38px;

    }
    .cat-banner-contact{
        display: none;
    }

    .cat-link {

        font-weight: 500 !important;
    display: inline-block;
    color: var(--cat-red-color);
    position: relative;
    padding: 0 0 3px;
    font-family: var(--cat-links-family);
    font-size: 30px;

}
}



@media (min-width: 768px) and (max-width: 991.98px) {}



@media (max-width: 767.98px) {

    .footer-title {

        margin: 0 0 20px;

    }

    .cat-banner-text {

        padding: 0;

    }

    .cat-booking-form .cat-shapp,

    .cat-booking-form .cat-shapp2 {

        display: none;

    }

    .popup-youtube {

        width: 60px;

        height: 60px;

        line-height: 60px;

        font-size: 24px;

    }

    .cat-play-btn {

        width: 60px;

        height: 60px;

        line-height: 60px;

    }

}



@media (max-width: 575.98px) {

    .menu-btn-wrap>a {

        width: 35px;

        height: 35px;

        padding: 8px 8px;

        margin: 0 0 0 4px;

    }

    .menu-btn-wrap .menu-btn {

        margin: 0 0 0 4px;

    }

    .main-menu>ul {

        width: 280px;

    }

    .cat-banner-text h4 {

        font-size: 14px;

        padding: 8px 15px;

    }

    .cat-banner-title {

        font-size: 28px;

        margin: 15px 0;

    }

    .header-btn {

        display: none;

    }

    .cat-banner-wrapper {

        padding: 100px 30px 100px 50px;

    }

    .cat-banner-text-inner p {

        font-size: 16px;

        margin: 0 auto 0px;

    }

    .mlf-testimonials-section:before {

        top: 10px;

        right: 10px;

    }

}





/* Animation CSS*/



.bouncing {

    -webkit-animation: bounce 3s infinite ease-in-out;

    -o-animation: bounce 3s infinite ease-in-out;

    -ms-animation: bounce 3s infinite ease-in-out;

    -moz-animation: bounce 3s infinite ease-in-out;

    animation: bounce 3s infinite ease-in-out;

}



@-webkit-keyframes bounce {

    0% {

        -webkit-transform: translateY(-5px);

        transform: translateY(-5px);

    }

    50% {

        -webkit-transform: translateY(10px);

        transform: translateY(10px);

    }

    100% {

        -webkit-transform: translateY(-5px);

        transform: translateY(-5px);

    }

}



@keyframes bounce {

    0% {

        -webkit-transform: translateY(-5px);

        transform: translateY(-5px);

    }

    50% {

        -webkit-transform: translateY(10px);

        transform: translateY(10px);

    }

    100% {

        -webkit-transform: translateY(-5px);

        transform: translateY(-5px);

    }

}



.btn-wave {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    border-radius: 9999px;

    background-color: var(--cat-white);

    opacity: 0;

    z-index: -1;

}



.btn-wave {

    -webkit-animation: sonarWave 1.5s linear infinite;

    animation: sonarWave 1.5s linear infinite;

}



@-webkit-keyframes sonarWave {

    from {

        opacity: 0.4;

    }

    to {

        -webkit-transform: scale(2);

        transform: scale(2);

        opacity: 0;

    }

}



@keyframes sonarWave {

    from {

        opacity: 0.4;

    }

    to {

        -webkit-transform: scale(2);

        transform: scale(2);

        opacity: 0;

    }

}


/* New styles for Horizontal Menu  */


.nav-tabs {
    display: inline-flex;
    width: 100%;
    overflow-x: auto;
    border-bottom: 2px solid #DDD;
    -ms-overflow-style: none;
    /*// IE 10+*/
    overflow: -moz-scrollbars-none;
    /*// Firefox*/
  }
  
  .nav-tabs > li.active > a,
  .nav-tabs > li.active > a:focus,
  .nav-tabs > li.active > a:hover {
    border-width: 0;
  }
  
  .nav-tabs > li > a {
    border: none;
    color: #666;
  }
  
  .nav-tabs > li.active > a,
  .nav-tabs > li > a:hover {
    border: none;
    color: #4285F4 !important;
    background: transparent;
  }
  
  .nav-tabs > li > a::after {
    content: "";
    background: #4285F4;
    height: 2px;
    position: absolute;
    width: 100%;
    left: 0px;
    bottom: 1px;
    transition: all 250ms ease 0s;
    transform: scale(0);
  }
  
  .nav-tabs > li.active > a::after,
  .nav-tabs > li:hover > a::after {
    transform: scale(1);
  }
  
  .tab-nav > li > a::after {
    background: #21527d none repeat scroll 0% 0%;
    color: #fff;
  }
  
  .tab-pane {
    padding: 15px 0;
  }
  
  .tab-content {
    padding: 20px;
  }
  
  .nav-tabs::-webkit-scrollbar {
    display: none;
    /*Safari and Chrome*/
  }
  
  .card {
    background: #FFF none repeat scroll 0% 0%;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
    margin-bottom: 30px;
    display: block;
  }
  
  .nav > li > a {
    position: relative;
    display: block;
    padding: 10px 15px;
  }
  
  .nav {
    flex-wrap: inherit;
  }

  /* New styles for Horizontal Tabs Menu */

  /**
 * jquery-bootstrap-scrolling-tabs
 * @version v2.6.1
 * @link https://github.com/mikejacobson/jquery-bootstrap-scrolling-tabs
 * @author Mike Jacobson <michaeljjacobson1@gmail.com>
 * @license MIT License, http://www.opensource.org/licenses/MIT
 */
.scrtabs-tab-container * {
    box-sizing: border-box; }
  
  .scrtabs-tab-container {
    height: 42px; }
    .scrtabs-tab-container .tab-content {
      clear: left; }
  
  .scrtabs-tab-container.scrtabs-bootstrap4 .scrtabs-tabs-movable-container > .navbar-nav {
    -ms-flex-direction: row;
    flex-direction: row; }
  
  .scrtabs-tabs-fixed-container {
    float: left;
    height: 42px;
    overflow: hidden;
    width: 100%; }
  
  .scrtabs-tabs-movable-container {
    position: relative; }
    .scrtabs-tabs-movable-container .tab-content {
      display: none; }
  
  .scrtabs-tab-container.scrtabs-rtl .scrtabs-tabs-movable-container > ul.nav-tabs {
    padding-right: 0; }
  
  .scrtabs-tab-scroll-arrow {
    border: 1px solid #dddddd;
    border-top: none;
    color: #428bca;
    display: none;
    float: left;
    font-size: 12px;
    height: 42px;
    margin-bottom: -1px;
    padding-left: 2px;
    padding-top: 13px;
    width: 20px; }
    .scrtabs-tab-scroll-arrow:hover {
      background-color: #eeeeee; }
  
  .scrtabs-tab-scroll-arrow,
  .scrtabs-tab-scroll-arrow .scrtabs-click-target {
    cursor: pointer; }
  
  .scrtabs-tab-scroll-arrow.scrtabs-with-click-target {
    cursor: default; }
  
  .scrtabs-tab-scroll-arrow.scrtabs-disable,
  .scrtabs-tab-scroll-arrow.scrtabs-disable .scrtabs-click-target {
    color: #ddd;
    cursor: default; }
  
  .scrtabs-tab-scroll-arrow.scrtabs-disable:hover {
    background-color: initial; }
  
  .scrtabs-tabs-fixed-container ul.nav-tabs > li {
    white-space: nowrap; }
    .nav-tabs .nav-link {
        margin-bottom: -1px;
        background: 0 0;
        border: 1px solid transparent;
        border-top-left-radius: 0.25rem;
        border-top-right-radius: 0.25rem;
        border: 1px solid var(--cat-primary-color);
        padding: 12px 15px;
        font-weight: 700;
        position: relative;
        color: var(--cat-primary-color);
        background: var(--cat-white);
        border-radius: 40px;
        text-wrap: nowrap;
    }
    .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
        /* color: #495057; */
        /* background-color: #fff; */
        border-color: #dee2e6 #dee2e6 #fff;
    }


    
/* New Styles for Banner */
/* 
::-webkit-scrollbar { 
    display: none; 
} */

#slide-show {
    /* height: 100vh;
    min-height: 100vh; */
    overflow: hidden;
    width: 100vw;
    min-width: 100vw !important;
  }
  
  .slide-text {
    font-size: 20px;
    color: #fff;
    text-align:center;
  }
  
  .slide-text b {
    font-weight: 400; 
  }
  
  .slide-text h2 {
    font-weight: 200;
    font-family: Raleway;
    font-size: 50px;
    text-align: center;
    line-height: 60px;
    letter-spacing: 1px;
    color: #fff;
  }
  
  .slidex {
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
    z-index: -1;
  }
  
  .activx {
    opacity: 1;
  }
  
  .slideshow-nav {
    position: absolute;
    bottom: 50%; 
    width: 100vw;
    min-width: 100vw !important;
    font-size: 30px;
    background: transparent;  
  }
  
  .previousx {
    float: left;
  }
  
  .nextx {
    float: right;
  }
  
  .bg1, .bg2, .bg3, .bg4 {
    background-repeat: no-repeat !important;
    background-attachment: scroll !important;
    background-position: top center !important;
    /* background-size: cover !important; */
    /* background-image: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/222641/iStockStreetScene.jpg"); */
    height: 100vh;
    min-height: 100vh;
    overflow: hidden;
    width: 100vw;
    min-width: 100vw !important;
    position: absolute;
    top:0;
    left:0;
  }
  
  
  .bg2 {background-image: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/222641/2D6HOGVCGE.jpg");}
  .bg3 { background-image: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/222641/BusScene.jpg");}
  .bg4 {background-image: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/222641/sun-trees.jpg");}
  
  .slider-center {
    position: absolute;
    height:15%;
    width: 50%;
    left: 50%;
    top: 50%;
    background-color: transparent;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: left;
    letter-spacing: 2px;
  }
  
  .nav-link {
    transition: all 0.4s;
    padding: 15px;
    color:#fff;
    opacity: 0.2;
    /* font-size: 40px;   */
  }
  .nav-link:hover {
    color: #999;
    /* font-size: 80px; */
    opacity: 0.8;
  }
  
  .arrow a {
    position: absolute;
    bottom:0;
    left: 50%;
    color: #fff;
    transition: all 0.4s;
    cursor: pointer;
    font-size: 80px;
    padding: 0 0 20px 0;
    opacity: 0.2;
  }
  
  .arrow a:hover {
    color: #999;
    font-size: 100px;
    opacity: 0.8;
  }
  
  
  #unten {
    width: 100vw;
    min-width: 100vw !important;
    height: 800px;
    background-color: #999;
    
    
  }