*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Jost", sans-serif;
    font-size: 16px;
    font-weight: 400;
}
:root{
    --primary-color: #228b22
}
ul{
    margin-bottom: 0;
}
ul li{
    list-style: none;
}
a{
    text-decoration: none;
}
img{
    max-width: 100%;
    object-fit: cover;
}
html{
    scroll-behavior: smooth;
}

/*menu mobile*/
.overlay{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #00000080;
    opacity: 0;
    visibility: hidden;
    transition: all .3s;
    z-index: 21;
}
.overlay.active{
    opacity: 1;
    visibility: visible;
    transition: all .3s;
}
.menu__mobile{
    position: fixed;
    top: 0;
    right: 0;
    width: 40%;
    height: 100%;
    background-color: var(--primary-color);
    box-shadow: 0 0 10px 0 #00000080;
    transform: translateX(100%);
    z-index: 22;
    transition: all ease-in-out .4s;
}
.menu__mobile.active{
    transform: translateX(0);
    transition: all ease-in-out .4s;
}

.main__menu__mobile{
    margin: auto;
    margin-top: 20px;
    padding: 0 20px 0 30px;
}
.dropdown__menu__mobile li a{
    font-size: 14px;
    color: #fff;
}
.dropdown__menu__mobile li{
    padding: 5px 10px;
}
.sub__menu__mobile{
    position: relative;
}
.sub__menu__mobile p {
    position: absolute;
    right: 20px;
    top: 15px;
    color: #fff;
}
.menu__title__mobile{
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 18px;
    color: #fff !important;
    padding: 5px 0px;
}
.menu__title__mobile i{
    margin-left: 5px;
    color: #fff;
    transition: all .4s;
}
.show__dropdown{
    background-color: #0000000d;
}
.sub__menu__mobile.show__dropdown .dropdown__menu__mobile{
    display: block;
}
.sub__menu__mobile.rotate__icons i{
    transform: rotate(90deg);
    transition: all .4s;
}
.menu__bar{
    display: none;
    background-color: var(--primary-color);
    color: #fff;
    border-radius: 3px;
}
/*end menu mobile*/

/*header*/
.header__content{
    display: flex;
    flex-wrap: wrap;
}
.info__top{
    width: 70%;
    background-color: #1c1c1c;
    text-align: center;
    padding: 12px 0;
}
.info__right{
    width: 30%;
    background-color: var(--primary-color);
    padding: 12px 15px;
}
.info__top a{
    color: #fff;
    font-weight: 500;
}
.info__top a:hover{
    color: var(--primary-color);
    text-decoration: none;
}
.info__right ul{
    display: flex;
    gap: 35px;
    margin-bottom: 0;
}
.info__right ul a{
    color: #fff;
    font-weight: 500;
}
.info__right ul a:hover{
    color: #1c1c1c;
    text-decoration: none;
}

.header{
    display: flex;
    align-items: center;
    background-color: var(--primary-color);
}
.main__header{
    width: 94%;
    padding: 5px 0;
    padding-left: 40px;
    background-color: #fff;
    border-radius: 0 20px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.menu__bar-desk{
    width: 6%;
    padding: 0 15px;
    text-align: center;
}
.menu__bar-desk svg{
    color: #fff;
}
.logo img{
    height: 50px;
}
.menu{
    height: 100%;
    display: flex;
    gap: 30px;
}
.nav__bar{
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0;
}
.sub__menu{
    position: relative;
}
.sub__menu__title{
    position: relative;
    height: 100%;
    font-size: 18px;
    color: var(--primary-color) !important;
    font-weight: 700;
    padding: 10px;
    display: block;
    text-decoration: none !important;
}
.sub__menu__title::before{
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    width: 0;
    height: 1px;
    
    transition: all .4s;
}
.sub__menu__title::after{
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 5px;
    width: 0;
    height: 1px;
    transition: all .4s;
}
.sub__menu__title:hover::before,
.sub__menu__title:hover::after{
    width: 100%;
    transition: all .4s;
}
.sub__menu:hover > .sub__menu__title{
    background-color: var(--primary-color);
    color: #fff !important;
    transition: all .2s;
}
.sub__menu__title__child{
    position: relative;
}
.dropdown__menu__child{
    display: none;
}
.sub__menu__title__child:hover .dropdown__menu__child{
    display: block;
}
.dropdown__menu__child{
    position: absolute;
    top: 0;
    left: 100%;
    background-color: #fff;
}
.dropdown__menu{
    background-color: #fff;
    position: absolute;
    top: 140%;
    left: 0;
    width: 600px;
    opacity: 0;
    visibility: hidden;
    box-shadow: 0 10px 30px #00000014;
    transform-origin: top center;
    z-index: 3;
    transition: all linear 0.2s;
}
.sub__menu:hover .dropdown__menu{
    opacity: 1;
    visibility: visible;
    top: 100%;
    transition: all linear 0.2s;
}
.dropdown__menu ul{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    border: 2px solid var(--primary-color);
    padding: 5px;
}
.dropdown__menu li{
    width: calc(50% - 5px);
}

.dropdown__menu li a{
    text-align: center;
    display: block;
    transition: all .3s;
}
.dropdown__menu li a span{
    color: #6e3205;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
}
.dropdown__menu li:hover a{
    color: #a42125;
    text-decoration: none;
}
.search i{
    font-size: 19px;
    color: #fff;
}
.search div{
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: var(--primary-color);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.btn__header{
    padding: 10px 15px;
}
.btn__header a{
    font-size: 18px;
    color: #000;
    font-weight: 600;
}
.btn__header a i{
    font-size: 20px;
    color: #ffd700;
}
.btn__header a:hover,
.btn__header a:hover i{
    color: var(--primary-color);
    text-decoration: none;
}

.main__search{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.95);
    transform: translateX(-100%);
    transition: all .5s;
    z-index: 15;
}
.main__search.active{
    transform: translateX(0);
    transition: all .5s;
}
.form-search{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    width: 45%;
    transform-origin: center center;
    transition: .7s;
    z-index: -1;
}
.form-search.active{
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
    z-index: 42;
    transition-delay: .4s;
}
.form-search input{
    width: 100%;
    height: 65px;
    background-color: transparent;
    border: 2px solid var(--primary-color);
    border-radius: 50px;
    outline: none;
    color: #fff;
    padding: 3px 65px 3px 30px;
    overflow: hidden;
}
.form-search input::placeholder{
    color: #fff;
    font-size: 16px;
}
.form-search button{
    position: absolute;
    top: 0;
    right: 0;
    width: 65px;
    height: 100%;
    background-color: transparent;
    border: none;
    outline: none !important;
    cursor: pointer;
}
.form-search button i{
    font-size: 20px;
    color: #fff;
}
.close-news,
.close-search{
    position: absolute;
    top: 50px;
    right: 50px;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: var(--primary-color);
    color: #fff;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.close-search i{
    font-size: 20px;
}
.close-search:hover{
    background-color: #ffd700;
    transition: all .3s;
}
.icon-bar{
    cursor: pointer;
}

.fixed__news{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: translateX(100%);
    transition: all .7s;
    z-index: 15;
}
.fixed__news.active{
    transform: translateX(0);
    transition: all .7s;
}
.fixed__news::before{
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000000bf;
    position: absolute;
    opacity: 0;
    transition: all .5s;
    z-index: -1;
}
.fixed__news.active::before{
    opacity: 1;
}
.main__fixed__news{
    width: 450px;
    height: 100%;
    overflow-y: auto;
    background-color: #fff;
    padding: 30px;
    position: absolute;
    top: 0;
    right: 0;
    transform: translateX(100%);
    transition: all .7s;
}
.fixed__news.active .main__fixed__news{
    transform: translateX(0);
    transition: all .7s;
    transition-delay: .2s;
}
.close-news{
    position: static;
    width: 50px;
    height: 50px;
    float: right;
}
.close-news i{
    transition: all .3s;
}
.close-news:hover i{
    transform: rotate(90deg);
    transition: all .3s;
}
.main__fixed__news h4{
    position: relative;
    color: #000;
    padding-bottom: 10px;
    font-weight: 600;
    margin-bottom: 30px;
}
.main__fixed__news h4::before{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100px;
    height: 2px;
    background-color: var(--primary-color);
}
.main__fixed__news h4::after{
    content: "";
    position: absolute;
    left: 15px;
    bottom: -2px;
    width: 6px;
    height: 4px;
    background-color: #fff;
}
.list__article{
    display: flex;
    gap: 15px;
}
.list__article:not(:last-child){
    margin-bottom: 30px;
}
.list__article img{
    width: 75px;
    height: 75px;
    min-width: 75px;
    border-radius: 6px;
}
.article__des{
    display: block;
    text-decoration: none !important;
}
.article__des span{
    font-size: 12px;
    color: #505050;
}
.article__des p{
    color: #1c1c1c;
    font-weight: 600;
    margin-bottom: 0;
}
.article__des p:hover{
    color: var(--primary-color);
}
/*end header*/

/*home*/
.intro__content h3{
    font-family: "ABeeZee", sans-serif;
    font-size: 33px;
    color: #1c1c1c;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 30px;
}
.intro__content ul li{
    display: flex;
    gap: 20px;
    opacity: 0;
    transform: translateY(30px);
    margin-bottom: 15px;
    transition: all .6s;
}
.slide__intro .owl-item.active .intro__content ul li{
    opacity: 1;
    transform: translateY(0);
}
.intro__content ul li:nth-child(1){
    transition-delay: .5s;
}
.intro__content ul li:nth-child(2){
    transition-delay: .6s;
}
.intro__content ul li:nth-child(3){
    transition-delay: .7s;
}
.intro__content ul li:nth-child(4){
    transition-delay: .8s;
}
.intro__content ul li img{
    width: 70px !important;
    min-width: 70px;
    height: 70px;
}
.intro__content ul li h5{
    font-size: 18px;
    color: #ecc31f;
}
.intro__img ul{
    display: grid;
    grid-template-columns: auto auto;
    gap: 10px;
}
.intro__img ul li img{
    transform: scale(0);
    transform-origin: center bottom;
}
.intro__img ul li img{
    transition: all 1s;
}
.slide__intro .owl-item.active .intro__img ul li img{
    transform: scale(1);
    transition: all 1s;
}
.st__about .slide__intro .owl-nav button.owl-prev{
    position: absolute;
    top: 50%;
    left: -50px;
    transform: translateY(-50%);
    border-radius: 5px;
    background-color: #000000ab !important;
    padding: 20px 10px 20px 10px !important;
    outline: none;
    color: #fff;
}
.st__about .slide__intro .owl-nav button.owl-next{
    position: absolute;
    top: 50%;
    right: -50px;
    transform: translateY(-50%);
    border-radius: 5px;
    background-color: #000000ab !important;
    padding: 20px 10px 20px 10px !important;
    outline: none;
    color: #fff;
}
.slide__intro .owl-item:nth-child(2n) .item__intro .row{
    flex-direction: row-reverse;
}
.input__field select{
    width: 100%;
    padding: 14px 38px;
    border: 1px solid #ffccb1;
    border-radius: 10px;
    outline: none;
    cursor: pointer;
}
.input__field{
    position: relative;
    margin-bottom: 20px;
}
.icon-input{
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
    z-index: 2;
}
.icon-input i{
    font-size: 14px;
}
.range__day{
    position: relative;
}
#money,
#days{
    width: 100%;
    padding: 14px 38px;
    border: 1px solid #ffccb1;
    border-radius: 10px;
    outline: none;
}
.slide__range{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    transition: all .5s;
}
.slide__range.active{
    top: 100%;
    opacity: 1;
    visibility: visible;
    transition: all .5s;
}
.price-range-slider .ui-widget.ui-widget-content{
    border: none;
}
.price-range-slider {
    width: 100%;
}
.price-range-slider .range-value input {
    width: 100%;
    font-family: "GoogleSans-Light";
    border: none;
    font-size: 16px;
    color: #C12D82;
    outline: none;
    background-color: transparent;
}
.price-range-slider .range-bar {
    border: none;
    background: #e6e6e6;
    height: 5px;
    margin-top: 10px;
}
.price-range-slider .range-bar .ui-slider-range {
    background: #FF681A;
}
.price-range-slider .range-bar .ui-slider-handle {
    border: none;
    border-radius: 25px;
    background: var(--primary-color);
    border: 1px solid #d9d9d9;
    height: 14px;
    width: 14px;
    top: -5px;
    cursor: pointer;
    outline: 0;
}
.btn-find button{
    padding: 14px 38px;
    background-color: #FF681A;
    border: none;
    outline: none !important;
    border-radius: 10px;
    color: #fff;
    font-weight: 600;
    cursor: pointer;
}
.heading__title span{
    font-family: "ABeeZee", sans-serif;
    font-size: 20px;
    color: var(--primary-color);
    font-weight: 600;
    margin-bottom: 0;
    display: block;
}
.heading__title h3{
    font-family: "ABeeZee", sans-serif;
    font-size: 48px;
    color: #1c1c1c;
    font-weight: 600;
}
.discover__item{
    margin-bottom: 30px;
}
.discover__item p{
    font-weight: 700;
    color: #505050;
    text-align: center;
    margin-top: 10px;
}

.list__holiday{
    position: relative;
    margin-bottom: 30px;
    box-shadow: 0px 0px 10px 0px rgba(21.762410207939507, 105.4, 5.7282608695652195, 0.5);
    border-radius: 4px;
}
.holiday__img{
    position: relative;
    overflow: hidden;
    border-radius: 4px 4px 0 0;
}
.holiday__img:hover img{
    transform: scale(1.1);
    transition: all .6s;
}
.holiday__img img{
    min-height: 200px;
    transition: all .6s;
}
.price-hd{
    position: absolute;
    left: 20px;
    bottom: 10px;
    font-size: 28px;
    color: #fff;
    font-weight: 600;
}
.holiday__des{
    padding: 24px;
}
.holiday__des a{
    display: inline-block;
    font-size: 20px;
    color: #1c1c1c;
    font-weight: 500;
    margin-bottom: 15px;
}
.holiday__des a:hover{
    color: var(--primary-color);
    text-decoration: none;
    transition: all .3s;
}
.holiday__des span{
    color: #505050;
}
.holiday__des span i{
    color: #FF681A;
}
.featured{
    position: absolute;
    left: 15px;
    top: -12px;
    padding: 4px 10px;
    border-radius: 20px;
    background-color: #37D4D9;
    font-size: 12px;
    color: #fff;
    z-index: 2;
}
.featured i{
    font-size: 10px;
}
.btn-page a,
.btn-page button{
    display: inline-block;
    position: relative;
    padding: 10px 30px;
    background-color: var(--primary-color);
    border-radius: 10px;
    color: #fff;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
    overflow: hidden;
    z-index: 1;
}
.btn-page button{
    border: none;
    outline: none !important;
    cursor: pointer;
}
.btn-page a::before,
.btn-page button::before{
    content: "";
    position: absolute;
    top: -1px;
    right: -1px;
    bottom: -1px;
    left: -1px;
    background-color: #FF681A;
    transform: scale(0);
    transform-origin: left top;
    border-radius: 10px;
    transition: opacity ease 0.4s, visibility ease 0.4s, transform ease 0.4s;
    z-index: -1;
}
.btn-page a::after,
.btn-page button::after{
    content: "";
    position: absolute;
    top: -1px;
    right: -1px;
    bottom: -1px;
    left: -1px;
    background-color: #FF681A;
    transform: scale(0);
    transform-origin: right bottom;
    border-radius: 10px;
    transition: opacity ease 0.4s, visibility ease 0.4s, transform ease 0.4s;
    z-index: -1;
}
.btn-page a:hover,
.btn-page button:hover{
    color: #fff;
    text-decoration: none;
}
.btn-page a:hover::before,
.btn-page a:hover::after,
.btn-page button:hover::before,
.btn-page button:hover::after{
    transform: scale(1);
    transition: opacity ease 0.4s, visibility ease 0.4s, transform ease 0.4s;
}

.img_abs{
    position: absolute;
    top: 10%;
    left: 0;
}
.img_abs img{
    animation: anmImg 4s infinite;
}
.st__about__content{
    position: relative;
}
.st__about__content ul{
    padding-left: 20px;
}
.st__about__content ul li{
    list-style: disc;
    margin-bottom: 10px;
}
.travel__type{
    display: grid;
    grid-template-columns: auto auto auto;
    gap: 10px;
}
.list__type__item{
    overflow: hidden;
    border-radius: 6px;
}
.list__type__item img{
    transition: all .5s;
}
.list__type__item:hover img{
    transform: scale(1.05);
    transition: all .5s;
}
.box-img{
    margin-bottom: 30px;
    overflow: hidden;
}
.img1{
    border: 5px solid #c7d10d;
    border-radius: 115px 0 0 0;
}
.img2{
    border: 5px solid var(--primary-color);
    border-radius: 0 75px 0 0;
}
.img3{
    border: 5px solid #ffdc66;
    border-radius: 0 0 0 80px;
}
@keyframes anmImg{
    0% {
        transform: scale(1);
        opacity: 0;
    }
    50% {
        opacity: 0.8;
    }
    100% {
        transform: scale(1.2);
        opacity: 0;
    }
}
.list__post{
    position: relative;
    border-radius: 20px;
    overflow: hidden;
}
.list__post img{
    min-height: 500px;
}
.post__des{
    position: absolute;
    left: 35px;
    bottom: 35px;
    right: 35px;
    background-color: #fff;
    border-radius: 10px;
    padding: 25px;
}
.date-post{
    position: absolute;
    top: -17px;
    left: 50%;
    transform: translateX(-50%);
    padding: 6px 20px;
    border-radius: 20px;
    color: #fff;
    font-weight: 600;
    background-color: var(--primary-color);
}
.post__des a{
    display: block;
    font-size: 24px;
    color: #1c1c1c;
    font-weight: 700;
    text-align: center;
    margin-bottom: 20px;
}
.post__des a:hover{
    color: var(--primary-color);
    text-decoration: none;
    transition: all .3s;
}
.post__des ul{
    display: flex;
    justify-content: center;
    gap: 40px;
}
.post__des ul li{
    position: relative;
}
.post__des ul li i{
    color: #37D4D9;
}
.post__des ul li:first-child::before{
    content: "";
    position: absolute;
    right: -20px;
    top: 2px;
    height: 16px;
    width: 1px;
    background-color: #505050;
}
.review{
    background-image: url('../image/bg-review.png');
    background-repeat: no-repeat;
}
.review__des p{
    color: #635900;
}
.review__content{
    background-color: #fff;
    border-radius: 10px;
    text-align: center;
    padding: 24px 30px;
}
.rating span i{
    color: var(--primary-color);
}
.author{
    text-align: center;
}
.author h4{
    font-size: 24px;
    color: #1c1c1c;
}
.author span{
    font-size: 14px;
    color: #1c1c1c;
}
.author img{
    width: 80px !important;
    margin: auto;
    margin-top: 10px;
}
/*end home*/

/*tour*/
.path__des{
    box-shadow: 0 4px 8px rgba(0, 0, 0, .15);
    border-radius: 4px;
    padding: 5px 15px;
}
.path__des h4{
    font-size: 20px;
    color: #1c1c1c;
    font-weight: 600;
}
.path__des ul{
    display: flex;
    gap: 30px;
    margin-bottom: 0;
}
.path__des ul li{
    position: relative;
}
.path__des ul li:not(:last-child)::before{
    content: "/";
    position: absolute;
    top: 0;
    right: -18px;
}
.path__des ul li a{
    color: #1c1c1c;
}
.icon-filter{
    display: none;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    background-color: #FF681A;
    color: #fff;
    border-radius: 4px;
    margin-bottom: 10px;
}
.icon-filter i{
    font-size: 20px;
}
.filter__tour{
    padding: 24px;
    box-shadow: 0px 4px 8px rgba(0,0,0,.04),0px 0px 2px rgba(0,0,0,.06),0px 0px 1px rgba(0,0,0,.04);
    margin-bottom: 30px;
}
.filter__field:not(:last-child){
    border-bottom: 1px solid #00000012;
    margin-bottom: 24px;
    padding-bottom: 24px;
}
.filter-title{
    font-size: 16px;
    color: #1c1c1c;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    cursor: pointer;
}
.filter-title i{
    transition: all .3s;
}
.filter-title.show i{
    transform: rotate(180deg);
    transition: all .3s;
}
.count{
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
}
.count input{
    width: 50%;
    font-size: 14px;
    border: none;
    outline: none;
}
#maxDay,
#maxPrice{
    text-align: right;
}
.filter__content{
    margin-top: 20px;
}
.filter__content .slide__range{
    opacity: 1;
    visibility: visible;
    position: static;
}
.filter__content .price-range-slider .range-bar .ui-slider-handle{
    background-color: #FF681A;
    width: 16px;
    height: 16px;
    top: -7px;
    border: none !important;
}
.filter__content .price-range-slider .range-bar .ui-slider-range,
.filter__content .price-range-slider .range-bar{
    height: 2px;
}
.trip__type ul{
    margin-bottom: 0;
}
.trip__type ul li:not(:last-child){
    margin-bottom: 20px;
}
.check__options {
    position: relative;
}
.check__options span {
    position: relative;
    display: inline-block;
    cursor: pointer;
    font-size: 14px;
    color: #1c1c1c;
    border-radius: 4px;
    padding-left: 30px;
}
.check__options span::before {
    content: "";
    width: 20px;
    height: 20px;
    border-radius: 4px;
    border: 1px solid #00000040;
    position: absolute;
    left: 0;
}
.check__options span:after {
    content: "\f00c";
    font-family: 'fontawesome';
    opacity: 0;
    position: absolute;
    left: 5px;
    top: 1px;
    color: #fff;
    font-size: 14px;
}
.check__options input[type="checkbox"] {
    visibility: hidden;
    display: none;
}
.check__options input[type="checkbox"]:checked+span::before {
    background-color: #FF681A;
    border-color: #FF681A;
}
.check__options input[type="checkbox"]:checked+span:after {
    opacity: 1;
}
.sort__tour{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}
.list__tour{
    margin-bottom: 30px;
    box-shadow: 0 0px 15px rgba(0, 0, 0, 0.04);
    border-radius: 4px;
}
.list__tour:hover{
    box-shadow: 0 10px 15px rgba(0,0,0,.1);
    transition: all .4s;
}
.tour__img{
    overflow: hidden;
    border-radius: 4px 4px 0 0;
}
.tour__img img{
    transition: all .4s;
}
.tour__img:hover img{
    transform: scale(1.1);
    transition: all .4s;
}
.tour__des{
    padding: 16px;
}
.tour__des > a{
    display: inline-block;
    font-size: 20px;
    color: #1c1c1c;
    font-weight: 600;
    margin-bottom: 10px;
}
.tour__des > a:hover{
    text-decoration: none;
    color: var(--primary-color);
    transition: all .3s;
}
.tour__code{
    display: inline-block;
    font-size: 14px;
    margin-bottom: 10px;
}
.tour__des ul li{
    font-size: 14px;
    color: #505050;
    margin-bottom: 8px;
}
.tour__des ul li i{
    color: #FF681A;
}
.price__tour{
    font-size: 32px;
    color: var(--primary-color);
    font-weight: 600;
}
.btn-tour{
    padding: 16px;
    border-top: 1px solid #e8e9e7;
}
.btn-tour a{
    display: block;
    padding: 10px 0;
    border-radius: 4px;
    background-color: #FF681A;
    color: #fff;
    font-weight: 500;
    text-align: center;
}
.btn-tour a:hover{
    color: #fff;
    text-decoration: none;
    background-color: var(--primary-color);
    transition: all .3s;
}
.heading__tour{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.heading__tour h3{
    font-size: 32px;
    color: #1c1c1c;
    font-weight: 500;
}
.day__tour{
    box-shadow: 0px 4px 8px rgba(0,0,0,.04),0px 0px 2px rgba(0,0,0,.06),0px 0px 1px rgba(0,0,0,.04);
    border-radius: 4px;
    width: 70px;
    text-align: center;
    overflow: hidden;
}
.day__tour p{
    background-color: #FF681A;
    color: #fff;
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 0;
}
.day__tour span{
    display: inline-block;
    font-size: 14px;
    padding: 5px 0;
}
.gallery__tour{
    position: relative;
}
.slide__image .owl-nav button i{
    font-size: 14px;
    color: #FF681A;
}
.slide__image .owl-nav button.owl-prev{
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: #fff !important;
    text-align: center;
    line-height: 35px;
    border: none;
    outline: none;
}
.slide__image .owl-nav button.owl-next{
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: #fff !important;
    text-align: center;
    line-height: 35px;
    border: none;
    outline: none;
}
.group__img{
    position: absolute;
    left: 15px;
    bottom: -14px;
    padding: 5px 15px;
    background-color: #fff;
    border-radius: 20px;
    font-size: 14px;
    color: #505050;
    box-shadow: 0px 4px 8px rgba(0,0,0,.04),0px 0px 2px rgba(0,0,0,.06),0px 0px 1px rgba(0,0,0,.04);
    z-index: 2;
}
.group__img{
    cursor: pointer;
}
.entry__content{
    padding: 10px 10px;
    color: black;
    background-color: #00000026;
    margin-top: 30px;
}
.entry__content ul li{
    margin-bottom: 5px;
}
.entry__content ul li span:first-child{
    text-decoration: underline;
}
.tag-tour{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-left: 10px;
}
.tag-tour a{
    position: relative;
    padding: 2px 5px;
    background-color: var(--primary-color);
    font-size: 12px;
    color: #fff !important;
    text-decoration: none !important;
    border-radius: 20px;
}
.tag-tour a:not(:last-child)::before{
    content: ",";
    position: absolute;
    bottom: 0;
    right: -6px;
    color: #1c1c1c;
    font-size: 18px;
}
.sidebar__tour{
    padding: 10px;
    border: 1px solid #dfd7d7;
    background-color: #fdf6ec;
    margin-bottom: 40px;
    border-radius: 6px;
}
.sidebar__tour > h4{
    font-size: 24px;
    color: var(--primary-color);
    text-transform: uppercase;
    text-align: center;
    font-weight: 600;
    margin-bottom: 20px;
}
.step-title{
    font-size: 18px;
    color: var(--primary-color);
    text-decoration: underline;
    font-weight: 400;
}
.button__change{
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.button__change button{
    padding: 5px 10px;
    border: 1px solid #1c1c1c;
    outline: none !important;
    cursor: pointer;
    background-color: #fff;
    border-radius: 0;
    font-size: 14px;
}
.button__change button.active{
    border-color: #FF681A;
    background-color: #FF681A;
    color: #fff;
}
.grid__price{
    display: grid;
    grid-template-columns: auto auto auto;
    gap: 10px;
    margin-top: 15px;
}
.list__price{
    background-color: #cbc098;
    padding: 10px;
    border-radius: 10px;
    text-align: center;
    cursor: pointer;
    transition: all .1s;
}
.list__price:hover{
    box-shadow: 0 0 20px rgba(9, 157, 194, 0.2);
    transform: scale(1.04);
    transition: all .1s;
}
.list__price p{
    background-color: #fff0d3;
    border-radius: 6px;
    font-size: 14px;
    color: var(--primary-color);
    font-weight: 600;
}
.money__change{
    margin-bottom: 10px;
}
.money__change span,
.money__change strong{
    font-size: 19px;
    font-weight: bold;
}
.choose__item{
    padding: 5px 10px;
    background-color: #ebdca8;
    border-radius: 5px;
    text-align: center;
}
.choose__item i{
    color: #fff;
}
.list__price.selected{
    background-color: var(--primary-color);
}
.list__price.selected .money__change span,
.list__price.selected .money__change strong{
    color: #fff;
}
.list__price.selected .choose__item i::before{
    content: "\f00c";
    color: #1c1c1c;
}
.notes{
    margin-top: 10px;
}
.notes p{
    font-size: 14px;
    color: darkred;
    text-transform: uppercase;
    text-decoration: underline;
    font-weight: 600;
    font-style: italic;
    margin-bottom: 0;
}
.notes ul{
    padding-left: 20px;
}
.notes ul li{
    list-style: disc;
    font-size: 14px;
    color: darkred;
    font-style: italic;
}
.button-goto{
    display: block;
    padding: 10px 0;
    background-color: var(--primary-color);
    border-radius: 5px;
    font-size: 18px;
    color: #fff !important;
    text-decoration: none !important;
    text-align: center;
}
.button-goto:hover{
    background-color: #FF681A;
    transition: all .3s;
}
.tab-content{
    display: none;
}
.tab-content.current{
    display: block;
}
.wrap__content{
    box-shadow: 0px 4px 8px rgba(0,0,0,.04),0px 0px 1px rgba(0,0,0,.04);
}
.tabs{
    display: flex;
    flex-wrap: wrap;
    padding-left: 20px;
    border-bottom: 1px solid #040f1a1a;
}
.list__tabs{
    padding: 15px;
    text-align: center;
    color: #000;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: all .3s;
}
.list__tabs p{
    margin-bottom: 0;
}
.list__tabs.current{
    color: #FF681A;
    border-color: #FF681A;
    transition: all .3s;
}
.wrap__tab h3{
    font-size: 30px;
    color: #1c1c1c;
    font-weight: 500;
    margin-bottom: 15px;
}
.wrap__tab{
    padding: 25px 40px;
}
.wrap__tab ul li{
    margin-bottom: 10px;
}
.wrap__tab ul li i{
    color: #FF681A;
}
.main__itn{
    margin-left: 20px;
    padding-left: 30px;
    border-left: 1px solid #040f1a1a;
}
.heading__itn{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.heading__itn span{
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}
.list__itn{
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px solid #040f1a1a;
}
.sub__title__itn{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 18px;
    color: #061626cc;
    font-weight: 500;
    cursor: pointer;
}
.sub__title__itn i{
    color: #FF681A;
    transition: all .3s;
}
.sub__title__itn.active i::before{
    content: "\f056";
    transition: all .3s;
}
.dropdown__content{
    padding-top: 10px;
    display: none;
}
.sub__title__itn::before{
    content: "";
    position: absolute;
    top: 50%;
    left: -35.5px;
    transform: translateY(-50%);
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #FF681A;
}
.list__itn:first-child .sub__title__itn::before{
    display: none;
}
.list__itn:first-child .sub__title__itn::after{
    content: "\f3c5";
    font-family: "fontawesome";
    position: absolute;
    top: 0;
    left: -46px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #FF681A;
    color: #fff;
    text-align: center;
    font-size: 14px;
    line-height: 30px;
}
.rq{
    color: red;
    font-weight: bold;
}
.enquiry{
    box-shadow: 0px 4px 8px rgba(0,0,0,.04),0px 0px 1px rgba(0,0,0,.04);
    padding: 30px 30px;
    border-radius: 4px;
}
.form-booking h3 strong{
    font-size: 20px;
    color: var(--primary-color);
}
.form-booking label{
    display: block;
    color: #1c1c1c;
    font-weight: bold;
}
.form-booking input,
.form-booking select{
    width: 100%;
    border: 1px solid #06162633;
    padding: 12px;
    outline: none;
    border-radius: 4px;
}
.form-booking textarea{
    resize: vertical;
    width: 100%;
    border: 1px solid #06162633;
    padding: 12px;
    outline: none;
    border-radius: 4px;
}
.form-booking button{
    display: block;
    width: 100%;
    padding: 18px 0;
    color: #fff;
    text-align: center;
    background-color: #FF681A;
    border-radius: 4px;
    border: none;
    outline: none !important;
    cursor: pointer;
}
/*end tour*/

/*about*/
.member h4{
    font-size: 32px;
    color: #1c1c1c;
    font-weight: 600;
}
.list__member{
    background-color: #f9f9f9;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 30px;
    text-align: center;
    transition: all .3s;
}
.list__member:hover{
    transform: translateY(-15px);
    transition: all .3s;
}
.list__member h5{
    font-size: 19px;
    color: #505050;
    font-weight: 600;
    margin-bottom: 15px;
}
.list__member img{
    width: 100%;
    border-radius: 10px;
    margin-bottom: 10px;
}
.list__member p{
    font-size: 14px;
    color: #505050;
    margin-bottom: 5px;
}
.st__contact{
    background-color: #EBEBEB;
}
.list__card{
    display: flex;
    gap: 15px;
    padding: 30px 25px;
    border: 1px solid var(--primary-color);
    border-radius: 10px;
    background-color: #fff;
    margin-bottom: 30px;
}
.icon__card{
    width: 60px;
    height: 60px;
    min-width: 60px;
    border-radius: 50%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: var(--primary-color);
}
.icon__card i{
    color: #fff;
    font-size: 20px;
}
.contact__card__info h5{
    font-size: 20px;
    color: #1c1c1c;
    font-weight: 600;
}
.contact__card__info p{
    color: #505050;
}
.contact__card__info p i{
    color: var(--primary-color);
}
.contact__card__des ul{
    padding-left: 20px;
}
.contact__card__des ul li{
    list-style: disc;
    margin-bottom: 8px;
}
.list__card:hover .icon__card{
    background-color: #FF681A;
    transition: all .3s;
}
.road__map{
    background-image: url('../image/bg-road-map.png');
    background-repeat: no-repeat;
    background-size: cover;
}
.road__map .history__step{
    padding-right: 100px;
}
.road__map .history__step:nth-child(even){
    margin-top: 80px;
    padding-left: 100px;
    padding-right: 0;
}
.title__area{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 15px;
}
.title__area h3{
    font-size: 30px;
    color: #1c1c1c;
    font-weight: 600;
}
.title__area span{
    position: relative;
    display: inline-block;
    font-size: 24px;
    color: #8b919c;
    font-weight: 600;
    padding-left: 30px;
}
.title__area span::before{
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: var(--primary-color);
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}
.card__history{
    padding: 30px;
    background-color: #fff;
    border-radius: 10px;
}
.card__history p{
    color: #8b919c;
    line-height: 29px;
}
.card__blog{
    padding: 30px 25px;
    border-radius: 10px;
    border: 1px solid #ffccb1;
}
.card__blog img{
    border-radius: 10px;
    transition: all .4s;
}
.card__blog__img{
    overflow: hidden;
    border-radius: 10px;
}
.card__blog__img:hover img{
    transform: scale(1.1);
    transition: all .4s;
}
.card__blog__des a{
    display: inline-block;
    font-size: 24px;
    color: #1c1c1c;
    font-weight: 600;
}
.card__blog__des a:hover{
    color: var(--primary-color);
    text-decoration: none;
    transition: all .3s;
}
.card__blog__des p{
    color: #505050;
}
.blog__bottom{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
}
.blog__bottom span{
    color: #505050;
}
.gallery{
    background-image: url('../image/bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}
.gallery .heading__title h3{
    color: #85B16B;
}
.tabs.tabs-gallery{
    border: none;
    padding-left: 0;
    gap: 20px;
}
.tabs-gallery .list__tabs{
    color: #fff;
    border: 1px solid #fff;
    border-radius: 5px;
    padding: 5px 10px;
}
.tabs-gallery .list__tabs.list__tabs.current{
    background-color: #FF681A;
    border-color: #FF681A;
}
.grid__gallery{
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 20px;
}
/*end about*/

/*contact*/
.contact{
    border-radius: 10px;
    background-color: var(--primary-color);
    padding: 60px 30px 30px 30px;
}
.contact__us{
    background-color: #f7f7f7;
}
.form-contact input,
.form-contact textarea{
    width: 100%;
    padding: 16px;
    border: 1px solid #ffccb1;
    border-radius: 10px;
    outline: none;
}
.form-contact textarea{
    resize: vertical;
}
.map{
    border: 3px solid var(--primary-color);
}
.map iframe{
    width: 100%;
    display: block;
}
.list__blog{
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 30px;
}
.blog__des{
    border: 1px solid #ffccb1;
    border-top: none;
    padding: 40px;
    border-radius: 0 0 10px 10px;
}
.blog__des > a{
    display: inline-block;
    font-size: 30px;
    color: #1c1c1c;
    font-weight: 600;
}
.blog__des > a:hover{
    color: var(--primary-color);
    text-decoration: none;
    transition: all .3s;
}
.blog__des p{
    color: #505050;
    line-height: 27px;
}
/*end contact*/

/*blog*/
.sidebar__blog {
    padding: 30px;
    border: 1px solid #dfd7d7;
    border-radius: 10px;
    margin-bottom: 30px;
    background-color: #f7f7f7;
}
.sidebar__blog h4{
    position: relative;
    font-size: 24px;
    color: #505050;
    margin-bottom: 20px;
    font-weight: 600;
    padding-bottom: 10px;
}
.sidebar__blog h4::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 70px;
    height: 2px;
    background-color: var(--primary-color);
}
.sidebar__blog h4::after {
    content: "";
    position: absolute;
    left: 15px;
    bottom: -2px;
    width: 6px;
    height: 4px;
    background-color: #fff;
}
.form__search-blog {
    position: relative;
}
.form__search-blog input {
    width: 100%;
    height: 50px;
    padding: 0 50px 0 20px;
    border: 1px solid #0000001a;
    background-color: #fff;
    border-radius: 10px;
    outline: none;
    color: #1c1c1c;
}
.form__search-blog button {
    position: absolute;
    top: 0;
    right: 0;
    width: 100px;
    height: 50px;
    background-color: var(--primary-color);
    border-radius: 0 10px 10px 0;
    font-size: 18px;
    font-weight: 500;
    color: #fff;
    border: none;
    outline: none !important;
    cursor: pointer;
}
.list__recent li:not(:last-child){
    margin-bottom: 15px;
}
.list__recent li a{
    color: #505050;
}
.list__recent li a:hover{
    color: var(--primary-color);
    text-decoration: none;
    transition: all .3s;
}
.cate li a{
    display: block;
    padding: 17px 18px;
    background-color: #fff;
    border: 1px solid #ffccb1;
    border-radius: 6px;
    color: #1c1c1c;
    font-weight: 600;
    margin-bottom: 10px;
}
.cate li a:hover{
    background-color: var(--primary-color);
    color: #fff;
    text-decoration: none;
    transition: all .3s;
}
.form-newsletter input{
    width: 100%;
    height: 50px;
    padding: 0 15px;
    border: 1px solid #0000001a;
    background-color: #fff;
    border-radius: 10px;
    outline: none;
    color: #1c1c1c;
}
.blog__gallery{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.navigation{
    padding: 30px 0;
    border-top: 1px solid #ffccb1;
    border-bottom: 1px solid #ffccb1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 30px 0;
}
.navigation a{
    display: flex;
    align-items: center;
    gap: 20px;
    text-decoration: none !important;
}
.navigation a img{
    width: 80px;
    height: 80px;
    min-width: 80px;
    border-radius: 4px;
}
.navigation a span{
    color: #1c1c1c;
    font-weight: 600;
}
.navigation a:hover span{
    color: var(--primary-color);
}
.next__post{
    flex-direction: row-reverse;
}
.list__feedback{
    padding: 25px 30px;
    border-radius: 10px;
    background-color: #f7f7f7;
    margin-bottom: 20px;
}
.heading__feedback{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px dashed #ffccb1;
}
.author{
    display: flex;
    align-items: center;
    gap: 15px;
}
.author__img img{
    width: 60px !important;
    height: 60px;
    object-fit: cover;
    border-radius: 50%;
}
.author__name h4{
    font-size: 18px;
    color: #1c1c1c;
    font-weight: 700;
}
.author__name p{
    font-size: 15px;
    margin-bottom: 0;
}
.rating__rv ul{
    display: flex;
    gap: 3px;
    margin-bottom: 0;
}
.rating__rv ul li i{
    font-size: 14px;
    color: #ffc800;
}
.rating__rv span{
    font-size: 14px;
    color: #acacac;
}
.our__brochure{
    background-image: url('../image/bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    padding: 20px 0;
}
.our__brochure__content h3{
    font-size: 36px;
    color: #999999;
    font-weight: 600;
}
.our__brochure__content p{
    color: #999999;
}
.our__brochure__content ul{
    padding-left: 20px;
}
.our__brochure__content ul li{
    list-style: disc;
}
.owl-theme .owl-dots .owl-dot{
    outline: none;
}
/*end blog*/

/*footer*/
footer{
    background-image: url('../image/bg-footer.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 40px;
}
.footer__info p{
    color: #fff;
}
.social{
    display: flex;
    gap: 10px;
}
.footer__info li a{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 45px;
    height: 45px;
    border: 1px solid #fff;
    border-radius: 50%;
    color: #fff;
}
.footer__info li a:hover{
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    text-decoration: none;
    transition: all .3s;
}
.card__footer{
    display: flex;
    justify-content: space-between;
    padding: 30px;
    background-color: var(--primary-color);
    border-radius: 10px;

}
.card__footer h4{
    font-size: 36px;
    color: #fff;
    font-weight: 600;
}
.card__footer p{
    color: #fff;
}
.card__footer .btn-page a{
    background-color: #fff;
    color: var(--primary-color);
}
.card__footer .btn-page a:hover{
    color: #fff;
}
.card__footer__img img{
    width: 200px;
    min-width: 200px;
}
.sub h4{
    position: relative;
    font-size: 22px;
    color: #fff;
    font-weight: 600;
    padding-bottom: 10px;
    margin-bottom: 30px;
}
.sub h4::before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 60px;
    height: 2px;
    background-color: var(--primary-color);
}
.sub h4::after{
    content: "";
    position: absolute;
    bottom: -1px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: #fff;
    outline: 3px solid var(--primary-color);
    animation: anmVector 5s infinite;
}
@keyframes anmVector{
    0%{
        left: 0;
    }
    50%{
        left: 60px;
    }
    100%{
        left: 0;
    }
}
.sub ul{
    display: grid;
    grid-template-columns: auto auto auto;
    gap: 1px;
}
.copyright{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 20px 0;
    margin-top: 30px;
    border-top: 1px solid #ffccb1;
}
.copyright span{
    color: #fff;
}
.copyright ul{
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin-bottom: 0;
}
.copyright ul li{
    position: relative;
}
.copyright ul li:not(:last-child)::before{
    content: "";
    position: absolute;
    right: -15px;
    top: 3px;
    width: 1px;
    height: 15px;
    background-color: var(--primary-color);
}
.copyright ul li a{
    color: #fff;
}
.back-to-top{
    position: fixed;
    right: 30px;
    bottom: 100%;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #ecc31f;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    cursor: pointer;
    opacity: 0;
    transition: all .5s;
    z-index: 10;
}
.back-to-top::before{
    content: "";
    position: absolute;
    top: -6px;
    right: -6px;
    bottom: -6px;
    left: -6px;
    border: 2px dashed #ecc31f;
    border-radius: 50%;
    animation: anmBtt 10s infinite linear;
}
.back-to-top.animate{
    bottom: 30px;
    opacity: 1;
    transition: all .5s;
}
.back-to-top:hover{
    background-color: var(--primary-color);
    transition: all .3s;
}
.back-to-top:hover::before{
    border-color: var(--primary-color);
    transition: all .3s;
}
@keyframes anmBtt{
    100%{
        transform: rotate(360deg);
    }
}
/*end footer*/

@media (min-width: 1200px) {
    .container {
        max-width: 1250px !important; 
    }
}

@media only screen and (max-width: 1200px){
    .menu,
    .btn__header,
    .menu__bar-desk{
        display: none;
    }
    .main__header{
        width: 100%;
        border-radius: 0;
    }
    .info__top,
    .info__right{
        width: 50%;
    }
    .logo img{
        height: 100px;
    }
    .menu__bar{
        display: block;
        padding: 5px 10px;
    }
    .main__header{
        padding: 0 40px;
    }
    .st__about__content .btn-page{
        text-align: center;
    }
    .st__about__content,
    .review__des{
        margin-bottom: 30px;
    }
    .heading__title h3,
    .intro__content h3{
        font-size: 27px;
    }
    .post__des{
        left: 20px;
        right: 20px;
        bottom: 20px;
    }



    .card__footer__img{
        display: none;
    }
}

@media only screen and (max-width: 991px){
    .road__map .history__step{
        padding-right: 30px;
    }
    .road__map .history__step:nth-child(even){
        padding-left: 30px;
    }
    .grid__gallery{
        grid-template-columns: repeat(3, 1fr);
    }
    .btn-find{
        text-align: center;
    }
}
@media only screen and (max-width: 767.98px){
    .menu__mobile{
        width: 80%;
    }
    .logo img{
        height: 50px;
    }
    .header__content{
        flex-direction: column;
    }
    .info__top, .info__right{
        width: 100%;
    }
    .info__right ul{
        justify-content: center;
    }
    .st__about .slide__intro .owl-nav button.owl-prev{
        left: 0;
    }
    .st__about .slide__intro .owl-nav button.owl-next{
        right: 0;
    }
    .icon-filter{
        display: inline-flex;
    }
    .filter__tour{
        display: none;
    }
    .card__history{
        padding: 20px;
    }
    .title__area h3{
        font-size: 26px;
    }
    .title__area span::before{
        display: none;
    }
    .card__blog{
        padding: 15px;
    }
    .btn-page a{
        padding: 8px 30px;
    }
    .road__map .history__step{
        padding-right: 15px;
    }
    .road__map .history__step:nth-child(even){
        padding-left: 15px;
    }
    .grid__gallery,
    .blog__gallery{
        grid-template-columns: repeat(2, 1fr);
    }
    .path{
        display: none;
    }
    .travel__type{
        grid-template-columns: auto auto;
    }
    .blog__des{
        padding: 15px;
    }
    .blog__des > a{
        font-size: 20px;
    }
    .navigation a img{
        width: 60px;
        min-width: 60px;
        height: 60px;
    }
    .navigation a{
        gap: 10px;
    }
    .card__footer{
        text-align: center;
        margin: 20px 0;
    }
    .card__footer h4{
        font-size: 30px;
    }
}

label.error {
    color: red;
    font-size: 0.9em;
    margin-top: 4px;
    display: block;
}

/*Loader*/
.loader {
    width: 48px;
    height: 48px;
    border: 3px solid #FFF;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

    .loader::after {
        content: '';
        box-sizing: border-box;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 56px;
        height: 56px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-bottom-color: var(--primary-color);
        z-index: 11;
    }

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
} 
.loading-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.4);
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity:0.3;
}