@charset "UTF-8"; /** * Name: Eklaa EL-khaleeg * Version: 1.0.2 * Author: Themesflat * Author URI: http://www.themesflat.com */ /** * Name: Eklaa EL-khaleeg * Version: 1.0.2 * Author: Themesflat * Author URI: http://www.themesflat.com */ /** * Name: Eklaa EL-khaleeg * Version: 1.0.2 * Author: Themesflat * Author URI: http://www.themesflat.com */ /** * scroll-top * PreLoad * pagination * Social * price-range * video * widget Tour List * Counter * widget Destination * Blog * widget clip text * widget icon box * widget Testimonial * widget Team * Gallery * widget Image Box * Faq * Count Down * slider * Button * Tab */ @import "animate.css"; @import "jquery.fancybox.min.css"; @import "magnific-popup.css"; @import "swiper-bundle.min.css"; @import "nice-select.css"; @import "../../assets/fonts/style.css"; @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@100..900&family=Oranienbaum&display=swap'); @import "bootstrap.css"; /* Header -------------------------------------------------------------- */ html, body { overflow-x: hidden; } .owl-carousel.owl-loaded { direction: ltr; } .btn-check:focus+.btn-outline-primary, .btn-outline-primary:focus { box-shadow: none !important; } .cursor-pointer { cursor: pointer; } .header-top { padding-right: 209px; background-color: #EBEBEB; } .header-top .header-top-wrap .header-top-right ul li:not(:last-child) { margin-left: 36px; } .header-top .header-top-wrap .header-top-right ul li i { color: #44b774; margin-left: 8px; font-size: 15px; } .header-top .header-top-wrap .header-top-right ul li span { font-size: 15px; font-weight: 400; line-height: 19.53px; } .header-top .header-top-wrap .header-top-left .booking { margin-left: 32px; } .header-top .header-top-wrap .header-top-left .booking i { color: #44b774; margin-left: 5px; } .header-top .header-top-wrap .header-top-left .booking span { font-size: 14px; font-weight: 500; line-height: 17px; text-decoration: underline; } .header-top .header-top-wrap .header-top-left .follow-social span { font-size: 15px; font-weight: 500; line-height: 19.53px; margin-left: 18px; } .header-top .header-top-wrap .header-top-left .follow-social ul { background-color: #DCDCDC; padding: 8px 30px; text-align: ri; } .header-top .follow-social { justify-content: end; } .header-top .follow-social ul { padding: 8px 30px; text-align: left; gap: 10px; } .header-top .contacts { gap: 10px } .header-top .contacts a { font-size: 14px; color: white; text-decoration: none; } .header-top .contacts i { font-size: 12px; } .header-top p { color: white; border-left: 1px solid #AAA; border-right: 1px solid #AAA; } .header-top .follow-social ul li a { width: 30px; height: 30px; line-height: 30px; border: 1px solid white; border-radius: 50%; display: block; text-align: center; color: white; transition: all 0.3s ease-in-out; } .header-top .follow-social ul li a:hover { background: #44b774 !important; color: #FFF !important; border-color: #44b774 !important; } .header-top .follow-social ul li a i { font-size: 11px; } .header-top .header-top-wrap .header-top-left .follow-social ul li:not(:last-child) { margin-left: 22px; } .header-top .header-top-wrap .header-top-left .follow-social ul li .header-top .header-top-wrap .header-top-left .follow-social ul li a { color: rgba(0, 0, 0, 0.72); } .header-top .header-top-wrap .header-top-left .follow-social ul li a:hover { color: #44b774; } .header-top .header-top-wrap .header-top-left .follow-social ul li a i { font-size: 12px; } .notification .dropdown-menu { min-width: 285px; left: 0 !important; right: auto !important; top: 47px !important; padding: 25px 15px; box-shadow: rgba(20, 25, 38, 0.1) 0px 4px 24px 2px; border-radius: 16px; border: unset !important; transform: translate(0px, 27px) !important; } .notification .dropdown-menu li:not(:last-child) { margin-bottom: 15px; } .notification .dropdown-menu .message-item { gap: 15px; } .notification .dropdown-menu .message-item .image { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; flex-shrink: 0; border-radius: 50%; background-color: #44b774; color: #FFFFFF; } .notification .dropdown-menu .message-item .body-title { color: #000000; font-size: 14px; font-weight: 600; line-height: 20px; margin-bottom: 3px; } .notification .dropdown-menu .message-item .text-tiny { color: #4F545A; font-size: 12px; line-height: 15px; } .dropdown.account .dropdown-menu { min-width: 150px; left: 0 !important; right: auto !important; top: 47px !important; padding: 25px 15px; box-shadow: rgba(20, 25, 38, 0.1) 0px 4px 24px 2px; border-radius: 16px; border: unset !important; transform: translate(0px, 31px) !important; } .dropdown.account .dropdown-menu li:not(:last-child) { margin-bottom: 10px; } .header-sidebar { background-color: #44b774; padding: 30px 60px; } .header-sidebar i { font-size: 33px; color: #FFFFFF; } .header-account ul li { color: #44b774; } .header-account ul li i { font-size: 20px; top: 5px; position: relative; } .header-account ul li a { color: #081E2A; font-size: 16px; font-weight: 500; display: flex; gap: 7px; } .header-account ul li a:hover { color: #44b774; } .header-account .register ul li a img { width: 40px; height: 40px; border-radius: 100%; border: 2px solid #FFFFFF; box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.14); } .header-account .search-mobie a i { font-size: 19px; color: #081E2A; } .header-account .search-mobie .show-search { margin-top: 5px; display: inline-block; } .dropdown-menu.top-search { padding: 0; min-width: max-content; left: 0px !important; transform: translate(0px, 63px) !important; right: auto !important; top: 0px !important; } .show-search.show i::before { content: "\e986"; font-size: 17px; padding: 1px; } .main-header { z-index: 99; width: 100%; position: relative; background-color: #FFFFFF; } #showlogo { display: none; } /* Header Email */ .main-header .header-account { padding: 0; gap: 5px; } .main-header .header-account .currency .nice-select { border: unset !important; border-radius: unset; padding: 8px 20px 8px 20px; } .main-header .header-account .currency .nice-select .current { font-size: 15px; font-weight: bold; line-height: 20px; color: #000000; } .auth-buttons { padding: 10px; } .main-header .header-account .currency .nice-select:after { border-bottom: 1.7px solid #ffffff; border-left: 1.7px solid #ffffff; margin-top: -6px; left: 5px; } .main-header .header-account .language .nice-select { border: unset !important; border-radius: unset; padding: 8px 0px 8px 26px; } .main-header .header-account .language .nice-select img { width: 20px; margin-left: 8px; } .main-header .header-account .language .nice-select .current { font-size: 15px; font-weight: bold; line-height: 20px; color: #000000; } .main-header .header-account .language .nice-select:after { border-bottom: 1.7px solid #ffffff; border-left: 1.7px solid #ffffff; margin-top: -6px; left: 5px; right: auto; } .border-r-l ul { border-left: 1px solid #DDD; border-right: 1px solid #DDD; } .main-header .header-account .language .nice-select.open .list { width: 200px; } .main-header .logo-box .logo img { display: inline-block; max-width: 100%; width: 130px; height: auto; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; } .main-header .logo-box .logo { position: relative; } #header { width: 100%; } .main-header .header-lower { position: relative; padding-right: 214px; padding-left: 45px; transition: all 300ms ease; -moz-transition: all 300ms ease; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; } .main-header .header-lower .fly-ab { position: absolute; width: auto; right: -8px; top: 0; } .main-header .header-lower .nav-outer { position: relative; /* width: 80%; */ } .main-header .header-upper .logo-box { position: relative; padding: 10px 0px 10px; } .main-header .header-upper .logo-box .logo { position: relative; } /* Main Menu */ .main-header .main-menu { position: relative; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; } .main-header .main-menu .navbar-collapse { padding: 0px; display: block; } .main-header .header-lower .main-menu .navigation { position: relative; } .main-header .navigation li svg:not(:host).svg-inline--fa { color: #44b774; display: none; } .main-header .main-menu .navigation>li { position: relative; display: inline-block; transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; margin-left: 26px; } .main-header .sticky-header .nav-outer .options-box { margin-top: 40px; } /*Sticky Header*/ .main-header .sticky-header { position: fixed; opacity: 0; visibility: hidden; right: 0px; top: 0px; width: 100%; padding: 0px 0px; z-index: 0; transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); } .main-header .sticky-header .mobile-nav-toggler { display: none; cursor: pointer; } .main-header .sticky-header .logo { position: relative; padding: 7px 0px; } .main-header.fixed-header .sticky-header { z-index: 999; opacity: 1; visibility: visible; -ms-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -op-animation-name: fadeInDown; -webkit-animation-name: fadeInDown; animation-name: fadeInDown; -ms-animation-duration: 0.3s; -moz-animation-duration: 0.3s; -op-animation-duration: 0.3s; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -ms-animation-timing-function: linear; -moz-animation-timing-function: linear; -op-animation-timing-function: linear; -webkit-animation-timing-function: linear; animation-timing-function: linear; -ms-animation-iteration-count: 1; -moz-animation-iteration-count: 1; -op-animation-iteration-count: 1; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; } .main-header .main-menu .navigation>li>a { position: relative; display: block; text-align: center; line-height: 26px; font-weight: 600; padding: 33px 0px; letter-spacing: 0px; color: #081E2A; font-size: 15px; text-transform: capitalize; transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .main-header .main-menu .navigation>li:last-child { margin-left: 0; } .main-header .main-menu .navigation>li:last-child>a { padding-left: 0px; } .main-header .sticky-header .main-menu .navigation>li { position: relative; } .main-header .sticky-header .main-menu .navigation>li:last-child { margin-left: 0; } .main-header .main-menu .navigation>li:last-child ul { left: 0px; } .main-header .sticky-header .main-menu .navigation>li>a:after { top: 22px; } .main-header .sticky-header .main-menu .navigation>li>a>span { top: 10px; } .main-header .main-menu .navigation>li:hover>a, .main-header .main-menu .navigation>li.current>a { opacity: 1; color: #44b774; } .main-header .main-menu .navigation>li>ul { position: absolute; width: 243px; border-radius: 6px; z-index: 1; padding: 20px 30px 20px 30px; transform: translateY(15px); -webkit-transform-origin: top; -ms-transform-origin: top; -o-transform-origin: top; transform-origin: top; opacity: 0; visibility: hidden; transition: all 300ms ease; -moz-transition: all 300ms ease; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; background-color: #FFFFFF; box-shadow: 0px 6px 15px 0px rgba(64, 79, 104, 0.05); } .main-header .main-menu .navigation>li>ul.from-right { right: auto; left: 0px; } .main-header .main-menu .navigation>li>ul>li { position: relative; width: 100%; opacity: 0; text-align: right; transform: translateY(11px); transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; margin-bottom: 15px; } .main-header .main-menu .navigation>li>ul>li:last-child { margin-bottom: 0; } .main-header .main-menu .navigation>li:hover>ul>li { opacity: 1; transform: translateY(0px); } .main-header .main-menu .navigation>li>ul>li:last-child { border-bottom: none; } .main-header .main-menu .navigation>li>ul>li>a { position: relative; display: block; line-height: 24px; font-weight: 600; font-size: 15px; text-transform: capitalize; color: #081E2A; transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .main-header .main-menu .navigation>li>ul>li:hover>a { color: #44b774; } .main-header .main-menu .navigation>li>ul>li:hover>a::before { opacity: 1; } .main-header .main-menu .navigation>li>ul>li.dropdown2>a:after { font-family: "icomoon"; content: "\e9da"; position: absolute; left: 5px; top: 1px; width: 10px; height: 20px; display: block; color: #081E2A; line-height: 20px; font-size: 8px; font-weight: normal; text-align: center; z-index: 5; } .main-header .main-menu .navigation>li>ul>li.dropdown2:hover>a:after { color: #44b774; } .main-header .main-menu .navigation>li>ul>li>ul { position: absolute; right: 100%; top: 0px; width: 243px; border-radius: 6px; z-index: 1; padding: 20px 30px 20px 30px; box-shadow: 0px 6px 15px 0px rgba(64, 79, 104, 0.05); -webkit-transform: scaleY(0); -ms-transform: scaleY(0); -o-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: top; -ms-transform-origin: top; -o-transform-origin: top; transform-origin: top; opacity: 0; visibility: hidden; visibility: hidden; transition: all 300ms ease; -moz-transition: all 300ms ease; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; background-color: #FFFFFF; } .main-header .main-menu .navigation>li>ul>li>ul.from-right { right: auto; left: 0px; } .main-header .main-menu .navigation>li>ul>li>ul>li { position: relative; width: 100%; text-align: right; border-bottom: 1px solid rgba(255, 255, 255, 0.1); opacity: 0; margin-bottom: 15px; transform: translateY(-8px); transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .main-header .main-menu .navigation>li>ul>li>ul>li:last-child { margin-bottom: 0; } .main-header .main-menu .navigation>li>ul>li.dropdown2:hover>ul>li { opacity: 1; transform: translateY(0px); -webkit-transition-delay: 70ms; -moz-transition-delay: 70ms; -ms-transition-delay: 70ms; -o-transition-delay: 70ms; transition-delay: 70ms; } .main-header .main-menu .navigation>li>ul>li>ul>li:last-child { border-bottom: none; } .main-header .main-menu .navigation>li>ul>li>ul>li>a { position: relative; display: block; line-height: 24px; font-weight: 600; font-size: 15px; text-transform: capitalize; color: #081E2A; transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .main-header .main-menu .navigation>li>ul>li>ul>li>a:hover::before { opacity: 1; } .main-header .main-menu .navigation>li>ul>.current>a { color: #44b774; } .main-header .main-menu .navigation>li>ul>li>ul>.current>a { color: #44b774; } .main-header .main-menu .navigation>li>ul>li>ul>li:hover>a { color: #FFFFFF; } .main-header .main-menu .navigation>li>ul>li>ul>li:hover>a { color: #44b774; } .main-header .main-menu .navigation>li.dropdown2:hover>ul { -webkit-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); opacity: 1; visibility: visible; } .main-header .main-menu .navigation li>ul>li.dropdown2:hover>ul { transform: translateY(15px); opacity: 1; visibility: visible; } .main-header .main-menu .navigation>li.dropdown2>a::after { content: "\e905"; font-family: "icomoon"; font-weight: 500; font-size: 14px; margin-right: 5px; vertical-align: bottom; display: inline-block; } .main-header .main-menu .navbar-collapse>ul li.dropdown2 .dropdown2-btn { position: absolute; left: 10px; top: 6px; width: 30px; height: 30px; text-align: center; color: #44b774; line-height: 28px; border: 1px solid #EDEEEE; background-size: 20px; cursor: pointer; z-index: 5; display: none; } /*** ==================================================================== Mobile Menu ==================================================================== .header-top { padding-left: 209px; background-color: #EBEBEB; } .header-top .header-top-wrap .header-top-right ul li:not(:last-child) { margin-right: 36px; } .header-top .header-top-wrap .header-top-right ul li i { color: #44b774; margin-right: 8px; font-size: 15px; } .header-top .header-top-wrap .header-top-right ul li span { font-size: 15px; font-weight: 400; line-height: 19.53px; } .header-top .header-top-wrap .header-top-left .booking { margin-right: 32px; } .header-top .header-top-wrap .header-top-left .booking i { color: #44b774; margin-right: 5px; } .header-top .header-top-wrap .header-top-left .booking span { font-size: 14px; font-weight: 500; line-height: 17px; text-decoration: underline; } .header-top .header-top-wrap .header-top-left .follow-social span { font-size: 15px; font-weight: 500; line-height: 19.53px; margin-right: 18px; } .header-top .header-top-wrap .header-top-left .follow-social ul { background-color: #DCDCDC; padding: 8px 30px; text-align: ri; } .header-top .follow-social { justify-content: end; } .header-top .follow-social ul { padding: 8px 30px; text-align: right; gap: 10px; } .header-top .contacts { gap: 10px } .header-top .contacts a { font-size: 14px; color: white; text-decoration: none; } .header-top .contacts i { font-size: 12px; } .header-top p { color: white; border-right: 1px solid #AAA; border-left: 1px solid #AAA; } .header-top .follow-social ul li a { width: 30px; height: 30px; line-height: 30px; border: 1px solid white; border-radius: 50%; display: block; text-align: center; color: white; transition: all 0.3s ease-in-out; } .header-top .follow-social ul li a:hover { background: #44b774 !important; color: #FFF !important; border-color: #44b774 !important; } .header-top .follow-social ul li a i { font-size: 11px; } .header-top .header-top-wrap .header-top-left .follow-social ul li:not(:last-child) { margin-right: 22px; } .header-top .header-top-wrap .header-top-left .follow-social ul li .header-top .header-top-wrap .header-top-left .follow-social ul li a { color: rgba(0, 0, 0, 0.72); } .header-top .header-top-wrap .header-top-left .follow-social ul li a:hover { color: #44b774; } .header-top .header-top-wrap .header-top-left .follow-social ul li a i { font-size: 12px; } .notification .dropdown-menu { min-width: 285px; right: 0 !important; left: auto !important; top: 47px !important; padding: 25px 15px; box-shadow: rgba(20, 25, 38, 0.1) 0px 4px 24px 2px; border-radius: 16px; border: unset !important; transform: translate(0px, 27px) !important; } .notification .dropdown-menu li:not(:last-child) { margin-bottom: 15px; } .notification .dropdown-menu .message-item { gap: 15px; } .notification .dropdown-menu .message-item .image { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; flex-shrink: 0; border-radius: 50%; background-color: #44b774; color: #FFFFFF; } .notification .dropdown-menu .message-item .body-title { color: #000000; font-size: 14px; font-weight: 600; line-height: 20px; margin-bottom: 3px; } .notification .dropdown-menu .message-item .text-tiny { color: #4F545A; font-size: 12px; line-height: 15px; } .dropdown.account .dropdown-menu { min-width: 150px; right: 0 !important; left: auto !important; top: 47px !important; padding: 25px 15px; box-shadow: rgba(20, 25, 38, 0.1) 0px 4px 24px 2px; border-radius: 16px; border: unset !important; transform: translate(0px, 31px) !important; } .dropdown.account .dropdown-menu li:not(:last-child) { margin-bottom: 10px; } .header-sidebar { background-color: #44b774; padding: 30px 60px; } .header-sidebar i { font-size: 33px; color: #FFFFFF; } .header-account ul li { color: #44b774; } .header-account ul li i { font-size: 20px; top: 5px; position: relative; } .header-account ul li a { color: #081E2A; font-size: 16px; font-weight: 500; display: flex; gap: 7px; } .header-account ul li a:hover { color: #44b774; } .header-account .register ul li a img { width: 40px; height: 40px; border-radius: 100%; border: 2px solid #FFFFFF; box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.14); } .header-account .search-mobie a i { font-size: 19px; color: #081E2A; } .header-account .search-mobie .show-search { margin-top: 5px; display: inline-block; } .dropdown-menu.top-search { padding: 0; min-width: max-content; right: 0px !important; transform: translate(0px, 63px) !important; left: auto !important; top: 0px !important; } .show-search.show i::before { content: "\e986"; font-size: 17px; padding: 1px; } .main-header { z-index: 99; width: 100%; position: relative; background-color: #FFFFFF; } #showlogo { display: none; } /* Header Email */ .main-header .header-account { padding: 0; gap: 5px; } .main-header .header-account .currency .nice-select { border: unset !important; border-radius: unset; padding: 8px 20px 8px 20px; } .main-header .header-account .currency .nice-select .current { font-size: 15px; font-weight: bold; line-height: 20px; color: #000000; } .auth-buttons { padding: 10px; } .main-header .header-account .currency .nice-select:after { border-bottom: 1.7px solid #ffffff; border-left: 1.7px solid #ffffff; margin-top: -6px; left: 5px; right: auto; } .main-header .header-account .language .nice-select { border: unset !important; border-radius: unset; padding: 8px 0px 8px 26px; } .main-header .header-account .language .nice-select img { width: 20px; margin-left: 8px; } .main-header .header-account .language .nice-select .current { font-size: 15px; font-weight: bold; line-height: 20px; color: #000000; } .main-header .header-account .language .nice-select:after { border-bottom: 1.7px solid #ffffff; border-left: 1.7px solid #ffffff; margin-top: -6px; left: 5px; } .main-header .header-account .language .nice-select.open .list { width: 110px; } .main-header .logo-box .logo img { display: inline-block; max-width: 100%; width: 130px; height: auto; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; } .main-header .logo-box .logo { position: relative; } #header { width: 100%; } .main-header .header-lower { position: relative; padding-right: 214px; padding-left: 45px; transition: all 300ms ease; -moz-transition: all 300ms ease; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; } .main-header .header-lower .fly-ab { position: absolute; width: auto; right: -8px; top: 0; } .main-header .header-lower .nav-outer { position: relative; /* width: 80%; */ } .main-header .header-upper .logo-box { position: relative; padding: 10px 0px 10px; } .main-header .header-upper .logo-box .logo { position: relative; } /* Main Menu */ .main-header .main-menu { position: relative; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; } .main-header .main-menu .navbar-collapse { padding: 0px; display: block; } .main-header .header-lower .main-menu .navigation { position: relative; } .main-header .navigation li svg:not(:host).svg-inline--fa { color: #44b774; display: none; } .main-header .main-menu .navigation>li { position: relative; display: inline-block; transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; margin-left: 26px; } .main-header .sticky-header .nav-outer .options-box { margin-top: 40px; } /*Sticky Header*/ .main-header .sticky-header { position: fixed; opacity: 0; visibility: hidden; right: 0px; top: 0px; width: 100%; padding: 0px 0px; z-index: 0; transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); } .main-header .sticky-header .mobile-nav-toggler { display: none; cursor: pointer; } .main-header .sticky-header .logo { position: relative; padding: 7px 0px; } .main-header.fixed-header .sticky-header { z-index: 999; opacity: 1; visibility: visible; -ms-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -op-animation-name: fadeInDown; -webkit-animation-name: fadeInDown; animation-name: fadeInDown; -ms-animation-duration: 0.3s; -moz-animation-duration: 0.3s; -op-animation-duration: 0.3s; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -ms-animation-timing-function: linear; -moz-animation-timing-function: linear; -op-animation-timing-function: linear; -webkit-animation-timing-function: linear; animation-timing-function: linear; -ms-animation-iteration-count: 1; -moz-animation-iteration-count: 1; -op-animation-iteration-count: 1; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; } .main-header .main-menu .navigation>li>a { position: relative; display: block; text-align: center; line-height: 26px; font-weight: 600; padding: 33px 0px; letter-spacing: 0px; color: #081E2A; font-size: 15px; text-transform: capitalize; transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .main-header .main-menu .navigation>li:last-child { margin-left: 0; } .main-header .main-menu .navigation>li:last-child>a { padding-left: 0px; } .main-header .sticky-header .main-menu .navigation>li { position: relative; } .main-header .sticky-header .main-menu .navigation>li:last-child { margin-left: 0; } .main-header .main-menu .navigation>li:last-child ul { left: 0px; } .main-header .sticky-header .main-menu .navigation>li>a:after { top: 22px; } .main-header .sticky-header .main-menu .navigation>li>a>span { top: 10px; } .main-header .main-menu .navigation>li:hover>a, .main-header .main-menu .navigation>li.current>a { opacity: 1; color: #44b774; } .main-header .main-menu .navigation>li>ul { position: absolute; width: 243px; border-radius: 6px; z-index: 1; padding: 20px 30px 20px 30px; transform: translateY(15px); -webkit-transform-origin: top; -ms-transform-origin: top; -o-transform-origin: top; transform-origin: top; opacity: 0; visibility: hidden; transition: all 300ms ease; -moz-transition: all 300ms ease; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; background-color: #FFFFFF; box-shadow: 0px 6px 15px 0px rgba(64, 79, 104, 0.05); } .main-header .main-menu .navigation>li>ul.from-right { right: auto; left: 0px; } .main-header .main-menu .navigation>li>ul>li { position: relative; width: 100%; opacity: 0; text-align: right; transform: translateY(11px); transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; margin-bottom: 15px; } .main-header .main-menu .navigation>li>ul>li:last-child { margin-bottom: 0; } .main-header .main-menu .navigation>li:hover>ul>li { opacity: 1; transform: translateY(0px); } .main-header .main-menu .navigation>li>ul>li:last-child { border-bottom: none; } .main-header .main-menu .navigation>li>ul>li>a { position: relative; display: block; line-height: 24px; font-weight: 600; font-size: 15px; text-transform: capitalize; color: #081E2A; transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .main-header .main-menu .navigation>li>ul>li:hover>a { color: #44b774; } .main-header .main-menu .navigation>li>ul>li:hover>a::before { opacity: 1; } .main-header .main-menu .navigation>li>ul>li.dropdown2>a:after { font-family: "icomoon"; content: "\e9da"; position: absolute; left: 5px; top: 1px; width: 10px; height: 20px; display: block; color: #081E2A; line-height: 20px; font-size: 8px; font-weight: normal; text-align: center; z-index: 5; } .main-header .main-menu .navigation>li>ul>li.dropdown2:hover>a:after { color: #44b774; } .main-header .main-menu .navigation>li>ul>li>ul { position: absolute; right: 100%; top: 0px; width: 243px; border-radius: 6px; z-index: 1; padding: 20px 30px 20px 30px; box-shadow: 0px 6px 15px 0px rgba(64, 79, 104, 0.05); -webkit-transform: scaleY(0); -ms-transform: scaleY(0); -o-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: top; -ms-transform-origin: top; -o-transform-origin: top; transform-origin: top; opacity: 0; visibility: hidden; visibility: hidden; transition: all 300ms ease; -moz-transition: all 300ms ease; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; background-color: #FFFFFF; } .main-header .main-menu .navigation>li>ul>li>ul.from-right { right: auto; left: 0px; } .main-header .main-menu .navigation>li>ul>li>ul>li { position: relative; width: 100%; text-align: right; border-bottom: 1px solid rgba(255, 255, 255, 0.1); opacity: 0; margin-bottom: 15px; transform: translateY(-8px); transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .main-header .main-menu .navigation>li>ul>li>ul>li:last-child { margin-bottom: 0; } .main-header .main-menu .navigation>li>ul>li.dropdown2:hover>ul>li { opacity: 1; transform: translateY(0px); -webkit-transition-delay: 70ms; -moz-transition-delay: 70ms; -ms-transition-delay: 70ms; -o-transition-delay: 70ms; transition-delay: 70ms; } .main-header .main-menu .navigation>li>ul>li>ul>li:last-child { border-bottom: none; } .main-header .main-menu .navigation>li>ul>li>ul>li>a { position: relative; display: block; line-height: 24px; font-weight: 600; font-size: 15px; text-transform: capitalize; color: #081E2A; transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .main-header .main-menu .navigation>li>ul>li>ul>li>a:hover::before { opacity: 1; } .main-header .main-menu .navigation>li>ul>.current>a { color: #44b774; } .main-header .main-menu .navigation>li>ul>li>ul>.current>a { color: #44b774; } .main-header .main-menu .navigation>li>ul>li>ul>li:hover>a { color: #FFFFFF; } .main-header .main-menu .navigation>li>ul>li>ul>li:hover>a { color: #44b774; } .main-header .main-menu .navigation>li.dropdown2:hover>ul { -webkit-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); opacity: 1; visibility: visible; } .main-header .main-menu .navigation li>ul>li.dropdown2:hover>ul { transform: translateY(15px); opacity: 1; visibility: visible; } .main-header .main-menu .navigation>li.dropdown2>a::after { content: "\e905"; font-family: "icomoon"; font-weight: 500; font-size: 14px; margin-right: 5px; vertical-align: bottom; display: inline-block; } .main-header .main-menu .navbar-collapse>ul li.dropdown2 .dropdown2-btn { position: absolute; left: 10px; top: 6px; width: 30px; height: 30px; text-align: center; color: #44b774; line-height: 28px; border: 1px solid #EDEEEE; background-size: 20px; cursor: pointer; z-index: 5; display: none; } /*** ==================================================================== Mobile Menu ==================================================================== ***/ .mobile-menu { position: fixed; right: 0; top: 0; width: 300px; padding-left: 30px; max-width: 100%; height: 100%; visibility: hidden; z-index: 999999; } .mobile-menu .nav-logo { position: relative; background: #FFF; box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.08); padding: 12px 20px; } .mobile-menu .nav-logo img { max-width: 123px; } .mobile-menu .bottom-canvas { padding: 20px; } .mobile-menu-visible { overflow: hidden; } .mobile-menu-visible .mobile-menu { visibility: visible; } .mobile-menu-visible .mobile-menu .menu-backdrop { opacity: 1; visibility: visible; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .mobile-menu-visible .mobile-menu .menu-box { right: 0px; -webkit-overflow-scrolling: touch; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: ease; transition-timing-function: ease; } .mobile-menu .menu-backdrop { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; background: rgba(0, 0, 0, 0.5); transition: all 0.3s ease 0s; visibility: hidden; opacity: 0; } .mobile-menu .menu-box { position: absolute; right: -300px; top: 0px; width: 100%; height: 100%; max-height: 100%; overflow-y: auto; background-color: #FFF; z-index: 5; border-radius: 0px; -webkit-overflow-scrolling: touch; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: ease; transition-timing-function: ease; } .close-btn { position: fixed; left: 16px; top: 25px; line-height: 30px; width: 30px; text-align: center; font-size: 16px; color: #FFFFFF; cursor: pointer; transition: all 0.3s ease; z-index: 9999999999; opacity: 0; visibility: hidden; } .close-btn::before { content: "\e986"; font-family: "icomoon"; font-size: 10px; font-weight: bold; } .bottom-canvas .menu-outer .collapse { display: block; } .mobile-menu-visible .close-btn { visibility: visible; opacity: 1; } .mobile-menu .close-btn:hover { opacity: 0.5; } .mobile-menu .navigation { position: relative; display: block; width: 100%; } .mobile-menu .navigation li { position: relative; display: block; } .mobile-menu .navigation li { position: relative; display: block; } .mobile-menu .navigation li>ul>li:last-child { border-bottom: none; } .mobile-menu .navigation li.dropdown2 .dropdown2-btn { position: absolute; left: 0px; top: 0px; width: 100%; text-align: end; line-height: 44px; cursor: pointer; z-index: 5; } .mobile-menu .navigation li.dropdown2 .dropdown2-btn::before { content: "\e905"; font-family: "icomoon"; font-size: 14px; color: #FFFFFF; } .mobile-menu .navigation li.dropdown2>ul li a { border-bottom: unset; } .mobile-menu .navigation li.dropdown2 .dropdown2-btn span { opacity: 0; } .mobile-menu .navigation li>ul, .mobile-menu .navigation li>ul>li>ul { display: none; background: #081E2A; padding: 15px 20px; border-radius: 10px; } .mobile-menu .navigation li>ul>li, .mobile-menu .navigation li>ul>li>ul>li { margin-bottom: 0; } .mobile-menu .navigation li>ul>li>a, .mobile-menu .navigation li>ul>li>ul>li>a { padding: 7px 0px !important; font-size: 14px !important; font-weight: 500; } .mobile-menu .navigation li>ul>li>ul { padding-right: 15px; } .mobile-menu .navigation li>ul>li>ul>li>a { padding-right: 40px; } .mobile-menu .close-btn:hover { opacity: 0.5; } .mobile-menu .navigation li>ul>li:last-child { border-bottom: none; } .mobile-menu .navigation li>a { position: relative; display: block; font-weight: 600; line-height: 24px; padding: 10px 0px; font-size: 15px; color: #000; text-transform: capitalize; } .mobile-menu .navigation li:hover>a, .mobile-menu .navigation li.current>a { color: #44b774; } .mobile-button { display: none; text-transform: capitalize; color: #FFFFFF; cursor: pointer; } .mobile-button i { font-size: 25px; color: #081E2A; padding: 5px; } .main-header.header-style3.is-fixed.is-fixed.is-small { background-color: rgb(33, 38, 34); } .mobile-menu .login-box { border-bottom: 1px solid #EDEEEE; padding-bottom: 20px; margin-bottom: 20px; } .mobile-menu .login-box svg { margin-left: 5px; } .mobile-menu .menu-outer { margin-bottom: 20px; } .mobile-menu .button-mobi-sell .sc-button { display: block; } .main-header .mobile-menu .menu-box .mCSB_scrollTools { width: 3px; } .header-lower.is-fixed.is-small { top: 0px; margin: 0 !important; opacity: 1; visibility: visible; background-color: #FFFFFF; } .header-lower.is-fixed { padding-right: 225px; padding-left: 225px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; z-index: 999; opacity: 0; position: fixed; top: -150px; right: 0; width: 100%; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1), inset 0px 1px 0px #ECECEC; } .header-style1 .header-top { padding-left: 157px; padding-right: 210px; background-color: #045c96; } .header-style1 .header-top .header-top-right ul li i { color: #FFFFFF; } .header-style1 .header-top .header-top-right ul li span { color: #FFFFFF; } .header-style1 .header-top .header-top-left .booking { color: #FFFFFF; } .header-style1 .header-top .header-top-left .follow-social span { color: #FFFFFF; } .header-style1 .header-top .header-top-left .follow-social ul { background-color: #177ec2; padding: 9px 30px; } .header-style1 .header-top .header-top-left .follow-social ul li a:hover { color: #FFFFFF; } .header-style1 .header-lower { padding-right: 50px; padding-left: 50px; } .mobile-auth-buttons a { /* color: white; */ display: block; margin-bottom: 10px; } .mobile-auth-buttons a i, .mobile-auth-buttons svg:not(:host).svg-inline--fa, .mobile-auth-buttons svg:not(:root).svg-inline--fa { color: #44B774 !important; } .header-style1 .header-lower .logo-box { /* clip-path: polygon(0 0, 79% 0, 100% 100%, 0% 100%); background: #081E2A; */ min-height: 100%; padding: 0px 40px 0px 35px; } .header-style1 .header-lower .main-menu .navigation>li>a { padding: 38px 0px; } .header-style1 .header-lower .header-account .search-mobie { margin: 0px 20px; } .header-style1 .header-lower .header-account .icon-bar-header a { color: #081E2A; background-color: #177ec2; padding: 20px; border-radius: 5px; display: inline-block; font-size: 22px; } .header-style1 .header-lower .header-account .icon-bar-header a:hover { background-color: #44b774; color: #FFFFFF; } .header-style2 .header-top { padding-right: 199px; padding-left: 302px; padding-top: 15px; padding-bottom: 15px; background-color: #44b774; } .header-style2 .header-top .mask-header3 { position: absolute; right: 0; left: 0; } .header-style2 .header-top .header-top-left .follow-social ul { background-color: transparent; padding: 0px 0px; } .header-style2 .header-top .header-top-left .follow-social ul li a { color: #FFFFFF; } .header-style2 .header-top .header-top-left .follow-social ul li a:hover { color: #177ec2; } .header-style2 .header-top .header-top-right ul li { color: #FFFFFF; } .header-style2 .header-top .header-top-right ul li i { color: #FFFFFF; } .header-style2 .header-lower { padding-right: 201px; padding-left: 306px; } .header-style2 .header-account .search-mobie { margin: 0px 20px; } .header-style2 .header-account .icon-bar-header a { color: #FFFFFF; background-color: #44b774; padding: 20px; border-radius: 5px; display: inline-block; font-size: 20px; } .header-style2 .header-account .icon-bar-header a:hover { background-color: #177ec2; color: #FFFFFF; } .header-style3 { position: absolute; background-color: transparent; } .header-style3 .header-top { padding-right: 0px; margin: 5px 0px 9px 0px; background-color: transparent; } .header-style3 .header-top .header-top-right ul li { color: #FFFFFF; } .header-style3 .header-top .header-top-left { background-color: #44b774; clip-path: polygon(4% 0%, 100% 0, 100% 100%, 0% 100%); padding: 5px 43px 5px 50px; } .header-style3 .header-top .header-top-left .follow-social ul { background-color: transparent; padding: 0px 0px; } .header-style3 .header-top .header-top-left .follow-social ul li a { color: #FFFFFF; } .header-style3 .header-top .header-top-left .follow-social ul li a:hover { color: #177ec2; } .header-style3 .header-top .header-top-left .menu-right-top { margin-left: 33px; } .header-style3 .header-top .header-top-left .menu-right-top li:not(:last-child) { margin-left: 24px; } .header-style3 .header-top .header-top-left .menu-right-top li a { font-size: 14px; font-weight: 500; line-height: 17px; color: #FFFFFF; } .header-style3 .header-top .header-top-left .menu-right-top li a:hover { color: #177ec2; } .header-style3 .header-lower { background-color: #FFFFFF; padding-right: 0px; padding-left: 38px; } .header-style3 .header-lower .logo-box { background-color: #212622; clip-path: polygon(0% 0%, 92% 0%, 100% 50%, 92% 100%, 0% 100%); padding: 29px 18px 29px 61px; } .header-style3 .header-lower .header-account { gap: 44px; } .header-style3 .header-lower .search-mobie a { padding: 15px; background-color: #EFEFEF; color: #081E2A; border-radius: 100%; display: inline-flex; } .header-style3 .header-lower .search-mobie a i { font-size: 15px; } .header-style3 .header-lower .address-wrap-right .icon { color: #44b774; width: 32px; height: 32px; border: 1px solid #44b774; border-radius: 100%; margin-left: 16px; } .header-style3 .header-lower .address-wrap-right .content span { font-size: 14px; font-weight: 700; line-height: 17px; display: inline-block; color: #081E2A; text-transform: uppercase; } .header-style3 .header-lower .address-wrap-right .content p { font-size: 15px; font-weight: 500; line-height: 18px; color: #44b774; } /* button --------------------------------------------------*/ .button-link { font-size: 14px; font-weight: 700; line-height: 22px; text-transform: uppercase; letter-spacing: 0.18em; color: #081E2A; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .button-link i { font-size: 9px; margin-right: 17px; position: relative; } .button-link i::before { position: relative; z-index: 2; } .button-link i::after { position: absolute; content: ""; width: 30px; height: 30px; border-radius: 100%; border: 1px solid #EDEEEE; left: -8px; top: 50%; transform: translateY(-50%); z-index: 1; } .button-link:hover { color: #081E2A; } @keyframes scaleUp { 0% { transform: scale(1); } 50% { transform: scale(0.95); } 100% { transform: scale(1); } } .btn-main-small { font-size: 15px; font-weight: 600; line-height: 18.9px; letter-spacing: 0.05em; text-transform: uppercase; color: #FFFFFF; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; border-radius: 5px; padding: 20px 26px; background-color: #44b774; display: inline-block; } .btn-main-small i { font-size: 14px; margin-right: 12px; font-weight: 700; } .btn-main-small:hover { background-color: #177ec2; color: #FFFFFF; } .sc-button { font-size: 15px; font-weight: 500; line-height: 26px; color: #FFFFFF; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; border-radius: 12px; background-color: #44b774; padding: 13px 37px; } .sc-button:hover { background-color: #44b774; color: #FFFFFF; } .sc-button i { margin-right: 5px; } .btn-read-more { font-size: 16px; font-weight: 500; line-height: 31px; } .btn-read-more:hover i { margin-right: 12px; } .btn-read-more i { transition: all 0.3s ease; margin-right: 7px; } .get-call { font-size: 15px; font-weight: 600; line-height: 18.9px; letter-spacing: 0.05em; text-transform: uppercase; padding: 23px 36px; background-color: #FFFFFF; color: #44b774; display: inline-block; border-radius: 5px; text-align: center; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .get-call:hover { background-color: #177ec2; color: #FFFFFF; } .view-all { font-size: 12px; font-weight: 600; line-height: 18.9px; text-transform: uppercase; } .view-all i { color: #44b774; margin-right: 10px; } .btn-main { display: inline-flex; align-items: center; gap: 10px; padding: 8px 24px; border-radius: 5px; border: none; overflow: hidden; background: #44b774; color: #FFFFFF; text-align: center; } .btn-main p { color: white !important; } .btn-main:hover { background-color: #177ec2; } .btn-main:hover .btn-main-text { color: #FFFFFF; transform: translateX(0px); } .btn-main:hover .iconer { color: #FFFFFF; transform: translateX(0px); opacity: 1; } .btn-main .btn-main-text { transform: translateX(-15px); font-size: 15px; font-weight: 600; line-height: 18.9px; letter-spacing: 0.05em; text-transform: uppercase; transition-duration: 0.3s; margin: 0 !important; padding: 0 !important; } .btn-main .iconer { transform: translateX(15px); transition-duration: 0.3s; opacity: 0; } /*----------------------breadcumb--------------------*/ .breadcumb-section { padding: 0px 0px 70px 0px; background-image: url(../../assets/images/page/breakcrumb.jpg); position: relative; background-position: center; background-repeat: no-repeat; background-size: cover; } .breadcumb-section::before { position: absolute; content: ""; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(-262deg, rgba(0, 0, 0, 0.33), rgba(4, 29, 11, 0.89)); } .breadcumb-section .title { color: #FFFFFF; margin-top: 20px; font-size: 22px; font-weight: 600; } .breadcumb-section .breadcumb-list li { font-size: 18px; font-weight: 400; line-height: 22.68px; position: relative; } .breadcumb-section .breadcumb-list li a { color: #44b774; margin-left: 30px; } .breadcumb-section .breadcumb-list li a::before { position: absolute; font-family: "icomoon"; left: 10px; content: "\e9da"; color: #FFFFFF; font-size: 8px; } .breadcumb-section .breadcumb-list li span { color: #FFFFFF; } .breadcumb-section .bcrumb-ab { position: absolute; right: 7%; width: auto; top: 40%; } /****/ .breadcumb-section2 { padding: 0px 0px 70px 0px; position: relative; background-position: center; background-repeat: no-repeat; background-size: cover; } .breadcumb-section2::before { position: absolute; content: ""; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(-262deg, rgba(0, 0, 0, 0.33), rgba(4, 29, 11, 0.89)); } .breadcumb-section2 .title { color: #FFFFFF; margin-top: 20px; font-size: 25px; } .breadcumb-section2 .breadcumb-list li { font-size: 18px; font-weight: 400; line-height: 22.68px; position: relative; } .breadcumb-section2 .breadcumb-list li a { color: #44b774; margin-left: 30px; } .breadcumb-section2 .breadcumb-list li a::before { position: absolute; font-family: "icomoon"; left: 10px; content: "\e9da"; color: #FFFFFF; font-size: 8px; } .breadcumb-section2 .breadcumb-list li span { color: #FFFFFF; } .breadcumb-section2 .bcrumb-ab { position: absolute; right: 7%; width: auto; top: 40%; } /*----------------------Blog--------------------*/ .side-blog { margin-left: 5px; margin-bottom: 56px; } .side-blog:hover .post-thumbnail img { transform: scale(1.1); } .side-blog .blog-image { position: relative; overflow: hidden; margin-bottom: 34px; } .side-blog .blog-image .list-categories { position: absolute; top: 20px; right: 20px; z-index: 2; } .side-blog .blog-image .list-categories .new { font-size: 20px; font-weight: 600; line-height: 25px; padding: 14px 22px; background-color: #44b774; border-radius: 5px; color: #FFFFFF; display: inline-block; width: 82px; text-align: center; } .side-blog .blog-image .list-categories .new:hover { background-color: #177ec2; } .side-blog .blog-image .post-thumbnail img { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .side-blog .top-detail-info ul li { font-size: 15px; font-weight: 500; line-height: 18.9px; color: #83827F; position: relative; } .side-blog .top-detail-info ul li:not(:last-child) { margin-left: 33px; } .side-blog .top-detail-info ul li:not(:last-child)::before { position: absolute; content: ""; width: 10px; height: 1px; background-color: #83827F; top: 50%; transform: translateY(-50%); left: -23px; } .side-blog .top-detail-info ul li i { color: #44b774; font-size: 17px; margin-left: 7px; } .side-blog .top-detail-info ul li a { color: #83827F; } .side-blog .blog-content .entry-title { margin-top: 19px; margin-bottom: 19px; } .side-blog .blog-content .description { margin-bottom: 39px; line-height: 33px; } .side-blog-single { margin-bottom: 0px; } .side-blog-single .image { margin-bottom: 29px; } .side-blog-single .entry-title { font-size: 30px; font-weight: 700; line-height: 44.2px; margin-top: 25px; margin-bottom: 24px; } .side-blog-single .blockquote-blog { padding: 38px 35px 23px 10em; background-color: #F4F6F8; position: relative; } .side-blog-single .blockquote-blog p { font-size: 21px; font-weight: 700; line-height: 43px; margin-bottom: 25px; } .side-blog-single .blockquote-blog .quote-title { font-size: 16px; font-weight: 500; line-height: 20.16px; padding-right: 30px; position: relative; } .side-blog-single .blockquote-blog .quote-title::before { position: absolute; content: ""; width: 17px; height: 2px; background-color: #000000; right: 0; top: 50%; transform: translateY(-50%); } .side-blog-single .blockquote-blog i { position: absolute; bottom: 13%; left: 5%; font-size: 40px; color: #44b774; } .side-blog-single-content { max-width: 900px; margin: auto; } .side-blog-single-content .ux-content h3.title { font-size: 23px; font-weight: 600; line-height: 53px; color: #000000; } .side-blog-single-content .ux-content .icon-listing li:not(:last-child) { margin-bottom: 21px; } .side-blog-single-content .ux-content .icon-listing li i { font-size: 12px; background-color: #FFFFFF; border-radius: 100%; padding: 9px 8px; color: #44b774; box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.09); display: inline-block; margin-left: 6px; margin-right: 5px; } .side-blog-single-content .ux-content .icon-listing li span { font-size: 15px; font-weight: bold; line-height: 20px; color: #505254; font-family: "Noto Sans Arabic", sans-serif; } .side-blog-single-content .ux-content img { width: 297px; } .side-blog-single-content .share-blog { padding-top: 64px; padding-bottom: 46px; border-bottom: 1px solid #EDEEEE; flex-wrap: wrap; } .side-blog-single-content .share-blog .tag-blog .tag li { margin-bottom: 0; } .side-blog-single-content .share-blog .tag-blog .tag li a { border: 1px solid #EDEEEE; text-transform: uppercase; } .side-blog-single-content .share-blog .social-blog .social a { color: #081E2A; background-color: #F4F6F8; border-radius: unset; } .side-blog-single-content .share-blog .social-blog .social a i { font-size: 13px; } .side-blog-single-content .share-blog .social-blog .social a:hover { background-color: #44b774; color: #FFFFFF; } .side-blog-single-content .share-blog span { font-size: 20px; font-weight: 500; line-height: 30px; color: #000000; margin-left: 15px; } .comment-single { padding-top: 48px; padding-bottom: 62px; } .comment-single h3.title { font-size: 27px; font-weight: 600; line-height: 53px; color: #000000; } .comment-single .comment-blog { padding-left: 4em; } .comment-single .comment-blog .avata img { width: 70px; border-radius: 100%; } .comment-single .comment-blog .content { padding-right: 44px; } .comment-single .comment-blog .content .info .date { font-size: 12px; font-weight: 500; line-height: 22px; letter-spacing: 0.05em; color: #B4B4B4; text-transform: uppercase; } .comment-single .comment-blog .content .repply i { font-size: 28px; color: #000000; } .comment-single .comment-blog .des { margin-top: 12px; line-height: 29px; } .form-comment { background-color: #F4F6F8; padding: 60px 50px 80px 50px; } .side-bar-right { padding-right: 33px; } .sidebar-widget { padding: 20px 30px; background-color: rgb(248, 248, 248); border: 1px solid rgb(248, 248, 248); ; border-radius: 10px; } .sidebar-widget:not(:last-child) { margin-bottom: 31px; } .sidebar-widget .block-heading { text-transform: capitalize; padding-right: 15px; position: relative; margin-bottom: 22px; color: #000000; } .sidebar-widget .block-heading::before { position: absolute; content: ""; height: 100%; width: 2px; background-color: #44b774; right: 0; } .sidebar-widget .profile-widget { margin-top: 33px; margin-bottom: 33px; } .sidebar-widget .profile-widget .avata { width: 100px; height: 100px; border-radius: 100%; margin-bottom: 17px; } .sidebar-widget .profile-widget .name { font-size: 16px; font-weight: 700; text-transform: uppercase; line-height: 20.16px; margin-bottom: 12.58px; } .sidebar-widget .profile-widget .job { font-size: 14px; font-weight: 400; line-height: 17.64px; color: #83827F; margin-bottom: 18.98px; display: block; } .sidebar-widget .profile-widget .des { font-weight: 400; line-height: 28.8px; margin-bottom: 26px; } .sidebar-widget .profile-widget .social { justify-content: center; } .sidebar-widget .profile-widget .social li a { color: #83827F; width: 42px; height: 37px; border: 1px solid #EDEEEE; border-radius: unset; } .sidebar-widget .profile-widget .social li a i { font-size: 10px; } .sidebar-widget .profile-widget .social li a:hover { background-color: #44b774; color: #FFFFFF; } .sidebar-widget .recent-post-list .list-recent:not(:last-child) { margin-bottom: 32px; } .sidebar-widget .recent-post-list .list-recent .recent-image img { width: 102px; } .sidebar-widget .recent-post-list .list-recent .recent-info { padding-right: 24px; } .sidebar-widget .recent-post-list .list-recent .recent-info .date i { color: #44b774; margin-left: 5px; } .sidebar-widget .recent-post-list .list-recent .recent-info .date span { font-size: 15px; font-weight: 500; line-height: 26px; } .sidebar-widget .recent-post-list .list-recent .recent-info .title { font-size: 15px; font-weight: 500; line-height: 25.8px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; } .sidebar-widget .category-blog li:not(:last-child) { margin-bottom: 21px; } .sidebar-widget .category-blog li a { padding: 14px 16px; background-color: #FFFFFF; border: 1px solid #EDEEEE; border-radius: 2px; color: #4F545A; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .sidebar-widget .category-blog li a:hover { background-color: #44b774; color: #FFFFFF; } .sidebar-widget .category-blog li a span { font-size: 16px; font-weight: 500; line-height: 26px; } .sidebar-widget .category-confidence li:not(:last-child) { margin-bottom: 22px; } .sidebar-widget .category-confidence li i { color: #44b774; font-size: 25px; margin-left: 12px; } .sidebar-widget .category-confidence li span { font-size: 16px; font-weight: 500; line-height: 30px; color: #4F545A; } .sidebar-widget-single .booking-style-1 .mask-banner-part { position: relative; } .home-packages .owl-carousel { text-align: right; } .home-packages a.view-all { text-align: left; font-size: 15px; display: block; margin-left: 0 !important; margin-top: 10px; } .banner-part.home-packages .item { box-shadow: 0 0 3px #d7d6d6; border-radius: 10px; margin-bottom: 10px; background: white; } .banner-part.home-packages .item h3 { font-size: 16px; padding: 10px 10px 3px; margin: 0; line-height: 1; } .banner-part.home-packages .item p { padding: 5px 10px 10px; margin-top: 0; font-size: 13px; font-weight: 600; color: #4a4646; } .sidebar-widget-single .booking-style-1 .price-banner-part { top: 50%; right: 15%; } .bg-blog-h4 { width: 100%; height: 400px; position: absolute; right: 0; left: 0; bottom: 0; } /*----------------------Video--------------------*/ .widget-image-video { position: relative; } .widget-image-video .widget-icon-video { position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .travel-video { padding: 20px 0px 0px 35px; } .travel-video .mask-video { position: absolute; right: -12.5%; bottom: -5%; width: auto; } .travel-video .mask-enjoy { bottom: 2%; right: 25%; width: auto; position: absolute; } .travel-video .widget-icon-video { position: absolute; top: 47%; right: 41%; transform: translate(50%, -50%); } .travel-video .image-video { margin: 0px -20px -14px 0px; } .video-h4-widget { padding-top: 168px; padding-bottom: 65px; background-image: url(../../assets/images/page/video1.jpg); background-position: center; background-repeat: no-repeat; background-attachment: fixed; background-size: cover; border-radius: 18px; display: flex; flex-direction: column; align-items: center; } .video-h4-widget::before { top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; background: linear-gradient(-180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.64)); z-index: 1; } .video-h4-widget .video-box { width: 138px; height: 134px; background-color: #44b774; border-radius: 25px; rotate: 45deg; } .video-h4-widget .video-box i { color: #FFFFFF; font-size: 30px; rotate: -45deg; } .video-h4-widget .text-video { font-size: 121px; font-weight: 400; line-height: 121px; margin-top: 46px; } /*----------------------call-to-action--------------------*/ .callt-to-action { background-color: #44b774; border-radius: 7px; padding: 35px 39px 39px 39px; position: relative; } .callt-to-action .callt-to-action-content .image { margin-left: 43px; } .callt-to-action .callt-to-action-content .image img { width: 74px; } .callt-to-action .callt-to-action-content .content .title-call { font-size: 36px; font-weight: 700; line-height: 45px; color: #FFFFFF; margin-bottom: 10px; } .callt-to-action .callt-to-action-content .content .des { font-size: 18px; font-weight: 400; line-height: 32px; font-family: "DM Sans", sans-serif; color: rgba(255, 255, 255, 0.52); text-transform: capitalize; } .callt-to-action .shape-ab { position: absolute; width: auto; left: 22%; -webkit-animation: anime-rorate 8s infinite; animation: anime-rorate 8s infinite; } .callt-to-action .mask-cta { position: absolute; right: 0; left: 0; bottom: -16%; } .widget-banner-contact { background-image: url(../../assets/images/page/bg3.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } .widget-banner-contact::before { content: ""; top: 0; left: 0; right: 0; bottom: 0; position: absolute; background: linear-gradient(-90deg, rgb(4, 27, 40), rgba(2, 15, 22, 0.55), rgba(0, 0, 0, 0)); } .widget-banner-contact address { margin-right: 34px; font-size: 20px; font-weight: 600; line-height: 26px; color: #FFFFFF; padding: 16px 34px; border: 1px solid rgba(255, 255, 255, 0.4); border-radius: 66px; } .widget-banner-contact address a { color: #FFFFFF; } .widget-banner-contact .mask-icon-banner { position: absolute; right: 52%; bottom: 23%; width: auto; animation: dot-anim-2 3s linear 0s infinite alternate; } .widget-banner-contact .image-banner-contact { margin-right: 38px; } .widget-banner-contact .content-banner-contact { padding-top: 93px; padding-bottom: 50px; } /*----------------------About Us--------------------*/ .inner-content-about { padding-right: 6px; } .inner-content-about .btn-wrap-about { margin-top: 37px; gap: 40px; flex-wrap: wrap; } .inner-content-about .btn-wrap-about .profile .image img { width: 56px; height: 56px; border-radius: 100%; border: 4px solid #FFFFFF; box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15); } .inner-content-about .btn-wrap-about .profile .content { margin-right: 20px; } .inner-content-about .btn-wrap-about .profile .content img { width: auto; } .inner-content-about .btn-wrap-about .profile .content span { display: block; font-size: 14px; font-weight: 500; line-height: 24px; } .inner-content-about .map-check .icon { color: #44b774; margin-left: 14px; } .inner-content-about .map-check span { font-size: 16px; font-weight: 700; line-height: 30px; } .about-us-h2 .mask1-about { width: auto; position: absolute; left: 0; top: 0; animation: dot-anim-3 3s linear 0s infinite alternate; } .about-us-h2 .mask2-about { width: auto; position: absolute; right: -10% !important; left: auto !important; bottom: 12%; animation: move-full-right-left 20s infinite linear !important; } @keyframes move-full-right-left { 0% { transform: translateX(0); } 100% { transform: translateX(-100vw); /* move to left edge */ } } .about-us-h2 .image-about-us { padding-left: 3.5em; padding-top: 17px; } .image-about-us .image-main { margin-bottom: -10px; } .image-about-us .mask1 { width: auto; position: absolute; top: 11%; right: -47px; animation: dot-anim-3 3s linear 0s infinite alternate; } .image-about-us .mask2 { width: auto; position: absolute; left: 13%; top: 12.3%; animation: dot-anim-2 3s linear 0s infinite alternate; } .about-us-h2 .content-about-us { padding-right: 4px; margin-top: -4px; } .about-us-h2 .content-about-us .pl-about { padding-right: 9px; } .about-us-h2 .content-about-us .icon-box-style-4:not(:last-child) { margin-bottom: 50px; } .about-us-h2 .content-about-us .about-us-list { margin-top: 10px; margin-right: 20px; margin-left: 45px; } .about-us-h2 .content-about-us .about-us-list li { padding: 11px 26px; background-color: #FFFFFF; border-radius: 26px; box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.07); transition: all 0.3s ease-in-out; } .about-us-h2 .content-about-us .about-us-list li:not(:last-child) { margin-bottom: 33px; } .about-us-h2 .content-about-us .about-us-list li:hover { background-color: #44b774; } .about-us-h2 .content-about-us .about-us-list li:hover .number, .about-us-h2 .content-about-us .about-us-list li:hover .experience { color: #FFFFFF; } .about-us-h2 .content-about-us .about-us-list li .number { font-size: 24px; font-weight: 700; line-height: 30px; margin-left: 10px; color: #44b774; } .about-us-h2 .content-about-us .about-us-list li .experience { font-size: 14px; font-weight: 600; color: #081E2A; } .about-us-h3 { background-color: #212622; padding-top: 245px; padding-bottom: 119px; } .about-us-h3 .about-us-h3-image { padding-right: 28px; padding-left: 71px; } .about-us-h3 .about-us-h3-image .image-explore { border-radius: 14px; } .about-us-h3 .about-us-h3-image .about-vector { position: absolute; top: -1%; right: -5%; rotate: -24deg; } .about-us-h3 .about-us-h3-image .about-vector .icon { color: #44b774; } .about-us-h3 .about-us-h3-image .about-vector span { font-size: 33px; font-weight: 400; line-height: 33.8px; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .about-us-h3 .about-us-h3-image p { font-size: 17px; font-weight: 600; margin-top: 22px; padding-bottom: 15px; border-bottom: 1px dashed #2E3830; } .about-us-h3 .about-us-h3-content { padding-right: 14px; margin-top: -5px; } .about-us-h3 .about-us-h3-content .ranger-suport { font-size: 18px; font-weight: 600; line-height: 33px; text-transform: capitalize; } .about-us-h3 .about-us-h3-content .list-icon li:not(:last-child) { margin-bottom: 12px; } .about-us-h3 .about-us-h3-content .list-icon li i { color: #44b774; margin-left: 7px; } .about-us-h3 .about-us-h3-content .about-wrap { gap: 44px; flex-wrap: wrap; } .about-us-h4 { padding-top: 103px; padding-bottom: 128px; } .about-us-h4 .image-about-h4-wrap { margin-left: 5.5em; padding-right: 13px; padding-top: 23px; } .about-us-h4 .image-about-h4-wrap .about-wrap-left { max-width: 372px; width: 100%; } .about-us-h4 .image-about-h4-wrap .about-wrap-left .quote { font-size: 20px; font-weight: 700; color: #FFFFFF; background-color: #44b774; padding: 20px 26px; clip-path: polygon(100% 0, 100% 50%, 100% 100%, 0% 100%, 5% 50%, 0% 0%); top: 31.7%; right: -41%; rotate: -90deg; position: absolute; } .about-us-h4 .image-about-h4-wrap .about-wrap-right { max-width: 349px; width: 100%; position: absolute; top: 31.5%; left: 0; } .about-us-h4 .image-about-h4-wrap .image-about-item .shape-about-h4 { position: absolute; bottom: -20px; right: 0; left: 0; } .about-us-h4 .image-about-h4-wrap .box-year { background-color: #FFFFFF; padding: 32px 34px 25px 34px; display: inline-block; border: 2px dashed #EDEEEE; position: absolute; bottom: -17.5%; right: 29%; animation: dot-anim-3 3s linear 0s infinite alternate; } .about-us-h4 .image-about-h4-wrap .box-year .number { font-size: 50px; font-weight: 700; line-height: 25px; color: #44b774; } .about-us-h4 .image-about-h4-wrap .box-year p { font-size: 17px; font-weight: 500; line-height: 25px; color: #081E2A; } .about-us-h4 .inner-content-about { padding-right: 17px; } .about-us-h5 .image { margin-right: -1.5em; padding-bottom: 26px; background-color: #44b774; } .about-us-h5 .image .about-vector { position: absolute; left: 13px; bottom: 66px; z-index: 1; transform: rotate(-334deg); } .about-us-h5 .image .about-vector span { font-size: 33px; font-weight: 400; line-height: 32px; position: absolute; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .about-us-h5 .image .mask-image-bottom { position: absolute; bottom: 0; color: #44b774; right: 0; left: 0; } .about-us-h5 .content { padding-top: 3.7em; padding-right: 6.2em; padding-left: 2em; } .about-us-h5 .content .ranger-suport { font-size: 18px; font-weight: 600; line-height: 33px; text-transform: capitalize; } .about-us-h5 .content .list-icon li:not(:last-child) { margin-bottom: 12px; } .about-us-h5 .content .list-icon li i { color: #44b774; margin-left: 7px; } .about-us-h5 .content .list-icon li span { text-transform: capitalize; } .about-us-h5 .content .about-wrap { gap: 44px; } .about-us-archieve { background-color: #FFFFFF; } .about-us-archieve .bg-archieve-about { background-color: #F4F6F8; width: 100%; height: 40%; position: absolute; right: 0; left: 0; top: 0; z-index: 1; } /*----------------------Tour Package--------------------*/ .tour-package { background-color: #F3F8F6; background-image: url(../../assets/images/page/bg1.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .tour-package2 { padding-top: 120px; } .tour-package2 .tour-package-swipper-wrap .swiper-button-next { left: -7% !important; } .tour-package2 .tour-package-swipper-wrap .swiper-button-prev { right: -7% !important; } .tour-package2 .tour-link { width: 120px; height: 120px; border-radius: 100%; background: #44b774; font-size: 15px; font-weight: 500; color: #FFFFFF; text-transform: uppercase; letter-spacing: 0.05em; flex-direction: column; } .tour-package2 .tour-link:hover { background-color: #177ec2; } .tour-package2 .tour-link i { display: block; } .tour-package2 .line { position: absolute; content: ""; width: 100%; height: 1px; border: 1px dashed #DCDCDC; right: 0; left: 0; top: 50%; transform: translateY(-50%); z-index: 0; } .w-text-heading { max-width: 600px; width: 100%; } .offer-package .feature-ofer { width: auto; height: -webkit-fill-available; left: 0; top: 0; bottom: 0; position: absolute; z-index: 1; } .offer-package .content { padding-left: 4em; } .offer-package .content .title-heading { margin-left: -4em; line-height: 51px; } .offer-package .content .inner-content { margin-bottom: 15px; } .offer-package .content .inner-content .offer { padding: 43px 25px 12px 25px; border-radius: 7px; border-bottom: 3px solid #44b774; background-color: #FFFFFF; text-align: center; } .offer-package .content .inner-content .offer .number { font-size: 52px; font-weight: 700; color: #44b774; line-height: 8px; } .offer-package .content .inner-content .offer .number span { font-size: 18px; text-transform: capitalize; } .offer-package .content .inner-content p { font-size: 18px; font-weight: 600; line-height: 30px; color: #081E2A; margin-right: 42px; } .offer-package .content .count-dow-wrap .title-counters { margin-left: 45px; } .offer-package .content .count-dow-wrap .title-counters span { font-size: 23px; font-weight: 600; color: #081E2A; } .offer-package .content .count-dow-wrap .title-counters p { font-size: 14px; font-weight: 500; line-height: 30px; color: #4F545A; } .offer-package .on-week-swipper-wrap { margin-left: -4em; margin-top: 7em; } /*----------------------Activities--------------------*/ .tf-widget-activities .mask-top { position: absolute; top: 0; right: 0; width: auto; z-index: 1; } .mask-bottom { position: absolute; bottom: 0; right: -10px; width: auto; z-index: 1; -webkit-animation: toRightFromLeft 15s infinite; animation: toRightFromLeft 20s infinite; } @keyframes toRightFromLeft { 0% { transform: translateX(30%); opacity: 1; } 100% { transform: translateX(-100vw); /* opacity: 0; */ } } .tf-widget-activities .tabs-activities-content { background-color: #44b774; border-radius: 8px; padding: 16px 16px 0px 10em; margin-left: 4em; margin-right: 5em; } .tf-widget-activities .tabs-activities-content .activities-image img { width: 370px; margin-right: -6em; border-radius: 8px; } .tf-widget-activities .tabs-activities-content .activities-content { padding: 38px 55px; } .tf-widget-activities .tabs-activities-content .activities-content .icon-activitis { width: 123px; height: 123px; border-radius: 100%; background-color: rgba(1, 6, 4, 0.1); color: #FFFFFF; } .tf-widget-activities .tabs-activities-content .activities-content .icon-activitis:hover { rotate: 45deg; } .tf-widget-activities .tabs-activities-content .activities-content .icon-activitis i { font-size: 40px; } .tf-widget-activities .tabs-activities-content .activities-content .title-activitis { font-size: 27px; line-height: 33px; } .tf-widget-activities .tabs-activities-content .activities-content .icon-list-wrap:not(:last-child) { margin-left: 30px; } .tf-widget-activities .tabs-activities-content .activities-content .icon-list-wrap .icon { font-size: 36px; } .tf-widget-activities .tabs-activities-content .activities-content .icon-list-wrap .icon-lists { font-size: 16px; font-weight: 600; margin-right: 17px; font-family: "Noto Sans Arabic", sans-serif !important; line-height: 30px; } .tf-widget-activities .tabs-activities-content .activities-content .btn-wrap-activitis { padding-top: 50px; border-top: 1px solid rgba(255, 255, 255, 0.07); } .tf-widget-activities .tabs-activities-content .activities-content .btn-wrap-activitis .get-start { font-size: 20px; font-weight: 500; line-height: 25px; padding-right: 20px; } .tf-widget-activities .tabs-activities-content .activities-content .mask-tab { position: absolute; width: auto; left: -13em; top: 60px; } .our-activities { background-image: url("../../assets/images/page/bg-4.png"); background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 16px; padding: 122px 0px 30px 0px; background-color: #1C231F; margin: 0px 42px; } .our-activities .activities-wrap { border-radius: 25px 25px 0px 0px; background-color: #EEE9E9; padding: 40px 43px; margin: 10px 20px 0px 20px; } .our-activities .activities-wrap .activities-list li:not(:last-child) { margin-bottom: 28px; } .our-activities .activities-wrap .activities-list li a { background-color: #FFFFFF; border-radius: 10px; padding: 15px 33px; font-size: 18px; font-weight: 600; line-height: 22px; color: #081E2A; } .our-activities .activities-wrap .activities-list li a:hover { background-color: #44b774; color: #FFFFFF; } .our-activities .activities-wrap .activities-list li a:hover .icon { color: #FFFFFF; } .our-activities .activities-wrap .activities-list li a .icon { color: #44b774; font-size: 47px; margin-left: 30px; } .our-activities .activities-wrap .more-place { font-size: 15px; font-weight: 600; line-height: 29px; color: #081E2A; display: block; } .our-activities .right-side { padding-right: 5.4em; } .our-activities .right-side .image-activities img { border-radius: 8px; } .populer-activities-section { padding-top: 114px; background-image: url(../../assets/images/page/bg-4.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .populer-activities-section .populer-activities-slide { margin-bottom: -13em; } .populer-activities-section .populer-activities-slide .populer-activities { padding-bottom: 20px; } .populer-activities-section .populer-activities-slide .swiper-button-next, .populer-activities-section .populer-activities-slide .swiper-button-prev { width: 50px; height: 50px; background-color: #FFFFFF; box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.05); } .populer-activities-section .populer-activities-slide .swiper-button-next::after, .populer-activities-section .populer-activities-slide .swiper-button-prev::after { color: #081E2A; } .populer-activities-section .populer-activities-slide .swiper-button-next { left: -5em; } .populer-activities-section .populer-activities-slide .swiper-button-prev { right: -5em; } /*----------------------Counter--------------------*/ .widget-counter { background-color: #44b774; background-image: url(../../assets/images/page/bg-counter.png); background-position: center; background-repeat: no-repeat; background-size: cover; padding-top: 124px; padding-bottom: 124px; } .widget-counter .counter-top { position: absolute; top: -40px; width: 100%; height: 80px; right: 0; left: 0; z-index: 2; } .widget-counter .counter-bottom { position: absolute; bottom: -50px; width: 100%; height: 80px; right: 0; left: 0; z-index: 2; } .widget-counter .image img { width: auto; } .widget-counter .content { margin-right: 38px; } .widget-counter .content .title-call { font-size: 42px; line-height: 45px; margin-bottom: 10px; } .widget-counter .content .des { font-size: 18px; font-weight: 400; line-height: 32px; font-family: "DM Sans", sans-serif; color: rgba(255, 255, 255, 0.52); text-transform: capitalize; } .widget-counter2 { padding-top: 50px; padding-bottom: 70px; } .impressino-counter { background-color: #FFFFFF; display: grid; grid-template-columns: 1fr 1fr; margin-left: 10px; position: relative; } .impressino-counter .icon-fly { font-size: 30px; color: #44b774; position: absolute; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .counter-to { padding-top: 170px; padding-bottom: 71px; background-image: url(../../assets/images/page/bg-counter.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } .counter-to::before { top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; background: linear-gradient(-90deg, rgba(0, 0, 0, 0.93), rgba(0, 0, 0, 0.35)); } .counter-to .mask-left { width: 305px; height: 428px; background: linear-gradient(0deg, rgba(241, 176, 10, 0.45), rgba(255, 183, 0, 0.31), rgba(23, 38, 61, 0)); clip-path: polygon(0 0, 0% 100%, 100% 0); opacity: 0.97; position: absolute; top: 0; right: 0; } .counter-to .mask-right { width: 305px; height: 428px; background: linear-gradient(-262deg, rgba(77, 165, 40, 0.52), rgba(77, 165, 40, 0.25), rgba(23, 38, 61, 0)); clip-path: polygon(0 100%, 100% 100%, 100% 0); opacity: 0.97; position: absolute; bottom: 0; left: 0; } .counter-to .tf-counter { background-color: transparent; } /*----------------------destination--------------------*/ .widget-destination { padding-top: 317px; } .widget-destination1 h3.title-heading { z-index: 1; position: relative; } .grid-three-destination { display: grid; grid-template-columns: repeat(3, 1fr); gap: 37px 30px; } .widget-destination1 .shape-destination { position: absolute; width: auto; left: 0; top: 0; z-index: 1; } .widget-destination1 { padding-top: 120px; } .widget-destination1.destination-home5 .destination-explore { margin-top: 66px; margin-bottom: -5px; } .top-destination { padding-top: 30em; padding-bottom: 120px; } .top-destination2 .tour-des-top { font-weight: 600; color: #081E2A; padding: 6px 36px; border-radius: 23px; border: 1px dashed #EDEEEE; display: inline-block; } .destination-explore { font-size: 16px; font-weight: 500; line-height: 36px; color: #081E2A; margin-top: 82px; margin-bottom: 11px; } /*----------------------Brand logo--------------------*/ .line-brand-logo .line { width: 100%; height: 1px; margin: 12px 0; background-color: #EDEEEE; } .line-brand-logo .line-text { font-size: 16px; font-weight: 600; line-height: 24px; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); background-color: #FFFFFF; padding: 0 40px; position: absolute; color: #081E2A; } .brand-logo img { max-width: 133px; width: 100%; } .widget-brand-logo { padding-top: 63px; padding-bottom: 127px; } .brand-logo-widget { padding: 91px 0px; } .brand-logo-h4 .line-brand-logo .line-text { background-color: #F4F6F8; } .brand-logo-h4 .widget-brand-logo { padding-top: 57px; padding-bottom: 68px; } /*----------------------Adventure--------------------*/ .adventure-content { margin-bottom: -8.3em; padding: 63px 65px 0px 0px; background-color: #FFFFFF; border-radius: 16px; box-shadow: 0px -21px 26px 0px rgba(0, 0, 0, 0.02); } /*----------------------Testimonial--------------------*/ .widget-testimonial-style01 { padding-top: 289px; padding-bottom: 158px; background-color: #F1F6F4; background-image: url(../../assets/images/page/bg2.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .widget-testimonial-style01 .box-testimonial1 { margin-top: -5px; margin-right: 45px; rotate: -15deg; z-index: 2; position: relative; animation: dot-anim-2 3s linear 0s infinite alternate; } .widget-testimonial-style01 .box-testimonial2 { rotate: 7deg; z-index: 1; position: absolute; right: 26%; top: 15%; } .widget-testimonial-style01 .widget-testimonial { margin-right: 44px; margin-left: 20px; } .widget-tes-style2 { padding-top: 270px; padding-bottom: 122px; } .widget-tes-style2 .widget-testimonial-style3 { max-width: 900px; width: 100%; margin: auto; } .widget-tes-style3 .content { padding: 6.2em 7em 4em 26em; } .widget-tes-style3 .image { margin-left: -2em; } .widget-tes-style3 .image .about-vector { position: absolute; left: 13px; bottom: 39px; z-index: 1; transform: rotate(-334deg); } .widget-tes-style3 .image .about-vector span { font-size: 33px; font-weight: 400; line-height: 32px; position: absolute; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .widget-tes-style3 .image .mask-ft-right { position: absolute; top: 0; bottom: 0px; left: -25px; width: auto; } .widget-tes-style3 .tes-style3Swiper .swiper-pagination { z-index: 2; text-align: left; } .testimonial-section-h4 .content { background-image: url(../../assets/images/page/mask-home4.png); background-position: left bottom; background-repeat: no-repeat; padding-right: 19.4em; padding-top: 6.6em; padding-left: 10em; padding-bottom: 6.5em; } .testimonial-section-h4 .gallery-testimonial-h4 { background-color: #212622; background-image: url(../../assets/images/page/bg1.png); background-position: center; background-repeat: no-repeat; background-size: cover; height: 100%; margin-right: 60px; padding-top: 8em; padding-right: 10.5em; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-wrapper { flex-direction: column; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-wrapper .swiper-slide { margin-bottom: 35px; margin-right: 15px; margin-top: 15px; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-wrapper .swiper-slide.swiper-slide-thumb-active .image { border-bottom: 5px solid #44b774; border-left: 5px solid #44b774; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-wrapper .swiper-slide .image { overflow: hidden; width: 111px; height: 111px; border-radius: 20px; transform: rotate(-45deg); border-bottom: 5px solid transparent; border-left: 5px solid transparent; position: relative; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-wrapper .swiper-slide img { all: unset; width: 100%; height: 100%; object-fit: cover; transform: rotate(45deg) scale(1.3); } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-pagination-fraction { bottom: 0px; right: -20px; width: auto; padding: 18px 60px; background-color: #FFFFFF; border-radius: 6px; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-pagination-fraction span { font-size: 31px; font-weight: 700; color: #000000; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-pagination-fraction span.swiper-pagination-total { color: #44b774; } .start { color: #177ec2; } /*----------------------Banner part--------------------*/ .banner-part-item .btn-booking { font-size: 14px; font-weight: 600; line-height: 17px; letter-spacing: 0.05em; display: block; } .banner-part-item .btn-booking i { margin-right: 10px; } .banner-part-item .mask-banner-bottom { position: absolute; right: 0; /* right: 0; */ top: -35px; width: 100% !important; transform: rotate(-360deg); /* overflow:hidden; */ } .booking-style-1 { padding: 32px 37px 55px 37px; } .booking-style-1:hover .mask-banner-part { scale: 1.1; } .booking-style-1 .sale-up { font-size: 14px; font-weight: bold; line-height: 17px; display: block; } .booking-style-1 .title { font-size: 34px; font-weight: 400; line-height: 44px; color: #081E2A; } .banner-part p { line-height: 1.2; margin-top: 10px; } .booking-style-1 .title:hover { color: #44b774; } .booking-style-1 .mask-banner-part { width: auto !important; position: absolute; top: 27px; left: 0; transition: all 0.3s ease; } .booking-style-1 .price-banner-part { width: 65px; height: 65px; border-radius: 100%; background-color: #44b774; font-size: 16px; font-weight: 600; color: #FFFFFF; line-height: 20.83px; position: absolute; top: 23%; right: 42%; } .booking-style-2 { padding: 38px 40px 64px 37px; } .booking-style-2:hover .mask-banner-part { scale: 1.1; } .booking-style-2 .sale-up { font-size: 16px; font-weight: 400; line-height: 23px; display: block; } .booking-style-2 .title { font-size: 23px; font-weight: 700; line-height: 44px; color: #081E2A; } .booking-style-2 .title:hover { color: #44b774; } .booking-style-2 .mask-banner-part { max-width: 148px; width: 100%; position: absolute; border-radius: 74px 74px 0px 0px; top: 35px; left: 21px; transition: all 0.3s ease; } .booking-style-2 .mask-banner-part::before { position: absolute; content: ""; right: -10px; top: -10px; width: 100%; height: 100%; border-radius: 74px 74px 0px 0px; border: 1px solid #44b774; } .booking-style-2 .banner-part-shape1 { width: auto; position: absolute; bottom: 16%; right: 47%; } .booking-style-2 .banner-part-shape2 { position: absolute; top: 24px; left: 27%; width: auto; } .booking-style-2 .widget-icon-video { width: 42px; height: 42px; position: absolute; left: 19%; bottom: 11%; } .booking-style-2 .widget-icon-video i { font-size: 10px; } .booking-style-3 { padding: 36px 32px 64px 37px; } .booking-style-3:hover .mask-banner-part { scale: 1.1; } .booking-style-3 .sale-up { font-size: 16px; font-weight: bold; line-height: 23px; display: block; } .booking-style-3 .title { font-size: 23px; font-weight: 700; line-height: 44px; color: #081E2A; } .booking-style-3 .title:hover { color: #44b774; } .booking-style-3 .mask-banner-part { width: 143px !important; background: #FFFFFF; padding: 7px 6px 33px 11px; position: absolute; top: 14.5%; left: 6%; rotate: -15deg; transition: all 0.3s ease; } .booking-style-3 .banner-part-shape1 { width: auto; left: 40%; position: absolute; bottom: 33%; } /*----------------------Video--------------------*/ .widget-video { padding-top: 236px; padding-bottom: 137px; background-image: url("../../assets/images/page/video.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } .widget-video::before { content: ""; top: 0; left: 0; right: 0; bottom: 0; position: absolute; background: linear-gradient(-90deg, rgba(0, 0, 0, 0.89), rgba(0, 0, 0, 0.36)); } .title-video { font-size: 170px; font-weight: 400; line-height: 170px; position: relative; } .title-video:before { position: absolute; content: ""; width: 72%; height: 3px; background-color: #FFFFFF; bottom: 17px; right: 50%; transform: translateX(50%); } .widget-video-style2 { padding-top: 310px; } /*----------------------service--------------------*/ .widget-service { padding-top: 112px; padding-bottom: 15px; } .widget-service-h5 .mask-home5 { height: 295px; position: absolute; right: 0; left: 0; bottom: 0; background-color: #EBEBEB; } /*----------------------Feature--------------------*/ .widget-feature .feature-shape { position: absolute; right: 0; top: 0; width: auto; z-index: 1; } .widget-feature .image-feature-wrap { padding-left: 6px; } .widget-feature .image-feature-wrap .image-feature .image { border-radius: 260px 260px 0px 0px; } .widget-feature .image-feature-wrap .image-feature .shape-image { position: absolute; bottom: -37px; right: 0; left: 0; } .widget-feature .image-feature-wrap .exploring { width: 160px; height: 150px; background-color: #44b774; position: absolute; bottom: 16%; right: -15%; border-radius: 29px; rotate: -45deg; animation: dot-anim-3 3s linear 0s infinite alternate; } .widget-feature .image-feature-wrap .exploring span { font-size: 33px; font-weight: 400; rotate: 45deg; } .widget-feature .content-feature-wrap { padding-right: 3em; margin-top: -6px; padding-left: 30px; } .widget-feature .content-feature-wrap .feature-list-wrap { background-color: #FFFFFF; border-radius: 13px; box-shadow: 0px 0px 19px 0px rgba(0, 0, 0, 0.06); padding: 26px 26px 26px 26px; } .widget-feature .content-feature-wrap .feature-list-wrap .feature-list { border-radius: 8px; border: 1px solid #EDEEEE; display: flex; flex-wrap: wrap; } .widget-feature .content-feature-wrap .feature-list-wrap .feature-list .feature-list-iteam { padding: 25px 40px 17px 3px; border: 1px solid #EDEEEE; width: 50%; } .widget-feature .content-feature-wrap .feature-list-wrap .feature-list .feature-list-iteam .icon { min-width: 55px; height: 55px; border-radius: 100%; border: 1px dashed #44b774; font-size: 30px; color: #44b774; margin-left: 15px; } .widget-feature .content-feature-wrap .feature-list-wrap .feature-list .feature-list-iteam span { font-size: 20px; font-weight: 600; color: #081E2A; } .exploring { width: 160px; height: 150px; background-color: #44b774; position: absolute; border-radius: 29px; rotate: -45deg; } .exploring span { font-size: 33px; font-weight: 400; rotate: 45deg; } .bg-ab-feature { position: absolute; right: 0; left: 0; bottom: 0; z-index: 1; } .bg-ab-feature img { width: 100%; } .widget-feature2 .image-feature2 { margin-left: -38px; } .widget-feature2 .image-feature2 .mask-ft-right { position: absolute; top: 0; bottom: 0; left: -4%; width: auto; } .widget-feature2 .image-feature2 .mask-ft-bottom { position: absolute; right: 0; left: 0; bottom: -2%; } .widget-feature2 .exploring { bottom: 16%; right: 15%; animation: dot-anim-3 3s linear 0s infinite alternate; } .widget-feature2 .content-feature2 { padding: 7em 6.8em 0em 22em; } .widget-feature3 { padding-top: 50px; padding-bottom: 15px; background-image: url(../../assets/images/page/bg-4.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .widget-feature3.ab { background: none; } .widget-feature3.ab .tf-icon-box { /* box-shadow: 0 0 7px 0 #EEE; */ border: 1px dashed #DDD; } .widget-feature3 .box-feature-wrap { padding: 0 50px; } .widget-feature3 .image-feature3 { margin-left: 54px; padding-top: 15px; } .widget-feature3 .image-feature3 .image-feature { border: 7px solid #FFFFFF; border-radius: 60px; margin-bottom: 32px; } .widget-feature3 .image-feature3 .image-feature img { border-radius: 60px; } .widget-feature3 .image-feature3 .text { font-size: 41px; font-weight: 400; line-height: 32.8px; position: absolute; bottom: 30px; right: 50%; transform: translateX(50%); } .widget-feature4 .mask-faeture4 { height: 100%; left: 0; top: 0; bottom: 0; color: #ffffff; position: absolute; z-index: 1; } .widget-feature4 .mask-faeture4 svg g { display: none; filter: invert(49%) sepia(79%) saturate(480%) hue-rotate(110deg) brightness(94%) contrast(87%); } .widget-feature4 .feature-wrap-box { padding-left: 7em; display: grid; grid-template-columns: 1fr 1fr; gap: 43px 70px; } .widget-feature4 .image-feature4 { margin-top: -4em; margin-right: 0; margin-left: -2em; width: 600px; } /*----------------------Mobie App--------------------*/ .mobie-app { background-color: #081E2A; border-radius: 14px; height: 300px; } .mobie-app .mobie-app-image { padding: 63px 89px 75px 89px; } .mobie-app .mobie-app-image .title-heading { font-size: 30px; line-height: 49px; margin-top: -3px; margin-bottom: 17px; } .mobie-app .mobie-app-image .mobie-wrap a { display: inline-block; } .mobie-app .mobie-app-image a img { height: 40px; } .mobie-app .mobie-app-image .mobie-wrap a:not(:last-child) { margin-left: 15px; } .mobie-app .mobie-app-image .mobie-wrap a img { width: auto; } .mobie-app .mobie-app-image .qr-code { position: absolute; left: -17px; bottom: 0; } .mobie-app .mobie-app-image .qr-code span { font-size: 15px; font-weight: 500; line-height: 30px; color: white; display: block; } .mobie-app .mobie-app-image .qr-code img { width: auto; margin-bottom: 70px; } .mobie-app .mobie-app-content .mask-mobie { width: auto; } .mobie-app .mobie-app-content .phone { position: absolute; right: 21px; bottom: 40px; width: auto; } /*----------------------Faq--------------------*/ .widget-faq .image-faq { margin-right: -78px; margin-left: -39px; margin-top: 8px; margin-bottom: -23px; } .widget-faq .content-faq { padding-right: 25px; } /*----------------------Top Week--------------------*/ .widget-top-week { background-image: url(../../assets/images/page/bg3.png); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 126px 0px 167px 0px; } .widget-top-week .on-week-swipper-wrap .swiper-button-prev { right: 87%; top: -18%; } .widget-top-week .on-week-swipper-wrap .swiper-button-next { top: -18%; } .top-this-week-slide .swiper-button-next, .top-this-week-slide .swiper-button-prev { width: 60px; height: 60px; } .top-this-week-slide .swiper-button-next { left: -6%; } .top-this-week-slide .swiper-button-prev { right: -6%; } .top-this-week-about-us { padding-top: 370px; padding-bottom: 218px; } /*----------------------Instagram--------------------*/ .widget-instagram { padding: 26px 28px; } .instagram-post { padding-top: 120px; } .instagram-post .bg-primary-ig { background-color: #44b774; height: 70%; width: 100%; position: absolute; top: 0; left: 0; right: 0; z-index: 1; } .instagram-post .instagram-post-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 22px; } .tf-instagram { display: block; overflow: hidden; } .tf-instagram:hover .mask-absolute { transform-origin: center; opacity: 0.9; visibility: visible; width: 100%; height: 100%; } .tf-instagram:hover img { transform: scale(1.1); } .tf-instagram:hover .mask-bg { visibility: visible; opacity: 1; } .tf-instagram img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-instagram .mask-bg { display: flex; justify-content: center; align-items: center; position: absolute; opacity: 0; visibility: hidden; margin: 15px; top: 0; right: 0; left: 0; bottom: 0; transition: all 0.4s ease-out; } .tf-instagram .mask-absolute { position: absolute; opacity: 0; visibility: hidden; bottom: 0%; z-index: 1; width: 100%; height: 100%; position: absolute; content: ""; right: 0px; left: 0px; transition: all 0.3s ease-in-out; } .tf-instagram .mask-absolute i { position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); font-size: 30px; color: #FFFFFF; transition: all 0.4s ease-out; } .tf-instagram .mask-absolute i:hover { color: #44b774; } /*----------------------impresssino--------------------*/ .impressino { padding-top: 182px; background-image: url(../../assets/images/page/bg-counter.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } .impressino::before { top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; background: linear-gradient(-180deg, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.32)); z-index: 1; height: -webkit-fill-available; } .impressino .mask-impression { position: absolute; left: 0; top: 0; z-index: 2; width: 570px; height: 100%; } .impressino .mt-impressino { margin-top: 11em; padding-right: 11px; } /*----------------------archieve tour--------------------*/ .archieve-tour { padding-top: 0px; padding-bottom: 105px; } .archieve-tour .tf-my-listing { border: 1px solid #EDEEEE; padding: 5px 27px; border-radius: 10px; } .archieve-tour .tf-my-listing .showing { font-size: 14px; font-weight: 600; line-height: 20px; color: #081E2A; } .archieve-tour .tf-my-listing .listing-all-wrap .toolbar-list { display: flex; align-items: center; justify-content: center; gap: 26px; margin-right: 30px; } .archieve-tour .tf-my-listing .listing-all-wrap .toolbar-list .form-group { cursor: pointer; } .archieve-tour .tf-my-listing .listing-all-wrap .toolbar-list .form-group a { font-size: 20px; } .child-select .nice-select { /* padding: 10px 40px 10px 10px; */ } .listing-list-car-wrap-grid3 .listing-list-car-grid { grid-template-columns: repeat(3, 1fr); } .listing-list-car-wrap-grid3 .listing-list-car-grid.listing-list-car-list { grid-template-columns: repeat(2, 1fr); } .listing-list-car-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; } .listing-list-car-grid.listing-list-car-list { grid-template-columns: 1fr; } .listing-list-car-grid.listing-list-car-list .tour-listing { padding: 13px; display: flex; } .listing-list-car-grid.listing-list-car-list .tour-listing .tour-listing-image { max-width: 258px; width: 100%; border-radius: 8px; overflow: hidden; } .listing-list-car-grid.listing-list-car-list .tour-listing .tour-listing-image img { height: 100%; object-fit: cover; } .listing-list-car-grid.listing-list-car-list .tour-listing .tour-listing-content { padding: 0px 37px 0px 37px; margin-top: 0px; width: 100%; } .listing-list-car-wrap .form-group .btn-display-listing-grid.active, .listing-list-car-wrap .form-group .btn-display-listing-list.active { color: #44b774; } .sider-bar-tour-package .widget-filter .row { border-radius: 10px; padding: 20px 10px 0; background: white; background-color: white; max-width: 1300px; margin: -30px auto 0; z-index: 9; position: relative; box-shadow: 0 0 7px 0 #DDD; justify-content: center; } .sider-bar-tour-package .widget-filter span.current { font-size: 15px; } .sider-bar-tour-package .widget-filter .btn-search { border-radius: 10px; transition: all 0.3s ease-in-out; padding: 20px; width: 100%; } .sider-bar-tour-package .widget-filter .btn-search:hover { background: #045c96; } .sider-bar-tour-package .widget-filter .row .col-lg-2 { border: 1px solid #DDD; margin-right: 7px; border-radius: 5px; padding-top: 10px; } .sider-bar-tour-package .widget-filter .row .col-lg-2 .tit { display: flex; align-items: center; gap: 10px; } .sider-bar-tour-package .widget-filter .row .col-lg-2 .tit i { position: unset !important; transform: none !important; } .sider-bar-tour-package .widget-filter .row .col-lg-2 .tit label { margin: 0; font-size: 14px; } .sider-bar-tour-package .widget-filter .row .col-lg-2:last-of-type { border: none !important; } @media (min-width:1200px) { .sider-bar-tour-package .widget-filter .row .col-lg-2 { width: 12% !important; } .sider-bar-tour-package .widget-filter .row .col-lg-2:last-of-type { width: 10% !important; } #facilities, #policies { place-items: anchor-center; width: 100%; } } .sider-bar-tour-package .widget-filter .title-tour { padding-right: 10px; position: relative; margin-bottom: 30px; } .sider-bar-tour-package .widget-filter .title-tour::before { height: 17px; width: 1px; background-color: #44b774; position: absolute; content: ""; right: 0; top: 50%; transform: translateY(-50%); } .sider-bar-tour-package .widget-filter .group-select-wrap .group-select i { position: absolute; font-size: 18px; color: #44b774; top: 50%; transform: translateY(-50%); right: 20px; } .sider-bar-tour-package .widget-filter .group-select-wrap .group-select .search-bar-group label { position: absolute; right: 53px; top: 10px; margin-bottom: 0; font-size: 14px; font-weight: bold; color: #4F545A; } .sider-bar-tour-package .widget-filter .group-select-wrap .group-select .search-bar-group .nice-select { padding: 29px 53px 10px 36px; font-size: 16px; font-weight: 600; color: #081E2A; } .sider-bar-tour-package .widget-filter .group-select-wrap .input-npd .search-bar-group label { position: absolute; right: 16px; } .sider-bar-tour-package .widget-filter .group-select-wrap .input-npd .search-bar-group .nice-select { padding: 29px 16px 10px 36px; } .sider-bar-tour-package .widget-filter .group-check-box-wrap input[type=checkbox]+label:before { border-radius: 3px; } .sider-bar-tour-package .widget-filter .group-check-box-wrap input[type=checkbox]+label { font-size: 16px; font-weight: 500; } .sider-bar-tour-package .widget-filter-content { background-image: url(../../assets/images/page/sidebar-right.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 8px; padding: 45px 41px 74px 41px; position: relative; } .sider-bar-tour-package .widget-filter-content::before { top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; background-color: rgba(0, 0, 0, 0.75); border-radius: 8px; z-index: 1; } .sider-bar-tour-package .widget-filter-content span { font-size: 14px; font-weight: 500; line-height: 17px; } .sider-bar-tour-package .widget-filter-content .title { font-size: 26px; font-weight: 700; line-height: 42px; margin-top: 11px; margin-bottom: 4px; } .sider-bar-tour-package .widget-filter-content p { font-size: 14px; font-weight: 500; line-height: 17px; } .sider-bar-tour-package .widget-filter-content a { font-size: 14px; font-weight: 600; line-height: 17px; color: #177ec2; margin-top: 30px; display: inline-block; } .sider-bar-tour-package .widget-filter-content a:hover { color: #44b774; } .sider-bar-tour-package .widget-filter-content a i { font-size: 12px; margin-right: 5px; } /*----------------------terms-condition--------------------*/ .terms-condition { padding-top: 116px; padding-bottom: 157px; } .terms-condition .tab-terms-condition .tab-content { padding-top: 21px; } .terms-condition .tab-terms-condition .tab-content .title-ter { font-size: 30px; font-weight: 700; line-height: 50px; margin-bottom: 47px; } .terms-condition .tab-terms-condition .tab-content .des { font-size: 21px; font-weight: 700; line-height: 30px; color: #081E2A; display: inline-block; margin-bottom: 21px; } .terms-condition .tab-terms-condition .tab-content .text { font-size: 16px; font-weight: 400; line-height: 34px; } .terms-condition .tab-terms-condition .tab-content .list-term li { margin-right: 29px; list-style: disc; } .terms-condition .tab-terms-condition .tab-content .list-term li:not(:last-child) { margin-bottom: 19px; } .terms-condition .tab-terms-condition .tab-content .list-term li span { font-size: 18px; font-weight: 600; color: #081E2A; text-transform: capitalize; line-height: 40px; } /*----------------------faq--------------------*/ .inner-faq { padding-top: 104px; padding-bottom: 143px; } .inner-faq .faq-list .faq .faq-question { padding: 22px 35px 22px 35px; } .inner-faq .faq-list .faq .faq-answer { margin-top: -8px; } .header-search-faq { padding-top: 138px; padding-bottom: 110px; } .header-search-faq .inner-header .title { font-size: 55px; line-height: 70px; text-transform: inherit; } .header-search-faq .inner-header .des { margin-top: 18px; margin-bottom: 35px; } .header-search-faq .inner-header .form-search-faq { margin: 0 auto; } .header-search-faq .inner-header .popular { font-size: 18px; font-weight: 600; line-height: 22px; color: #081E2A; margin-left: 24px; } .header-search-faq .inner-header .tag-wrap { margin-top: 32px; } .header-search-faq .inner-header .tag-wrap .tag-popular li:not(:last-child) { margin-left: 16px; } .header-search-faq .inner-header .tag-wrap .tag-popular li span { font-size: 15px; font-weight: 500; line-height: 18px; color: #4F545A; padding: 10px 18px; background-color: #FFFFFF; border-radius: 5px; box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.05); display: inline-block; } /*----------------------login--------------------*/ .login { padding-top: 94px; padding-bottom: 105px; } .login .mask2-about { bottom: -100px !important; } .login .image-about-us .mask1 { top: 200px; } .login .login-wrap { padding: 29px 25px 35px 37px; border-radius: 10px; box-shadow: 0px 4px 27px 0px rgba(0, 0, 0, 0.07); background: white; position: relative; } .login .login-wrap .image { max-width: 444px; width: 100%; margin-left: 55px; } .login .login-wrap .image img { border-radius: 10px; } .login .login-wrap .content { width: 100%; } .login .login-wrap .content .inner-header-login { margin-bottom: 28px; } .inner-header-login { text-align: center; } .inner-header-login img.logo { display: block; margin: auto; width: 160px; } .login .login-wrap .content .inner-header-login .title { margin-bottom: 13px !important; font-size: 25px; line-height: 1.2; } .login .login-wrap .content .inner-header-login .sale { font-size: 14px; line-height: 14px; border-radius: 5px; font-weight: 600; padding: 4px 10px; background-color: #177ec2; color: #FFFFFF; } .login .login-wrap .content .inner-header-login p { font-size: 15px; font-weight: 400; line-height: 1.5; /* margin-left: 12px; */ } .login .login-wrap .content .input-wrap { margin-bottom: 36px; } .login .login-wrap .content .input-wrap-social .or { font-size: 17px; font-weight: 600; line-height: 26px; color: #081E2A; position: relative; display: block; margin-bottom: 8px; } .login .login-wrap .content .input-wrap-social .or::before { width: 145px; height: 1px; background-color: #B6C2D4; position: absolute; content: ""; right: 30px; top: 50%; transform: translateY(-50%); } .login .login-wrap .content .input-wrap-social .login-social { font-size: 15px; font-weight: 500; line-height: 26px; color: #081E2A; padding: 12px 15px; border: 1px solid rgba(0, 0, 0, 0.26); border-radius: 6px; } .login .login-wrap .content .input-wrap-social .login-social:not(:last-child) { margin-left: 20px; } .login .login-wrap .content .input-wrap-social .login-social img { width: auto; margin-left: 12px; } .login .login-wrap .content .btn-submit { width: 100%; border-radius: 7px; text-transform: uppercase; } .login .login-wrap .content .account { color: #081E2A; font-size: 15px; font-weight: bold; margin-left: 20px; } .login .login-wrap .content .link-login { display: inline-block; font-size: 15px; font-weight: 600; color: #FFFFFF; padding: 4px 15px; background-color: #44b774; border-radius: 5px; } .login .login-wrap .content .link-login:hover { background-color: #4ba771; } /*----------------------contact us--------------------*/ .contact-us .box-contact { border-radius: 2px; background: white; max-width: 400px; margin-bottom: 34px; /* border: 1px solid #EDEEEE; */ padding: 38px 20px 37px 20px; box-shadow: 0px 0px 20px 0px #EEE; } .contact-us .tf-container { max-width: 1200px; } .contact-us .box-contact .icon { color: #44b774; height: 41px; } .contact-us .box-contact .icon svg { width: 30px; height: 30px; animation: spin 5s linear infinite; } .contact-us .box-contact span { font-size: 17px; font-weight: 600; line-height: 30px; color: #081E2A; margin-top: 2px; margin-bottom: 5px; display: block; } .contact-us .contact-us-wrap { padding: 56px 65px 57px 65px; margin-right: -25px; box-shadow: 0 0 27px 0 #EEE; border-radius: 5px; } .contact-us button.btn-submit-contact { margin: auto; display: block; } .contact-us .contact-us-wrap>.inner-header .title { font-size: 24px; font-weight: 600; line-height: 48px; letter-spacing: 1px; margin-bottom: 20px; } .contact-us .contact-us-map { padding-left: 4.5em; } .contact-us .contact-us-map .inner-header .title { margin-bottom: 36px; } .contact-us .contact-us-map .map, .contact-us .contact-us-map #map { height: 559px; } /*----------------------Team--------------------*/ .team-member-page .team-member-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 85px 58px; } .single-destinaion-content .inner-haeder i { color: #44b774; margin-left: 9px; } .single-destinaion-content .inner-haeder .title { font-size: 40px; font-weight: 700; line-height: 50px; margin-bottom: 24px; } .single-destinaion-content .description-wrap .description { font-size: 24px; font-weight: 700; line-height: 30px; margin-bottom: 16px; display: inline-block; color: #081E2A; } .single-destinaion-content .description-wrap .des { line-height: 34px; } .single-destinaion-content .description-wrap .listing-des li { padding-right: 23px; position: relative; } .single-destinaion-content .description-wrap .listing-des li::before { width: 7px; height: 7px; background-color: #44b774; border-radius: 100%; content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .single-destinaion-content .description-wrap .listing-des li p { font-size: 16px; font-weight: 600; line-height: 52px; color: #081E2A; } .single-destinaion-content .description-wrap .listing-icon li i { color: #44b774; margin-left: 10px; } .single-destinaion-content .description-wrap .listing-icon li p { font-size: 16px; font-weight: 600; line-height: 48px; color: #081E2A; } .single-destinaion-content .image-wrap { gap: 30px; } .single-destinaion-content .image-wrap img { width: 100%; height: 100%; object-fit: cover; } .description-wrap .description { font-size: 24px; font-weight: 700; line-height: 30px; margin-bottom: 16px; display: inline-block; color: #081E2A; } .description-wrap .des { line-height: 34px; } .tour-single .listing-des li { padding-right: 23px; position: relative; } .tour-single .listing-des li::before { width: 7px; height: 7px; background-color: #44b774; border-radius: 100%; content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .tour-single .listing-des li p { font-size: 16px; font-weight: 600; line-height: 52px; color: #081E2A; } .tour-single .listing-icon li i { color: #44b774; margin-left: 10px; } .tour-single .listing-icon li p { font-size: 16px; font-weight: 600; line-height: 48px; color: #081E2A; } .tour-single .listing-clude li:not(:last-child) { margin-bottom: 10px; } .tour-single .listing-clude li i { color: #44b774; font-size: 18px; margin-left: 19px; } .tour-single .listing-clude li p { font-size: 16px; font-weight: 500; } .tour-single .inner-heading-wrap .inner-heading .feature { font-size: 15px; font-weight: 500; line-height: 20px; padding: 5px 18px; background-color: #FF494F; color: #FFFFFF; border-radius: 2px; display: inline-block; margin-bottom: 20px; } .tour-single .inner-heading-wrap .inner-heading .title { font-size: 26px; font-weight: 700; line-height: 50px; margin-bottom: 5px; } .tour-single .inner-heading-wrap .inner-heading .list-wrap-heading li:not(:last-child) { margin-left: 40px; } .tour-single .inner-heading-wrap .inner-heading .list-wrap-heading li i { color: #44b774; margin-left: 15px; font-size: 20px; } .tour-single .inner-heading-wrap .inner-heading .list-wrap-heading li span { font-size: 15px; font-weight: bold; color: black; } .tour-single .inner-heading-wrap .inner-price .review { font-size: 16px; font-weight: 600; line-height: 20px; color: #081E2A; margin-right: 20px; margin-left: 21px; } .tour-single .inner-heading-wrap .inner-price .price-sale { font-size: 24px; font-weight: 700; line-height: 30px; margin-top: 15px; } .tour-single .inner-heading-wrap .inner-price .price { font-size: 18px; font-weight: 500; line-height: 22px; color: #4F545A; margin-right: 10px; } .tour-single .side-bar-right { padding-right: 0; margin-top: 10px; } .tour-single .information-content-tour .expect-wrap .title { font-size: 24px; font-weight: 700; line-height: 30px; } .tour-single .information-content-tour .expect-wrap .expect { padding-bottom: 12px; padding-top: 12px; border-bottom: 1px solid #EDEEEE; } .tour-single .information-content-tour .expect-wrap .expect span { font-size: 15px; font-weight: 600; line-height: 34px; color: #000000; width: 40%; } .tour-single .information-content-tour .expect-wrap .expect p { font-size: 15px; font-weight: 500; line-height: 30px; width: 60%; } .tour-single .information-content-tour .expect-wrap .listing-icon li:not(:last-child) { margin-bottom: 10px; } .tour-single .information-content-tour .expect-wrap .listing-icon li i { font-size: 15px; color: #44b774; margin-left: 19px; } .tour-single .planing-content-tour .title-plan { line-height: 23px; margin-bottom: 46px; } .tour-single .planing-content-tour .tour-planing-section:not(:last-child) { margin-bottom: 60px; } .tour-single .planing-content-tour .tour-planing-section .number-box { max-width: 100px; width: 100%; height: 94px; border-radius: 7px; background-color: #44b774; font-size: 25px; font-weight: 700; color: #FFFFFF; margin-left: 51px; margin-top: 3px; } .tour-single .planing-content-tour .tour-planing-section .content-box { padding-left: 3em; } .tour-single .planing-content-tour .tour-planing-section .content-box .title { margin-bottom: 22px; } .tour-single .planing-content-tour .tour-planing-section .content-box .des { line-height: 34px; } .tour-single .localtion-content-tour .map2, .tour-single .localtion-content-tour #map2 { height: 473px; } .tour-single .localtion-content-tour .map-list i { color: #44b774; margin-left: 15px; font-size: 20px; } .tour-single .localtion-content-tour .map-list p { font-size: 18px; font-weight: 500; line-height: 30px; color: #081E2A; } .tour-single .localtion-content-tour .title-location { font-size: 24px; line-height: 30px; margin-bottom: 14px; color: #081E2A; } .tour-single .review-content-tour .title-review { font-size: 24px; line-height: 30px; padding-right: 10px; position: relative; } .tour-single .review-content-tour .title-review::before { height: 70%; width: 1px; background-color: #44b774; content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .tour-single .review-content-tour .custom-review { border: 1px solid #EDEEEE; border-radius: 15px; padding: 40px 53px 80px 42px; } .tour-single .review-content-tour .custom-review .review-list { width: 100%; } .tour-single .review-content-tour .custom-review .card-review { margin-left: 62px; } .tour-single .review-content-tour .custom-review .card-review .percent { position: relative; } .tour-single .review-content-tour .custom-review .card-review svg { position: relative; width: 210px; height: 210px; transform: rotate(90deg); } .tour-single .review-content-tour .custom-review .card-review svg circle { width: 100%; height: 100%; fill: none; stroke: #EDEEEE; stroke-width: 10; stroke-linecap: round; } .tour-single .review-content-tour .custom-review .card-review svg circle:last-of-type { stroke-dasharray: 625px; stroke-dashoffset: calc(625px - 625px * var(--percent) / 100); stroke: #44b774; } .tour-single .review-content-tour .custom-review .card-review .number { position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); width: max-content; } .tour-single .review-content-tour .client-review .client-review span { font-size: 16px; font-weight: 600; line-height: 30px; color: #081E2A; } .tour-single .review-content-tour .client-review .client-review .start { margin-right: 15px; margin-left: 15px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item { padding-left: 10em; padding-bottom: 27px; border-bottom: 1px solid #EDEEEE; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item:not(:last-child) { margin-bottom: 48px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .avata { margin-left: 36px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .avata img { width: 80px; height: 80px; border-radius: 100%; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .content { margin-top: 6px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .content .name { display: inline-block; font-size: 16px; font-weight: 700; line-height: 25px; color: #081E2A; margin-bottom: 15px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .content .des { line-height: 28.8px; margin-bottom: 4px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .content .start i { font-size: 14px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .content .start span { font-size: 16px; font-weight: 700; line-height: 38px; color: #081E2A; margin-right: 15px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .content .date { font-size: 12px; font-weight: 700; line-height: 29px; text-transform: uppercase; letter-spacing: 0.1em; color: #4F545A; } .tour-single .review-content-tour .form-review { padding: 50px 35px 70px 35px; margin-left: 5em; } .tour-single .review-content-tour .inner-review .inner-review-item .text-review { font-size: 16px; font-weight: 700; line-height: 26px; color: #081E2A; margin-bottom: 13px; } .tour-single .review-content-tour .progress { height: 8px; } .tour-single .review-content-tour .progress .progress-bar { background-color: #44b774; } .tour-single .gallery-content-tour { display: grid; grid-template-areas: "image-gallery1 image-gallery1 image-gallery2" "image-gallery1 image-gallery1 image-gallery2" "image-gallery3 image-gallery4 image-gallery4" "image-gallery3 image-gallery4 image-gallery4" "image-gallery5 image-gallery5 image-gallery6" "image-gallery5 image-gallery5 image-gallery6"; gap: 30px; } .tour-single .gallery-content-tour .image { width: 100%; height: 100%; } .tour-single .gallery-content-tour .image img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; } .tour-single .gallery-content-tour .image-gallery1 { grid-area: image-gallery1; } .tour-single .gallery-content-tour .image-gallery2 { grid-area: image-gallery2; } .tour-single .gallery-content-tour .image-gallery3 { grid-area: image-gallery3; } .tour-single .gallery-content-tour .image-gallery4 { grid-area: image-gallery4; } .tour-single .gallery-content-tour .image-gallery5 { grid-area: image-gallery5; } .tour-single .gallery-content-tour .image-gallery6 { grid-area: image-gallery6; } .discount-h5 { padding-bottom: 123px; } .discount-h5 .sale-up { font-size: 14px; font-weight: 500; line-height: 17px; display: block; } .discount-h5 .text-free { font-size: 14px; font-weight: 500; } .discount-h5 .booking-style-1 { background-image: url(../../assets/images/page/bg-discount.png); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 47px 42px 0px 20px; } .discount-h5 .booking-style-1:hover .mask-banner-part2 { scale: 1.1; } .discount-h5 .booking-style-1 .image-wrap .mask-banner-part { position: relative; top: 0px; margin-top: 7px; margin-bottom: 15px; } .discount-h5 .booking-style-1 .image-wrap .price-banner-part { right: 7%; top: 15%; } .discount-h5 .booking-style-2 { padding: 45px 43px 42px 37px; } .discount-h5 .booking-style-2 .title { font-size: 26px; margin-top: 11px; } .discount-h5 .booking-style-2 .image-wrap .mask-banner-part { left: -5.8em; top: 23px; position: relative; } .discount-h5 .booking-style-2 .image-wrap .banner-part-shape1 { bottom: -12%; right: 17%; } .discount-h5 .booking-style-2 .image-wrap .banner-part-shape2 { top: 13px; left: 35%; } .discount-h5 .booking-style-2 .image-wrap .widget-icon-video { bottom: -19%; } .discount-h5 .booking-style-3 { padding: 45px 32px 30px 37px; } .discount-h5 .booking-style-3 .title { font-size: 21px; text-transform: capitalize; } .discount-h5 .booking-style-3 .image-wrap .mask-banner-part { position: relative; top: 0px; left: -40%; margin-top: 35px; } .discount-h5 .booking-style-3 .image-wrap .banner-part-shape1 { left: 61%; bottom: 19%; } .discount-h5 .mask-banner-part2 { left: -15px; top: 18px; position: relative; transition: all 0.3s ease; } /*----------------------Dash-board--------------------*/ .sidebar-dashboard { transition: all 0.2s ease-out; background-color: #021B32; max-width: 320px; width: 100%; height: 100vh; z-index: 99; position: fixed; right: 0; } .sidebar-dashboard.actives { max-width: 70px; } .sidebar-dashboard.actives .db-menu { padding: 55px 10px 50px 10px; } .sidebar-dashboard.actives .db-menu ul li a { padding: 10px 17px; } .sidebar-dashboard.actives .db-menu ul li a span { display: none; } .sidebar-dashboard.actives .db-logo { padding: 38px 24px 38px 10px; } .sidebar-dashboard.actives .db-logo span { display: none; } .sidebar-dashboard .db-logo { padding: 40px 74px 40px 40px; border-bottom: 1px solid rgba(217, 217, 217, 0.08); } .sidebar-dashboard .db-logo a { font-size: 28px; font-weight: 700; line-height: 35px; color: #FFFFFF; } .sidebar-dashboard .db-logo a img { width: 35px; margin-left: 10px; } .sidebar-dashboard .db-menu { padding: 55px 26px 50px 35px; } .sidebar-dashboard .db-menu ul li:not(:last-child) { margin-bottom: 10px; } .sidebar-dashboard .db-menu ul li:hover, .sidebar-dashboard .db-menu ul li.active { background-color: rgba(255, 255, 255, 0.05); } .sidebar-dashboard .db-menu ul li a { font-size: 16px; font-weight: 600; line-height: 28px; color: #FFFFFF; padding: 10px 50px; border-radius: 8px; display: inline-block; } .sidebar-dashboard .db-menu ul li a i { color: #44b774; margin-left: 14px; } .has-dashboard { margin-right: 320px; transition: all 0.2s ease-out; } .has-dashboard.actives { margin-right: 70px; } .has-dashboard .main-header.is-fixed { position: relative; opacity: 1; top: 0; } .has-dashboard .header-dashboard { background-color: #021B32; padding: 0px 38px 0px 185px; } .has-dashboard .header-dashboard .header-search .icon-bars { color: #FFFFFF; cursor: pointer; font-size: 18px; margin-left: 30px; padding: 5px; } .has-dashboard .header-dashboard .header-search .search-dashboard { position: relative; } .has-dashboard .header-dashboard .header-search .search-dashboard i { position: absolute; font-size: 20px; color: #FFFFFF; top: 21px; right: 31px; } .has-dashboard .header-dashboard .header-search .search-dashboard input { width: 307px; background-color: rgba(255, 255, 255, 0.04); border-radius: 32px; border: unset; padding: 25px 65px 25px 17px; color: #FFFFFF; font-size: 15px; font-weight: 500; } .has-dashboard .header-dashboard .header-search .search-dashboard input::placeholder { color: #FFFFFF; } .has-dashboard .header-dashboard .nav-outer .main-menu .navigation>li>a { color: #FFFFFF; padding: 44px 0px 46px 0px; } .has-dashboard .header-dashboard .header-account .icon-send { color: #FFFFFF; font-size: 25px; cursor: pointer; } .has-dashboard .header-dashboard .header-account .icon-notification { color: #FFFFFF; font-size: 25px; cursor: pointer; } .has-dashboard .header-dashboard .header-account .account { margin-right: 13px; } .has-dashboard .header-dashboard .header-account .account a img { width: 40px; height: 40px; border-radius: 100%; border: 2px solid #FFFFFF; } .has-dashboard .footer-dashboard { background-color: #021B32; padding: 50px 109px 50px 161px; } .has-dashboard .footer-dashboard .menu-footer li:not(:first-child) { margin-right: 20px; } .has-dashboard .footer-dashboard .menu-footer li a { color: #FFFFFF; } .has-dashboard .footer-dashboard .menu-footer li a:hover { color: #44b774; } .has-dashboard .profile-dashboard { padding: 100px 74px; background-color: #F4F6F8; } .has-dashboard .profile-dashboard .title { padding-right: 10px; position: relative; } .has-dashboard .profile-dashboard .title::before { position: absolute; content: ""; height: 80%; width: 1px; background-color: #44b774; right: 0; top: 50%; transform: translateY(-50%); } .has-dashboard .profile-dashboard .title-add-tour { font-size: 26px; line-height: 47px; } .has-dashboard .profile-dashboard .widget-dash-board { background-color: #FFFFFF; border-radius: 16px; padding: 60px 50px 92px 50px; } .has-dashboard .profile-dashboard .inner-header .title { font-size: 28px; line-height: 35px; font-weight: 700; margin-bottom: 7px; } .has-dashboard .profile-dashboard .edit-profile .title { margin-bottom: 20px; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .title-avata { font-size: 21px; font-weight: 600; color: #081E2A; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap { margin-right: 92px; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .avata img { width: 158px; height: 138px; border-radius: 8px; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .avata .icon-delete { position: absolute; right: 7px; top: 6px; padding: 6px 8px; background-color: #FFFFFF; border-radius: 3px; cursor: pointer; color: #081E2A; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .avata .icon-delete:hover { background-color: #FF494F; color: #FFFFFF; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .upload { font-size: 18px; font-weight: 400; display: inline-block; margin-top: 12px; margin-bottom: 12px; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .upload-file { min-width: 648px; width: 100%; border: 1px solid #EDEEEE; border-radius: 5px; padding: 10px; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .upload-file input { width: 100%; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap p { font-size: 16px; font-weight: 500; margin-top: 23px; } .has-dashboard .profile-dashboard .edit-profile .grid-input-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 25px; } .has-dashboard .profile-dashboard .edit-profile .grid-input-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px 40px; } .has-dashboard .profile-dashboard .edit-profile .input-wrap label { display: block; } .has-dashboard .profile-dashboard .edit-profile .input-wrap label i { color: #44b774; margin-left: 10px; } .has-dashboard .profile-dashboard .edit-profile .input-wrap input { width: 334px; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .send-otp { margin-top: 20px; margin-bottom: 10px; font-size: 16px; font-weight: 500; display: inline-block; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .input-wrap input { width: 100%; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .button-wrap .save { padding: 20px 30px; border-radius: 8px; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .button-wrap .save:hover { background-color: #177ec2; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .button-wrap .save i { margin-left: 10px; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .button-wrap .reset { background-color: transparent; color: #081E2A; padding: 20px 30px; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .button-wrap .reset:hover { color: #44b774; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .button-wrap .reset i { margin-left: 10px; } .has-dashboard .profile-dashboard .favorite-wrap { padding: 34px 38px 64px 63px; background-color: #FFFFFF; border-radius: 10px; } .has-dashboard .profile-dashboard .favorite-wrap .favorite-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px 34px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap label { font-size: 18px; font-family: 700; line-height: 56px; color: #081E2A; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap input { width: 100%; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .nice-select { padding: 21px 15px 21px 35px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .upload-image-add-car { display: flex; gap: 27px; justify-content: flex-start; flex-wrap: wrap; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .upload-image-add-car .upload-image .uploadLabel { padding: 43px 20px; position: relative; height: 148px; width: 149px; background-color: #FFFFFF; border: 1px solid #EDEEEE; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 5px; -webkit-transition: all 0.25s linear; -moz-transition: all 0.25s linear; transition: all 0.25s linear; text-align: center; margin-bottom: 0px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .upload-image-add-car .upload-image .uploadLabel i { font-size: 30px; color: #B4B4B4; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .upload-image-add-car .upload-image .uploadLabel span { font-size: 16px; font-weight: 500; color: #B4B4B4; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .upload-image-add-car .upload-image .uploadLabel .photoLoad { position: absolute; right: 0; bottom: 0; width: 100%; height: 100%; cursor: pointer; opacity: 0; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .icon-delete-title { width: 61px; height: 59px; background-color: #EBEBEB; border-radius: 5px; cursor: pointer; margin-right: 20px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .button-add { padding: 15px 35px; border-radius: 5px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .button-add i { font-size: 12px; margin-left: 5px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .icon-delete-price { background-color: #FFFFFF; padding: 10px; border-radius: 8px; color: #44b774; box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.07); cursor: pointer; margin-right: 17px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .icon-delete-price:hover { background-color: #FF494F; color: #FFFFFF; } .has-dashboard .profile-dashboard .form-add-tour .grid-input-2 { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 50px; width: 100%; } .has-dashboard .profile-dashboard .form-add-tour .grid-input-3 { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 35px; width: 100%; } .has-dashboard .profile-dashboard .my-listing-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 33px 23px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item { box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.06); border-radius: 5px; padding: 17px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .image img { width: 202px; height: 185px; object-fit: cover; border-radius: 8px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .image .featured { font-size: 14px; font-weight: 500; color: #FFFFFF; background-color: #177ec2; line-height: 23px; padding: 2px 14px; border-radius: 4px; position: absolute; display: inline-block; right: 7px; top: 9px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content { width: 100%; padding-right: 22px; padding-top: 10px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .map { font-size: 14px; font-weight: 500; font-family: "DM Sans", sans-serif; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .map i { color: #44b774; margin-left: 5px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .media { padding: 8px 5px; border-radius: 5px; background-color: #44b774; color: #FFFFFF; font-size: 14px; font-weight: 500; line-height: 14px; margin-right: 10px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .media i { margin-left: 5px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .review i { color: #177ec2; font-size: 12px; margin-left: 4px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .review span { font-size: 14px; font-weight: 500; margin-right: 5px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .list-meta { margin-top: 23px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .list-meta li:not(:last-child) { margin-left: 13px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .list-meta li i { color: #44b774; margin-left: 10px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .list-meta li span { font-size: 16px; font-weight: 500; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .price { font-size: 15px; font-weight: 500; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .price span { font-size: 16px; font-weight: 600; } .has-dashboard .profile-dashboard .my-booking-wrap { border-radius: 10px; background-color: #FFFFFF; padding-bottom: 88px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content { padding: 32px 50px 0px 28px; width: 100%; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li { border-bottom: 1px solid #EDEEEE; width: 100%; padding-bottom: 29px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li:not(:last-child) { margin-bottom: 29px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list { min-width: 400px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list .image { margin-left: 25px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list .image img { width: 142px; height: 111px; object-fit: cover; border-radius: 4px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list .content .id { font-size: 14px; font-weight: 500; display: block; line-height: 17px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list .content .title-booking { font-size: 17px; font-weight: 600; line-height: 30px; margin-bottom: 5px; margin-top: 3px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list .content .price { font-size: 15px; font-weight: 700; line-height: 19px; color: #D01818; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list-table { width: 100%; text-align: center; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .status { font-size: 15px; font-weight: 500; line-height: 20px; padding: 6px 15px; background-color: #44b774; color: #FFFFFF; border-radius: 15px; display: inline-block; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .date-gues { font-size: 16px; font-weight: 600; line-height: 30px; color: #081E2A; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .action-wrap { gap: 10px; max-width: 145px; width: 100%; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .action-wrap .action { width: 44px; height: 43px; border: 1px solid #EDEEEE; border-radius: 11px; color: #44b774; cursor: pointer; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .action-wrap .action:hover { background-color: #44b774; color: #FFFFFF; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-title { padding: 20px 50px 16px 28px; background-color: #021B32; border-radius: 8px; width: 100%; gap: 20px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-title li { width: 100%; text-align: center; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-title li:first-child { min-width: 400px; text-align: right; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-title li:last-child { max-width: 145px; width: 100%; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-title li p { color: #FFFFFF; font-size: 16px; font-weight: 600; line-height: 30px; } .has-dashboard .profile-dashboard .counter-dashboard { padding: 22px 28px 28px 28px; background-color: #FFFFFF; border-radius: 9px; } .has-dashboard .profile-dashboard .counter-dashboard .icon { width: 65px; height: 65px; border-radius: 100%; background-color: rgba(77, 165, 40, 0.13); margin-left: 38px; } .has-dashboard .profile-dashboard .counter-dashboard .icon i { font-size: 28px; color: #44b774; } .has-dashboard .profile-dashboard .counter-dashboard .content span { font-size: 16px; font-weight: 500; line-height: 20px; color: #081E2A; display: block; margin-bottom: 10px; } .has-dashboard .profile-dashboard .counter-dashboard .content .number-counter { font-size: 26px; font-weight: 800; line-height: 32px; color: #081E2A; position: relative; } .has-dashboard .profile-dashboard .counter-dashboard .content .money::after, .has-dashboard .profile-dashboard .counter-dashboard .content .plus::after { position: absolute; } .has-dashboard .profile-dashboard .counter-dashboard .content .money::after { content: "$"; } .has-dashboard .profile-dashboard .counter-dashboard .content .plus::after { content: "+"; } .has-dashboard .profile-dashboard .page-insight { padding: 35px 22px 35px 55px; background-color: #FFFFFF; border-radius: 19px; border: 1px solid #EDEEEE; } .has-dashboard .profile-dashboard .tfcl-card { background-color: #FFFFFF; border-radius: 10px; padding: 32px 37px; } .has-dashboard .profile-dashboard .dashboard-message .message li:not(:last-child) { margin-bottom: 26px; } .has-dashboard .profile-dashboard .dashboard-message .message li .icon { font-size: 17px; color: #44b774; margin-left: 18px; } .has-dashboard .profile-dashboard .dashboard-message .message li p { font-size: 15px; font-weight: 500; line-height: 23px; color: #081E2A; } .has-dashboard .profile-dashboard .dashboard-reviews ul .comment-by-user:not(:last-child) { margin-bottom: 40px; } .has-dashboard .profile-dashboard .dashboard-reviews ul .comment-by-user .group-author { margin-left: 11px; } .has-dashboard .profile-dashboard .dashboard-reviews ul .comment-by-user .group-author img { width: 56px; height: 56px; border-radius: 100%; object-fit: cover; } .has-dashboard .profile-dashboard .dashboard-reviews ul .comment-by-user .content .group-name .review-name { font-size: 14px; font-weight: 700; line-height: 25px; color: #081E2A; } .has-dashboard .profile-dashboard .dashboard-reviews ul .comment-by-user .content .group-name .rating-wrap i { font-size: 15px; color: #177ec2; } .has-dashboard .profile-dashboard .dashboard-reviews ul .comment-by-user .content p { font-size: 14px; font-weight: 400; line-height: 24.8px; margin-top: 4px; } .counter-grid-dashboard { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; } .offcanvas .offcanvas-body .logo-canvas { margin-bottom: 30px; } .offcanvas .offcanvas-body .logo-canvas img { width: 170px; } .offcanvas .offcanvas-body .des { color: #4F545A; margin-bottom: 20px; } .offcanvas .offcanvas-body .canvas-info { margin-bottom: 20px; } .offcanvas .offcanvas-body .canvas-info li i { color: #44b774; font-size: 20px; margin-left: 10px; } .offcanvas .offcanvas-body .canvas-info li p { color: #4F545A; } .offcanvas .offcanvas-body .social li a { background-color: #44b774; } .offcanvas .offcanvas-body .social li a:hover { background-color: #177ec2; color: #FFFFFF; } .wrapper-layout-map .wrap-left { width: 45%; padding: 108px 67px 118px 31px; } .wrapper-layout-map .wrap-right { width: 55%; } .populer-activities, .tour-package-swipper { padding-bottom: 30px; margin-bottom: -30px; } .view-all-wrap .view-all { margin-left: 15px; } .footer .footer-main { display: flex; padding-top: 165px; padding-bottom: 77px; } .footer-style1.footer-home3 .footer-main { padding-top: 80px; } .footer-style1 { background-color: #1D231F; } .footer-style1 .footer-main { display: flex; padding-top: 165px; padding-bottom: 83px; } .footer-style1 .footer-main .title { margin-bottom: 25px; color: #FFFFFF; line-height: 35px; } .footer-style1 .footer-main .footer-logo { width: 29.8%; padding-left: 4em; } .footer-style1 .footer-main .footer-logo .logo-footer { margin-bottom: 26px; } .footer-style1 .footer-main .footer-logo .logo-footer img { width: 130px; } .footer-style1 .footer-main .footer-logo .des-footer { color: #FFFFFF; margin-bottom: 20px; } .footer-style1 .footer-main .footer-logo .footer-info li:not(:last-child) { margin-bottom: 11px; } .footer-style1 .footer-main .footer-logo .footer-info li i { color: #44b774; margin-left: 12px; font-size: 17px; } .footer-style1 .footer-main .footer-logo .footer-info li p, .footer-style1 .footer-main .footer-logo .footer-info li a { font-size: 16px; font-weight: 500; line-height: 34px; color: #FFFFFF; } .footer-style1 .footer-main .footer-service { width: 17.2%; padding-left: 2em; } .footer-style1 .footer-main .footer-service .footer-menu li:not(:last-child) { margin-bottom: 11px; } .footer-style1 .footer-main .footer-service .footer-menu li a { font-size: 16px; font-weight: 600; line-height: 35px; color: #B4B4B4; transition: all 0 0.3ss ease-in-out; } .footer-style1 .footer-main .footer-service .footer-menu li a:hover { color: #44b774; margin-right: 5px; } .footer-style1 .footer-main .footer-gallery { width: 30%; padding-right: 5px; padding-left: 6.8em; } .footer-style1 .footer-main .footer-gallery .gallery-img { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 10px; } .footer-style1 .footer-main .footer-gallery .gallery-img img { border-radius: 2px; } .footer-style1 .footer-main .footer-newsletter { width: 23%; padding-right: 3px; } .footer-style1 .footer-main .footer-newsletter .check-form { margin-top: 23px; margin-bottom: 30px; } .footer-style1 .footer-main .footer-newsletter .check-form i { color: #FFFFFF; padding: 5px; border: 1px solid #44b774; border-radius: 100%; margin-left: 12px; font-size: 12px; } .footer-style1 .footer-main .footer-newsletter .check-form p { font-size: 15px; font-weight: 500; line-height: 26px; color: #B4B4B4; } .footer-style1 .footer-main .footer-newsletter .social-ft li:not(:last-child) { margin-left: 24px; } .footer-style1 .footer-main .footer-newsletter .social-ft li a { color: #FFFFFF; } .footer-style1 .footer-main .footer-newsletter .social-ft li a:hover { color: #44b774; } .footer-style1 .footer-bottom { padding: 28px 0px; border-top: 1px solid rgba(242, 242, 242, 0.07); } .footer-style1 .footer-bottom p { font-size: 17px; color: #FFFFFF; } .footer-style2 { padding-top: 60px; background: url(https://assets.unlayer.com/projects/42726/1751528383002-map.png) no-repeat center center; background-size: cover; } .footer-style2 .footer-menu li:not(:last-child) { margin-bottom: 8px; } .footer-style2 .footer-menu li a { font-size: 14px; font-weight: bold; color: #4F545A; transition: all 0.3s ease-in-out; } .footer-style2 .footer-menu li a:hover { color: #44b774; margin-right: 5px; } .footer-style2 .footer-item-logo .logo { margin-bottom: 5px; margin-right: 35px; } .footer-style2 .footer-item-logo .logo img { width: 200px; } .footer-style2 .footer-item-logo .des-footer { font-size: 15px; font-weight: 400; text-align: center; line-height: 26px; margin-bottom: 27px; } .footer-style2 .footer-item-logo .social li:not(:last-child) { margin-left: 10px; } .footer-style2 .footer-item-logo .social li a { width: 40px; height: 40px; border-radius: 100%; border: 1px solid #44b774; background-color: rgba(0, 0, 0, 0.04); color: #4F545A; font-size: 12px; } .footer-style2 .footer-item-logo .social li a:hover { background-color: #44b774; color: #FFFFFF; } .footer-style2 .footer-item-company { padding-right: 68px; } .footer-style2 .footer-item-quick-link { padding-right: 29px; } .footer-style2 .footer-item-newsletter { margin-right: -13px; } .footer-style2 .footer-item-newsletter .des { font-size: 15px; font-weight: 400; line-height: 26px; } .footer-style2 .footer-bottom { margin-top: 40px; border-top: 1px solid #EDEEEE; padding-top: 20px; padding-bottom: 30px; } .footer-style2 .footer-bottom .copy-right { font-size: 15px; font-weight: 500; line-height: 27px; color: #081E2A; text-align: left; } .footer-style2 .footer-bottom .policy-tern li:not(:first-child) { margin-right: 40px; } .footer-style2 .footer-bottom .policy-tern li a { font-size: 15px; font-weight: 500; line-height: 27px; color: #081E2A; } .footer-style2 .footer-bottom .policy-tern li a:hover { color: #44b774; } /*----------------------Slide-home 01--------------------*/ .slider-home1 .silider-image::before { background: linear-gradient(-90deg, rgb(4, 27, 40), rgba(0, 0, 0, 0)); top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; z-index: 2; } .slider-home1 .silider-image img { position: absolute; } .slider-home1 .silider-image .image-slide { width: 100%; height: 100%; object-fit: cover; } .slider-home1 .silider-image .mask-slide { width: auto; z-index: 2; height: 100%; } .slider-home1 .silider-image .mask-flane { width: auto; right: 0px; bottom: 5.8%; z-index: 2; animation: dot-anim-2 3s linear 0s infinite alternate; } .slider-home1 .silider-image .booking-title { position: absolute; z-index: 3; left: 33.6%; top: 11%; rotate: -5deg; } .slider-home1 .silider-image .booking-title .booking { font-size: 40px; font-weight: 400; line-height: 50.69px; font-family: "Yesteryear", sans-serif; color: #FFFFFF; padding: 18px 33px 14px 33px; border: 2px solid #44b774; display: inline-block; position: relative; } .slider-home1 .silider-image .booking-title .booking::before { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; top: -5px; right: -8px; } .slider-home1 .silider-image .booking-title .booking::after { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; top: -5px; left: -8px; } .slider-home1 .silider-image .booking-title span::before { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; bottom: -10px; right: -10px; } .slider-home1 .silider-image .booking-title span::after { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; bottom: 0px; left: -15px; } .slider-home1 .slider-content { position: relative; z-index: 3; padding-top: 144px; padding-bottom: 202px; } .slider-home1 .slider-content .title-slide { text-transform: uppercase; font-size: 70px; font-weight: 700; line-height: 95px; } .slider-home1 .slider-content .des { max-width: 570px; width: 100%; } .slider-home1 .slider-content .btn-group .btn-main { padding: 15px 24px; } .btn-group { gap: 40px; flex-wrap: wrap; } .btn-group .btn-w-wa { font-size: 20px; font-weight: 500; line-height: 29px; padding: 18px 0px; color: #FFFFFF; } .btn-group .btn-w-wa i { color: #44b774; font-size: 16px; margin-right: 7px; margin-right: 5px; transition: all 0.3s ease; } .btn-group .btn-w-wa:hover { color: #177ec2; } .btn-group .btn-w-wa:hover i { margin-right: 12px; } .btn-nex-prev { position: absolute; left: 11.6%; top: 33%; z-index: 4; } .btn-nex-prev .swiper-button-next::after { content: "\e970"; } .btn-nex-prev .swiper-button-prev::after { content: "\e971"; } .btn-nex-prev .next-home1, .btn-nex-prev .prev-home1 { position: relative !important; background-color: rgba(255, 255, 255, 0.5); gap: 25px; right: 0; left: 0; top: 0; bottom: 0; margin: 25px 0px; } .btn-nex-prev .next-home1::before, .btn-nex-prev .next-home1::after, .btn-nex-prev .prev-home1::before, .btn-nex-prev .prev-home1::after { color: #081E2A; font-weight: 600; } .btn-nex-prev .next-home1:hover, .btn-nex-prev .prev-home1:hover { background-color: #177ec2; } .btn-nex-prev .next-home1.swiper-button-disabled, .btn-nex-prev .prev-home1.swiper-button-disabled { opacity: 1; background-color: rgba(4, 28, 41, 0.5); } .btn-nex-prev .next-home1.swiper-button-disabled::before, .btn-nex-prev .next-home1.swiper-button-disabled::after, .btn-nex-prev .prev-home1.swiper-button-disabled::before, .btn-nex-prev .prev-home1.swiper-button-disabled::after { color: #FFFFFF; } /*----------------------Slide-home 02--------------------*/ .slider-home2-image .slider-home2 { position: relative; } .slider-home2-image .slider-home2::before { background: linear-gradient(-80deg, rgba(1, 10, 4, 0.89), rgba(0, 0, 0, 0.34)); top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; z-index: 2; border-radius: 25px; } .slider-home2-image .slider-home2 .image-slider-home2 { height: 500px; object-fit: cover; /* border-radius: 25px; */ } .slider-home2-image .slider-home2 .next-slider2 { border: 1px solid rgba(255, 255, 255, 0.28); top: 86% !important; left: 5%; background-color: transparent; color: #FFFFFF !important; } .slider-home2-image .slider-home2 .next-slider2::after { content: "\e926"; font-family: "icomoon"; font-size: 15px; } .slider-home2-image .slider-home2 .swiper-button-disabled::after { color: #FFFFFF !important; } .slider-home2-image .slider-home2 .prev-slider2 { border: 1px solid rgba(255, 255, 255, 0.28); top: 86% !important; right: 86.5%; background-color: transparent; color: #FFFFFF !important; } .slider-home2-image .slider-home2 .prev-slider2::after { content: "\e925"; font-family: "icomoon"; font-size: 15px; } .slider-home2-content { position: absolute; z-index: 2; padding-top: 50px; padding-bottom: 0; top: 0; right: 50%; width: 100%; transform: translateX(50%); } .slider-home2-content .mask-slide2 { position: absolute; width: auto; top: 0; right: 0; z-index: 1; } .slider-home2-content .mask-slide2-flan { width: auto; right: 17%; position: absolute; top: 15%; z-index: -1; } div#pills-tab2Content { background: white; border-radius: 10px; min-height: 160px; align-items: center; width: 100%; padding: 0 !important; margin-bottom: 25px; } .slider-home2-content .sub-title { font-size: 28px; font-weight: 400; line-height: 46px; display: inline-block; } .slider-home2-content .title-slide { text-transform: capitalize; font-size: 40px; font-weight: 800; line-height: 1.4; margin-top: 7px; margin-bottom: 20px; } .slider-home2-content p { color: white; font-size: 20px; } .slider-home2-content .tour-list { margin-top: 38px; } .slider-home2-content .tour-list ul li:not(:last-child) { margin-left: 37px; } .slider-home2-content .tour-list ul li i { font-size: 8px; padding: 5px; color: #FFFFFF; border-radius: 100%; background-color: #44b774; margin-left: 8px; } .slider-home2-content .tour-list ul li span { font-size: 16px; font-weight: 600; color: #FFFFFF; line-height: 30px; text-transform: capitalize; } /*----------------------Slide-home 03--------------------*/ .booking-title { z-index: 3; rotate: -5deg; position: relative; } .booking-title .booking { font-family: "Yesteryear", sans-serif; color: #44b774; font-weight: 400; padding: 7px 5px 0px 17px; border: 2px dotted #44b774; display: inline-block; position: relative; rotate: -4deg; margin-right: -8px; margin-left: -6px; transition: all 0.3s; } .booking-title .booking:hover { rotate: 0deg; } .booking-title .booking::before { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; top: -5px; right: -8px; } .booking-title .booking::after { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; top: -5px; left: -8px; } .booking-title .dot::before { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; bottom: -5px; right: -8px; } .booking-title .dot::after { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; bottom: -5px; left: -8px; } .slider-home3 { padding-right: 15.6%; } .slider-home3 .slider-home3-content { padding-top: 174px; padding-bottom: 232px; padding-left: 2.7em; } .slider-home3 .slider-home3-content .title-slide { font-size: 70px; font-weight: 800; line-height: 70px; text-transform: capitalize; margin-top: 10px; } .slider-home3 .slider-home3-content .des { max-width: 570px; width: 100%; } .slider-home3 .slider-home3-content .btn-group .btn-w-wa { color: #081E2A; } .slider-home3 .slider-home3-content .btn-group .btn-w-wa:hover { color: #177ec2; } /*----------------------Slide-home 04--------------------*/ .slider-home4 { background-image: url(../../assets/images/slide/slide4.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding-top: 267px; padding-bottom: 203px; background-attachment: fixed; } .slider-home4::before { top: 0; left: 0; right: 0; bottom: 0; position: absolute; background-color: rgba(0, 0, 0, 0.28); content: ""; z-index: 1; } .slider-home4 .mask-slider { position: absolute; left: 0; top: 0; z-index: 1; } .slider-home4 .mask-slider img { width: auto; height: 100%; } .slider-home4 .home4-content { padding-left: 4em; z-index: 3; position: relative; } .slider-home4 .home4-content .sub-title { font-size: 26px; margin-bottom: 4px; } .slider-home4 .home4-content .title-slide { font-size: 75px; font-weight: 800; line-height: 85px; text-transform: capitalize; margin-bottom: 57px; } .slider-home4 .home4-content .btn-group { gap: 20px; flex-wrap: wrap; } .slider-home4 .home4-content .btn-group .btn-main { padding: 18px 23px; } .slider-home4 .home4-content .btn-group .btn-w-wa { color: #44b774; font-size: 16px; font-weight: 700; line-height: 65px; padding: 0px 5px; text-decoration: underline; } .slider-home4 .home4-content .btn-group .btn-w-wa:hover { color: #FFFFFF; } .slider-home4 .widget-icon-video { position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } /*----------------------Slide-home 05--------------------*/ .slider-home5 { padding-top: 112px; padding-bottom: 185px; background-color: #212622; } .slider-home5 .mask-left { width: 305px; height: 408px; background: linear-gradient(0deg, rgba(241, 176, 10, 0.45), rgba(255, 183, 0, 0.31), rgba(23, 38, 61, 0)); clip-path: polygon(0 0, 0% 100%, 100% 0); opacity: 0.97; position: absolute; top: 0; right: 0; z-index: 1; } .slider-home5 .mask-right { width: 305px; height: 408px; background: linear-gradient(-262deg, rgba(77, 165, 40, 0.52), rgba(77, 165, 40, 0.25), rgba(23, 38, 61, 0)); clip-path: polygon(0 100%, 100% 100%, 100% 0); opacity: 0.97; position: absolute; bottom: 0; left: 0; z-index: 1; } .slider-home5 .image-slide-home5 { margin-left: -69px; margin-right: -25px; } .slider-home5 .image-slide-home5 .image-svg { width: auto; position: absolute; bottom: -7%; right: -9%; animation: anime-rorate 8s infinite; } .slider-home5 .image-slide-home5 span { font-size: 54px; font-weight: 400; line-height: 54.8px; rotate: -42deg; position: absolute; bottom: 14%; left: 3%; } .slider-home5 .content-slide-home5 { padding-left: 3em; padding-top: 24px; } .slider-home5 .content-slide-home5 .title-slide { font-size: 70px; font-weight: 800; line-height: 77px; text-transform: capitalize; margin-top: 7px; margin-bottom: 38px; z-index: 2; position: relative; } .slider-home5 .content-slide-home5 .des { width: 570px; max-width: 100%; } .slider-home5 .content-slide-home5 .widget-icon-video { width: 60px; height: 60px; margin-right: 38px; } .slider-home5 .content-slide-home5 .image-svg2 { position: absolute; top: 38.3%; right: -1%; width: auto; z-index: 1; animation: dot-anim-2 3s linear 0s infinite alternate; } #footer-form .input-wrap { position: relative; padding: 5px 7px; background-color: #FFFFFF; border-radius: 30px; } #footer-form .input-wrap input { padding: 10px; border: unset; } #footer-form .input-wrap button { border-radius: 30px; padding: 7px 25px; } #search-bar-widget { position: relative; } #search-bar-widget input { background-color: #FFFFFF; border: unset; border-radius: unset; padding: 15px 15px 15px 60px; } #search-bar-widget button { background-color: transparent; position: absolute; left: 0; top: 0; color: #081E2A; padding: 16px 32px; } #comment .group-gap { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 33px; } #comment .input-cmt { background-color: #FFFFFF; border-radius: unset; color: #4F545A; font-weight: 400; } #comment .input-cmt::placeholder { color: #4F545A; font-weight: 400; } #comment .checkbox { margin-top: 20px; margin-bottom: 70px; } #comment .checkbox label { margin-bottom: 0px; } .search-form-widget-slider { background-color: #FFFFFF; padding: 32px 35px 30px 28px; border-radius: 6px; box-shadow: 0px 7px 29px 0px rgba(0, 0, 0, 0.06); width: 100%; z-index: 20; } .wd-search .form-group { position: relative; text-align: right; } .wd-search .form-group:not(:last-child) { margin-left: 20px; } .wd-search .form-group:not(:last-child)::before { height: 61px; width: 1px; background-color: #EDEEEE; position: absolute; content: ""; left: -6px; } .wd-search .form-group i { color: #44b774; font-size: 20px; margin-left: 13px; margin-top: 8px; } .wd-search .form-group i.fs-30 { font-size: 30px !important; } .wd-search .form-group i.fs-40 { font-size: 40px !important; } .wd-search .form-group .search-bar-group { position: relative; } .wd-search .form-group .search-bar-group label { font-size: 17px; font-weight: 700; line-height: 20px; color: #081E2A; margin-bottom: 0px; position: absolute; top: 5px; right: 0; } .wd-search .form-group .search-bar-group input { padding: 38px 0px 5px 30px; border: unset !important; } .wd-search .form-group .search-bar-group .nice-select { padding: 35px 0px 8px 30px; border: unset !important; width: 200px; } .wd-search .form-group .search-bar-group .nice-select::after { top: 36%; } .wd-search .form-group .icon-icon-filter { margin-left: 23px; cursor: pointer; } .wd-search .form-group .icon-icon-filter i { font-size: 30px; color: #44b774; } .wd-search .form-group .icon-icon-filter i:hover { color: #177ec2; } .wd-search .form-group .btn-search { background-color: #44b774; font-size: 18px; font-weight: 500; line-height: 18px; border-radius: 33px; padding: 20px 40px 20px 46px; color: #FFFFFF; } .wd-search .form-group .btn-search i { color: #FFFFFF; margin-left: 11px; font-size: 17px; } .wd-search .form-group .btn-search:hover { background-color: #177ec2; } .search-mobie .modal-dialog { max-width: 800px; margin: 90px auto; padding: 0px 15px; } .search-mobie .modal-dialog .modal-content { border-radius: 16px; } .search-mobie .modal-dialog .search-form-mobie .search { position: relative; display: flex; align-items: center; flex-wrap: nowrap; } .search-mobie .modal-dialog .search-form-mobie .search i { position: absolute; right: 0; top: 20px; } .search-mobie .modal-dialog .search-form-mobie .search .search-input { border: unset; padding: 15px 25px 15px 20px; } .search-mobie .modal-dialog .search-form-mobie .search button { border-radius: 30px; padding: 20px 30px; } .search-mobie .modal-dialog .btn-close:before { content: "\e986"; font-size: 18px; color: #FFFFFF; font-family: "icomoon"; } .search-mobie .modal-dialog .btn-close { position: absolute; left: 0; top: -30px; padding: 0; background: transparent; } .form-search-faq { padding: 11px; background-color: #FFFFFF; border-radius: 50px; max-width: 912px; width: 100%; } .form-search-faq button { max-width: 184px; width: 100%; border-radius: 50px; padding: 20px 20px; } .form-search-faq button i { margin-left: 10px; } .form-search-faq input { border: 1px solid transparent !important; } .form-search-faq input::placeholder { color: #4F545A; text-transform: capitalize; font-size: 16px; } #form-contact-us .input-wrap:not(:last-child) { margin-bottom: 50px; } #form-contact-us .input-wrap i { position: absolute; right: 15px; top: 10px; font-size: 20px; } #form-contact-us .input-wrap i svg { width: 20px; height: 20px; position: relative; top: -7px; } #form-contact-us .input-wrap input, #form-contact-us .input-wrap textarea { padding: 10px 48px 10px 20px; /* border: unset; */ border-radius: 10px; font-size:15px; font-weight:200; border-bottom: 1px solid #EDEEEE; } #form-contact-us .iti.iti--allow-dropdown { width: 100%; } #form-contact-us .input-wrap { margin-bottom: 20px; } #form-contact-us .input-wrap input::placeholder, #form-contact-us .input-wrap textarea::placeholder { font-size: 14px; font-weight: bold; line-height: 22px; } #form-contact-us .input-wrap input:focus, #form-contact-us .input-wrap textarea:focus { border-bottom: 1px solid #081E2A; } #form-contact-us .btn-submit-contact i { margin-left: 10px; } #form-book-tour input, #form-book-tour .nice-select { background-color: #FFFFFF; padding: 10px; font-weight: bold; font-size: 14px; } #form-book-tour .label { font-size: 15px; font-weight: 700; line-height: 30px; color: rgb(34, 34, 34); } #form-book-tour p { font-size: 15px; font-weight: 500; line-height: 26px; color: #83827F; } #form-book-tour .input-wrap-sellect .nice-select { width: 115px; } #form-book-tour .input-wrap-checkbox .extra { margin-right: 32px; } #form-book-tour .input-wrap-checkbox .extra .name { font-size: 15px; font-weight: 500; line-height: 39px; color: #83827F; margin-left: 4px; width: 90px; } #form-book-tour .input-wrap-checkbox .extra .price { font-size: 14px; font-weight: 500; line-height: 39px; color: #081E2A; } #form-book-tour .total { font-size: 22px; font-weight: 700; } #form-book-tour button { width: 100%; border-radius: 3px; background-color: #44b774; text-transform: uppercase; display: flex; justify-content: center; transition: all 0.3s ease-in-out; } #form-book-tour button:hover { background-color: #177ec2; } #form-review .input-wrap input, #form-review .input-wrap textarea { background-color: #FFFFFF; padding: 20px 50px 20px 17px; } #form-review .input-wrap i { position: absolute; top: 24px; right: 20px; } #form-review .checkbox label { font-size: 16px; font-weight: 500; line-height: 20px; } #form-review .submit { width: 100%; text-transform: uppercase; } #form-review .submit:hover { background-color: #177ec2; } .form-footer-st2 { box-shadow: 0px 13px 22px 0px rgba(6, 34, 51, 0.06); } .form-footer-st2 .input-search { border: unset; } .form-footer-st2 .input-search:focus { border: unset; } .form-footer-st2 button { padding: 20px 25px; border-radius: 8px; } .wd-search-form { position: absolute; width: 97%; margin-top: 105px; right: 20px; left: 0; background-color: #FFFFFF; padding: 10px; box-shadow: 0px 7px 29px 0px rgba(0, 0, 0, 0.06); border-radius: 5px; z-index: 9; opacity: 0; visibility: hidden; text-align: right; transition: all 0.3s ease-in-out; } .wd-search-form.show { opacity: 1; visibility: visible; } .wd-search-form .input-group-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; } /** * scroll-top * PreLoad * pagination * Social * price-range * video * widget Tour List * Counter * widget Destination * Blog * widget clip text * widget icon box * widget Testimonial * widget Team * Gallery * widget Image Box * Faq * Count Down */ /* Scroll Top -------------------------------------------------------------- */ .button-go { position: fixed; display: block; width: 47px; height: 47px; line-height: 47px; border-radius: 6px; text-align: center; z-index: 999; left: 25px; bottom: 30px; opacity: 0; visibility: hidden; cursor: pointer; overflow: hidden; } .button-go.show { left: 20px; opacity: 1; visibility: visible; } .button-go::before, .button-go::after { content: ""; position: absolute; top: 0; right: 0; width: 100%; height: 100%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .button-go::before { z-index: -1; background-color: #44b774; } .button-go::after { content: "\e9db"; font-family: "icomoon"; font-size: 15px; color: #FFFFFF; font-weight: 600; } .button-go:hover { transform: translateY(-3px); } /* PreLoad -------------------------------------------------------------- */ .pl { width: 6em; height: 6em; } .pl__ring { animation: ringA 2s linear infinite; } .pl__ring--a { stroke: #44b774; } .pl__ring--b { animation-name: ringB; stroke: #177ec2; } .pl__ring--c { animation-name: ringC; stroke: #177ec2; } .pl__ring--d { animation-name: ringD; stroke: #44b774; } .preload { overflow: hidden; } .preload-container { position: relative; width: 100%; height: 100%; background: #FFFFFF; position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 99999999999; display: flex; justify-content: center; align-items: center; } /*pagination -------------------------------------------------------------- */ .swiper-pagination .swiper-pagination-bullet { background: #d0d0d0; opacity: 1; margin: 0px 7px !important; } .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #44b774 !important; position: relative; margin: 0px 14px !important; } .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::before { width: 26px; height: 26px; border-radius: 100%; border: 1px solid #44b774; position: absolute; content: ""; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .swiper-button-next { background-color: #44b774; } .swiper-button-next::after { content: "\e9e0"; font-family: "icomoon"; font-size: 15px !important; } .swiper-button-prev { background-color: #44b774; } .swiper-button-prev::after { content: "\e9df"; font-family: "icomoon"; font-size: 15px !important; } .swiper-button-disabled { background-color: #DCDCDC; } .swiper-button-disabled::after { color: #44b774 !important; } /*pagination -------------------------------------------------------------- */ .tf-pagination { flex-wrap: wrap; gap: 16px; margin-top: 40px; justify-content: center; } .tf-pagination li { color: #FFFFFF; } .tf-pagination li .pages-link { width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; color: #44b774; border: 1px solid #44b774; border-radius: 100%; } .tf-pagination li .pages-link:hover { background-color: #44b774; color: #FFFFFF; } .tf-pagination li.active { background-color: #44b774; color: #FFFFFF; border-radius: 100%; } .tf-pagination li.active>.pages-link { color: #FFFFFF; } /*Social -------------------------------------------------------------- */ .social { display: flex; align-items: center; gap: 10px; margin-right: 30px; } .social a { color: #FFFFFF; width: 40px; height: 40px; border-radius: 100%; display: flex; align-items: center; justify-content: center; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .social a:hover { background-color: rgba(255, 255, 255, 0.07); } .social a.active { background-color: rgba(255, 255, 255, 0.07); } /* price-range -------------------------------------------------------------- */ .noUi-target, .noUi-target * { -webkit-touch-callout: none; -webkit-user-select: none; -ms-touch-action: none; touch-action: none; -ms-user-select: none; -moz-user-select: none; user-select: none; -moz-box-sizing: border-box; box-sizing: border-box; } .noUi-target { position: relative; direction: rtl; } .noUi-base { width: 100%; height: 100%; position: relative; z-index: 1; } .noUi-origin { position: absolute; left: 0; top: 0; right: 0; bottom: 0; } .noUi-handle { position: relative; z-index: 1; } .noUi-stacking .noUi-handle { z-index: 10; } .noUi-state-tap .noUi-origin { -webkit-transition: right 0.3s, top 0.3s; transition: right 0.3s, top 0.3s; } .noUi-state-drag * { cursor: inherit !important; } .noUi-base, .noUi-handle { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .noUi-horizontal { height: 6px; } .noUi-horizontal .noUi-handle { position: relative; width: 17px; height: 17px; border-radius: 50px; right: 0px; top: -6.5px; background-color: #f6f6f6; border: 1px solid #ccc; } .caption { margin-top: 20px; } /* Styling; */ .noUi-background { background: #081E2A; } .noUi-connect { background: #44b774; -webkit-transition: background 450ms; transition: background 450ms; } .noUi-origin { border-radius: 2px; } .noUi-target { width: 100%; height: 6px; border-radius: 2px; } .noUi-horizontal .noUi-handle.noUi-handle-upper { right: -7px; } /* Handles and cursors; */ .noUi-draggable { cursor: w-resize; } .noUi-vertical .noUi-draggable { cursor: n-resize; } .noUi-handle { cursor: default; -webkit-box-sizing: content-box !important; -moz-box-sizing: content-box !important; box-sizing: content-box !important; } .noUi-handle:active { border: 1px solid #44b774; } /* Disabled state; */ [disabled].noUi-connect, [disabled] .noUi-connect { background: #B8B8B8; } [disabled].noUi-origin, [disabled] .noUi-handle { cursor: not-allowed; } .slider-labels .caption { font-weight: 500; font-size: 16px; color: #081E2A; line-height: 26px; } #slider-range-value01::after, #slider-range-value1::after { content: " — "; margin: 0 2px; } /* Tag -------------------------------------------------------------- */ .tag { display: flex; align-items: center; flex-wrap: wrap; } .tag li { margin-left: 14px; margin-bottom: 14px; } .tag li a { font-size: 14px; font-weight: 500; line-height: 17.64px; background-color: #FFFFFF; color: #4F545A; padding: 10px 18px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; display: inline-block; } .tag li a.active { background-color: #44b774; color: #FFFFFF; } .tag li a:hover { background-color: #44b774; color: #FFFFFF; } /* body -------------------------------------------------------------- */ /* video -------------------------------------------------------------- */ .widget-icon-video { width: 80px; height: 80px; border-radius: 100%; background-color: #44b774; animation: pulse_two 2s infinite; cursor: pointer; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .widget-icon-video:hover { background-color: #177ec2; } .widget-icon-video i { font-size: 20px; color: #FFFFFF; } /* video -------------------------------------------------------------- */ .image-list img, .image-list .icon { width: 36px; height: 36px; border-radius: 100%; border: 2px solid #FFFFFF; background-color: #44b774; } .image-list img i, .image-list .icon i { font-size: 8px; } .image-list .item:not(:first-child) { margin-right: -12px; } .client { font-size: 17px; font-weight: 500; line-height: 37px; padding-bottom: 13px; margin-right: 25px; border-bottom: 1px solid #EDEEEE; color: #000000; } /* Next Priev -------------------------------------------------------------- */ .swiper-button-next, .swiper-button-prev { width: 66px; height: 66px; border-radius: 100%; } .swiper-button-next::after, .swiper-button-prev::after { font-size: 20px; } .swiper-button-next::before, .swiper-button-prev::before { font-size: 20px; } .swiper-button-next:hover, .swiper-button-prev:hover { background-color: #177ec2 !important; } /* widget heading -------------------------------------------------------------- */ .sub-title-heading { font-size: 18px; font-weight: 500; line-height: 22.68px; display: inline-block; } /* widget Tour List -------------------------------------------------------------- */ .tour-listing { border-radius: 8px 8px 8px 8px; position: relative; overflow: hidden; } .tour-listing:hover .tour-listing-image img { transform: scale(1.1); } .tour-listing:hover .tour-listing-content .tag-listing { background-color: #44b774; color: #FFFFFF; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .featured-cities .flex-two { justify-content: center; } .tour-listing .tour-listing-image { position: relative; display: block; } .tour-listing .tour-listing-image .badge-top { position: absolute; width: 100%; z-index: 2; right: 0px; left: 0px; padding-right: 12px; padding-left: 16px; top: 12px; } .tour-listing .tour-listing-image .badge-top .feature { font-size: 14px; font-weight: 500; line-height: 20px; color: #FFFFFF; background-color: #14B0C3; padding: 4px 17px; border-radius: 4px; } .tour-listing .tour-listing-image .badge-top .badge-media .media { padding: 6px 8px; background-color: rgba(0, 0, 0, 0.63); border-radius: 2px; box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.05); color: #FFFFFF; font-size: 14px; font-weight: 500; line-height: 16px; display: flex; align-items: center; cursor: pointer; } .tour-listing .tour-listing-image .badge-top .badge-media .media:not(:first-child) { margin-right: 10px; } .tour-listing .tour-listing-image .badge-top .badge-media .media i { font-size: 16px; margin-left: 5px; } .tour-listing .tour-listing-image img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tour-listing .tour-listing-content { padding: 14px 29px 0px 40px; background-color: #FFFFFF; border-radius: 8px; margin-top: -73px; position: relative; text-align: center; } .tour-listing .tour-listing-content .tag-listing { font-size: 14px; font-weight: 500; line-height: 17px; background-color: #FFFFFF; padding: 6px 22px; border-radius: 4px; box-shadow: 0px 6px 9px 0px rgba(0, 0, 0, 0.05); position: absolute; top: -13px; left: 25px; } .tour-listing .tour-listing-content .map { font-size: 15px; font-weight: 400; line-height: 20px; color: #4F545A; font-family: "DM Sans", sans-serif; } .tour-listing .tour-listing-content .map i { color: #44b774; margin-left: 10px; font-size: 12px; } .tour-listing .tour-listing-content .title-tour-list { font-size: 14px; line-height: 30px; margin-top: 0px; margin-bottom: 8px; text-transform: inherit; } .tour-listing .tour-listing-content .review i { color: #177ec2; font-size: 16px; } .tour-listing .tour-listing-content .review span { font-size: 14px; font-weight: 500; line-height: 17px; color: #4F545A; margin-right: 6px; } .tour-listing .tour-listing-content .icon-box { padding-top: 0px; padding-bottom: 8px; border-bottom: 1px solid #EBEBEB; margin-bottom: 8px; flex-wrap: wrap; gap: 18px; justify-content: center; } .tour-listing .tour-listing-content .icon-box .icons i { color: #44b774; margin-left: 10px; font-size: 19px; } .tour-listing .tour-listing-content .icon-box .icons svg { margin-left: 10px; } .tour-listing .tour-listing-content .icon-box .icons svg path { stroke: #44b774; } .tour-listing .tour-listing-content .icon-box .icons span { font-size: 12px; font-weight: bold; color: #83827F; font-family: "Noto Sans Arabic", sans-serif; } .tour-listing .tour-listing-content .price-box { flex-wrap: wrap; gap: 8px; } .tour-listing .tour-listing-content .price-box p { font-size: 15px; font-weight: 500; color: #83827F; } .tour-listing .tour-listing-content .price-box p .price-sale { font-size: 16px; font-weight: 600; line-height: 20px; color: #44b774; } .tour-listing .tour-listing-content .price-box .price { font-size: 14px; font-weight: 500; line-height: 17px; color: #83827F; } .tour-listing .tour-listing-content .icon-bookmark { padding: 0px 10px; cursor: pointer; } .tour-listing .tour-listing-content .icon-bookmark i { font-size: 20px; color: #44b774; } /* widget Counter -------------------------------------------------------------- */ .tf-counter { background-color: #FFFFFF; padding: 50px; border: 1px solid rgba(255, 255, 255, 0.17); border-radius: 23px; box-shadow: 0px 14px 40px 0px rgba(0, 0, 0, 0.03); position: relative; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; z-index: 1; } .tf-counter:hover::before { border: 1px dashed #44b774; } .tf-counter:hover .icon svg { transform: rotateY(-180deg); } .tf-counter::before { content: ""; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); width: 90%; height: 92%; border: 2px dashed rgba(0, 0, 0, 0.17); border-radius: 23px; } .tf-counter .icon { color: #177ec2; height: 75px; } .tf-counter .icon svg { transition: all 0.5s ease; } .tf-counter .number-counter { font-size: 30px; font-weight: 700; color: #44b774; line-height: 40px; position: relative; } .tf-counter .number-counter.percen::after { position: absolute; content: "%"; } .tf-counter .number-counter.plus::after { position: absolute; content: "+"; } .tf-counter .line { height: 3px; width: 50px; border: 1px dashed #44b774; display: inline-block; margin-top: 19px; margin-bottom: 3px; } .tf-counter .title-counter { font-size: 18px; font-weight: 600; line-height: 27px; color: #081E2A; } .counter-item { padding: 50px 20px 45px 20px; border: 1px solid #EDEEEE; } .counter-item span { font-size: 18px; font-weight: 500; line-height: 49px; color: #081E2A; } .counter-item .number-counter { font-size: 42px; font-weight: 700; line-height: 49px; color: #081E2A; } .counter-item .number-counter.plus { position: relative; } .counter-item .number-counter.plus::after { content: "+"; } .counter-item .number-counter.kare { position: relative; } .counter-item .number-counter.kare::after { content: "k"; } /* widget Destination -------------------------------------------------------------- */ .tf-widget-destination:hover .destination-imgae img { transform: scale(1.1); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-destination:hover .destination-content .nation { background-color: #177ec2; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-destination:hover .destination-content .btn-destination .btn-view { background-color: #44b774; color: #FFFFFF; } .tf-widget-destination .destination-imgae { position: relative; overflow: hidden; display: block; border-radius: 10px; } .tf-widget-destination .destination-imgae::before { background: linear-gradient(-180deg, rgba(0, 0, 0, 0), rgb(0, 0, 0)); content: ""; top: 0; left: 0; right: 0; bottom: 0; position: absolute; z-index: 2; } .tf-widget-destination .destination-imgae .tour { font-size: 14px; font-weight: 600; line-height: 16px; padding: 6px 25px 9px 24px; background-color: #177ec2; color: #FFFFFF; text-transform: uppercase; border-radius: 4px; display: inline-block; position: absolute; left: 15px; top: 13px; z-index: 2; } .tf-widget-destination .destination-imgae img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-destination .destination-content { background-color: #FFFFFF; border-radius: 8px; box-shadow: 0px 4px 21px 0px rgba(0, 0, 0, 0.06); margin-right: 14px; margin-left: 26px; margin-top: -40px; z-index: 2; position: relative; overflow: hidden; } .tf-widget-destination .destination-content .nation { max-width: 245px; width: 100%; font-size: 17px; font-weight: 600; line-height: 28.76px; color: #FFFFFF; background-color: #44b774; text-transform: capitalize; display: inline-block; padding: 4px 19px 9px 19px; margin-top: -1px; clip-path: polygon(0 0, 100% 0, 88% 100%, 0% 100%); } .tf-widget-destination .destination-content .btn-destination { padding: 14px 19px 18px 36px; } .tf-widget-destination .destination-content .btn-destination .title { font-size: 18px; font-weight: 500; line-height: 22.68px; color: #000000; text-transform: math-auto; } .tf-widget-destination .destination-content .btn-destination .btn-view { width: 45px; height: 45px; background-color: #F4F6F8; border-radius: 100%; color: #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-destination .destination-content .btn-destination .btn-view:hover { background-color: #177ec2; color: #FFFFFF; } .tf-widget-destination .destination-content .btn-destination .btn-view i { font-size: 8px; } .destination-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 66px; } .destination-tour { margin: 0 auto; } .destination-tour:hover .destination-image>img { transform: scale(1.2) rotate(1deg); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .destination-tour:hover .destination-image::before { visibility: visible; opacity: 0.37; z-index: 2; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .destination-tour .destination-image { width: 160px; height: 160px; position: relative; display: block; overflow: hidden; border-radius: 100%; } .destination-tour .destination-image img { border-radius: 100%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .destination-tour .destination-image::before { position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); content: ""; width: 110px; height: 110px; background-color: rgba(10, 4, 4, 0.83); border-radius: 100%; visibility: hidden; opacity: 0; } .destination-tour .destination-tour-list { position: relative; margin-top: -26px; } .destination-tour .destination-tour-list .tour { font-size: 16px; font-weight: 500; line-height: 27.7px; color: #081E2A; position: absolute; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .destination-tour .title-tour { font-size: 20px; line-height: 30px; font-weight: 600; color: #081E2A; text-transform: capitalize; margin-top: 19px; } .destination-style { border-radius: 7px; overflow: hidden; display: block; height: 100%; } .destination-style:hover>img { transform: scale(1.2) rotate(1deg); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .destination-style::before { background: linear-gradient(-180deg, rgba(0, 0, 0, 0), rgb(0, 0, 0)); top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; z-index: 1; } .destination-style>img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; object-fit: cover; height: 430px; } .destination-style .tour { font-size: 14px; font-weight: 600; line-height: 16px; color: #FFFFFF; background-color: #177ec2; text-transform: uppercase; padding: 10px 30px; border-radius: 4px; top: 14px; left: 12px; position: absolute; z-index: 2; } .destination-style .destination-content { bottom: 14px; right: 0; position: absolute; z-index: 2; width: 100%; text-align: center; } .destination-style .destination-content .travel { font-size: 17px; font-weight: 600; line-height: 30px; text-transform: capitalize; } .destination-style .destination-content p { font-size: 16px; font-weight: 400; line-height: 40px; } .destination-style1 .image .mask-ab { height: auto; } .destination-style1:hover .image .mask-ab { bottom: -10px; visibility: visible; opacity: 1; height: auto; } .destination-style1:hover .image>img { transform: scale(1.2) rotate(1deg); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .destination-style1 .image { overflow: hidden; display: block; border-radius: 10px; } .destination-style1 .image>img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; height: 300px; object-fit: cover; } .destination-style1 .image .mask-ab { position: absolute; right: 0px; bottom: -40px; visibility: hidden; opacity: 0; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .destination-grid-6 { display: grid; grid-template-columns: repeat(6, 1fr); gap: 30px; } /* widget Blog -------------------------------------------------------------- */ .tf-widget-blog:hover .blog-image>img { transform: scale(1.1); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-blog .blog-image { position: relative; overflow: hidden; display: block; } .tf-widget-blog .blog-image .category-blog { position: absolute; bottom: 0; right: 0; font-size: 12px; font-weight: 700; line-height: 22px; letter-spacing: 0.135em; color: #FFFFFF; text-transform: uppercase; padding: 7px 20px 7px 27px; background-color: #44b774; z-index: 1; } .tf-widget-blog .blog-image img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-blog .blog-image .admin { position: absolute; top: 15px; right: 16px; background-color: #FFFFFF; border-radius: 80px; } .tf-widget-blog .blog-image .admin:hover span { display: flex !important; transition: all 0.3s ease-out; } .tf-widget-blog .blog-image .admin img { width: 48px; height: 48px; border-radius: 100%; padding: 4px; } .tf-widget-blog .blog-image .admin span { font-size: 12px; font-weight: 600; line-height: 26px; color: #000000; margin-left: 12px; text-transform: uppercase; display: none; } .tf-widget-blog .blog-content { padding: 29px 45px 26px 66px; } .tf-widget-blog .blog-content .meta-list li { font-size: 14px; font-weight: 400; line-height: 17.68px; color: #081E2A; position: relative; } .tf-widget-blog .blog-content .meta-list li:not(:last-child) { margin-left: 44px; } .tf-widget-blog .blog-content .meta-list li i { color: #44b774; margin-left: 6px; } .tf-widget-blog .blog-content .entry-title { font-size: 24px; font-weight: 700; line-height: 33px; margin-top: 10px; margin-bottom: 12px; text-transform: inherit; } .tf-widget-blog .blog-content .des { font-size: 16px; font-weight: 400; line-height: 29px; margin-bottom: 13px; } .blog-style { border: 1px solid #EDEEEE; } .blog-style:hover { box-shadow: 0px 4px 22px 0px rgba(0, 0, 0, 0.11); } .blog-style .blog-content { padding: 29px 45px 26px 66px; } .blog-style .blog-content .meta-list { flex-wrap: wrap; } .blog-style .blog-content .meta-list li { font-size: 14px; font-weight: 400; line-height: 17.68px; color: #081E2A; position: relative; } .blog-style .blog-content .meta-list li:not(:last-child) { margin-left: 44px; } .blog-style .blog-content .meta-list li:not(:last-child)::before { position: absolute; content: ""; width: 9px; height: 1px; background-color: #081E2A; left: -34px; top: 50%; transform: translateY(-50%); } .blog-style .blog-content .meta-list li i { color: #44b774; margin-left: 6px; } .blog-style1 { box-shadow: 0px 4px 11px 0px rgba(0, 0, 0, 0.04); border: unset; } .blog-style1 .blog-content { padding: 25px 45px 46px 45px; position: relative; } .blog-style1 .blog-content .meta-list li:not(:last-child) { margin-left: 20px; } .blog-style1 .blog-content .meta-list li:not(:last-child)::before { content: unset; } .blog-style1 .blog-content .entry-title { font-size: 20px; line-height: 31px; margin-top: 21px; margin-bottom: 0px; text-transform: inherit; } .blog-style1 .blog-content .icon-link { height: 60px; width: 60px; border-radius: 100%; background-color: #44b774; color: #FFFFFF; bottom: -30px; position: absolute; opacity: 0; visibility: hidden; right: 40%; transform: translateX(50%); transition: all 0.3s ease-out; z-index: 1; } .blog-style1 .blog-content .icon-link:hover { background-color: #177ec2; } .blog-style1:hover .blog-content .icon-link { opacity: 1; visibility: visible; right: 50%; transform: translateX(50%); } .blog-style2 { border: unset; } .blog-style2:hover { box-shadow: unset; } .blog-style2 .blog-image { border-radius: 4px; } .blog-style2 .blog-image .category-blog { top: 13px; right: 12px; bottom: unset; border-radius: 4px; padding: 7px 15px 7px 21px; } .blog-style2 .blog-content { background-color: #44b774; margin-right: 21px; margin-left: 41px; margin-top: -102px; position: relative; border-radius: 4px; padding: 35px 36px 26px 9em; z-index: 1; } .blog-style2 .blog-content .meta-list li { color: rgba(255, 255, 255, 0.6); } .blog-style2 .blog-content .meta-list li:not(:last-child) { margin-left: 17px; } .blog-style2 .blog-content .meta-list li:not(:last-child)::before { content: unset; } .blog-style2 .blog-content .meta-list li i { color: #FFFFFF; font-size: 16px; } .blog-style2 .blog-content .entry-title { font-size: 22px; font-weight: 700; line-height: 35px; margin-top: 12px; margin-bottom: 16px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; color: #FFFFFF; } .blog-style2 .blog-content .entry-title a { color: #FFFFFF; } .blog-style2 .blog-content .entry-title a:hover { color: #177ec2; } .blog-style2 .blog-content .btn-read-more { color: #FFFFFF; } .blog-style2 .blog-content .btn-read-more:hover { color: #177ec2; } .blog-style2 .blog-content .btn-read-more i { margin-right: 5px; } .blog-style3:not(:last-child) { margin-bottom: 30px; } .blog-style3 .blog-image { border-radius: 4px; max-width: 229px; width: 100%; } .blog-style3 .blog-content { background-color: #FFFFFF; border-radius: 4px; box-shadow: 0px 3px 10px 0px rgba(57, 106, 191, 0.16); margin-right: -30px; padding: 24px 35px 18px 8em; z-index: 1; } .blog-style3 .blog-content .meta-list li:not(:last-child) { margin-left: 14px; } .blog-style3 .blog-content .meta-list li i { font-size: 18px; } .blog-style3 .blog-content .entry-title { font-size: 18px; font-weight: 700; line-height: 28px; margin-top: 11px; margin-bottom: 5px; text-transform: inherit; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; } .blog-style3 .blog-content .btn-read-more { font-size: 15px; font-weight: 500; line-height: 31px; font-family: "DM Sans", sans-serif; } .blog-style3 .blog-content .btn-read-more i { color: #44b774; } .blog-style4 { box-shadow: 0px 7px 16px 0px rgba(0, 0, 0, 0.04); } .blog-style4:hover .blog-content .button-link i::after { background-color: #44b774; } .blog-style4 .blog-content { padding: 32px 32px 32px 40px; } .blog-style4 .blog-content .meta-list li:not(:last-child) { margin-left: 24px; } .blog-style4 .blog-content .entry-title { font-size: 20px; font-weight: 600; line-height: 33px; margin-top: 17px; margin-bottom: 21px; text-transform: inherit; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; } .blog-style4 .blog-content .button-link { margin-right: 5px; } .blog-style4 .blog-content .button-link i { margin-right: 0px; transition: all 0.3s ease; } /* widget populer -------------------------------------------------------------- */ .tf-widget-populer { border-radius: 8px; overflow: hidden; box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.08); background-color: #FFFFFF; } .tf-widget-populer:hover .content .icon { background-color: #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-populer:hover .content .icon::before { border-top: 8px solid #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-populer .image { overflow: hidden; } .tf-widget-populer .image .mask-populer { position: absolute; bottom: -15px; right: 0; } .tf-widget-populer .content { padding: 47px 33px 45px 34px; } .tf-widget-populer .content .icon { width: 81px; height: 75px; background-color: #177ec2; border-radius: 5px; color: #FFFFFF; position: absolute; top: -32%; right: 50%; transform: translateX(50%); } .tf-widget-populer .content .icon:before { position: absolute; content: ""; width: 0; height: 0; border-right: 6px solid transparent; border-left: 6px solid transparent; border-top: 8px solid #177ec2; bottom: -8px; } .tf-widget-populer .content .icon i { font-size: 35px; } .tf-widget-populer .content .des-populer { font-size: 15px; font-weight: 400; line-height: 27.8px; color: #4F545A; } /* widget places -------------------------------------------------------------- */ .tf-widget-place:hover .content .price-place { color: #081E2A; background-color: #177ec2; } .tf-widget-place:hover .content .place-content { background-color: #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-place:hover .content .place-content .meta-place span, .tf-widget-place:hover .content .place-content .title-place a, .tf-widget-place:hover .content .place-content span { color: #FFFFFF; } .tf-widget-place:hover .content .place-content .icon, .tf-widget-place:hover .content .place-content i { color: #177ec2 !important; } .tf-widget-place .place-image { display: block; border-radius: 5px; overflow: hidden; } .tf-widget-place .place-image .feature { font-size: 14px; font-weight: 500; line-height: 14px; color: #FFFFFF; padding: 8px 20px; background-color: #44b774; border-radius: 4px; top: 8px; right: 7px; position: absolute; } .tf-widget-place .content { margin-top: -85px; margin-right: 16px; margin-left: 14px; z-index: 1; position: relative; transition: all 0.3s ease-in-out; } .tf-widget-place .content .price-place { color: #FFFFFF; background-color: #44b774; font-size: 15px; font-weight: 500; line-height: 18px; padding: 4px 22px 4px 54px; display: inline-block; clip-path: polygon(0 0, 90% 0, 100% 100%, 0% 100%); } .tf-widget-place .content .price-place .price { font-size: 14px; font-weight: 600; line-height: 18px; margin-right: 4.5px; } .tf-widget-place .content .place-content { background-color: #FFFFFF; box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.05); border-radius: 6px; padding: 15px 20px 23px 22px; margin-top: -10px; transition: all 0.3s ease-in-out; } .tf-widget-place .content .place-content .map { font-size: 14px; font-weight: 400; font-family: "DM Sans", sans-serif; color: #83827F; transition: all 0.3s ease-in-out; } .tf-widget-place .content .place-content .map i { margin-left: 5px; color: #44b774; } .tf-widget-place .content .place-content .title-place { font-size: 15px; line-height: 30px; text-transform: inherit; transition: all 0.3s ease-in-out; } .tf-widget-place .content .place-content .meta-place { flex-wrap: wrap; gap: 19px; transition: all 0.3s ease-in-out; } .tf-widget-place .content .place-content .meta-place li .icon { color: #44b774; margin-left: 8px; } .tf-widget-place .content .place-content .meta-place li span { font-size: 15px; font-weight: 500; color: #83827F; line-height: 22px; } /* widget clip text -------------------------------------------------------------- */ .clip-text { font-size: 105px; font-weight: 800; line-height: 89px; text-align: center; text-transform: uppercase; margin-top: -10px; margin-bottom: -5px; } @supports (background-clip: text) or (-webkit-background-clip: text) { .clip-text { color: transparent; -webkit-background-clip: text; background-image: url(../../assets/images/page/clip-text.jpg); background-size: cover; background-position: center; } } /* widget icon box -------------------------------------------------------------- */ .icon-box-style1 { border: 1px solid rgba(224, 224, 224, 0.28); box-shadow: 0px 8px 25px 0px rgba(0, 0, 0, 0.06); padding: 49px 41px 49px 41px; transition: all 0.3s ease-in-out; overflow: hidden; } .icon-box-style1:hover::before, .icon-box-style1:hover::after { opacity: 1; visibility: visible; transition: all 0.3s; left: 0; bottom: 0; } .icon-box-style1:hover::after { left: 0; top: 0; } .icon-box-style1::before { position: absolute; bottom: -50px; right: 0; left: -50px; content: ""; clip-path: polygon(100% 0, 0% 100%, 100% 100%); background: linear-gradient(-180deg, rgba(45, 138, 6, 0.1), rgb(49, 132, 14)); height: 238px; opacity: 0; visibility: hidden; z-index: 1; transition: all 0.6s ease-in-out; } .icon-box-style1::after { position: absolute; left: -50px; top: -50px; content: ""; clip-path: polygon(100% 0, 4% 100%, 100% 66%); background: #428E22; height: 212px; width: 98px; opacity: 0; visibility: hidden; z-index: 1; transition: all 0.3s ease-in-out; } .icon-box-style1 .icon { margin-bottom: 24px; } .icon-box-style1 .icon i { font-size: 55px; } .icon-box-style1 .des-icon { margin-bottom: 38px; } .icon-box-style1 .icons-link { font-size: 14px; font-weight: 600; line-height: 17.64px; letter-spacing: 0.05em; color: #44b774; font-family: "Noto Sans Arabic", sans-serif; } .icon-box-style1 .icons-link:hover { color: #177ec2 !important; } .icon-box-style1 .icons-link i { font-size: 10px; margin-right: 10px; } .icon-box-style1 .title-icon { margin-bottom: 23px; } .icon-box-style2 { padding: 32px 38px 30px 40px; overflow: hidden; } .icon-box-style2:hover::before { top: 0; } .icon-box-style2:hover { background-color: transparent !important; } .icon-box-style2::before { transition: all 0.3s ease-in-out; width: 100%; height: 100%; position: absolute; right: 0; left: 0; top: -100%; background-color: #44b774; content: ""; } .icon-box-style2 .icon { margin-left: 29px; margin-top: 6px; position: relative; } /* .icon-box-style2 .icon::before { position: absolute; content: ""; width: 25px; height: 25px; border-radius: 100px; background-color: #177ec2; right: -8px; top: -2px; z-index: 1; } */ .icon-box-style2 .icon i { font-size: 44px; position: relative; z-index: 2; } .icon-box-style2 .title-icon { margin-bottom: 12px; } .icon-box-style2 .des-icon { text-transform: inherit !important; } .icon-box-style3 .icon { color: #44b774; margin-bottom: 12px; height: 50px; } .icon-box-style3 .des { line-height: 30px; } .icon-box-style-4 .icon { width: 65px; flex-shrink: 0; height: 65px; border-radius: 100%; background-color: #FFFFFF; box-shadow: 0px 4px 13px 0px rgba(0, 0, 0, 0.1); color: #44b774; margin-left: 17px; } .icon-box-style-4 .content .des { line-height: 30px; } .icon-box-style5 { padding: 40px 40px; } .icon-box-style5 .icon { color: #44b774; margin-left: 13px; } .icon-box-style5 .text { font-size: 16px; font-weight: 600; color: #FFFFFF; font-family: "Noto Sans Arabic", sans-serif; } .icon-box-style5 .des { font-size: 16px; font-weight: 400; color: #4F545A; line-height: 30.8px; margin-top: 18px; } .icon-box-style7 .image { width: auto; } .icon-box-style7 .title { font-size: 18px; font-weight: 700; line-height: 33px; color: #081E2A; margin-right: 15px; font-family: "Noto Sans Arabic", sans-serif; } .icon-box-style7 .des { font-size: 15px; font-weight: 400; line-height: 26px; } .cheackmark:hover .icon { background-color: #44b774; color: #FFFFFF; box-shadow: unset; } .cheackmark .icon { width: 65px; flex-shrink: 0; height: 65px; background-color: #FFFFFF; border-radius: 100%; box-shadow: 0px 4px 13px 0px rgba(0, 0, 0, 0.1); color: #44b774; font-size: 40px; transition: all 0.3s ease-in-out; } .cheackmark .content { margin-right: 18px; } .icon-box-style6 .icon { color: #44b774; font-size: 40px; display: inline-block; z-index: 2; height: 40px; margin-bottom: 23px; } /* .icon-box-style6 .icon::before { width: 22px; height: 22px; border-radius: 100%; background-color: #177ec2; position: absolute; content: ""; top: -4px; right: -10px; z-index: 1; } */ .icon-box-style6 .content .title-icon { margin-bottom: 8px; } .icon-box-style6 .content .des-icon { line-height: 30px; } .tf-icon-box { background-color: #FFFFFF; border-radius: 8px; } .tf-icon-box:hover { background-color: #44b774; transition: all 0.3s; } .tf-icon-box:hover .icon, .tf-icon-box:hover .des-icon, .tf-icon-box:hover .icons-link, .tf-icon-box:hover .title-icon a { color: #FFFFFF; z-index: 2; position: relative; transition: all 0.3s; } .tf-icon-box .icon { color: #44b774; } .tf-icon-box .des-icon { font-size: 16px; font-weight: 400; line-height: 30px; color: #4F545A; text-transform: capitalize; } /* widget Testimonial -------------------------------------------------------------- */ .widget-testimonial .testimonial-content .profile .name { font-size: 29px; line-height: 31px; letter-spacing: -0.02em; margin-bottom: 4px; } .widget-testimonial .testimonial-content .profile .job { display: inline-block; font-size: 18px; font-weight: 500; line-height: 31px; letter-spacing: -0.02em; } .widget-testimonial .testimonial-content .tes { font-size: 29px; font-weight: 700; line-height: 57px; color: #081E2A; text-transform: capitalize; letter-spacing: -0.02em; } .widget-testimonial .testimonial-content .line { width: 50px; height: 4px; position: relative; display: inline-block; background-color: #44b774; border-radius: 2px; margin-top: 31px; margin-bottom: 17px; } .widget-testimonial .testimonial-content .icon-tes { width: 92px; height: 86px; background-color: #FFFFFF; border: 1px solid rgba(122, 134, 151, 0.15); position: absolute; bottom: -19%; left: 11%; } .widget-testimonial .testimonial-content .icon-tes i { font-size: 27px; color: #44b774; } .widget-testimonial .testimonial-image .avata { width: auto !important; cursor: pointer; } .widget-testimonial .testimonial-image .avata img { width: 65px; height: 65px; border-radius: 100%; } .widget-testimonial .testimonial-image .swiper-slide { border-radius: 100%; border: 3px solid #FFFFFF; box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.06); } .widget-testimonial .testimonial-image .swiper-slide-thumb-active { border: 3px solid #44b774; } .widget-testimonial-style2 { padding: 60px 75px 60px 50px; background-color: #FFFFFF; box-shadow: 0px 13px 32px 0px rgba(0, 0, 0, 0.02); } .widget-testimonial-style2::before { position: absolute; content: ""; height: 70%; width: 5px; background-color: #44b774; border-radius: 13px; right: 0; top: 50%; transform: translateY(-50%); } .widget-testimonial-style2::after { position: absolute; content: ""; width: 0; height: 0; border-top: 10px solid transparent; border-right: 20px solid #44b774; border-bottom: 10px solid transparent; right: 0; top: 50%; transform: translateY(-50%); } .widget-testimonial-style2 .image { margin-left: 21px; } .widget-testimonial-style2 .image img { width: 70px; height: 70px; border-radius: 100%; } .widget-testimonial-style2 .profile .job { font-size: 16px; font-weight: 600; line-height: 37px; color: #44b774; display: inline-block; } .widget-testimonial-style2 .icon-tes { color: #44b774; } .widget-testimonial-style2 .icon-tes i { font-size: 42px; } .widget-testimonial-style2 .des { font-size: 17px; font-weight: 500; line-height: 35px; padding-left: 50px; } .widget-testimonial-style2 .mask-tes { position: absolute; left: 0; bottom: 0; width: auto; } .widget-testimonial-style3 .testimonial-content .profile .name { margin-bottom: 7px; } .widget-testimonial-style3 .testimonial-content .profile .job { display: inline-block; font-size: 20px; font-weight: 500; line-height: 36px; letter-spacing: -0.02em; } .widget-testimonial-style3 .testimonial-content .tes { font-size: 35px; font-weight: 700; line-height: 60px; color: #081E2A; text-transform: capitalize; letter-spacing: 0em; } .widget-testimonial-style3 .testimonial-content .line { margin-top: 40px; margin-bottom: 23px; } .widget-testimonial-style3 .testimonial-image2 .avata { width: auto !important; cursor: pointer; margin: 0 11px; } .widget-testimonial-style3 .testimonial-image2 .avata img { width: 65px; height: 65px; border-radius: 100%; } .widget-testimonial-style3 .testimonial-image2 .swiper-slide { border-radius: 100%; border: 3px solid #FFFFFF; box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.06); } .widget-testimonial-style3 .testimonial-image2 .swiper-wrapper { justify-content: center; } .widget-testimonial-style3 .testimonial-image2 .line { width: 50px; height: 4px; position: relative; display: inline-block; background-color: #44b774; border-radius: 2px; margin-top: 31px; margin-bottom: 17px; } .widget-testimonial-style3 .testimonial-image2 .swiper-slide-thumb-active { border: 3px solid #44b774; } .widget-testimonial-style4 .des { font-size: 28px; font-weight: 400; line-height: 46px; padding-bottom: 45px; margin-bottom: 60px; border-bottom: 1px solid #EDEEEE; } .widget-testimonial-style4 .image-avata { margin-left: 19px; } .widget-testimonial-style4 .image-avata img { width: 72px; height: 72px; border-radius: 100%; border: 5px solid #FFFFFF; } .widget-testimonial-style4 .content-testimonial .job { font-size: 18px; font-weight: 400; font-family: "DM Sans", sans-serif; } .widget-testimonial-style5 .des { font-size: 24px; font-weight: 500; line-height: 46px; color: #081E2A; margin-bottom: 52px; letter-spacing: -0.7px; } .widget-testimonial-style5 .image-avata { margin-left: 19px; } .widget-testimonial-style5 .image-avata img { width: 79px; width: 79px; border-radius: 100%; border: 6px solid #FFFFFF; } .widget-testimonial-style5 .start { margin-left: 6em; } .widget-testimonial-style5 .start i { color: #44b774; } /* widget Team -------------------------------------------------------------- */ .tf-widget-team:hover .team-image .social-team { opacity: 1; visibility: visible; right: -16px; } .tf-widget-team:hover .team-image::before { opacity: 1; visibility: visible; rotate: -3deg; transition: all 0.3s; } .tf-widget-team .team-image { position: relative; z-index: 2; } .tf-widget-team .team-image::before { width: 100%; height: 100%; top: -15px; left: -16px; position: absolute; content: ""; border: 2px dashed #44b774; border-radius: 13px; rotate: 0deg; z-index: 1; opacity: 0; visibility: hidden; } .tf-widget-team .team-image img { border-radius: 13px; position: relative; z-index: 2; } .tf-widget-team .team-image .social-team { padding: 16px 17px; background-color: #44b774; display: inline-block; text-align: center; position: absolute; right: -30px; top: 50%; transform: translateY(-50%); z-index: 3; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-team .team-image .social-team::before { position: absolute; top: -9px; right: 0px; content: ""; width: 0; height: 0; border-bottom: 10px solid #44b774; border-right: 16px solid transparent; } .tf-widget-team .team-image .social-team::after { position: absolute; top: 52%; transform: translateY(-50%); left: -15px; content: ""; width: 0; height: 0; border-bottom: 18px solid #44b774; border-left: 15px solid transparent; } .tf-widget-team .team-image .social-team li:not(:last-child) { margin-bottom: 12px; } .tf-widget-team .team-image .social-team a { color: #FFFFFF; } .tf-widget-team .team-image .social-team a:hover { color: #177ec2; } .tf-widget-team .team-content .job { font-size: 15px; font-weight: 500; color: #44b774; line-height: 24px; margin-bottom: 6px; } /* widget Gallery -------------------------------------------------------------- */ .grid-gallery { display: grid; grid-gap: 20px; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(6, 118.33px); } .item-1 { grid-row: 1/3; grid-column: 1/2; } .item-2 { grid-row: 1/4; grid-column: 2/4; } .item-3 { grid-row: 1/5; grid-column: 4/4; } .item-4 { grid-row: 3/7; grid-column: 1/2; } .item-5 { grid-row: 4/7; grid-column: 2/4; } .item-6 { grid-row: 5/7; grid-column: 4/4; } .item-1 .tf-gallery .btn-gallery, .item-6 .tf-gallery .btn-gallery { width: 55px; height: 55px; } .item-1 .tf-gallery .btn-gallery i, .item-6 .tf-gallery .btn-gallery i { font-size: 15px; } .item-1 .tf-gallery .gallery-content, .item-6 .tf-gallery .gallery-content { position: absolute; bottom: 20px; } .item-1 .tf-gallery .gallery-content .gallery-title, .item-6 .tf-gallery .gallery-content .gallery-title { font-size: 18px; line-height: 26px; } .item-1 .tf-gallery .gallery-content .sub-title, .item-6 .tf-gallery .gallery-content .sub-title { font-size: 14px; line-height: 18px; } .item-3 .tf-gallery .btn-gallery, .item-4 .tf-gallery .btn-gallery { width: 85px; height: 85px; } .item-3 .tf-gallery .btn-gallery i, .item-4 .tf-gallery .btn-gallery i { font-size: 20px; } .tf-gallery { position: relative; overflow: hidden; border-radius: 6px; height: 100%; } .tf-gallery img { height: 100%; object-fit: cover; } .tf-gallery:hover .btn-gallery { opacity: 1; visibility: visible; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-gallery:hover .gallery-content { opacity: 1; visibility: visible; right: 30px; -webkit-transform: translateX(0px); transform: translateX(0px); } .tf-gallery::before { top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; background: linear-gradient(-180deg, rgba(0, 0, 0, 0), rgb(0, 0, 0)); } .tf-gallery .btn-gallery { width: 110px; height: 110px; color: #FFFFFF; background-color: #44b774; border-radius: 100%; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); cursor: pointer; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; z-index: 1; transition: transform 1000ms ease; } .tf-gallery .btn-gallery:hover { background-color: #177ec2; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-gallery .btn-gallery i { font-size: 30px; } .tf-gallery .gallery-content { position: absolute; right: 0px; bottom: 40px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-gallery .gallery-content .gallery-title { font-size: 24px; line-height: 30px; } .tf-gallery .gallery-content .sub-title { font-size: 16px; font-weight: 500; line-height: 20px; color: rgba(255, 255, 255, 0.6); } /* widget Image Box -------------------------------------------------------------- */ .tf-adventure .adventure-image { margin-left: 19px; display: inline-block; } .tf-adventure .adventure-image img { width: 94px; border-radius: 9px; } .tf-adventure .adventure-image .tour-ad { font-size: 14px; font-weight: 400; display: block; line-height: 16px; } .tf-adventure .adventure-image .title-ad { font-size: 16px; font-weight: 600; line-height: 27px; } .tf-adventure .adventure-image .price-ad { font-size: 14px; font-weight: 600; } .image-box-tesimonial { max-width: 327px; width: 100%; background-color: #FFFFFF; box-shadow: 0px 4px 26px 0px rgba(0, 0, 0, 0.07); padding: 16px 17px 80px 17px; } .tf-image-box:hover .image img { transform: scale(1.1); } .tf-image-box .image { overflow: hidden; margin-bottom: 16px; display: block; } .tf-image-box .image img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } /* Box Tour -------------------------------------------------------------- */ .box-tour-select-wrap { background-color: #FFFFFF; border-radius: 14px; padding: 39px 37px; box-shadow: 0px 3px 30px 0px rgba(0, 0, 0, 0.05); display: grid; grid-template-columns: repeat(5, 1fr); gap: 30px; } .box-tour-select-item { border: 1px solid #EDEEEE; border-radius: 6px; padding: 29px 20px 42px 20px; transition: all 0.3s ease-in-out; overflow: hidden; position: relative; } .box-tour-select-item:before { width: 100%; height: 100%; position: absolute; content: ""; background-color: #44b774; right: 0; top: -100%; left: 0; transition: all 0.3s ease-in-out; } .box-tour-select-item:hover .icon, .box-tour-select-item:hover .content .title, .box-tour-select-item:hover .content .price, .box-tour-select-item:hover .content i { color: #FFFFFF; } .box-tour-select-item:hover .content i { rotate: 34deg; } .box-tour-select-item:hover::before { top: 0; } .box-tour-select-item:hover .content .tour { background-color: #FFFFFF; color: #44b774; } .box-tour-select-item .icon { color: #44b774; font-size: 63px; height: 77px; margin-bottom: 16px; z-index: 2; position: relative; } .box-tour-select-item .content .title { font-size: 20px; font-weight: 600; line-height: 27px; color: #081E2A; margin-bottom: 20px; } .box-tour-select-item .content .tour { font-size: 15px; font-weight: 500; padding: 5px 17px; line-height: 15px; background-color: #44b774; border-radius: 15px; color: #FFFFFF; display: inline-block; margin-bottom: 38px; } .box-tour-select-item .content .price { font-size: 16px; font-weight: 700; line-height: 29px; color: #081E2A; } .box-tour-select-item .content i { font-size: 45px; color: #44b774; position: absolute; left: 1%; bottom: 18%; transition: all 0.3s ease-in-out; } /* Faq -------------------------------------------------------------- */ .faq-list .accordion-item { border: unset !important; border-radius: unset; background-color: #FFFFFF; box-shadow: 0 4px 21px 0px rgba(0, 0, 0, 0.08); } .faq-list .accordion-item:not(:last-child) { margin-bottom: 22px; } .faq-list .accordion-button { padding: 22px 35px 22px 35px; color: #081E2A; font-size: 18px; font-weight: 700; flex-grow: 1; text-transform: capitalize; } .faq-list .accordion-button:hover { background-color: #FFFFFF; } .faq-list .accordion-button:not(.collapsed) { color: #081E2A; background-color: #FFFFFF; box-shadow: unset; } .faq-list .accordion-body { padding: 0px 36px 35px 81px; color: #4F545A; font-size: 15px; font-weight: 400; line-height: 29px; } .faq-list .icon { width: 46px; height: 44px; background-color: #44b774; clip-path: polygon(100% 0, 0% 100%, 100% 100%); position: absolute; bottom: 0; left: 0; } /* Count Down -------------------------------------------------------------- */ .count-down .countdown__timer { display: flex; gap: 20px; } .count-down .countdown__timer .countdown__item { display: flex; flex-direction: column; align-items: center; } .count-down .countdown__timer .countdown__item .countdown__value { font-size: 16px; font-weight: 700; line-height: 23px; color: #44b774; width: 60px; height: 60px; background: #FFFFFF; border-radius: 100%; display: flex; justify-content: center; align-items: center; } .count-down .countdown__timer .countdown__item .countdown__label { font-size: 14px; font-weight: 700; line-height: 23px; text-transform: uppercase; color: #081E2A; margin-top: 7px; } .tab-list .nav-link { font-size: 14px; font-weight: 600; line-height: 18.9px; letter-spacing: 0.03em; color: #081E2A; padding: 10px 22px; background-color: #FFFFFF; border-radius: 10px; border: 1px solid #44b774; margin: 0 7px; position: relative; transition: all 0.3s ease; min-width: 134px; } .tab-list .nav-link::before { position: absolute; content: ""; width: 0; height: 0; border-right: 7px solid transparent; border-left: 5px solid transparent; border-top: 7px solid #44b774; bottom: -7px; right: 50%; transform: translateX(50%); transition: all 0.2s ease; opacity: 0; } .tab-list .nav-link:hover { background-color: #44b774; color: #FFFFFF; } .tab-list .nav-link:hover::before { position: absolute; content: ""; width: 0; height: 0; border-right: 7px solid transparent; border-left: 7px solid transparent; border-top: 7px solid #44b774; bottom: -7px; right: 50%; transform: translateX(50%); transition: all 0.2s ease; opacity: 1; } .tab-list .nav-link.active { background-color: #44b774; color: #FFFFFF; } .tab-list .nav-link.active::before { position: absolute; content: ""; width: 0; height: 0; border-right: 7px solid transparent; border-left: 7px solid transparent; border-top: 7px solid #44b774; bottom: -7px; right: 50%; transform: translateX(50%); opacity: 1; } .nav-tabs-activities { padding-left: 1.5em; } .nav-tabs-activities .nav-item .nav-link { font-size: 18px; font-weight: 700; line-height: 27px; color: #081E2A; background-color: #FFFFFF; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 25px 22px 28px 22px; border: 1px solid #EDEEEE; border-radius: 8px; max-width: 214px; width: 100%; margin: 0px 8.5px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .nav-tabs-activities .nav-item .nav-link:hover, .nav-tabs-activities .nav-item .nav-link.active { background-color: #44b774; color: #FFFFFF; position: relative; } .nav-tabs-activities .nav-item .nav-link:hover::before, .nav-tabs-activities .nav-item .nav-link.active::before { content: ""; position: absolute; width: 0; height: 0; border-right: 15px solid transparent; border-left: 15px solid transparent; border-top: 17px solid #44b774; bottom: -17px; right: 50%; transform: translateX(50%); } .nav-tabs-activities .nav-item .nav-link:hover .icon, .nav-tabs-activities .nav-item .nav-link.active .icon { color: #FFFFFF; } .nav-tabs-activities .nav-item .nav-link:hover .icon { color: #FFFFFF; } .nav-tabs-activities .nav-item .nav-link .icon { color: #44b774; height: 66px; margin-bottom: 15px; } .nav-tabs-activities .nav-item .nav-link .icon i { font-size: 50px; } .nav-tabs-adventure .nav-link { font-size: 18px; font-weight: 600; line-height: 27px; color: #081E2A; padding: 0px 0px 17px 0px; border-bottom: 1px solid #EDEEEE; cursor: pointer; } .nav-tabs-adventure .nav-link:not(:last-child) { margin-left: 43px; } .nav-tabs-adventure .nav-link i { font-size: 40px; color: #44b774; margin-left: 15px; } .nav-tabs-adventure .nav-link:hover, .nav-tabs-adventure .nav-link.active { background-color: transparent; border-bottom: 1px solid #44b774; } .tab-top-destination .nav-item:not(:last-child) { margin-left: 20px; } .tab-top-destination .nav-item .nav-link { padding: 5px 15px 12px 15px; border-radius: 10px; color: #081E2A; font-size: 16px; font-weight: 600; line-height: 27px; background-color: transparent; } .tab-top-destination .nav-item .nav-link i { font-size: 30px; color: #44b774; margin-left: 10px; position: relative; top: 5px; } .tab-top-destination .nav-item .nav-link:hover, .tab-top-destination .nav-item .nav-link.active { background-color: #44b774; color: white; } .tab-top-destination .nav-item .nav-link:hover i, .tab-top-destination .nav-item .nav-link.active i { color: #FFF; } .tab-terms-condition .nav-pills { padding: 50px 30px 70px 22px; margin-left: 56px; max-width: 429px; width: 100%; } .tab-terms-condition .nav-pills .nav-link { font-size: 16px; font-weight: bold; color: #4F545A; padding: 15px 25px; text-align: right; border-right: 2px solid transparent; } .tab-terms-condition .nav-pills .nav-link:hover, .tab-terms-condition .nav-pills .nav-link.active { background-color: #FFFFFF; color: #081E2A; border-right: 2px solid #44b774; } .tab-terms-condition .tab-content { width: 100%; } .tab-tour-single { background-color: #FFFFFF; padding: 10px 13px; border-radius: 47px; box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.05); margin-top: -47px; } .tab-tour-single .nav-link { font-size: 16px; font-weight: 600; line-height: 20px; padding: 26px 34px; border-radius: 47px; color: #081E2A; background-color: transparent; } .tab-tour-single .nav-link:hover, .tab-tour-single .nav-link.active { background-color: #F4F6F8; } .tab-tour-single .nav-link i { color: #44b774; margin-left: 14px; font-size: 20px; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font: inherit; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } /* Elements -------------------------------------------------------------- */ html { margin-left: 0 !important; } * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: "Noto Sans Arabic", sans-serif; font-size: 16px; line-height: 30.8px; font-weight: 400; color: #4F545A; background-color: #FFFFFF; } img { width: 100%; height: auto; } .row { margin-left: -15px; margin-right: -15px; } ul, li { list-style-type: none; margin-bottom: 0; padding-right: 0; list-style: none; } .center { text-align: center; } .tf-container { max-width: 1320px; width: 100%; margin: auto; padding-right: 15px; padding-left: 15px; } .tf-container.w-1456 { max-width: 1475px; width: 100%; margin: auto; padding-right: 15px; padding-left: 15px; } .tf-container.full { max-width: 100%; width: 100%; margin: auto; padding-right: 0px; padding-left: 0px; } .bg-main { background-color: #1D231F; } label { font-size: 15px; font-weight: 600; line-height: 16px; color: rgb(34, 34, 34); margin-bottom: 15px; } textarea, input[type=text], input[type=password], input[type=datetime], input[type=datetime-local], input[type=date], input[type=month], input[type=time], input[type=week], input[type=number], input[type=email], input[type=url], input[type=search], input[type=tel], input[type=color] { border: 1px solid #EDEEEE; outline: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; line-height: 16px; font-size: 16px; font-weight: 500; border-radius: 8px; padding: 20px 17px 20px 17px; width: 100%; background: transparent; color: #4F545A; } textarea::placeholder, input[type=text]::placeholder, input[type=password]::placeholder, input[type=datetime]::placeholder, input[type=datetime-local]::placeholder, input[type=date]::placeholder, input[type=month]::placeholder, input[type=time]::placeholder, input[type=week]::placeholder, input[type=number]::placeholder, input[type=email]::placeholder, input[type=url]::placeholder, input[type=search]::placeholder, input[type=tel]::placeholder, input[type=color]::placeholder { color: #4F545A; line-height: 16px; font-size: 16px; font-weight: 500; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } textarea:focus, input[type=text]:focus, input[type=password]:focus, input[type=datetime]:focus, input[type=datetime-local]:focus, input[type=date]:focus, input[type=month]:focus, input[type=time]:focus, input[type=week]:focus, input[type=number]:focus, input[type=email]:focus, input[type=url]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=color]:focus { border: 1px solid #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } /* Placeholder color */ ::-webkit-input-placeholder { color: #8A8AA0; } :-moz-placeholder { color: #8A8AA0; } ::-moz-placeholder { color: #8A8AA0; opacity: 1; } /* Since FF19 lowers the opacity of the placeholder by default */ :-ms-input-placeholder { color: #8A8AA0; } /* Typography -------------------------------------------------------------- */ h1, h2, h3, h4, h5, h6 { font-family: "Noto Sans Arabic", sans-serif; text-rendering: optimizeLegibility; color: #081E2A; text-transform: capitalize; } h1 { font-size: 65px; line-height: 82px; font-weight: 700; } h2 { font-size: 50px; line-height: 60px; font-weight: 800; } h3 { font-size: 26px; line-height: 44.2px; font-weight: 600; } h4 { font-size: 22px; line-height: 30px; font-weight: 700; } h5 { font-size: 20px; line-height: 25.2px; font-weight: 700; } h6 { font-size: 16px; line-height: 30px; font-weight: 700; } p { font-family: "Noto Sans Arabic", sans-serif; } /* Extra classes -------------------------------------------------------------- */ .msg-success { background: linear-gradient(to left, #E250E5, #4B50E6, #E250E5); background-clip: text; -webkit-background-clip: text; font-weight: 700; background-size: 200% 200%; animation: rainbow 2s ease-in-out infinite; color: rgba(0, 0, 0, 0); transition: color 0.2s ease-in-out; font-size: 18px; font-weight: 400; line-height: 28px; } label.error { color: red; } .text-white { color: #FFFFFF; } .text-24 { font-size: 14px; font-weight: 400; line-height: 24px; } .shaw-box { padding: 50px; margin: -50px; } .flex { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .flex-one { justify-content: space-between; display: flex; } .flex-two { justify-content: space-between; align-items: center; display: flex; } .flex-three { display: flex; align-items: center; } .flex-five { display: flex; justify-content: center; align-items: center; } .flex-six { display: flex; justify-content: flex-end; align-items: center; } .center, .text-center { text-align: center; } .text-end { text-align: end; } .absolute { position: absolute; } .relative { position: relative; } .flex-none { flex: none !important; } .text-t { text-transform: capitalize; } .text-u { text-transform: uppercase; } .text-unset { text-transform: unset !important; } .text-line { text-decoration-line: underline !important; } .justify-center { justify-content: center; } .justify-end { justify-content: end; } .justify-space { justify-content: space-between; } .flex-wrap { flex-wrap: wrap; } .align-center { align-items: center; } .text-end { text-align: end; } .font-italic { font-style: italic; } .al-i-end { align-items: flex-end; } #wrapper { position: relative; overflow: hidden; max-width: 100%; height: 100%; } .wrapper-style { background: #FAF8FF; } .z-index1 { z-index: 1; } .z-index3 { z-index: 3; } .z-index4 { z-index: 4; } button { border: none; font-family: "Noto Sans Arabic", sans-serif; } button:hover { background-color: #177ec2; transition: all 0.3s; border: unset; } button[type=submit]:hover { background-color: #44b774; transition: all 0.3s; border: unset; } button, input[type=submit] { font-family: "Noto Sans Arabic", sans-serif; border: unset; padding: 20px 60px; font-size: 16px; font-weight: 500; line-height: 20px; text-transform: capitalize; color: #FFFFFF; background-color: #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; cursor: pointer; } button:hover, input[type=submit]:hover { background-color: #177ec2; transition: all 0.3s; border: unset; } .fs-28-46 { font-size: 28px; font-weight: 400; line-height: 46px; display: inline-block; } .mt-40 { margin-top: 40px; } .pd-main { padding: 50px 0; } .pb-60 { padding-bottom: 60px; } .m0-auto { margin: 0 auto; } .mb-10 { margin-bottom: 10px; } .mb-15 { margin-bottom: 15px; } .mb-18 { margin-bottom: 18px !important; } .mb-22 { margin-bottom: 22px; } .mb-25 { margin-bottom: 25px; } .mb-30 { margin-bottom: 30px; } .mb-32 { margin-bottom: 32px; } .mb-37 { margin-bottom: 37px; } .mb-40 { margin-bottom: 40px; } .mb-43 { margin-bottom: 43px; } .mb-45 { margin-bottom: 45px; } .mb-50 { margin-bottom: 50px; } .mb-60 { margin-bottom: 60px; } .mb-70 { margin-bottom: 70px; } .mb-75 { margin-bottom: 75px; } .mb-80 { margin-bottom: 80px; } .mb--93 { margin-bottom: -93px; } .mb--7em { margin-bottom: -7.6em; } .mb--14em { margin-bottom: -14em; } .mb--20em { margin-bottom: -20em; } .mb--25em { margin-bottom: -25em; } .mt--50 { margin-top: -50px; } .mt--60 { margin-top: -60px; } .mt--82 { margin-top: -82px; } .pt-25 { padding-top: 25px; } .pt-35 { padding-top: 35px; } .pt-115 { padding-top: 115px; } .mt-20 { margin-top: 20px; } .mt-27 { margin-top: 27px; } .mt-35 { margin-top: 35px; } .mt-44 { margin-top: 44px; } .mt-53 { margin-top: 53px; } .pb-150 { padding-bottom: 150px; } .pr-256 { padding-left: 256px !important; } .lh-32 { line-height: 32px; } .box-sd { box-shadow: 0px 4px 21px 0px rgba(0, 0, 0, 0.07); } .text-white { color: #FFFFFF; } .text-gray { color: #B6C2D4; } .text-black { color: #081E2A; } .text-second { color: #177ec2; } .text-main { color: #44b774 !important; } .font-yes { font-family: "Yesteryear", sans-serif; } .overflow-hidden { overflow: hidden; } .relative { position: relative; } .fs-italic { font-style: italic; } .tour1 { color: #177ec2; } .tour2 { color: #17FBC4; } .tour3 { color: #FB4E17; } .tour4 { color: #17E0FB; } .tour5 { color: #F617FB; } .tour6 { color: #FB1717; } .bg-part-gray { background-color: #EEE9E9; } .bg-part-blue { background-color: #E0F4F3; } .bg-1 { background-color: #F4F6F8; } .bg-2 { background-color: #177ec2 !important; } .bg-3 { background-color: #1D231F; } .bg-4 { background-color: #F3F8F6; } .bg-white { background-color: #FFFFFF; } /* Custom radio buttons */ input[type=radio]+label { display: inline-block; cursor: pointer; position: relative; padding-right: 30px; margin-left: 15px; font-size: 15px; font-weight: 400; } input[type=radio]+label:before { content: ""; display: block; width: 20px; height: 20px; margin-left: 14px; position: absolute; top: -3px; right: 0; border: 1px solid #EDEEEE; background-color: #FFFFFF; border-radius: 50%; } input[type=radio] { display: none !important; display: inline; } input[type=radio]:checked+label:after { content: ""; display: block; position: absolute; top: 1px; right: 4px; width: 12px; height: 12px; border-radius: 50%; background: #44b774; } /* Custom checkbox */ input[type=checkbox]+label { display: inline-block; cursor: pointer; position: relative; padding-right: 30px; margin-left: 15px; font-size: 13px; font-weight: bold; } input[type=checkbox]+label:before { content: ""; display: block; width: 17px; height: 17px; margin-left: 14px; position: absolute; top: 0px; right: 0; border: 1px solid #83827F; } input[type=checkbox] { display: none !important; display: inline; } input[type=checkbox]:checked+label:after { content: "\e9c7"; font-family: "icomoon"; font-size: 10px; line-height: 20px; color: #FFFFFF; background-color: #44b774; display: block; position: absolute; top: 0px; right: 0px; width: 17px; height: 17px; padding-right: 4px; } .mobile-menu { position: fixed; right: 0; top: 0; width: 300px; padding-left: 30px; max-width: 100%; height: 100%; visibility: hidden; z-index: 999999; } .mobile-menu .nav-logo { position: relative; background: #FFF; box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.08); padding: 12px 20px; } .mobile-menu .nav-logo img { max-width: 123px; } .mobile-menu .bottom-canvas { padding: 20px; } .mobile-menu-visible { overflow: hidden; } .mobile-menu-visible .mobile-menu { visibility: visible; } .mobile-menu-visible .mobile-menu .menu-backdrop { opacity: 1; visibility: visible; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .mobile-menu-visible .mobile-menu .menu-box { right: 0px; -webkit-overflow-scrolling: touch; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: ease; transition-timing-function: ease; } .mobile-menu .menu-backdrop { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; background: rgba(0, 0, 0, 0.5); transition: all 0.3s ease 0s; visibility: hidden; opacity: 0; } .mobile-menu .menu-box { position: absolute; right: -300px; top: 0px; width: 100%; height: 100%; max-height: 100%; overflow-y: auto; background-color: #FFF; z-index: 5; border-radius: 0px; -webkit-overflow-scrolling: touch; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: ease; transition-timing-function: ease; } .close-btn { position: fixed; left: 16px; top: 25px; line-height: 30px; width: 30px; text-align: center; font-size: 16px; color: #FFFFFF; cursor: pointer; transition: all 0.3s ease; z-index: 9999999999; opacity: 0; visibility: hidden; } .close-btn::before { content: "\e986"; font-family: "icomoon"; font-size: 10px; font-weight: bold; } .bottom-canvas .menu-outer .collapse { display: block; } .mobile-menu-visible .close-btn { visibility: visible; opacity: 1; } .mobile-menu .close-btn:hover { opacity: 0.5; } .mobile-menu .navigation { position: relative; display: block; width: 100%; } .mobile-menu .navigation li { position: relative; display: block; } .mobile-menu .navigation li { position: relative; display: block; } .mobile-menu .navigation li>ul>li:last-child { border-bottom: none; } .mobile-menu .navigation li.dropdown2 .dropdown2-btn { position: absolute; left: 0px; top: 0px; width: 100%; text-align: end; line-height: 44px; cursor: pointer; z-index: 5; } .mobile-menu .navigation li.dropdown2 .dropdown2-btn::before { content: "\e905"; font-family: "icomoon"; font-size: 14px; color: #FFFFFF; } .mobile-menu .navigation li.dropdown2>ul li a { border-bottom: unset; } .mobile-menu .navigation li.dropdown2 .dropdown2-btn span { opacity: 0; } .mobile-menu .navigation li>ul, .mobile-menu .navigation li>ul>li>ul { display: none; background: #081E2A; padding: 15px 20px; border-radius: 10px; } .mobile-menu .navigation li>ul>li, .mobile-menu .navigation li>ul>li>ul>li { margin-bottom: 0; } .mobile-menu .navigation li>ul>li>a, .mobile-menu .navigation li>ul>li>ul>li>a { padding: 7px 0px !important; font-size: 14px !important; font-weight: 500; } .mobile-menu .navigation li>ul>li>ul { padding-right: 15px; } .mobile-menu .navigation li>ul>li>ul>li>a { padding-right: 40px; } .mobile-menu .close-btn:hover { opacity: 0.5; } .mobile-menu .navigation li>ul>li:last-child { border-bottom: none; } .mobile-menu .navigation li>a { position: relative; display: block; font-weight: 600; line-height: 24px; padding: 10px 0px; font-size: 15px; color: #000; text-transform: capitalize; } .mobile-menu .navigation li:hover>a, .mobile-menu .navigation li.current>a { color: #44b774; } .mobile-button { display: none; text-transform: capitalize; color: #FFFFFF; cursor: pointer; } .mobile-button i { font-size: 25px; color: #081E2A; padding: 5px; } .main-header.header-style3.is-fixed.is-fixed.is-small { background-color: rgb(33, 38, 34); } .mobile-menu .login-box { border-bottom: 1px solid #EDEEEE; padding-bottom: 20px; margin-bottom: 20px; } .mobile-menu .login-box svg { margin-left: 5px; } .mobile-menu .menu-outer { margin-bottom: 20px; } .mobile-menu .button-mobi-sell .sc-button { display: block; } .main-header .mobile-menu .menu-box .mCSB_scrollTools { width: 3px; } .header-lower.is-fixed.is-small { top: 0px; margin: 0 !important; opacity: 1; visibility: visible; background-color: #FFFFFF; } .header-lower.is-fixed { padding-right: 225px; padding-left: 225px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; z-index: 999; opacity: 0; position: fixed; top: -150px; right: 0; width: 100%; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1), inset 0px 1px 0px #ECECEC; } .header-style1 .header-top { padding-left: 157px; padding-right: 210px; background-color: #045c96; } .header-style1 .header-top .header-top-right ul li i { color: #FFFFFF; } .header-style1 .header-top .header-top-right ul li span { color: #FFFFFF; } .header-style1 .header-top .header-top-left .booking { color: #FFFFFF; } .header-style1 .header-top .header-top-left .follow-social span { color: #FFFFFF; } .header-style1 .header-top .header-top-left .follow-social ul { background-color: #177ec2; padding: 9px 30px; } .header-style1 .header-top .header-top-left .follow-social ul li a:hover { color: #FFFFFF; } .header-style1 .header-lower { padding-right: 50px; padding-left: 50px; } .mobile-auth-buttons a { /* color: white; */ display: block; margin-bottom: 10px; } .mobile-auth-buttons a i, .mobile-auth-buttons svg:not(:host).svg-inline--fa, .mobile-auth-buttons svg:not(:root).svg-inline--fa { color: #44B774 !important; } .header-style1 .header-lower .logo-box { /* clip-path: polygon(0 0, 79% 0, 100% 100%, 0% 100%); background: #081E2A; */ min-height: 100%; padding: 0px 40px 0px 35px; } .header-style1 .header-lower .main-menu .navigation>li>a { padding: 38px 0px; } .header-style1 .header-lower .header-account .search-mobie { margin: 0px 20px; } .header-style1 .header-lower .header-account .icon-bar-header a { color: #081E2A; background-color: #177ec2; padding: 20px; border-radius: 5px; display: inline-block; font-size: 22px; } .header-style1 .header-lower .header-account .icon-bar-header a:hover { background-color: #44b774; color: #FFFFFF; } .header-style2 .header-top { padding-right: 199px; padding-left: 302px; padding-top: 15px; padding-bottom: 15px; background-color: #44b774; } .header-style2 .header-top .mask-header3 { position: absolute; right: 0; left: 0; } .header-style2 .header-top .header-top-left .follow-social ul { background-color: transparent; padding: 0px 0px; } .header-style2 .header-top .header-top-left .follow-social ul li a { color: #FFFFFF; } .header-style2 .header-top .header-top-left .follow-social ul li a:hover { color: #177ec2; } .header-style2 .header-top .header-top-right ul li { color: #FFFFFF; } .header-style2 .header-top .header-top-right ul li i { color: #FFFFFF; } .header-style2 .header-lower { padding-right: 201px; padding-left: 306px; } .header-style2 .header-account .search-mobie { margin: 0px 20px; } .header-style2 .header-account .icon-bar-header a { color: #FFFFFF; background-color: #44b774; padding: 20px; border-radius: 5px; display: inline-block; font-size: 20px; } .header-style2 .header-account .icon-bar-header a:hover { background-color: #177ec2; color: #FFFFFF; } .header-style3 { position: absolute; background-color: transparent; } .header-style3 .header-top { padding-right: 0px; margin: 5px 0px 9px 0px; background-color: transparent; } .header-style3 .header-top .header-top-right ul li { color: #FFFFFF; } .header-style3 .header-top .header-top-left { background-color: #44b774; clip-path: polygon(4% 0%, 100% 0, 100% 100%, 0% 100%); padding: 5px 43px 5px 50px; } .header-style3 .header-top .header-top-left .follow-social ul { background-color: transparent; padding: 0px 0px; } .header-style3 .header-top .header-top-left .follow-social ul li a { color: #FFFFFF; } .header-style3 .header-top .header-top-left .follow-social ul li a:hover { color: #177ec2; } .header-style3 .header-top .header-top-left .menu-right-top { margin-left: 33px; } .header-style3 .header-top .header-top-left .menu-right-top li:not(:last-child) { margin-left: 24px; } .header-style3 .header-top .header-top-left .menu-right-top li a { font-size: 14px; font-weight: 500; line-height: 17px; color: #FFFFFF; } .header-style3 .header-top .header-top-left .menu-right-top li a:hover { color: #177ec2; } .header-style3 .header-lower { background-color: #FFFFFF; padding-right: 0px; padding-left: 38px; } .header-style3 .header-lower .logo-box { background-color: #212622; clip-path: polygon(0% 0%, 92% 0%, 100% 50%, 92% 100%, 0% 100%); padding: 29px 18px 29px 61px; } .header-style3 .header-lower .header-account { gap: 44px; } .header-style3 .header-lower .search-mobie a { padding: 15px; background-color: #EFEFEF; color: #081E2A; border-radius: 100%; display: inline-flex; } .header-style3 .header-lower .search-mobie a i { font-size: 15px; } .header-style3 .header-lower .address-wrap-right .icon { color: #44b774; width: 32px; height: 32px; border: 1px solid #44b774; border-radius: 100%; margin-left: 16px; } .header-style3 .header-lower .address-wrap-right .content span { font-size: 14px; font-weight: 700; line-height: 17px; display: inline-block; color: #081E2A; text-transform: uppercase; } .header-style3 .header-lower .address-wrap-right .content p { font-size: 15px; font-weight: 500; line-height: 18px; color: #44b774; } /* button --------------------------------------------------*/ .button-link { font-size: 14px; font-weight: 700; line-height: 22px; text-transform: uppercase; letter-spacing: 0.18em; color: #081E2A; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .button-link i { font-size: 9px; margin-right: 17px; position: relative; } .button-link i::before { position: relative; z-index: 2; } .button-link i::after { position: absolute; content: ""; width: 30px; height: 30px; border-radius: 100%; border: 1px solid #EDEEEE; left: -8px; top: 50%; transform: translateY(-50%); z-index: 1; } .button-link:hover { color: #081E2A; } @keyframes scaleUp { 0% { transform: scale(1); } 50% { transform: scale(0.95); } 100% { transform: scale(1); } } .btn-main-small { font-size: 15px; font-weight: 600; line-height: 18.9px; letter-spacing: 0.05em; text-transform: uppercase; color: #FFFFFF; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; border-radius: 5px; padding: 20px 26px; background-color: #44b774; display: inline-block; } .btn-main-small i { font-size: 14px; margin-right: 12px; font-weight: 700; } .btn-main-small:hover { background-color: #177ec2; color: #FFFFFF; } .sc-button { font-size: 15px; font-weight: 500; line-height: 26px; color: #FFFFFF; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; border-radius: 12px; background-color: #44b774; padding: 13px 37px; } .sc-button:hover { background-color: #44b774; color: #FFFFFF; } .sc-button i { margin-right: 5px; } .btn-read-more { font-size: 16px; font-weight: 500; line-height: 31px; } .btn-read-more:hover i { margin-right: 12px; } .btn-read-more i { transition: all 0.3s ease; margin-right: 7px; } .get-call { font-size: 15px; font-weight: 600; line-height: 18.9px; letter-spacing: 0.05em; text-transform: uppercase; padding: 23px 36px; background-color: #FFFFFF; color: #44b774; display: inline-block; border-radius: 5px; text-align: center; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .get-call:hover { background-color: #177ec2; color: #FFFFFF; } .view-all { font-size: 12px; font-weight: 600; line-height: 18.9px; text-transform: uppercase; } .view-all i { color: #44b774; margin-right: 10px; } .btn-main { display: inline-flex; align-items: center; gap: 10px; padding: 8px 24px; border-radius: 5px; border: none; overflow: hidden; background: #44b774; color: #FFFFFF; text-align: center; } .btn-main p { color: white !important; } .btn-main:hover { background-color: #177ec2; } .btn-main:hover .btn-main-text { color: #FFFFFF; transform: translateX(0px); } .btn-main:hover .iconer { color: #FFFFFF; transform: translateX(0px); opacity: 1; } .btn-main .btn-main-text { transform: translateX(-15px); font-size: 15px; font-weight: 600; line-height: 18.9px; letter-spacing: 0.05em; text-transform: uppercase; transition-duration: 0.3s; } .btn-main .iconer { transform: translateX(15px); transition-duration: 0.3s; opacity: 0; } /*----------------------breadcumb--------------------*/ .breadcumb-section { padding: 0px 0px 70px 0px; /* background-image: url(../../assets/images/page/breakcrumb.jpg); */ position: relative; background-position: center; background-repeat: no-repeat; background-size: cover; } .breadcumb-section::before { position: absolute; content: ""; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(-262deg, rgba(0, 0, 0, 0.33), rgba(4, 29, 11, 0.89)); } .breadcumb-section .title { color: #FFFFFF; margin-top: 20px; font-size: 22px; font-weight: 600; } .breadcumb-section .breadcumb-list li { font-size: 18px; font-weight: 400; line-height: 22.68px; position: relative; } .breadcumb-section .breadcumb-list li a { color: #44b774; margin-left: 30px; } .breadcumb-section .breadcumb-list li a::before { position: absolute; font-family: "icomoon"; left: 10px; content: "\e9da"; color: #FFFFFF; font-size: 8px; } .breadcumb-section .breadcumb-list li span { color: #FFFFFF; } .breadcumb-section .bcrumb-ab { position: absolute; right: 7%; width: auto; top: 40%; } /*----------------------Blog--------------------*/ .side-blog { margin-left: 5px; margin-bottom: 56px; } .side-blog:hover .post-thumbnail img { transform: scale(1.1); } .side-blog .blog-image { position: relative; overflow: hidden; margin-bottom: 34px; } .side-blog .blog-image .list-categories { position: absolute; top: 20px; right: 20px; z-index: 2; } .side-blog .blog-image .list-categories .new { font-size: 20px; font-weight: 600; line-height: 25px; padding: 14px 22px; background-color: #44b774; border-radius: 5px; color: #FFFFFF; display: inline-block; width: 82px; text-align: center; } .side-blog .blog-image .list-categories .new:hover { background-color: #177ec2; } .side-blog .blog-image .post-thumbnail img { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .side-blog .top-detail-info ul li { font-size: 15px; font-weight: 500; line-height: 18.9px; color: #83827F; position: relative; } .side-blog .top-detail-info ul li:not(:last-child) { margin-left: 33px; } .side-blog .top-detail-info ul li:not(:last-child)::before { position: absolute; content: ""; width: 10px; height: 1px; background-color: #83827F; top: 50%; transform: translateY(-50%); left: -23px; } .side-blog .top-detail-info ul li i { color: #44b774; font-size: 17px; margin-left: 7px; } .side-blog .top-detail-info ul li a { color: #83827F; } .side-blog .blog-content .entry-title { margin-top: 19px; margin-bottom: 19px; } .side-blog .blog-content .description { margin-bottom: 39px; line-height: 33px; } .side-blog-single { margin-bottom: 0px; } .side-blog-single .image { margin-bottom: 29px; } .side-blog-single .entry-title { font-size: 30px; font-weight: 700; line-height: 44.2px; margin-top: 25px; margin-bottom: 24px; } .side-blog-single .blockquote-blog { padding: 38px 35px 23px 10em; background-color: #F4F6F8; position: relative; } .side-blog-single .blockquote-blog p { font-size: 21px; font-weight: 700; line-height: 43px; margin-bottom: 25px; } .side-blog-single .blockquote-blog .quote-title { font-size: 16px; font-weight: 500; line-height: 20.16px; padding-right: 30px; position: relative; } .side-blog-single .blockquote-blog .quote-title::before { position: absolute; content: ""; width: 17px; height: 2px; background-color: #000000; right: 0; top: 50%; transform: translateY(-50%); } .side-blog-single .blockquote-blog i { position: absolute; bottom: 13%; left: 5%; font-size: 40px; color: #44b774; } .side-blog-single-content { max-width: 900px; margin: auto; } .side-blog-single-content .ux-content h3.title { font-size: 27px; font-weight: 600; line-height: 53px; color: #000000; } .side-blog-single-content .ux-content .icon-listing li:not(:last-child) { margin-bottom: 21px; } .side-blog-single-content .ux-content .icon-listing li i { font-size: 12px; background-color: #FFFFFF; border-radius: 100%; padding: 9px 8px; color: #44b774; box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.09); display: inline-block; margin-left: 6px; margin-right: 5px; } .side-blog-single-content .ux-content .icon-listing li span { font-size: 16px; font-weight: bold; line-height: 20px; color: #4F545A; font-family: "Noto Sans Arabic", sans-serif; } .side-blog-single-content .ux-content img { width: 297px; } .side-blog-single-content .share-blog { padding-top: 64px; padding-bottom: 46px; border-bottom: 1px solid #EDEEEE; flex-wrap: wrap; } .side-blog-single-content .share-blog .tag-blog .tag li { margin-bottom: 0; } .side-blog-single-content .share-blog .tag-blog .tag li a { border: 1px solid #EDEEEE; text-transform: uppercase; } .side-blog-single-content .share-blog .social-blog .social a { color: #081E2A; background-color: #F4F6F8; border-radius: unset; } .side-blog-single-content .share-blog .social-blog .social a i { font-size: 13px; } .side-blog-single-content .share-blog .social-blog .social a:hover { background-color: #44b774; color: #FFFFFF; } .side-blog-single-content .share-blog span { font-size: 20px; font-weight: 500; line-height: 30px; color: #000000; margin-left: 15px; } .comment-single { padding-top: 48px; padding-bottom: 62px; } .comment-single h3.title { font-size: 27px; font-weight: 600; line-height: 53px; color: #000000; } .comment-single .comment-blog { padding-left: 4em; } .comment-single .comment-blog .avata img { width: 70px; border-radius: 100%; } .comment-single .comment-blog .content { padding-right: 44px; } .comment-single .comment-blog .content .info .date { font-size: 12px; font-weight: 500; line-height: 22px; letter-spacing: 0.05em; color: #B4B4B4; text-transform: uppercase; } .comment-single .comment-blog .content .repply i { font-size: 28px; color: #000000; } .comment-single .comment-blog .des { margin-top: 12px; line-height: 29px; } .form-comment { background-color: #F4F6F8; padding: 60px 50px 80px 50px; } .side-bar-right { padding-right: 33px; } .sidebar-widget { padding: 20px 30px; background-color: rgb(248, 248, 248); border: 1px solid rgb(248, 248, 248); ; border-radius: 10px; } .sidebar-widget:not(:last-child) { margin-bottom: 31px; } .sidebar-widget .block-heading { text-transform: capitalize; padding-right: 15px; position: relative; margin-bottom: 22px; color: #000000; } .sidebar-widget .block-heading::before { position: absolute; content: ""; height: 100%; width: 2px; background-color: #44b774; right: 0; } .sidebar-widget .profile-widget { margin-top: 33px; margin-bottom: 33px; } .sidebar-widget .profile-widget .avata { width: 100px; height: 100px; border-radius: 100%; margin-bottom: 17px; } .sidebar-widget .profile-widget .name { font-size: 16px; font-weight: 700; text-transform: uppercase; line-height: 20.16px; margin-bottom: 12.58px; } .sidebar-widget .profile-widget .job { font-size: 14px; font-weight: 400; line-height: 17.64px; color: #83827F; margin-bottom: 18.98px; display: block; } .sidebar-widget .profile-widget .des { font-weight: 400; line-height: 28.8px; margin-bottom: 26px; } .sidebar-widget .profile-widget .social { justify-content: center; } .sidebar-widget .profile-widget .social li a { color: #83827F; width: 42px; height: 37px; border: 1px solid #EDEEEE; border-radius: unset; } .sidebar-widget .profile-widget .social li a i { font-size: 10px; } .sidebar-widget .profile-widget .social li a:hover { background-color: #44b774; color: #FFFFFF; } .sidebar-widget .recent-post-list .list-recent:not(:last-child) { margin-bottom: 32px; } .sidebar-widget .recent-post-list .list-recent .recent-image img { width: 102px; } .sidebar-widget .recent-post-list .list-recent .recent-info { padding-right: 24px; } .sidebar-widget .recent-post-list .list-recent .recent-info .date i { color: #44b774; margin-left: 5px; } .sidebar-widget .recent-post-list .list-recent .recent-info .date span { font-size: 15px; font-weight: 500; line-height: 26px; } .sidebar-widget .recent-post-list .list-recent .recent-info .title { font-size: 15px; font-weight: 500; line-height: 25.8px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; } .sidebar-widget .category-blog li:not(:last-child) { margin-bottom: 21px; } .sidebar-widget .category-blog li a { padding: 14px 16px; background-color: #FFFFFF; border: 1px solid #EDEEEE; border-radius: 2px; color: #4F545A; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .sidebar-widget .category-blog li a:hover { background-color: #44b774; color: #FFFFFF; } .sidebar-widget .category-blog li a span { font-size: 16px; font-weight: 500; line-height: 26px; } .sidebar-widget .category-confidence li:not(:last-child) { margin-bottom: 22px; } .sidebar-widget .category-confidence li i { color: #44b774; font-size: 25px; margin-left: 12px; } .sidebar-widget .category-confidence li span { font-size: 16px; font-weight: 500; line-height: 30px; color: #4F545A; } .sidebar-widget-single .booking-style-1 .mask-banner-part { position: relative; } .home-packages a.view-all { text-align: left; font-size: 15px; display: block; margin-left: 0 !important; margin-top: 10px; } .banner-part.home-packages .item { box-shadow: 0 0 3px #d7d6d6; border-radius: 10px; margin-bottom: 10px; background: white; } .banner-part.home-packages .item h3 { font-size: 16px; padding: 10px 10px 3px; margin: 0; line-height: 1; } .banner-part.home-packages .item p { padding: 5px 10px 10px; margin-top: 0; font-size: 13px; font-weight: 600; color: #4a4646; } .sidebar-widget-single .booking-style-1 .price-banner-part { top: 50%; right: 15%; } .bg-blog-h4 { width: 100%; height: 400px; position: absolute; right: 0; left: 0; bottom: 0; } /*----------------------Video--------------------*/ .widget-image-video { position: relative; } .widget-image-video .widget-icon-video { position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .travel-video { padding: 20px 0px 0px 35px; } .travel-video .mask-video { position: absolute; right: -12.5%; bottom: -5%; width: auto; } .travel-video .mask-enjoy { bottom: 2%; right: 25%; width: auto; position: absolute; } .travel-video .widget-icon-video { position: absolute; top: 47%; right: 41%; transform: translate(50%, -50%); } .travel-video .image-video { margin: 0px -20px -14px 0px; } .video-h4-widget { padding-top: 168px; padding-bottom: 65px; background-image: url(../../assets/images/page/video1.jpg); background-position: center; background-repeat: no-repeat; background-attachment: fixed; background-size: cover; border-radius: 18px; display: flex; flex-direction: column; align-items: center; } .video-h4-widget::before { top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; background: linear-gradient(-180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.64)); z-index: 1; } .video-h4-widget .video-box { width: 138px; height: 134px; background-color: #44b774; border-radius: 25px; rotate: 45deg; } .video-h4-widget .video-box i { color: #FFFFFF; font-size: 30px; rotate: -45deg; } .video-h4-widget .text-video { font-size: 121px; font-weight: 400; line-height: 121px; margin-top: 46px; } /*----------------------call-to-action--------------------*/ .callt-to-action { background-color: #44b774; border-radius: 7px; padding: 35px 39px 39px 39px; position: relative; } .callt-to-action .callt-to-action-content .image { margin-left: 43px; } .callt-to-action .callt-to-action-content .image img { width: 74px; } .callt-to-action .callt-to-action-content .content .title-call { font-size: 36px; font-weight: 700; line-height: 45px; color: #FFFFFF; margin-bottom: 10px; } .callt-to-action .callt-to-action-content .content .des { font-size: 18px; font-weight: 400; line-height: 32px; font-family: "DM Sans", sans-serif; color: rgba(255, 255, 255, 0.52); text-transform: capitalize; } .callt-to-action .shape-ab { position: absolute; width: auto; left: 22%; -webkit-animation: anime-rorate 8s infinite; animation: anime-rorate 8s infinite; } .callt-to-action .mask-cta { position: absolute; right: 0; left: 0; bottom: -16%; } .widget-banner-contact { background-image: url(../../assets/images/page/bg3.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } .widget-banner-contact::before { content: ""; top: 0; left: 0; right: 0; bottom: 0; position: absolute; background: linear-gradient(-90deg, rgb(4, 27, 40), rgba(2, 15, 22, 0.55), rgba(0, 0, 0, 0)); } .widget-banner-contact address { margin-right: 34px; font-size: 20px; font-weight: 600; line-height: 26px; color: #FFFFFF; padding: 16px 34px; border: 1px solid rgba(255, 255, 255, 0.4); border-radius: 66px; } .widget-banner-contact address a { color: #FFFFFF; } .widget-banner-contact .mask-icon-banner { position: absolute; right: 52%; bottom: 23%; width: auto; animation: dot-anim-2 3s linear 0s infinite alternate; } .widget-banner-contact .image-banner-contact { margin-right: 38px; } .widget-banner-contact .content-banner-contact { padding-top: 93px; padding-bottom: 50px; } /*----------------------About Us--------------------*/ .inner-content-about { padding-right: 6px; } .inner-content-about .btn-wrap-about { margin-top: 37px; gap: 40px; flex-wrap: wrap; } .inner-content-about .btn-wrap-about .profile .image img { width: 56px; height: 56px; border-radius: 100%; border: 4px solid #FFFFFF; box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15); } .inner-content-about .btn-wrap-about .profile .content { margin-right: 20px; } .inner-content-about .btn-wrap-about .profile .content img { width: auto; } .inner-content-about .btn-wrap-about .profile .content span { display: block; font-size: 14px; font-weight: 500; line-height: 24px; } .inner-content-about .map-check .icon { color: #44b774; margin-left: 14px; } .inner-content-about .map-check span { font-size: 16px; font-weight: 700; line-height: 30px; } .about-us-h2 .mask1-about { width: auto; position: absolute; left: 0; top: 0; animation: dot-anim-3 3s linear 0s infinite alternate; } .about-us-h2 .mask2-about { width: auto; position: absolute; left: -10%; bottom: 12%; animation: move-full-left-right 20s infinite linear; } @keyframes move-full-left-right { 0% { transform: translateX(0); } 100% { transform: translateX(100vw); /* move to left edge */ } } .about-us-h2 .image-about-us { padding-left: 3.5em; padding-top: 17px; } .image-about-us .image-main { margin-bottom: -10px; } .image-about-us .mask1 { width: auto; position: absolute; top: 11%; right: -47px; animation: dot-anim-3 3s linear 0s infinite alternate; } .image-about-us .mask2 { width: auto; position: absolute; left: 13%; top: 12.3%; animation: dot-anim-2 3s linear 0s infinite alternate; } .about-us-h2 .content-about-us { padding-right: 4px; margin-top: -4px; } .about-us-h2 .content-about-us .pl-about { padding-right: 9px; } .about-us-h2 .content-about-us .icon-box-style-4:not(:last-child) { margin-bottom: 50px; } .about-us-h2 .content-about-us .about-us-list { margin-top: 10px; margin-right: 20px; margin-left: 45px; } .about-us-h2 .content-about-us .about-us-list li { padding: 11px 26px; background-color: #FFFFFF; border-radius: 26px; box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.07); transition: all 0.3s ease-in-out; } .about-us-h2 .content-about-us .about-us-list li:not(:last-child) { margin-bottom: 33px; } .about-us-h2 .content-about-us .about-us-list li:hover { background-color: #44b774; } .about-us-h2 .content-about-us .about-us-list li:hover .number, .about-us-h2 .content-about-us .about-us-list li:hover .experience { color: #FFFFFF; } .about-us-h2 .content-about-us .about-us-list li .number { font-size: 24px; font-weight: 700; line-height: 30px; margin-left: 10px; color: #44b774; } .about-us-h2 .content-about-us .about-us-list li .experience { font-size: 14px; font-weight: 600; color: #081E2A; } .about-us-h3 { background-color: #212622; padding-top: 245px; padding-bottom: 119px; } .about-us-h3 .about-us-h3-image { padding-right: 28px; padding-left: 71px; } .about-us-h3 .about-us-h3-image .image-explore { border-radius: 14px; } .about-us-h3 .about-us-h3-image .about-vector { position: absolute; top: -1%; right: -5%; rotate: -24deg; } .about-us-h3 .about-us-h3-image .about-vector .icon { color: #44b774; } .about-us-h3 .about-us-h3-image .about-vector span { font-size: 33px; font-weight: 400; line-height: 33.8px; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .about-us-h3 .about-us-h3-image p { font-size: 17px; font-weight: 600; margin-top: 22px; padding-bottom: 15px; border-bottom: 1px dashed #2E3830; } .about-us-h3 .about-us-h3-content { padding-right: 14px; margin-top: -5px; } .about-us-h3 .about-us-h3-content .ranger-suport { font-size: 18px; font-weight: 600; line-height: 33px; text-transform: capitalize; } .about-us-h3 .about-us-h3-content .list-icon li:not(:last-child) { margin-bottom: 12px; } .about-us-h3 .about-us-h3-content .list-icon li i { color: #44b774; margin-left: 7px; } .about-us-h3 .about-us-h3-content .about-wrap { gap: 44px; flex-wrap: wrap; } .about-us-h4 { padding-top: 103px; padding-bottom: 128px; } .about-us-h4 .image-about-h4-wrap { margin-left: 5.5em; padding-right: 13px; padding-top: 23px; } .about-us-h4 .image-about-h4-wrap .about-wrap-left { max-width: 372px; width: 100%; } .about-us-h4 .image-about-h4-wrap .about-wrap-left .quote { font-size: 20px; font-weight: 700; color: #FFFFFF; background-color: #44b774; padding: 20px 26px; clip-path: polygon(100% 0, 100% 50%, 100% 100%, 0% 100%, 5% 50%, 0% 0%); top: 31.7%; right: -41%; rotate: -90deg; position: absolute; } .about-us-h4 .image-about-h4-wrap .about-wrap-right { max-width: 349px; width: 100%; position: absolute; top: 31.5%; left: 0; } .about-us-h4 .image-about-h4-wrap .image-about-item .shape-about-h4 { position: absolute; bottom: -20px; right: 0; left: 0; } .about-us-h4 .image-about-h4-wrap .box-year { background-color: #FFFFFF; padding: 32px 34px 25px 34px; display: inline-block; border: 2px dashed #EDEEEE; position: absolute; bottom: -17.5%; right: 29%; animation: dot-anim-3 3s linear 0s infinite alternate; } .about-us-h4 .image-about-h4-wrap .box-year .number { font-size: 50px; font-weight: 700; line-height: 25px; color: #44b774; } .about-us-h4 .image-about-h4-wrap .box-year p { font-size: 17px; font-weight: 500; line-height: 25px; color: #081E2A; } .about-us-h4 .inner-content-about { padding-right: 17px; } .about-us-h5 .image { margin-right: -1.5em; padding-bottom: 26px; background-color: #44b774; } .about-us-h5 .image .about-vector { position: absolute; left: 13px; bottom: 66px; z-index: 1; transform: rotate(-334deg); } .about-us-h5 .image .about-vector span { font-size: 33px; font-weight: 400; line-height: 32px; position: absolute; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .about-us-h5 .image .mask-image-bottom { position: absolute; bottom: 0; color: #44b774; right: 0; left: 0; } .about-us-h5 .content { padding-top: 3.7em; padding-right: 6.2em; padding-left: 2em; } .about-us-h5 .content .ranger-suport { font-size: 18px; font-weight: 600; line-height: 33px; text-transform: capitalize; } .about-us-h5 .content .list-icon li:not(:last-child) { margin-bottom: 12px; } .about-us-h5 .content .list-icon li i { color: #44b774; margin-left: 7px; } .about-us-h5 .content .list-icon li span { text-transform: capitalize; } .about-us-h5 .content .about-wrap { gap: 44px; } .about-us-archieve { background-color: #FFFFFF; } .about-us-archieve .bg-archieve-about { background-color: #F4F6F8; width: 100%; height: 40%; position: absolute; right: 0; left: 0; top: 0; z-index: 1; } /*----------------------Tour Package--------------------*/ .tour-package { background-color: #F3F8F6; background-image: url(../../assets/images/page/bg1.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .tour-package2 { padding-top: 120px; } .tour-package2 .tour-package-swipper-wrap .swiper-button-next { left: -7% !important; } .tour-package2 .tour-package-swipper-wrap .swiper-button-prev { right: -7% !important; } .tour-package2 .tour-link { width: 120px; height: 120px; border-radius: 100%; background: #44b774; font-size: 15px; font-weight: 500; color: #FFFFFF; text-transform: uppercase; letter-spacing: 0.05em; flex-direction: column; } .tour-package2 .tour-link:hover { background-color: #177ec2; } .tour-package2 .tour-link i { display: block; } .tour-package2 .line { position: absolute; content: ""; width: 100%; height: 1px; border: 1px dashed #DCDCDC; right: 0; left: 0; top: 50%; transform: translateY(-50%); z-index: 0; } .w-text-heading { max-width: 600px; width: 100%; } .offer-package .feature-ofer { width: auto; height: -webkit-fill-available; left: 0; top: 0; bottom: 0; position: absolute; z-index: 1; } .offer-package .content { padding-left: 4em; } .offer-package .content .title-heading { margin-left: -4em; line-height: 51px; } .offer-package .content .inner-content { margin-bottom: 15px; } .offer-package .content .inner-content .offer { padding: 43px 25px 12px 25px; border-radius: 7px; border-bottom: 3px solid #44b774; background-color: #FFFFFF; text-align: center; } .offer-package .content .inner-content .offer .number { font-size: 52px; font-weight: 700; color: #44b774; line-height: 8px; } .offer-package .content .inner-content .offer .number span { font-size: 18px; text-transform: capitalize; } .offer-package .content .inner-content p { font-size: 18px; font-weight: 600; line-height: 30px; color: #081E2A; margin-right: 42px; } .offer-package .content .count-dow-wrap .title-counters { margin-left: 45px; } .offer-package .content .count-dow-wrap .title-counters span { font-size: 23px; font-weight: 600; color: #081E2A; } .offer-package .content .count-dow-wrap .title-counters p { font-size: 14px; font-weight: 500; line-height: 30px; color: #4F545A; } .offer-package .on-week-swipper-wrap { margin-left: -4em; margin-top: 7em; } /*----------------------Activities--------------------*/ .tf-widget-activities .mask-top { position: absolute; top: 0; right: 0; width: auto; z-index: 1; } .mask-bottom { position: absolute; bottom: 0; right: -10px; width: auto; z-index: 1; -webkit-animation: toRightFromLeft 15s infinite; animation: toRightFromLeft 20s infinite; } @keyframes toRightFromLeft { 0% { transform: translateX(30%); opacity: 1; } 100% { transform: translateX(-100vw); /* opacity: 0; */ } } .tf-widget-activities .tabs-activities-content { background-color: #44b774; border-radius: 8px; padding: 16px 16px 0px 10em; margin-left: 4em; margin-right: 5em; } .tf-widget-activities .tabs-activities-content .activities-image img { width: 370px; margin-right: -6em; border-radius: 8px; } .tf-widget-activities .tabs-activities-content .activities-content { padding: 38px 55px; } .tf-widget-activities .tabs-activities-content .activities-content .icon-activitis { width: 123px; height: 123px; border-radius: 100%; background-color: rgba(1, 6, 4, 0.1); color: #FFFFFF; } .tf-widget-activities .tabs-activities-content .activities-content .icon-activitis:hover { rotate: 45deg; } .tf-widget-activities .tabs-activities-content .activities-content .icon-activitis i { font-size: 40px; } .tf-widget-activities .tabs-activities-content .activities-content .title-activitis { font-size: 27px; line-height: 33px; } .tf-widget-activities .tabs-activities-content .activities-content .icon-list-wrap:not(:last-child) { margin-left: 30px; } .tf-widget-activities .tabs-activities-content .activities-content .icon-list-wrap .icon { font-size: 36px; } .tf-widget-activities .tabs-activities-content .activities-content .icon-list-wrap .icon-lists { font-size: 16px; font-weight: 600; margin-right: 17px; font-family: "Noto Sans Arabic", sans-serif !important; line-height: 30px; } .tf-widget-activities .tabs-activities-content .activities-content .btn-wrap-activitis { padding-top: 50px; border-top: 1px solid rgba(255, 255, 255, 0.07); } .tf-widget-activities .tabs-activities-content .activities-content .btn-wrap-activitis .get-start { font-size: 20px; font-weight: 500; line-height: 25px; padding-right: 20px; } .tf-widget-activities .tabs-activities-content .activities-content .mask-tab { position: absolute; width: auto; left: -13em; top: 60px; } .our-activities { background-image: url("../../assets/images/page/bg-4.png"); background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 16px; padding: 122px 0px 30px 0px; background-color: #1C231F; margin: 0px 42px; } .our-activities .activities-wrap { border-radius: 25px 25px 0px 0px; background-color: #EEE9E9; padding: 40px 43px; margin: 10px 20px 0px 20px; } .our-activities .activities-wrap .activities-list li:not(:last-child) { margin-bottom: 28px; } .our-activities .activities-wrap .activities-list li a { background-color: #FFFFFF; border-radius: 10px; padding: 15px 33px; font-size: 18px; font-weight: 600; line-height: 22px; color: #081E2A; } .our-activities .activities-wrap .activities-list li a:hover { background-color: #44b774; color: #FFFFFF; } .our-activities .activities-wrap .activities-list li a:hover .icon { color: #FFFFFF; } .our-activities .activities-wrap .activities-list li a .icon { color: #44b774; font-size: 47px; margin-left: 30px; } .our-activities .activities-wrap .more-place { font-size: 15px; font-weight: 600; line-height: 29px; color: #081E2A; display: block; } .our-activities .right-side { padding-right: 5.4em; } .our-activities .right-side .image-activities img { border-radius: 8px; } .populer-activities-section { padding-top: 114px; background-image: url(../../assets/images/page/bg-4.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .populer-activities-section .populer-activities-slide { margin-bottom: -13em; } .populer-activities-section .populer-activities-slide .populer-activities { padding-bottom: 20px; } .populer-activities-section .populer-activities-slide .swiper-button-next, .populer-activities-section .populer-activities-slide .swiper-button-prev { width: 50px; height: 50px; background-color: #FFFFFF; box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.05); } .populer-activities-section .populer-activities-slide .swiper-button-next::after, .populer-activities-section .populer-activities-slide .swiper-button-prev::after { color: #081E2A; } .populer-activities-section .populer-activities-slide .swiper-button-next { left: -5em; } .populer-activities-section .populer-activities-slide .swiper-button-prev { right: -5em; } /*----------------------Counter--------------------*/ .widget-counter { background-color: #44b774; background-image: url(../../assets/images/page/bg-counter.png); background-position: center; background-repeat: no-repeat; background-size: cover; padding-top: 124px; padding-bottom: 124px; } .widget-counter .counter-top { position: absolute; top: -40px; width: 100%; height: 80px; right: 0; left: 0; z-index: 2; } .widget-counter .counter-bottom { position: absolute; bottom: -50px; width: 100%; height: 80px; right: 0; left: 0; z-index: 2; } .widget-counter .image img { width: auto; } .widget-counter .content { margin-right: 38px; } .widget-counter .content .title-call { font-size: 42px; line-height: 45px; margin-bottom: 10px; } .widget-counter .content .des { font-size: 18px; font-weight: 400; line-height: 32px; font-family: "DM Sans", sans-serif; color: rgba(255, 255, 255, 0.52); text-transform: capitalize; } .widget-counter2 { padding-top: 50px; padding-bottom: 70px; } .impressino-counter { background-color: #FFFFFF; display: grid; grid-template-columns: 1fr 1fr; margin-left: 10px; position: relative; } .impressino-counter .icon-fly { font-size: 30px; color: #44b774; position: absolute; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .counter-to { padding-top: 170px; padding-bottom: 71px; background-image: url(../../assets/images/page/bg-counter.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } .counter-to::before { top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; background: linear-gradient(-90deg, rgba(0, 0, 0, 0.93), rgba(0, 0, 0, 0.35)); } .counter-to .mask-left { width: 305px; height: 428px; background: linear-gradient(0deg, rgba(241, 176, 10, 0.45), rgba(255, 183, 0, 0.31), rgba(23, 38, 61, 0)); clip-path: polygon(0 0, 0% 100%, 100% 0); opacity: 0.97; position: absolute; top: 0; right: 0; } .counter-to .mask-right { width: 305px; height: 428px; background: linear-gradient(-262deg, rgba(77, 165, 40, 0.52), rgba(77, 165, 40, 0.25), rgba(23, 38, 61, 0)); clip-path: polygon(0 100%, 100% 100%, 100% 0); opacity: 0.97; position: absolute; bottom: 0; left: 0; } .counter-to .tf-counter { background-color: transparent; } /*----------------------destination--------------------*/ .widget-destination { padding-top: 317px; } .widget-destination1 h3.title-heading { z-index: 1; position: relative; } .grid-three-destination { display: grid; grid-template-columns: repeat(3, 1fr); gap: 37px 30px; } .widget-destination1 .shape-destination { position: absolute; width: auto; left: 0; top: 0; z-index: 1; } .widget-destination1 { padding-top: 120px; } .widget-destination1.destination-home5 .destination-explore { margin-top: 66px; margin-bottom: -5px; } .top-destination { padding-top: 30em; padding-bottom: 120px; } .top-destination2 .tour-des-top { font-weight: 600; color: #081E2A; padding: 6px 36px; border-radius: 23px; border: 1px dashed #EDEEEE; display: inline-block; } .destination-explore { font-size: 16px; font-weight: 500; line-height: 36px; color: #081E2A; margin-top: 82px; margin-bottom: 11px; } /*----------------------Brand logo--------------------*/ .line-brand-logo .line { width: 100%; height: 1px; margin: 12px 0; background-color: #EDEEEE; } .line-brand-logo .line-text { font-size: 16px; font-weight: 600; line-height: 24px; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); background-color: #FFFFFF; padding: 0 40px; position: absolute; color: #081E2A; } .brand-logo img { max-width: 133px; width: 100%; } .widget-brand-logo { padding-top: 63px; padding-bottom: 127px; } .brand-logo-widget { padding: 91px 0px; } .brand-logo-h4 .line-brand-logo .line-text { background-color: #F4F6F8; } .brand-logo-h4 .widget-brand-logo { padding-top: 57px; padding-bottom: 68px; } /*----------------------Adventure--------------------*/ .adventure-content { margin-bottom: -8.3em; padding: 63px 65px 0px 0px; background-color: #FFFFFF; border-radius: 16px; box-shadow: 0px -21px 26px 0px rgba(0, 0, 0, 0.02); } /*----------------------Testimonial--------------------*/ .widget-testimonial-style01 { padding-top: 289px; padding-bottom: 158px; background-color: #F1F6F4; background-image: url(../../assets/images/page/bg2.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .widget-testimonial-style01 .box-testimonial1 { margin-top: -5px; margin-right: 45px; rotate: -15deg; z-index: 2; position: relative; animation: dot-anim-2 3s linear 0s infinite alternate; } .widget-testimonial-style01 .box-testimonial2 { rotate: 7deg; z-index: 1; position: absolute; right: 26%; top: 15%; } .widget-testimonial-style01 .widget-testimonial { margin-right: 44px; margin-left: 20px; } .widget-tes-style2 { padding-top: 270px; padding-bottom: 122px; } .widget-tes-style2 .widget-testimonial-style3 { max-width: 900px; width: 100%; margin: auto; } .widget-tes-style3 .content { padding: 6.2em 7em 4em 26em; } .widget-tes-style3 .image { margin-left: -2em; } .widget-tes-style3 .image .about-vector { position: absolute; left: 13px; bottom: 39px; z-index: 1; transform: rotate(-334deg); } .widget-tes-style3 .image .about-vector span { font-size: 33px; font-weight: 400; line-height: 32px; position: absolute; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .widget-tes-style3 .image .mask-ft-right { position: absolute; top: 0; bottom: 0px; left: -25px; width: auto; } .widget-tes-style3 .tes-style3Swiper .swiper-pagination { z-index: 2; text-align: left; } .testimonial-section-h4 .content { background-image: url(../../assets/images/page/mask-home4.png); background-position: left bottom; background-repeat: no-repeat; padding-right: 19.4em; padding-top: 6.6em; padding-left: 10em; padding-bottom: 6.5em; } .testimonial-section-h4 .gallery-testimonial-h4 { background-color: #212622; background-image: url(../../assets/images/page/bg1.png); background-position: center; background-repeat: no-repeat; background-size: cover; height: 100%; margin-right: 60px; padding-top: 8em; padding-right: 10.5em; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-wrapper { flex-direction: column; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-wrapper .swiper-slide { margin-bottom: 35px; margin-right: 15px; margin-top: 15px; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-wrapper .swiper-slide.swiper-slide-thumb-active .image { border-bottom: 5px solid #44b774; border-left: 5px solid #44b774; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-wrapper .swiper-slide .image { overflow: hidden; width: 111px; height: 111px; border-radius: 20px; transform: rotate(-45deg); border-bottom: 5px solid transparent; border-left: 5px solid transparent; position: relative; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-wrapper .swiper-slide img { all: unset; width: 100%; height: 100%; object-fit: cover; transform: rotate(45deg) scale(1.3); } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-pagination-fraction { bottom: 0px; right: -20px; width: auto; padding: 18px 60px; background-color: #FFFFFF; border-radius: 6px; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-pagination-fraction span { font-size: 31px; font-weight: 700; color: #000000; } .testimonial-section-h4 .gallery-testimonial-h4 .mySwiperGalllery .swiper-pagination-fraction span.swiper-pagination-total { color: #44b774; } .start { color: #177ec2; } /*----------------------Banner part--------------------*/ .banner-part-item .btn-booking { font-size: 14px; font-weight: 600; line-height: 17px; letter-spacing: 0.05em; display: block; } .banner-part-item .btn-booking i { margin-right: 10px; } .banner-part-item .mask-banner-bottom { position: absolute; right: 0; /* right: 0; */ top: -35px; width: 100% !important; transform: rotate(-360deg); /* overflow:hidden; */ } .booking-style-1 { padding: 32px 37px 55px 37px; } .booking-style-1:hover .mask-banner-part { scale: 1.1; } .booking-style-1 .sale-up { font-size: 14px; font-weight: bold; line-height: 17px; display: block; } .booking-style-1 .title { font-size: 34px; font-weight: 400; line-height: 44px; color: #081E2A; } .banner-part p { line-height: 1.2; margin-top: 10px; } .booking-style-1 .title:hover { color: #44b774; } .booking-style-1 .mask-banner-part { width: auto !important; position: absolute; top: 27px; left: 0; transition: all 0.3s ease; } .booking-style-1 .price-banner-part { width: 65px; height: 65px; border-radius: 100%; background-color: #44b774; font-size: 16px; font-weight: 600; color: #FFFFFF; line-height: 20.83px; position: absolute; top: 23%; right: 42%; } .booking-style-2 { padding: 38px 40px 64px 37px; } .booking-style-2:hover .mask-banner-part { scale: 1.1; } .booking-style-2 .sale-up { font-size: 16px; font-weight: 400; line-height: 23px; display: block; } .booking-style-2 .title { font-size: 23px; font-weight: 700; line-height: 44px; color: #081E2A; } .booking-style-2 .title:hover { color: #44b774; } .booking-style-2 .mask-banner-part { max-width: 148px; width: 100%; position: absolute; border-radius: 74px 74px 0px 0px; top: 35px; left: 21px; transition: all 0.3s ease; } .booking-style-2 .mask-banner-part::before { position: absolute; content: ""; right: -10px; top: -10px; width: 100%; height: 100%; border-radius: 74px 74px 0px 0px; border: 1px solid #44b774; } .booking-style-2 .banner-part-shape1 { width: auto; position: absolute; bottom: 16%; right: 47%; } .booking-style-2 .banner-part-shape2 { position: absolute; top: 24px; left: 27%; width: auto; } .booking-style-2 .widget-icon-video { width: 42px; height: 42px; position: absolute; left: 19%; bottom: 11%; } .booking-style-2 .widget-icon-video i { font-size: 10px; } .booking-style-3 { padding: 36px 32px 64px 37px; } .booking-style-3:hover .mask-banner-part { scale: 1.1; } .booking-style-3 .sale-up { font-size: 16px; font-weight: bold; line-height: 23px; display: block; } .booking-style-3 .title { font-size: 23px; font-weight: 700; line-height: 44px; color: #081E2A; } .booking-style-3 .title:hover { color: #44b774; } .booking-style-3 .mask-banner-part { width: 143px !important; background: #FFFFFF; padding: 7px 6px 33px 11px; position: absolute; top: 14.5%; left: 6%; rotate: -15deg; transition: all 0.3s ease; } .booking-style-3 .banner-part-shape1 { width: auto; left: 40%; position: absolute; bottom: 33%; } /*----------------------Video--------------------*/ .widget-video { padding-top: 236px; padding-bottom: 137px; background-image: url("../../assets/images/page/video.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } .widget-video::before { content: ""; top: 0; left: 0; right: 0; bottom: 0; position: absolute; background: linear-gradient(-90deg, rgba(0, 0, 0, 0.89), rgba(0, 0, 0, 0.36)); } .title-video { font-size: 170px; font-weight: 400; line-height: 170px; position: relative; } .title-video:before { position: absolute; content: ""; width: 72%; height: 3px; background-color: #FFFFFF; bottom: 17px; right: 50%; transform: translateX(50%); } .widget-video-style2 { padding-top: 310px; } /*----------------------service--------------------*/ .widget-service { padding-top: 112px; padding-bottom: 15px; } .widget-service-h5 .mask-home5 { height: 295px; position: absolute; right: 0; left: 0; bottom: 0; background-color: #EBEBEB; } /*----------------------Feature--------------------*/ .widget-feature .feature-shape { position: absolute; right: 0; top: 0; width: auto; z-index: 1; } .widget-feature .image-feature-wrap { padding-left: 6px; } .widget-feature .image-feature-wrap .image-feature .image { border-radius: 260px 260px 0px 0px; } .widget-feature .image-feature-wrap .image-feature .shape-image { position: absolute; bottom: -37px; right: 0; left: 0; } .widget-feature .image-feature-wrap .exploring { width: 160px; height: 150px; background-color: #44b774; position: absolute; bottom: 16%; right: -15%; border-radius: 29px; rotate: -45deg; animation: dot-anim-3 3s linear 0s infinite alternate; } .widget-feature .image-feature-wrap .exploring span { font-size: 33px; font-weight: 400; rotate: 45deg; } .widget-feature .content-feature-wrap { padding-right: 3em; margin-top: -6px; padding-left: 30px; } .widget-feature .content-feature-wrap .feature-list-wrap { background-color: #FFFFFF; border-radius: 13px; box-shadow: 0px 0px 19px 0px rgba(0, 0, 0, 0.06); padding: 26px 26px 26px 26px; } .widget-feature .content-feature-wrap .feature-list-wrap .feature-list { border-radius: 8px; border: 1px solid #EDEEEE; display: flex; flex-wrap: wrap; } .widget-feature .content-feature-wrap .feature-list-wrap .feature-list .feature-list-iteam { padding: 25px 40px 17px 3px; border: 1px solid #EDEEEE; width: 50%; } .widget-feature .content-feature-wrap .feature-list-wrap .feature-list .feature-list-iteam .icon { width: 55px; height: 55px; border-radius: 100%; border: 1px dashed #44b774; font-size: 30px; color: #44b774; margin-left: 15px; } .widget-feature .content-feature-wrap .feature-list-wrap .feature-list .feature-list-iteam span { font-size: 20px; font-weight: 600; color: #081E2A; } .exploring { width: 160px; height: 150px; background-color: #44b774; position: absolute; border-radius: 29px; rotate: -45deg; } .exploring span { font-size: 33px; font-weight: 400; rotate: 45deg; } .bg-ab-feature { position: absolute; right: 0; left: 0; bottom: 0; z-index: 1; } .bg-ab-feature img { width: 100%; } .widget-feature2 .image-feature2 { margin-left: -38px; } .widget-feature2 .image-feature2 .mask-ft-right { position: absolute; top: 0; bottom: 0; left: -4%; width: auto; } .widget-feature2 .image-feature2 .mask-ft-bottom { position: absolute; right: 0; left: 0; bottom: -2%; } .widget-feature2 .exploring { bottom: 16%; right: 15%; animation: dot-anim-3 3s linear 0s infinite alternate; } .widget-feature2 .content-feature2 { padding: 7em 6.8em 0em 22em; } .widget-feature3 { padding-top: 50px; padding-bottom: 15px; background-image: url(../../assets/images/page/bg-4.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .widget-feature3.ab { background: none; } .widget-feature3.ab .tf-icon-box { /* box-shadow: 0 0 7px 0 #EEE; */ border: 1px dashed #DDD; } .widget-feature3 .box-feature-wrap { padding: 0 50px; } .widget-feature3 .image-feature3 { margin-left: 54px; padding-top: 15px; } .widget-feature3 .image-feature3 .image-feature { border: 7px solid #FFFFFF; border-radius: 60px; margin-bottom: 32px; } .widget-feature3 .image-feature3 .image-feature img { border-radius: 60px; } .widget-feature3 .image-feature3 .text { font-size: 41px; font-weight: 400; line-height: 32.8px; position: absolute; bottom: 30px; right: 50%; transform: translateX(50%); } .widget-feature4 .mask-faeture4 { height: 100%; left: 0; top: 0; bottom: 0; color: #ffffff; position: absolute; z-index: 1; } .widget-feature4 .mask-faeture4 svg g { display: none; filter: invert(49%) sepia(79%) saturate(480%) hue-rotate(110deg) brightness(94%) contrast(87%); } .widget-feature4 .feature-wrap-box { padding-left: 7em; display: grid; grid-template-columns: 1fr 1fr; gap: 43px 70px; } .widget-feature4 .image-feature4 { margin-top: -4em; margin-right: 0; margin-left: -2em; width: 600px; } /*----------------------Mobie App--------------------*/ .mobie-app { background-color: #081E2A; border-radius: 14px; height: 300px; } .mobie-app .mobie-app-image { padding: 63px 89px 75px 89px; } .mobie-app .mobie-app-image .title-heading { font-size: 30px; line-height: 49px; margin-top: -3px; margin-bottom: 17px; } .mobie-app .mobie-app-image .mobie-wrap a { display: inline-block; } .mobie-app .mobie-app-image a img { height: 40px; } .mobie-app .mobie-app-image .mobie-wrap a:not(:last-child) { margin-left: 15px; } .mobie-app .mobie-app-image .mobie-wrap a img { width: auto; } .mobie-app .mobie-app-image .qr-code { position: absolute; left: -17px; bottom: 0; } .mobie-app .mobie-app-image .qr-code span { font-size: 15px; font-weight: 500; line-height: 30px; color: white; display: block; } .mobie-app .mobie-app-image .qr-code img { width: auto; margin-bottom: 70px; } .mobie-app .mobie-app-content .mask-mobie { width: auto; } .mobie-app .mobie-app-content .phone { position: absolute; right: 21px; bottom: 40px; width: auto; } /*----------------------Faq--------------------*/ .widget-faq .image-faq { margin-right: -78px; margin-left: -39px; margin-top: 8px; margin-bottom: -23px; } .widget-faq .content-faq { padding-right: 25px; } /*----------------------Top Week--------------------*/ .widget-top-week { background-image: url(../../assets/images/page/bg3.png); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 126px 0px 167px 0px; } .widget-top-week .on-week-swipper-wrap .swiper-button-prev { right: 87%; top: -18%; } .widget-top-week .on-week-swipper-wrap .swiper-button-next { top: -18%; } .top-this-week-slide .swiper-button-next, .top-this-week-slide .swiper-button-prev { width: 60px; height: 60px; } .top-this-week-slide .swiper-button-next { left: -6%; } .top-this-week-slide .swiper-button-prev { right: -6%; } .top-this-week-about-us { padding-top: 370px; padding-bottom: 218px; } /*----------------------Instagram--------------------*/ .widget-instagram { padding: 26px 28px; } .instagram-post { padding-top: 120px; } .instagram-post .bg-primary-ig { background-color: #44b774; height: 70%; width: 100%; position: absolute; top: 0; left: 0; right: 0; z-index: 1; } .instagram-post .instagram-post-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 22px; } .tf-instagram { display: block; overflow: hidden; } .tf-instagram:hover .mask-absolute { transform-origin: center; opacity: 0.9; visibility: visible; width: 100%; height: 100%; } .tf-instagram:hover img { transform: scale(1.1); } .tf-instagram:hover .mask-bg { visibility: visible; opacity: 1; } .tf-instagram img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-instagram .mask-bg { display: flex; justify-content: center; align-items: center; position: absolute; opacity: 0; visibility: hidden; margin: 15px; top: 0; right: 0; left: 0; bottom: 0; transition: all 0.4s ease-out; } .tf-instagram .mask-absolute { position: absolute; opacity: 0; visibility: hidden; bottom: 0%; z-index: 1; width: 100%; height: 100%; position: absolute; content: ""; right: 0px; left: 0px; transition: all 0.3s ease-in-out; } .tf-instagram .mask-absolute i { position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); font-size: 30px; color: #FFFFFF; transition: all 0.4s ease-out; } .tf-instagram .mask-absolute i:hover { color: #44b774; } /*----------------------impresssino--------------------*/ .impressino { padding-top: 182px; background-image: url(../../assets/images/page/bg-counter.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } .impressino::before { top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; background: linear-gradient(-180deg, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.32)); z-index: 1; height: -webkit-fill-available; } .impressino .mask-impression { position: absolute; left: 0; top: 0; z-index: 2; width: 570px; height: 100%; } .impressino .mt-impressino { margin-top: 11em; padding-right: 11px; } /*----------------------archieve tour--------------------*/ .archieve-tour { padding-top: 0px; padding-bottom: 105px; } .archieve-tour .tf-my-listing { border: 1px solid #EDEEEE; padding: 5px 27px; border-radius: 10px; } .archieve-tour .tf-my-listing .showing { font-size: 14px; font-weight: 600; line-height: 20px; color: #081E2A; } .archieve-tour .tf-my-listing .listing-all-wrap .toolbar-list { display: flex; align-items: center; justify-content: center; gap: 26px; margin-right: 30px; } .archieve-tour .tf-my-listing .listing-all-wrap .toolbar-list .form-group { cursor: pointer; } .archieve-tour .tf-my-listing .listing-all-wrap .toolbar-list .form-group a { font-size: 20px; } .child-select .nice-select { /* padding: 10px 40px 10px 10px; */ } .listing-list-car-wrap-grid3 .listing-list-car-grid { grid-template-columns: repeat(3, 1fr); } .listing-list-car-wrap-grid3 .listing-list-car-grid.listing-list-car-list { grid-template-columns: repeat(2, 1fr); } .listing-list-car-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; } .listing-list-car-grid.listing-list-car-list { grid-template-columns: 1fr; } .listing-list-car-grid.listing-list-car-list .tour-listing { padding: 13px; display: flex; } .listing-list-car-grid.listing-list-car-list .tour-listing .tour-listing-image { max-width: 258px; width: 100%; border-radius: 8px; overflow: hidden; } .listing-list-car-grid.listing-list-car-list .tour-listing .tour-listing-image img { height: 100%; object-fit: cover; } .listing-list-car-grid.listing-list-car-list .tour-listing .tour-listing-content { padding: 0px 37px 0px 37px; margin-top: 0px; width: 100%; } .listing-list-car-wrap .form-group .btn-display-listing-grid.active, .listing-list-car-wrap .form-group .btn-display-listing-list.active { color: #44b774; } .sider-bar-tour-package .widget-filter .row { border-radius: 10px; padding: 20px 10px 0; background: white; background-color: white; max-width: 1300px; margin: -30px auto 0; z-index: 9; position: relative; box-shadow: 0 0 7px 0 #DDD; justify-content: center; } .sider-bar-tour-package .widget-filter span.current { font-size: 15px; } .sider-bar-tour-package .widget-filter .btn-search { border-radius: 10px; transition: all 0.3s ease-in-out; padding: 20px; width: 100%; } .sider-bar-tour-package .widget-filter .btn-search:hover { background: #045c96; } .sider-bar-tour-package .widget-filter .row .col-lg-2 { border: 1px solid #DDD; margin-right: 7px; border-radius: 5px; padding-top: 10px; } .sider-bar-tour-package .widget-filter .row .col-lg-2 .tit { display: flex; align-items: center; gap: 10px; } .sider-bar-tour-package .widget-filter .row .col-lg-2 .tit i { position: unset !important; transform: none !important; } .sider-bar-tour-package .widget-filter .row .col-lg-2 .tit label { margin: 0; font-size: 14px; } .sider-bar-tour-package .widget-filter .row .col-lg-2:last-of-type { border: none !important; } @media (min-width:1200px) { .sider-bar-tour-package .widget-filter .row .col-lg-2 { width: 12% !important; } .sider-bar-tour-package .widget-filter .row .col-lg-2:last-of-type { width: 10% !important; } } .sider-bar-tour-package .widget-filter .title-tour { padding-right: 10px; position: relative; margin-bottom: 30px; } .sider-bar-tour-package .widget-filter .title-tour::before { height: 17px; width: 1px; background-color: #44b774; position: absolute; content: ""; right: 0; top: 50%; transform: translateY(-50%); } .sider-bar-tour-package .widget-filter .group-select-wrap .group-select i { position: absolute; font-size: 18px; color: #44b774; top: 50%; transform: translateY(-50%); right: 20px; } .sider-bar-tour-package .widget-filter .group-select-wrap .group-select .search-bar-group label { position: absolute; right: 53px; top: 10px; margin-bottom: 0; font-size: 14px; font-weight: bold; color: #4F545A; } .sider-bar-tour-package .widget-filter .group-select-wrap .group-select .search-bar-group .nice-select { padding: 29px 53px 10px 36px; font-size: 16px; font-weight: 600; color: #081E2A; } .sider-bar-tour-package .widget-filter .group-select-wrap .input-npd .search-bar-group label { position: absolute; right: 16px; } .sider-bar-tour-package .widget-filter .group-select-wrap .input-npd .search-bar-group .nice-select { padding: 29px 16px 10px 36px; } .sider-bar-tour-package .widget-filter .group-check-box-wrap input[type=checkbox]+label:before { border-radius: 3px; } .sider-bar-tour-package .widget-filter .group-check-box-wrap input[type=checkbox]+label { font-size: 16px; font-weight: 500; } .sider-bar-tour-package .widget-filter-content { background-image: url(../../assets/images/page/sidebar-right.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 8px; padding: 45px 41px 74px 41px; position: relative; } .sider-bar-tour-package .widget-filter-content::before { top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; background-color: rgba(0, 0, 0, 0.75); border-radius: 8px; z-index: 1; } .sider-bar-tour-package .widget-filter-content span { font-size: 14px; font-weight: 500; line-height: 17px; } .sider-bar-tour-package .widget-filter-content .title { font-size: 26px; font-weight: 700; line-height: 42px; margin-top: 11px; margin-bottom: 4px; } .sider-bar-tour-package .widget-filter-content p { font-size: 14px; font-weight: 500; line-height: 17px; } .sider-bar-tour-package .widget-filter-content a { font-size: 14px; font-weight: 600; line-height: 17px; color: #177ec2; margin-top: 30px; display: inline-block; } .sider-bar-tour-package .widget-filter-content a:hover { color: #44b774; } .sider-bar-tour-package .widget-filter-content a i { font-size: 12px; margin-right: 5px; } /*----------------------terms-condition--------------------*/ .terms-condition { padding-top: 116px; padding-bottom: 157px; } .terms-condition .tab-terms-condition .tab-content { padding-top: 21px; } .terms-condition .tab-terms-condition .tab-content .title-ter { font-size: 30px; font-weight: 700; line-height: 50px; margin-bottom: 47px; } .terms-condition .tab-terms-condition .tab-content .des { font-size: 21px; font-weight: 700; line-height: 30px; color: #081E2A; display: inline-block; margin-bottom: 21px; } .terms-condition .tab-terms-condition .tab-content .text { font-size: 16px; font-weight: 400; line-height: 34px; } .terms-condition .tab-terms-condition .tab-content .list-term li { margin-right: 29px; list-style: disc; } .terms-condition .tab-terms-condition .tab-content .list-term li:not(:last-child) { margin-bottom: 19px; } .terms-condition .tab-terms-condition .tab-content .list-term li span { font-size: 18px; font-weight: 600; color: #081E2A; text-transform: capitalize; line-height: 40px; } /*----------------------faq--------------------*/ .inner-faq { padding-top: 104px; padding-bottom: 143px; } .inner-faq .faq-list .faq .faq-question { padding: 22px 35px 22px 35px; } .inner-faq .faq-list .faq .faq-answer { margin-top: -8px; } .header-search-faq { padding-top: 138px; padding-bottom: 110px; } .header-search-faq .inner-header .title { font-size: 55px; line-height: 70px; text-transform: inherit; } .header-search-faq .inner-header .des { margin-top: 18px; margin-bottom: 35px; } .header-search-faq .inner-header .form-search-faq { margin: 0 auto; } .header-search-faq .inner-header .popular { font-size: 18px; font-weight: 600; line-height: 22px; color: #081E2A; margin-left: 24px; } .header-search-faq .inner-header .tag-wrap { margin-top: 32px; } .header-search-faq .inner-header .tag-wrap .tag-popular li:not(:last-child) { margin-left: 16px; } .header-search-faq .inner-header .tag-wrap .tag-popular li span { font-size: 15px; font-weight: 500; line-height: 18px; color: #4F545A; padding: 10px 18px; background-color: #FFFFFF; border-radius: 5px; box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.05); display: inline-block; } /*----------------------login--------------------*/ .login { padding-top: 94px; padding-bottom: 105px; } .login .mask2-about { bottom: -100px !important; } .login .image-about-us .mask1 { top: 200px; } .login .login-wrap { padding: 29px 25px 35px 37px; border-radius: 10px; box-shadow: 0px 4px 27px 0px rgba(0, 0, 0, 0.07); background: white; position: relative; } .login .login-wrap .image { max-width: 444px; width: 100%; margin-left: 55px; } .login .login-wrap .image img { border-radius: 10px; } .login .login-wrap .content { width: 100%; } .login .login-wrap .content .inner-header-login { margin-bottom: 28px; } .inner-header-login { text-align: center; } .inner-header-login img.logo { display: block; margin: auto; width: 160px; } .login .login-wrap .content .inner-header-login .title { margin-bottom: 13px !important; font-size: 25px; line-height: 1.2; } .login .login-wrap .content .inner-header-login .sale { font-size: 14px; line-height: 14px; border-radius: 5px; font-weight: 600; padding: 4px 10px; background-color: #177ec2; color: #FFFFFF; } .login .login-wrap .content .inner-header-login p { font-size: 15px; font-weight: 400; line-height: 1.5; /* margin-left: 12px; */ } .login .login-wrap .content .input-wrap { margin-bottom: 36px; } .login .login-wrap .content .input-wrap-social .or { font-size: 17px; font-weight: 600; line-height: 26px; color: #081E2A; position: relative; display: block; margin-bottom: 8px; } .login .login-wrap .content .input-wrap-social .or::before { width: 145px; height: 1px; background-color: #B6C2D4; position: absolute; content: ""; right: 30px; top: 50%; transform: translateY(-50%); } .login .login-wrap .content .input-wrap-social .login-social { font-size: 15px; font-weight: 500; line-height: 26px; color: #081E2A; padding: 12px 15px; border: 1px solid rgba(0, 0, 0, 0.26); border-radius: 6px; } .login .login-wrap .content .input-wrap-social .login-social:not(:last-child) { margin-left: 20px; } .login .login-wrap .content .input-wrap-social .login-social img { width: auto; margin-left: 12px; } .login .login-wrap .content .btn-submit { width: 100%; border-radius: 7px; text-transform: uppercase; } .login .login-wrap .content .account { color: #081E2A; font-size: 15px; font-weight: bold; margin-left: 20px; } .login .login-wrap .content .link-login { display: inline-block; font-size: 15px; font-weight: 600; color: #FFFFFF; padding: 4px 15px; background-color: #44b774; border-radius: 5px; } .login .login-wrap .content .link-login:hover { background-color: #4ba771; } /*----------------------contact us--------------------*/ .contact-us .box-contact { border-radius: 2px; background: white; max-width: 400px; margin-bottom: 34px; /* border: 1px solid #EDEEEE; */ padding: 38px 20px 37px 20px; box-shadow: 0px 0px 20px 0px #EEE; } .contact-us .tf-container { max-width: 1200px; } .contact-us .box-contact .icon { color: #44b774; height: 41px; } .contact-us .box-contact .icon svg { width: 30px; height: 30px; animation: spin 5s linear infinite; } .contact-us .box-contact span { font-size: 17px; font-weight: 600; line-height: 30px; color: #081E2A; margin-top: 2px; margin-bottom: 5px; display: block; } .contact-us .contact-us-wrap { padding: 56px 65px 57px 65px; margin-right: -25px; box-shadow: 0 0 27px 0 #EEE; border-radius: 5px; } .contact-us button.btn-submit-contact { margin: auto; display: block; } .contact-us .contact-us-wrap>.inner-header .title { font-size: 24px; font-weight: 600; line-height: 48px; letter-spacing: 1px; margin-bottom: 20px; } .contact-us .contact-us-map { padding-left: 4.5em; } .contact-us .contact-us-map .inner-header .title { margin-bottom: 36px; } .contact-us .contact-us-map .map, .contact-us .contact-us-map #map { height: 559px; } /*----------------------Team--------------------*/ .team-member-page .team-member-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 85px 58px; } .single-destinaion-content .inner-haeder i { color: #44b774; margin-left: 9px; } .single-destinaion-content .inner-haeder .title { font-size: 40px; font-weight: 700; line-height: 50px; margin-bottom: 24px; } .single-destinaion-content .description-wrap .description { font-size: 24px; font-weight: 700; line-height: 30px; margin-bottom: 16px; display: inline-block; color: #081E2A; } .single-destinaion-content .description-wrap .des { line-height: 34px; } .single-destinaion-content .description-wrap .listing-des li { padding-right: 23px; position: relative; } .single-destinaion-content .description-wrap .listing-des li::before { width: 7px; height: 7px; background-color: #44b774; border-radius: 100%; content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .single-destinaion-content .description-wrap .listing-des li p { font-size: 16px; font-weight: 600; line-height: 52px; color: #081E2A; } .single-destinaion-content .description-wrap .listing-icon li i { color: #44b774; margin-left: 10px; } .single-destinaion-content .description-wrap .listing-icon li p { font-size: 16px; font-weight: 600; line-height: 48px; color: #081E2A; } .single-destinaion-content .image-wrap { gap: 30px; } .single-destinaion-content .image-wrap img { width: 100%; height: 100%; object-fit: cover; } .description-wrap .description { font-size: 24px; font-weight: 700; line-height: 30px; margin-bottom: 16px; display: inline-block; color: #081E2A; } .description-wrap .des { line-height: 34px; } .tour-single .listing-des li { padding-right: 23px; position: relative; } .tour-single .listing-des li::before { width: 7px; height: 7px; background-color: #44b774; border-radius: 100%; content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .tour-single .listing-des li p { font-size: 16px; font-weight: 600; line-height: 52px; color: #081E2A; } .tour-single .listing-icon li i { color: #44b774; margin-left: 10px; } .tour-single .listing-icon li p { font-size: 16px; font-weight: 600; line-height: 48px; color: #081E2A; } .tour-single .listing-clude li:not(:last-child) { margin-bottom: 10px; } .tour-single .listing-clude li i { color: #44b774; font-size: 18px; margin-left: 19px; } .tour-single .listing-clude li p { font-size: 16px; font-weight: 500; } .tour-single .inner-heading-wrap .inner-heading .feature { font-size: 15px; font-weight: 500; line-height: 20px; padding: 5px 18px; background-color: #FF494F; color: #FFFFFF; border-radius: 2px; display: inline-block; margin-bottom: 20px; } .tour-single .inner-heading-wrap .inner-heading .title { font-size: 26px; font-weight: 700; line-height: 50px; margin-bottom: 5px; } .tour-single .inner-heading-wrap .inner-heading .list-wrap-heading li:not(:last-child) { margin-left: 40px; } .tour-single .inner-heading-wrap .inner-heading .list-wrap-heading li i { color: #44b774; margin-left: 15px; font-size: 20px; } .tour-single .inner-heading-wrap .inner-heading .list-wrap-heading li span { font-size: 15px; font-weight: bold; color: black; } .tour-single .inner-heading-wrap .inner-price .review { font-size: 16px; font-weight: 600; line-height: 20px; color: #081E2A; margin-right: 20px; margin-left: 21px; } .tour-single .inner-heading-wrap .inner-price .price-sale { font-size: 24px; font-weight: 700; line-height: 30px; margin-top: 15px; } .tour-single .inner-heading-wrap .inner-price .price { font-size: 18px; font-weight: 500; line-height: 22px; color: #4F545A; margin-right: 10px; } .tour-single .side-bar-right { padding-right: 0; margin-top: 10px; } .tour-single .information-content-tour .expect-wrap .title { font-size: 24px; font-weight: 700; line-height: 30px; } .tour-single .information-content-tour .expect-wrap .expect { padding-bottom: 12px; padding-top: 12px; border-bottom: 1px solid #EDEEEE; } .tour-single .information-content-tour .expect-wrap .expect span { font-size: 15px; font-weight: 600; line-height: 34px; color: #000000; width: 40%; } .tour-single .information-content-tour .expect-wrap .expect p { font-size: 15px; font-weight: 500; line-height: 30px; width: 60%; } .tour-single .information-content-tour .expect-wrap .listing-icon li:not(:last-child) { margin-bottom: 10px; } .tour-single .information-content-tour .expect-wrap .listing-icon li i { font-size: 15px; color: #44b774; margin-left: 19px; } .tour-single .planing-content-tour .title-plan { line-height: 23px; margin-bottom: 46px; } .tour-single .planing-content-tour .tour-planing-section:not(:last-child) { margin-bottom: 60px; } .tour-single .planing-content-tour .tour-planing-section .number-box { max-width: 100px; width: 100%; height: 94px; border-radius: 7px; background-color: #44b774; font-size: 25px; font-weight: 700; color: #FFFFFF; margin-left: 51px; margin-top: 3px; } .tour-single .planing-content-tour .tour-planing-section .content-box { padding-left: 3em; } .tour-single .planing-content-tour .tour-planing-section .content-box .title { margin-bottom: 22px; } .tour-single .planing-content-tour .tour-planing-section .content-box .des { line-height: 34px; } .tour-single .localtion-content-tour .map2, .tour-single .localtion-content-tour #map2 { height: 473px; } .tour-single .localtion-content-tour .map-list i { color: #44b774; margin-left: 15px; font-size: 20px; } .tour-single .localtion-content-tour .map-list p { font-size: 18px; font-weight: 500; line-height: 30px; color: #081E2A; } .tour-single .localtion-content-tour .title-location { font-size: 24px; line-height: 30px; margin-bottom: 14px; color: #081E2A; } .tour-single .review-content-tour .title-review { font-size: 24px; line-height: 30px; padding-right: 10px; position: relative; } .tour-single .review-content-tour .title-review::before { height: 70%; width: 1px; background-color: #44b774; content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .tour-single .review-content-tour .custom-review { border: 1px solid #EDEEEE; border-radius: 15px; padding: 40px 53px 80px 42px; } .tour-single .review-content-tour .custom-review .review-list { width: 100%; } .tour-single .review-content-tour .custom-review .card-review { margin-left: 62px; } .tour-single .review-content-tour .custom-review .card-review .percent { position: relative; } .tour-single .review-content-tour .custom-review .card-review svg { position: relative; width: 210px; height: 210px; transform: rotate(90deg); } .tour-single .review-content-tour .custom-review .card-review svg circle { width: 100%; height: 100%; fill: none; stroke: #EDEEEE; stroke-width: 10; stroke-linecap: round; } .tour-single .review-content-tour .custom-review .card-review svg circle:last-of-type { stroke-dasharray: 625px; stroke-dashoffset: calc(625px - 625px * var(--percent) / 100); stroke: #44b774; } .tour-single .review-content-tour .custom-review .card-review .number { position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); width: max-content; } .tour-single .review-content-tour .client-review .client-review span { font-size: 16px; font-weight: 600; line-height: 30px; color: #081E2A; } .tour-single .review-content-tour .client-review .client-review .start { margin-right: 15px; margin-left: 15px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item { padding-left: 10em; padding-bottom: 27px; border-bottom: 1px solid #EDEEEE; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item:not(:last-child) { margin-bottom: 48px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .avata { margin-left: 36px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .avata img { width: 80px; height: 80px; border-radius: 100%; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .content { margin-top: 6px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .content .name { display: inline-block; font-size: 16px; font-weight: 700; line-height: 25px; color: #081E2A; margin-bottom: 15px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .content .des { line-height: 28.8px; margin-bottom: 4px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .content .start i { font-size: 14px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .content .start span { font-size: 16px; font-weight: 700; line-height: 38px; color: #081E2A; margin-right: 15px; } .tour-single .review-content-tour .client-review .client-review-list .client-review-item .content .date { font-size: 12px; font-weight: 700; line-height: 29px; text-transform: uppercase; letter-spacing: 0.1em; color: #4F545A; } .tour-single .review-content-tour .form-review { padding: 50px 35px 70px 35px; margin-left: 5em; } .tour-single .review-content-tour .inner-review .inner-review-item .text-review { font-size: 16px; font-weight: 700; line-height: 26px; color: #081E2A; margin-bottom: 13px; } .tour-single .review-content-tour .progress { height: 8px; } .tour-single .review-content-tour .progress .progress-bar { background-color: #44b774; } .tour-single .gallery-content-tour { display: grid; grid-template-areas: "image-gallery1 image-gallery1 image-gallery2" "image-gallery1 image-gallery1 image-gallery2" "image-gallery3 image-gallery4 image-gallery4" "image-gallery3 image-gallery4 image-gallery4" "image-gallery5 image-gallery5 image-gallery6" "image-gallery5 image-gallery5 image-gallery6"; gap: 30px; } .tour-single .gallery-content-tour .image { width: 100%; height: 100%; } .tour-single .gallery-content-tour .image img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; } .tour-single .gallery-content-tour .image-gallery1 { grid-area: image-gallery1; } .tour-single .gallery-content-tour .image-gallery2 { grid-area: image-gallery2; } .tour-single .gallery-content-tour .image-gallery3 { grid-area: image-gallery3; } .tour-single .gallery-content-tour .image-gallery4 { grid-area: image-gallery4; } .tour-single .gallery-content-tour .image-gallery5 { grid-area: image-gallery5; } .tour-single .gallery-content-tour .image-gallery6 { grid-area: image-gallery6; } .discount-h5 { padding-bottom: 123px; } .discount-h5 .sale-up { font-size: 14px; font-weight: 500; line-height: 17px; display: block; } .discount-h5 .text-free { font-size: 14px; font-weight: 500; } .discount-h5 .booking-style-1 { background-image: url(../../assets/images/page/bg-discount.png); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 47px 42px 0px 20px; } .discount-h5 .booking-style-1:hover .mask-banner-part2 { scale: 1.1; } .discount-h5 .booking-style-1 .image-wrap .mask-banner-part { position: relative; top: 0px; margin-top: 7px; margin-bottom: 15px; } .discount-h5 .booking-style-1 .image-wrap .price-banner-part { right: 7%; top: 15%; } .discount-h5 .booking-style-2 { padding: 45px 43px 42px 37px; } .discount-h5 .booking-style-2 .title { font-size: 26px; margin-top: 11px; } .discount-h5 .booking-style-2 .image-wrap .mask-banner-part { left: -5.8em; top: 23px; position: relative; } .discount-h5 .booking-style-2 .image-wrap .banner-part-shape1 { bottom: -12%; right: 17%; } .discount-h5 .booking-style-2 .image-wrap .banner-part-shape2 { top: 13px; left: 35%; } .discount-h5 .booking-style-2 .image-wrap .widget-icon-video { bottom: -19%; } .discount-h5 .booking-style-3 { padding: 45px 32px 30px 37px; } .discount-h5 .booking-style-3 .title { font-size: 21px; text-transform: capitalize; } .discount-h5 .booking-style-3 .image-wrap .mask-banner-part { position: relative; top: 0px; left: -40%; margin-top: 35px; } .discount-h5 .booking-style-3 .image-wrap .banner-part-shape1 { left: 61%; bottom: 19%; } .discount-h5 .mask-banner-part2 { left: -15px; top: 18px; position: relative; transition: all 0.3s ease; } /*----------------------Dash-board--------------------*/ .sidebar-dashboard { transition: all 0.2s ease-out; background-color: #021B32; max-width: 320px; width: 100%; height: 100vh; z-index: 99; position: fixed; right: 0; } .sidebar-dashboard.actives { max-width: 70px; } .sidebar-dashboard.actives .db-menu { padding: 55px 10px 50px 10px; } .sidebar-dashboard.actives .db-menu ul li a { padding: 10px 17px; } .sidebar-dashboard.actives .db-menu ul li a span { display: none; } .sidebar-dashboard.actives .db-logo { padding: 38px 24px 38px 10px; } .sidebar-dashboard.actives .db-logo span { display: none; } .sidebar-dashboard .db-logo { padding: 40px 74px 40px 40px; border-bottom: 1px solid rgba(217, 217, 217, 0.08); } .sidebar-dashboard .db-logo a { font-size: 28px; font-weight: 700; line-height: 35px; color: #FFFFFF; } .sidebar-dashboard .db-logo a img { width: 35px; margin-left: 10px; } .sidebar-dashboard .db-menu { padding: 55px 26px 50px 35px; } .sidebar-dashboard .db-menu ul li:not(:last-child) { margin-bottom: 10px; } .sidebar-dashboard .db-menu ul li:hover, .sidebar-dashboard .db-menu ul li.active { background-color: rgba(255, 255, 255, 0.05); } .sidebar-dashboard .db-menu ul li a { font-size: 16px; font-weight: 600; line-height: 28px; color: #FFFFFF; padding: 10px 50px; border-radius: 8px; display: inline-block; } .sidebar-dashboard .db-menu ul li a i { color: #44b774; margin-left: 14px; } .has-dashboard { margin-right: 320px; transition: all 0.2s ease-out; } .has-dashboard.actives { margin-right: 70px; } .has-dashboard .main-header.is-fixed { position: relative; opacity: 1; top: 0; } .has-dashboard .header-dashboard { background-color: #021B32; padding: 0px 38px 0px 185px; } .has-dashboard .header-dashboard .header-search .icon-bars { color: #FFFFFF; cursor: pointer; font-size: 18px; margin-left: 30px; padding: 5px; } .has-dashboard .header-dashboard .header-search .search-dashboard { position: relative; } .has-dashboard .header-dashboard .header-search .search-dashboard i { position: absolute; font-size: 20px; color: #FFFFFF; top: 21px; right: 31px; } .has-dashboard .header-dashboard .header-search .search-dashboard input { width: 307px; background-color: rgba(255, 255, 255, 0.04); border-radius: 32px; border: unset; padding: 25px 65px 25px 17px; color: #FFFFFF; font-size: 15px; font-weight: 500; } .has-dashboard .header-dashboard .header-search .search-dashboard input::placeholder { color: #FFFFFF; } .has-dashboard .header-dashboard .nav-outer .main-menu .navigation>li>a { color: #FFFFFF; padding: 44px 0px 46px 0px; } .has-dashboard .header-dashboard .header-account .icon-send { color: #FFFFFF; font-size: 25px; cursor: pointer; } .has-dashboard .header-dashboard .header-account .icon-notification { color: #FFFFFF; font-size: 25px; cursor: pointer; } .has-dashboard .header-dashboard .header-account .account { margin-right: 13px; } .has-dashboard .header-dashboard .header-account .account a img { width: 40px; height: 40px; border-radius: 100%; border: 2px solid #FFFFFF; } .has-dashboard .footer-dashboard { background-color: #021B32; padding: 50px 109px 50px 161px; } .has-dashboard .footer-dashboard .menu-footer li:not(:first-child) { margin-right: 20px; } .has-dashboard .footer-dashboard .menu-footer li a { color: #FFFFFF; } .has-dashboard .footer-dashboard .menu-footer li a:hover { color: #44b774; } .has-dashboard .profile-dashboard { padding: 100px 74px; background-color: #F4F6F8; } .has-dashboard .profile-dashboard .title { padding-right: 10px; position: relative; } .has-dashboard .profile-dashboard .title::before { position: absolute; content: ""; height: 80%; width: 1px; background-color: #44b774; right: 0; top: 50%; transform: translateY(-50%); } .has-dashboard .profile-dashboard .title-add-tour { font-size: 26px; line-height: 47px; } .has-dashboard .profile-dashboard .widget-dash-board { background-color: #FFFFFF; border-radius: 16px; padding: 60px 50px 92px 50px; } .has-dashboard .profile-dashboard .inner-header .title { font-size: 28px; line-height: 35px; font-weight: 700; margin-bottom: 7px; } .has-dashboard .profile-dashboard .edit-profile .title { margin-bottom: 20px; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .title-avata { font-size: 21px; font-weight: 600; color: #081E2A; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap { margin-right: 92px; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .avata img { width: 158px; height: 138px; border-radius: 8px; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .avata .icon-delete { position: absolute; right: 7px; top: 6px; padding: 6px 8px; background-color: #FFFFFF; border-radius: 3px; cursor: pointer; color: #081E2A; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .avata .icon-delete:hover { background-color: #FF494F; color: #FFFFFF; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .upload { font-size: 18px; font-weight: 400; display: inline-block; margin-top: 12px; margin-bottom: 12px; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .upload-file { min-width: 648px; width: 100%; border: 1px solid #EDEEEE; border-radius: 5px; padding: 10px; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .upload-file input { width: 100%; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap p { font-size: 16px; font-weight: 500; margin-top: 23px; } .has-dashboard .profile-dashboard .edit-profile .grid-input-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 25px; } .has-dashboard .profile-dashboard .edit-profile .grid-input-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px 40px; } .has-dashboard .profile-dashboard .edit-profile .input-wrap label { display: block; } .has-dashboard .profile-dashboard .edit-profile .input-wrap label i { color: #44b774; margin-left: 10px; } .has-dashboard .profile-dashboard .edit-profile .input-wrap input { width: 334px; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .send-otp { margin-top: 20px; margin-bottom: 10px; font-size: 16px; font-weight: 500; display: inline-block; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .input-wrap input { width: 100%; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .button-wrap .save { padding: 20px 30px; border-radius: 8px; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .button-wrap .save:hover { background-color: #177ec2; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .button-wrap .save i { margin-left: 10px; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .button-wrap .reset { background-color: transparent; color: #081E2A; padding: 20px 30px; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .button-wrap .reset:hover { color: #44b774; } .has-dashboard .profile-dashboard .edit-profile .otp-dashboard .button-wrap .reset i { margin-left: 10px; } .has-dashboard .profile-dashboard .favorite-wrap { padding: 34px 38px 64px 63px; background-color: #FFFFFF; border-radius: 10px; } .has-dashboard .profile-dashboard .favorite-wrap .favorite-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px 34px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap label { font-size: 18px; font-family: 700; line-height: 56px; color: #081E2A; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap input { width: 100%; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .nice-select { padding: 21px 15px 21px 35px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .upload-image-add-car { display: flex; gap: 27px; justify-content: flex-start; flex-wrap: wrap; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .upload-image-add-car .upload-image .uploadLabel { padding: 43px 20px; position: relative; height: 148px; width: 149px; background-color: #FFFFFF; border: 1px solid #EDEEEE; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 5px; -webkit-transition: all 0.25s linear; -moz-transition: all 0.25s linear; transition: all 0.25s linear; text-align: center; margin-bottom: 0px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .upload-image-add-car .upload-image .uploadLabel i { font-size: 30px; color: #B4B4B4; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .upload-image-add-car .upload-image .uploadLabel span { font-size: 16px; font-weight: 500; color: #B4B4B4; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .upload-image-add-car .upload-image .uploadLabel .photoLoad { position: absolute; right: 0; bottom: 0; width: 100%; height: 100%; cursor: pointer; opacity: 0; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .icon-delete-title { width: 61px; height: 59px; background-color: #EBEBEB; border-radius: 5px; cursor: pointer; margin-right: 20px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .button-add { padding: 15px 35px; border-radius: 5px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .button-add i { font-size: 12px; margin-left: 5px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .icon-delete-price { background-color: #FFFFFF; padding: 10px; border-radius: 8px; color: #44b774; box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.07); cursor: pointer; margin-right: 17px; } .has-dashboard .profile-dashboard .form-add-tour .input-wrap .icon-delete-price:hover { background-color: #FF494F; color: #FFFFFF; } .has-dashboard .profile-dashboard .form-add-tour .grid-input-2 { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 50px; width: 100%; } .has-dashboard .profile-dashboard .form-add-tour .grid-input-3 { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 35px; width: 100%; } .has-dashboard .profile-dashboard .my-listing-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 33px 23px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item { box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.06); border-radius: 5px; padding: 17px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .image img { width: 202px; height: 185px; object-fit: cover; border-radius: 8px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .image .featured { font-size: 14px; font-weight: 500; color: #FFFFFF; background-color: #177ec2; line-height: 23px; padding: 2px 14px; border-radius: 4px; position: absolute; display: inline-block; right: 7px; top: 9px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content { width: 100%; padding-right: 22px; padding-top: 10px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .map { font-size: 14px; font-weight: 500; font-family: "DM Sans", sans-serif; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .map i { color: #44b774; margin-left: 5px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .media { padding: 8px 5px; border-radius: 5px; background-color: #44b774; color: #FFFFFF; font-size: 14px; font-weight: 500; line-height: 14px; margin-right: 10px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .media i { margin-left: 5px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .review i { color: #177ec2; font-size: 12px; margin-left: 4px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .review span { font-size: 14px; font-weight: 500; margin-right: 5px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .list-meta { margin-top: 23px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .list-meta li:not(:last-child) { margin-left: 13px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .list-meta li i { color: #44b774; margin-left: 10px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .list-meta li span { font-size: 16px; font-weight: 500; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .price { font-size: 15px; font-weight: 500; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content .price span { font-size: 16px; font-weight: 600; } .has-dashboard .profile-dashboard .my-booking-wrap { border-radius: 10px; background-color: #FFFFFF; padding-bottom: 88px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content { padding: 32px 50px 0px 28px; width: 100%; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li { border-bottom: 1px solid #EDEEEE; width: 100%; padding-bottom: 29px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li:not(:last-child) { margin-bottom: 29px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list { min-width: 400px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list .image { margin-left: 25px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list .image img { width: 142px; height: 111px; object-fit: cover; border-radius: 4px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list .content .id { font-size: 14px; font-weight: 500; display: block; line-height: 17px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list .content .title-booking { font-size: 17px; font-weight: 600; line-height: 30px; margin-bottom: 5px; margin-top: 3px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list .content .price { font-size: 15px; font-weight: 700; line-height: 19px; color: #D01818; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .booking-list-table { width: 100%; text-align: center; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .status { font-size: 15px; font-weight: 500; line-height: 20px; padding: 6px 15px; background-color: #44b774; color: #FFFFFF; border-radius: 15px; display: inline-block; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .date-gues { font-size: 16px; font-weight: 600; line-height: 30px; color: #081E2A; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .action-wrap { gap: 10px; max-width: 145px; width: 100%; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .action-wrap .action { width: 44px; height: 43px; border: 1px solid #EDEEEE; border-radius: 11px; color: #44b774; cursor: pointer; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content li .action-wrap .action:hover { background-color: #44b774; color: #FFFFFF; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-title { padding: 20px 50px 16px 28px; background-color: #021B32; border-radius: 8px; width: 100%; gap: 20px; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-title li { width: 100%; text-align: center; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-title li:first-child { min-width: 400px; text-align: right; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-title li:last-child { max-width: 145px; width: 100%; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-title li p { color: #FFFFFF; font-size: 16px; font-weight: 600; line-height: 30px; } .has-dashboard .profile-dashboard .counter-dashboard { padding: 22px 28px 28px 28px; background-color: #FFFFFF; border-radius: 9px; } .has-dashboard .profile-dashboard .counter-dashboard .icon { width: 65px; height: 65px; border-radius: 100%; background-color: rgba(77, 165, 40, 0.13); margin-left: 38px; } .has-dashboard .profile-dashboard .counter-dashboard .icon i { font-size: 28px; color: #44b774; } .has-dashboard .profile-dashboard .counter-dashboard .content span { font-size: 16px; font-weight: 500; line-height: 20px; color: #081E2A; display: block; margin-bottom: 10px; } .has-dashboard .profile-dashboard .counter-dashboard .content .number-counter { font-size: 26px; font-weight: 800; line-height: 32px; color: #081E2A; position: relative; } .has-dashboard .profile-dashboard .counter-dashboard .content .money::after, .has-dashboard .profile-dashboard .counter-dashboard .content .plus::after { position: absolute; } .has-dashboard .profile-dashboard .counter-dashboard .content .money::after { content: "$"; } .has-dashboard .profile-dashboard .counter-dashboard .content .plus::after { content: "+"; } .has-dashboard .profile-dashboard .page-insight { padding: 35px 22px 35px 55px; background-color: #FFFFFF; border-radius: 19px; border: 1px solid #EDEEEE; } .has-dashboard .profile-dashboard .tfcl-card { background-color: #FFFFFF; border-radius: 10px; padding: 32px 37px; } .has-dashboard .profile-dashboard .dashboard-message .message li:not(:last-child) { margin-bottom: 26px; } .has-dashboard .profile-dashboard .dashboard-message .message li .icon { font-size: 17px; color: #44b774; margin-left: 18px; } .has-dashboard .profile-dashboard .dashboard-message .message li p { font-size: 15px; font-weight: 500; line-height: 23px; color: #081E2A; } .has-dashboard .profile-dashboard .dashboard-reviews ul .comment-by-user:not(:last-child) { margin-bottom: 40px; } .has-dashboard .profile-dashboard .dashboard-reviews ul .comment-by-user .group-author { margin-left: 11px; } .has-dashboard .profile-dashboard .dashboard-reviews ul .comment-by-user .group-author img { width: 56px; height: 56px; border-radius: 100%; object-fit: cover; } .has-dashboard .profile-dashboard .dashboard-reviews ul .comment-by-user .content .group-name .review-name { font-size: 14px; font-weight: 700; line-height: 25px; color: #081E2A; } .has-dashboard .profile-dashboard .dashboard-reviews ul .comment-by-user .content .group-name .rating-wrap i { font-size: 15px; color: #177ec2; } .has-dashboard .profile-dashboard .dashboard-reviews ul .comment-by-user .content p { font-size: 14px; font-weight: 400; line-height: 24.8px; margin-top: 4px; } .counter-grid-dashboard { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; } .offcanvas .offcanvas-body .logo-canvas { margin-bottom: 30px; } .offcanvas .offcanvas-body .logo-canvas img { width: 170px; } .offcanvas .offcanvas-body .des { color: #4F545A; margin-bottom: 20px; } .offcanvas .offcanvas-body .canvas-info { margin-bottom: 20px; } .offcanvas .offcanvas-body .canvas-info li i { color: #44b774; font-size: 20px; margin-left: 10px; } .offcanvas .offcanvas-body .canvas-info li p { color: #4F545A; } .offcanvas .offcanvas-body .social li a { background-color: #44b774; } .offcanvas .offcanvas-body .social li a:hover { background-color: #177ec2; color: #FFFFFF; } .wrapper-layout-map .wrap-left { width: 45%; padding: 108px 67px 118px 31px; } .wrapper-layout-map .wrap-right { width: 55%; } .populer-activities, .tour-package-swipper { padding-bottom: 30px; margin-bottom: -30px; } .view-all-wrap .view-all { margin-left: 15px; } .footer .footer-main { display: flex; padding-top: 165px; padding-bottom: 77px; } .footer-style1.footer-home3 .footer-main { padding-top: 80px; } .footer-style1 { background-color: #1D231F; } .footer-style1 .footer-main { display: flex; padding-top: 165px; padding-bottom: 83px; } .footer-style1 .footer-main .title { margin-bottom: 25px; color: #FFFFFF; line-height: 35px; } .footer-style1 .footer-main .footer-logo { width: 29.8%; padding-left: 4em; } .footer-style1 .footer-main .footer-logo .logo-footer { margin-bottom: 26px; } .footer-style1 .footer-main .footer-logo .logo-footer img { width: 130px; } .footer-style1 .footer-main .footer-logo .des-footer { color: #FFFFFF; margin-bottom: 20px; } .footer-style1 .footer-main .footer-logo .footer-info li:not(:last-child) { margin-bottom: 11px; } .footer-style1 .footer-main .footer-logo .footer-info li i { color: #44b774; margin-left: 12px; font-size: 17px; } .footer-style1 .footer-main .footer-logo .footer-info li p, .footer-style1 .footer-main .footer-logo .footer-info li a { font-size: 16px; font-weight: 500; line-height: 34px; color: #FFFFFF; } .footer-style1 .footer-main .footer-service { width: 17.2%; padding-left: 2em; } .footer-style1 .footer-main .footer-service .footer-menu li:not(:last-child) { margin-bottom: 11px; } .footer-style1 .footer-main .footer-service .footer-menu li a { font-size: 16px; font-weight: 600; line-height: 35px; color: #B4B4B4; transition: all 0 0.3ss ease-in-out; } .footer-style1 .footer-main .footer-service .footer-menu li a:hover { color: #44b774; margin-right: 5px; } .footer-style1 .footer-main .footer-gallery { width: 30%; padding-right: 5px; padding-left: 6.8em; } .footer-style1 .footer-main .footer-gallery .gallery-img { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 10px; } .footer-style1 .footer-main .footer-gallery .gallery-img img { border-radius: 2px; } .footer-style1 .footer-main .footer-newsletter { width: 23%; padding-right: 3px; } .footer-style1 .footer-main .footer-newsletter .check-form { margin-top: 23px; margin-bottom: 30px; } .footer-style1 .footer-main .footer-newsletter .check-form i { color: #FFFFFF; padding: 5px; border: 1px solid #44b774; border-radius: 100%; margin-left: 12px; font-size: 12px; } .footer-style1 .footer-main .footer-newsletter .check-form p { font-size: 15px; font-weight: 500; line-height: 26px; color: #B4B4B4; } .footer-style1 .footer-main .footer-newsletter .social-ft li:not(:last-child) { margin-left: 24px; } .footer-style1 .footer-main .footer-newsletter .social-ft li a { color: #FFFFFF; } .footer-style1 .footer-main .footer-newsletter .social-ft li a:hover { color: #44b774; } .footer-style1 .footer-bottom { padding: 28px 0px; border-top: 1px solid rgba(242, 242, 242, 0.07); } .footer-style1 .footer-bottom p { font-size: 17px; color: #FFFFFF; } .footer-style2 { padding-top: 60px; background: url(https://assets.unlayer.com/projects/42726/1751528383002-map.png) no-repeat center center; background-size: cover; } .footer-style2 .footer-menu li:not(:last-child) { margin-bottom: 8px; } .footer-style2 .footer-menu li a { font-size: 14px; font-weight: bold; color: #4F545A; transition: all 0.3s ease-in-out; } .footer-style2 .footer-menu li a:hover { color: #44b774; margin-right: 5px; } .footer-style2 .footer-item-logo .logo { margin-bottom: 5px; margin-right: 35px; } .footer-style2 .footer-item-logo .logo img { width: 200px; } .footer-style2 .footer-item-logo .des-footer { font-size: 15px; font-weight: 400; text-align: center; line-height: 26px; margin-bottom: 27px; } .footer-style2 .footer-item-logo .social li:not(:last-child) { margin-left: 10px; } .footer-style2 .footer-item-logo .social li a { width: 40px; height: 40px; border-radius: 100%; border: 1px solid #44b774; background-color: rgba(0, 0, 0, 0.04); color: #4F545A; font-size: 12px; } .footer-style2 .footer-item-logo .social li a:hover { background-color: #44b774; color: #FFFFFF; } .footer-style2 .footer-item-company { padding-right: 68px; } .footer-style2 .footer-item-quick-link { padding-right: 29px; } .footer-style2 .footer-item-newsletter { margin-right: -13px; } .footer-style2 .footer-item-newsletter .des { font-size: 15px; font-weight: 400; line-height: 26px; } .footer-style2 .footer-bottom { margin-top: 40px; border-top: 1px solid #EDEEEE; padding-top: 20px; padding-bottom: 30px; } .footer-style2 .footer-bottom .copy-right { font-size: 15px; font-weight: 500; line-height: 27px; color: #081E2A; text-align: left; } .footer-style2 .footer-bottom .policy-tern li:not(:first-child) { margin-right: 40px; } .footer-style2 .footer-bottom .policy-tern li a { font-size: 15px; font-weight: 500; line-height: 27px; color: #081E2A; } .footer-style2 .footer-bottom .policy-tern li a:hover { color: #44b774; } /*----------------------Slide-home 01--------------------*/ .slider-home1 .silider-image::before { background: linear-gradient(-90deg, rgb(4, 27, 40), rgba(0, 0, 0, 0)); top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; z-index: 2; } .slider-home1 .silider-image img { position: absolute; } .slider-home1 .silider-image .image-slide { width: 100%; height: 100%; object-fit: cover; } .slider-home1 .silider-image .mask-slide { width: auto; z-index: 2; height: 100%; } .slider-home1 .silider-image .mask-flane { width: auto; right: 0px; bottom: 5.8%; z-index: 2; animation: dot-anim-2 3s linear 0s infinite alternate; } .slider-home1 .silider-image .booking-title { position: absolute; z-index: 3; left: 33.6%; top: 11%; rotate: -5deg; } .slider-home1 .silider-image .booking-title .booking { font-size: 40px; font-weight: 400; line-height: 50.69px; font-family: "Yesteryear", sans-serif; color: #FFFFFF; padding: 18px 33px 14px 33px; border: 2px solid #44b774; display: inline-block; position: relative; } .slider-home1 .silider-image .booking-title .booking::before { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; top: -5px; right: -8px; } .slider-home1 .silider-image .booking-title .booking::after { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; top: -5px; left: -8px; } .slider-home1 .silider-image .booking-title span::before { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; bottom: -10px; right: -10px; } .slider-home1 .silider-image .booking-title span::after { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; bottom: 0px; left: -15px; } .slider-home1 .slider-content { position: relative; z-index: 3; padding-top: 144px; padding-bottom: 202px; } .slider-home1 .slider-content .title-slide { text-transform: uppercase; font-size: 70px; font-weight: 700; line-height: 95px; } .slider-home1 .slider-content .des { max-width: 570px; width: 100%; } .slider-home1 .slider-content .btn-group .btn-main { padding: 15px 24px; } .btn-group { gap: 40px; flex-wrap: wrap; } .btn-group .btn-w-wa { font-size: 20px; font-weight: 500; line-height: 29px; padding: 18px 0px; color: #FFFFFF; } .btn-group .btn-w-wa i { color: #44b774; font-size: 16px; margin-right: 7px; margin-right: 5px; transition: all 0.3s ease; } .btn-group .btn-w-wa:hover { color: #177ec2; } .btn-group .btn-w-wa:hover i { margin-right: 12px; } .btn-nex-prev { position: absolute; left: 11.6%; top: 33%; z-index: 4; } .btn-nex-prev .swiper-button-next::after { content: "\e970"; } .btn-nex-prev .swiper-button-prev::after { content: "\e971"; } .btn-nex-prev .next-home1, .btn-nex-prev .prev-home1 { position: relative !important; background-color: rgba(255, 255, 255, 0.5); gap: 25px; right: 0; left: 0; top: 0; bottom: 0; margin: 25px 0px; } .btn-nex-prev .next-home1::before, .btn-nex-prev .next-home1::after, .btn-nex-prev .prev-home1::before, .btn-nex-prev .prev-home1::after { color: #081E2A; font-weight: 600; } .btn-nex-prev .next-home1:hover, .btn-nex-prev .prev-home1:hover { background-color: #177ec2; } .btn-nex-prev .next-home1.swiper-button-disabled, .btn-nex-prev .prev-home1.swiper-button-disabled { opacity: 1; background-color: rgba(4, 28, 41, 0.5); } .btn-nex-prev .next-home1.swiper-button-disabled::before, .btn-nex-prev .next-home1.swiper-button-disabled::after, .btn-nex-prev .prev-home1.swiper-button-disabled::before, .btn-nex-prev .prev-home1.swiper-button-disabled::after { color: #FFFFFF; } /*----------------------Slide-home 02--------------------*/ .slider-home2-image .slider-home2 { position: relative; } .slider-home2-image .slider-home2::before { background: linear-gradient(-80deg, rgba(1, 10, 4, 0.89), rgba(0, 0, 0, 0.34)); top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; z-index: 2; border-radius: 25px; } .slider-home2-image .slider-home2 .image-slider-home2 { height: 500px; object-fit: cover; /* border-radius: 25px; */ } .slider-home2-image .slider-home2 .next-slider2 { border: 1px solid rgba(255, 255, 255, 0.28); top: 86% !important; left: 5%; background-color: transparent; color: #FFFFFF !important; } .slider-home2-image .slider-home2 .next-slider2::after { content: "\e926"; font-family: "icomoon"; font-size: 15px; } .slider-home2-image .slider-home2 .swiper-button-disabled::after { color: #FFFFFF !important; } .slider-home2-image .slider-home2 .prev-slider2 { border: 1px solid rgba(255, 255, 255, 0.28); top: 86% !important; right: 86.5%; background-color: transparent; color: #FFFFFF !important; } .slider-home2-image .slider-home2 .prev-slider2::after { content: "\e925"; font-family: "icomoon"; font-size: 15px; } .slider-home2-content { position: absolute; z-index: 2; padding-top: 50px; padding-bottom: 0; top: 0; right: 50%; width: 100%; transform: translateX(50%); } .slider-home2-content .mask-slide2 { position: absolute; width: auto; top: 0; right: 0; z-index: 1; } .slider-home2-content .mask-slide2-flan { width: auto; right: 17%; position: absolute; top: 15%; z-index: -1; } div#pills-tab2Content { background: white; border-radius: 10px; min-height: 160px; align-items: center; width: 100%; padding: 20px; } .slider-home2-content .sub-title { font-size: 28px; font-weight: 400; line-height: 46px; display: inline-block; } .slider-home2-content .title-slide { text-transform: capitalize; font-size: 40px; font-weight: 800; line-height: 1.4; margin-top: 7px; margin-bottom: 20px; } .slider-home2-content p { color: white; font-size: 20px; } .slider-home2-content .tour-list { margin-top: 38px; } .slider-home2-content .tour-list ul li:not(:last-child) { margin-left: 37px; } .slider-home2-content .tour-list ul li i { font-size: 8px; padding: 5px; color: #FFFFFF; border-radius: 100%; background-color: #44b774; margin-left: 8px; } .slider-home2-content .tour-list ul li span { font-size: 16px; font-weight: 600; color: #FFFFFF; line-height: 30px; text-transform: capitalize; } /*----------------------Slide-home 03--------------------*/ .booking-title { z-index: 3; rotate: -5deg; position: relative; } .booking-title .booking { font-family: "Yesteryear", sans-serif; color: #44b774; font-weight: 400; padding: 7px 5px 0px 17px; border: 2px dotted #44b774; display: inline-block; position: relative; rotate: -4deg; margin-right: -8px; margin-left: -6px; transition: all 0.3s; } .booking-title .booking:hover { rotate: 0deg; } .booking-title .booking::before { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; top: -5px; right: -8px; } .booking-title .booking::after { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; top: -5px; left: -8px; } .booking-title .dot::before { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; bottom: -5px; right: -8px; } .booking-title .dot::after { position: absolute; content: ""; width: 15px; height: 13px; background-color: #FFFFFF; border: 2px solid #44b774; bottom: -5px; left: -8px; } .slider-home3 { padding-right: 15.6%; } .slider-home3 .slider-home3-content { padding-top: 174px; padding-bottom: 232px; padding-left: 2.7em; } .slider-home3 .slider-home3-content .title-slide { font-size: 70px; font-weight: 800; line-height: 70px; text-transform: capitalize; margin-top: 10px; } .slider-home3 .slider-home3-content .des { max-width: 570px; width: 100%; } .slider-home3 .slider-home3-content .btn-group .btn-w-wa { color: #081E2A; } .slider-home3 .slider-home3-content .btn-group .btn-w-wa:hover { color: #177ec2; } /*----------------------Slide-home 04--------------------*/ .slider-home4 { background-image: url(../../assets/images/slide/slide4.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding-top: 267px; padding-bottom: 203px; background-attachment: fixed; } .slider-home4::before { top: 0; left: 0; right: 0; bottom: 0; position: absolute; background-color: rgba(0, 0, 0, 0.28); content: ""; z-index: 1; } .slider-home4 .mask-slider { position: absolute; left: 0; top: 0; z-index: 1; } .slider-home4 .mask-slider img { width: auto; height: 100%; } .slider-home4 .home4-content { padding-left: 4em; z-index: 3; position: relative; } .slider-home4 .home4-content .sub-title { font-size: 26px; margin-bottom: 4px; } .slider-home4 .home4-content .title-slide { font-size: 75px; font-weight: 800; line-height: 85px; text-transform: capitalize; margin-bottom: 57px; } .slider-home4 .home4-content .btn-group { gap: 20px; flex-wrap: wrap; } .slider-home4 .home4-content .btn-group .btn-main { padding: 18px 23px; } .slider-home4 .home4-content .btn-group .btn-w-wa { color: #44b774; font-size: 16px; font-weight: 700; line-height: 65px; padding: 0px 5px; text-decoration: underline; } .slider-home4 .home4-content .btn-group .btn-w-wa:hover { color: #FFFFFF; } .slider-home4 .widget-icon-video { position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } /*----------------------Slide-home 05--------------------*/ .slider-home5 { padding-top: 112px; padding-bottom: 185px; background-color: #212622; } .slider-home5 .mask-left { width: 305px; height: 408px; background: linear-gradient(0deg, rgba(241, 176, 10, 0.45), rgba(255, 183, 0, 0.31), rgba(23, 38, 61, 0)); clip-path: polygon(0 0, 0% 100%, 100% 0); opacity: 0.97; position: absolute; top: 0; right: 0; z-index: 1; } .slider-home5 .mask-right { width: 305px; height: 408px; background: linear-gradient(-262deg, rgba(77, 165, 40, 0.52), rgba(77, 165, 40, 0.25), rgba(23, 38, 61, 0)); clip-path: polygon(0 100%, 100% 100%, 100% 0); opacity: 0.97; position: absolute; bottom: 0; left: 0; z-index: 1; } .slider-home5 .image-slide-home5 { margin-left: -69px; margin-right: -25px; } .slider-home5 .image-slide-home5 .image-svg { width: auto; position: absolute; bottom: -7%; right: -9%; animation: anime-rorate 8s infinite; } .slider-home5 .image-slide-home5 span { font-size: 54px; font-weight: 400; line-height: 54.8px; rotate: -42deg; position: absolute; bottom: 14%; left: 3%; } .slider-home5 .content-slide-home5 { padding-left: 3em; padding-top: 24px; } .slider-home5 .content-slide-home5 .title-slide { font-size: 70px; font-weight: 800; line-height: 77px; text-transform: capitalize; margin-top: 7px; margin-bottom: 38px; z-index: 2; position: relative; } .slider-home5 .content-slide-home5 .des { width: 570px; max-width: 100%; } .slider-home5 .content-slide-home5 .widget-icon-video { width: 60px; height: 60px; margin-right: 38px; } .slider-home5 .content-slide-home5 .image-svg2 { position: absolute; top: 38.3%; right: -1%; width: auto; z-index: 1; animation: dot-anim-2 3s linear 0s infinite alternate; } #footer-form .input-wrap { position: relative; padding: 5px 7px; background-color: #FFFFFF; border-radius: 30px; } #footer-form .input-wrap input { padding: 10px; border: unset; } #footer-form .input-wrap button { border-radius: 30px; padding: 7px 25px; } #search-bar-widget { position: relative; } #search-bar-widget input { background-color: #FFFFFF; border: unset; border-radius: unset; padding: 15px 15px 15px 60px; } #search-bar-widget button { background-color: transparent; position: absolute; left: 0; top: 0; color: #081E2A; padding: 16px 32px; } #comment .group-gap { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 33px; } #comment .input-cmt { background-color: #FFFFFF; border-radius: unset; color: #4F545A; font-weight: 400; } #comment .input-cmt::placeholder { color: #4F545A; font-weight: 400; } #comment .checkbox { margin-top: 20px; margin-bottom: 70px; } #comment .checkbox label { margin-bottom: 0px; } .search-form-widget-slider { background-color: #FFFFFF; padding: 32px 35px 30px 28px; border-radius: 6px; box-shadow: 0px 7px 29px 0px rgba(0, 0, 0, 0.06); width: 100%; z-index: 20; } .wd-search .form-group { position: relative; text-align: right; } .wd-search .form-group:not(:last-child) { margin-left: 20px; } .wd-search .form-group:not(:last-child)::before { height: 61px; width: 1px; background-color: #EDEEEE; position: absolute; content: ""; left: -6px; } .wd-search .form-group i { color: #44b774; font-size: 20px; margin-left: 13px; margin-top: 8px; } .wd-search .form-group i.fs-30 { font-size: 30px !important; } .wd-search .form-group i.fs-40 { font-size: 40px !important; } .wd-search .form-group .search-bar-group { position: relative; } .wd-search .form-group .search-bar-group label { font-size: 17px; font-weight: 700; line-height: 20px; color: #081E2A; margin-bottom: 0px; position: absolute; top: 5px; right: 0; } .wd-search .form-group .search-bar-group input { padding: 38px 0px 5px 30px; border: unset !important; } .wd-search .form-group .search-bar-group .nice-select { padding: 35px 0px 8px 30px; border: unset !important; width: 200px; } .wd-search .form-group .search-bar-group .nice-select::after { top: 36%; } .wd-search .form-group .icon-icon-filter { margin-left: 23px; cursor: pointer; } .wd-search .form-group .icon-icon-filter i { font-size: 30px; color: #44b774; } .wd-search .form-group .icon-icon-filter i:hover { color: #177ec2; } .wd-search .form-group .btn-search { background-color: #44b774; font-size: 18px; font-weight: 500; line-height: 18px; border-radius: 33px; padding: 20px 40px 20px 46px; color: #FFFFFF; } .wd-search .form-group .btn-search i { color: #FFFFFF; margin-left: 11px; font-size: 17px; } .wd-search .form-group .btn-search:hover { background-color: #177ec2; } .search-mobie .modal-dialog { max-width: 800px; margin: 90px auto; padding: 0px 15px; } .search-mobie .modal-dialog .modal-content { border-radius: 16px; } .search-mobie .modal-dialog .search-form-mobie .search { position: relative; display: flex; align-items: center; flex-wrap: nowrap; } .search-mobie .modal-dialog .search-form-mobie .search i { position: absolute; right: 0; top: 20px; } .search-mobie .modal-dialog .search-form-mobie .search .search-input { border: unset; padding: 15px 25px 15px 20px; } .search-mobie .modal-dialog .search-form-mobie .search button { border-radius: 30px; padding: 20px 30px; } .search-mobie .modal-dialog .btn-close:before { content: "\e986"; font-size: 18px; color: #FFFFFF; font-family: "icomoon"; } .search-mobie .modal-dialog .btn-close { position: absolute; left: 0; top: -30px; padding: 0; background: transparent; } .form-search-faq { padding: 11px; background-color: #FFFFFF; border-radius: 50px; max-width: 912px; width: 100%; } .form-search-faq button { max-width: 184px; width: 100%; border-radius: 50px; padding: 20px 20px; } .form-search-faq button i { margin-left: 10px; } .form-search-faq input { border: 1px solid transparent !important; } .form-search-faq input::placeholder { color: #4F545A; text-transform: capitalize; font-size: 16px; } #form-contact-us .input-wrap:not(:last-child) { margin-bottom: 50px; } #form-contact-us .input-wrap i { position: absolute; right: 15px; top: 10px; font-size: 20px; } #form-contact-us .input-wrap i svg { width: 20px; height: 20px; position: relative; top: -7px; } #form-contact-us .input-wrap input, #form-contact-us .input-wrap textarea { padding: 10px 48px 10px 20px; /* border: unset; */ border-radius: 10px; font-size:15px; border-bottom: 1px solid #EDEEEE; } #form-contact-us .iti.iti--allow-dropdown { width: 100%; } #form-contact-us .input-wrap { margin-bottom: 20px; } #form-contact-us .input-wrap input::placeholder, #form-contact-us .input-wrap textarea::placeholder { font-size: 14px; font-weight: bold; line-height: 22px; } #form-contact-us .input-wrap input:focus, #form-contact-us .input-wrap textarea:focus { border-bottom: 1px solid #081E2A; } #form-contact-us .btn-submit-contact i { margin-left: 10px; } #form-book-tour input, #form-book-tour .nice-select { background-color: #FFFFFF; padding: 10px; font-weight: bold; font-size: 14px; } #form-book-tour .label { font-size: 15px; font-weight: 700; line-height: 30px; color: rgb(34, 34, 34); } #form-book-tour p { font-size: 15px; font-weight: 500; line-height: 26px; color: #83827F; } #form-book-tour .input-wrap-sellect .nice-select { width: 115px; } #form-book-tour .input-wrap-checkbox .extra { margin-right: 32px; } #form-book-tour .input-wrap-checkbox .extra .name { font-size: 15px; font-weight: 500; line-height: 39px; color: #83827F; margin-left: 4px; width: 90px; } #form-book-tour .input-wrap-checkbox .extra .price { font-size: 14px; font-weight: 500; line-height: 39px; color: #081E2A; } #form-book-tour .total { font-size: 22px; font-weight: 700; } #form-book-tour button { width: 100%; border-radius: 3px; text-transform: uppercase; display: flex; justify-content: center; transition: all 0.3s ease-in-out; } #form-book-tour button:hover { background-color: #177ec2; } #form-review .input-wrap input, #form-review .input-wrap textarea { background-color: #FFFFFF; padding: 20px 50px 20px 17px; } #form-review .input-wrap i { position: absolute; top: 24px; right: 20px; } #form-review .checkbox label { font-size: 16px; font-weight: 500; line-height: 20px; } #form-review .submit { width: 100%; text-transform: uppercase; } #form-review .submit:hover { background-color: #177ec2; } .form-footer-st2 { box-shadow: 0px 13px 22px 0px rgba(6, 34, 51, 0.06); } .form-footer-st2 .input-search { border: unset; } .form-footer-st2 .input-search:focus { border: unset; } .form-footer-st2 button { padding: 20px 25px; border-radius: 8px; } .wd-search-form { position: absolute; width: 97%; margin-top: 105px; right: 20px; left: 0; background-color: #FFFFFF; padding: 10px; box-shadow: 0px 7px 29px 0px rgba(0, 0, 0, 0.06); border-radius: 5px; z-index: 9; opacity: 0; visibility: hidden; text-align: right; transition: all 0.3s ease-in-out; } .wd-search-form.show { opacity: 1; visibility: visible; } .wd-search-form .input-group-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; } .accordion-button { font-weight: bold; font-size: 15px; } .accordion-body { font-size: 14px; color: #495057; } /** * scroll-top * PreLoad * pagination * Social * price-range * video * widget Tour List * Counter * widget Destination * Blog * widget clip text * widget icon box * widget Testimonial * widget Team * Gallery * widget Image Box * Faq * Count Down */ /* Scroll Top -------------------------------------------------------------- */ .button-go { position: fixed; display: block; width: 47px; height: 47px; line-height: 47px; border-radius: 6px; text-align: center; z-index: 999; left: 25px; bottom: 30px; opacity: 0; visibility: hidden; cursor: pointer; overflow: hidden; } .button-go.show { left: 20px; opacity: 1; visibility: visible; } .button-go::before, .button-go::after { content: ""; position: absolute; top: 0; right: 0; width: 100%; height: 100%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .button-go::before { z-index: -1; background-color: #44b774; } .button-go::after { content: "\e9db"; font-family: "icomoon"; font-size: 15px; color: #FFFFFF; font-weight: 600; } .button-go:hover { transform: translateY(-3px); } /* PreLoad -------------------------------------------------------------- */ .pl { width: 6em; height: 6em; } .pl__ring { animation: ringA 2s linear infinite; } .pl__ring--a { stroke: #44b774; } .pl__ring--b { animation-name: ringB; stroke: #177ec2; } .pl__ring--c { animation-name: ringC; stroke: #177ec2; } .pl__ring--d { animation-name: ringD; stroke: #44b774; } .preload { overflow: hidden; } .preload-container { position: relative; width: 100%; height: 100%; background: #FFFFFF; position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 99999999999; display: flex; justify-content: center; align-items: center; } /*pagination -------------------------------------------------------------- */ .swiper-pagination .swiper-pagination-bullet { background: #d0d0d0; opacity: 1; margin: 0px 7px !important; } .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #44b774 !important; position: relative; margin: 0px 14px !important; } .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::before { width: 26px; height: 26px; border-radius: 100%; border: 1px solid #44b774; position: absolute; content: ""; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .swiper-button-next { background-color: #44b774; } .swiper-button-next::after { content: "\e9e0"; font-family: "icomoon"; font-size: 15px !important; } .swiper-button-prev { background-color: #44b774; } .swiper-button-prev::after { content: "\e9df"; font-family: "icomoon"; font-size: 15px !important; } .swiper-button-disabled { background-color: #DCDCDC; } .swiper-button-disabled::after { color: #44b774 !important; } /*pagination -------------------------------------------------------------- */ .tf-pagination { flex-wrap: wrap; gap: 16px; margin-top: 40px; justify-content: center; } .tf-pagination li { color: #FFFFFF; } .tf-pagination li .pages-link { width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; color: #44b774; border: 1px solid #44b774; border-radius: 100%; } .tf-pagination li .pages-link:hover { background-color: #44b774; color: #FFFFFF; } .tf-pagination li.active { background-color: #44b774; color: #FFFFFF; border-radius: 100%; } .tf-pagination li.active>.pages-link { color: #FFFFFF; } /*Social -------------------------------------------------------------- */ .social { display: flex; align-items: center; gap: 10px; margin-right: 30px; } .social a { color: #FFFFFF; width: 40px; height: 40px; border-radius: 100%; display: flex; align-items: center; justify-content: center; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .social a:hover { background-color: rgba(255, 255, 255, 0.07); } .social a.active { background-color: rgba(255, 255, 255, 0.07); } /* price-range -------------------------------------------------------------- */ .noUi-target, .noUi-target * { -webkit-touch-callout: none; -webkit-user-select: none; -ms-touch-action: none; touch-action: none; -ms-user-select: none; -moz-user-select: none; user-select: none; -moz-box-sizing: border-box; box-sizing: border-box; } .noUi-target { position: relative; direction: rtl; } .noUi-base { width: 100%; height: 100%; position: relative; z-index: 1; } .noUi-origin { position: absolute; left: 0; top: 0; right: 0; bottom: 0; } .noUi-handle { position: relative; z-index: 1; } .noUi-stacking .noUi-handle { z-index: 10; } .noUi-state-tap .noUi-origin { -webkit-transition: right 0.3s, top 0.3s; transition: right 0.3s, top 0.3s; } .noUi-state-drag * { cursor: inherit !important; } .noUi-base, .noUi-handle { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .noUi-horizontal { height: 6px; } .noUi-horizontal .noUi-handle { position: relative; width: 17px; height: 17px; border-radius: 50px; right: 0px; top: -6.5px; background-color: #f6f6f6; border: 1px solid #ccc; } .caption { margin-top: 20px; } /* Styling; */ .noUi-background { background: #081E2A; } .noUi-connect { background: #44b774; -webkit-transition: background 450ms; transition: background 450ms; } .noUi-origin { border-radius: 2px; } .noUi-target { width: 100%; height: 6px; border-radius: 2px; } .noUi-horizontal .noUi-handle.noUi-handle-upper { right: -7px; } /* Handles and cursors; */ .noUi-draggable { cursor: w-resize; } .noUi-vertical .noUi-draggable { cursor: n-resize; } .noUi-handle { cursor: default; -webkit-box-sizing: content-box !important; -moz-box-sizing: content-box !important; box-sizing: content-box !important; } .noUi-handle:active { border: 1px solid #44b774; } /* Disabled state; */ [disabled].noUi-connect, [disabled] .noUi-connect { background: #B8B8B8; } [disabled].noUi-origin, [disabled] .noUi-handle { cursor: not-allowed; } .slider-labels .caption { font-weight: 500; font-size: 16px; color: #081E2A; line-height: 26px; } #slider-range-value01::after, #slider-range-value1::after { content: " — "; margin: 0 2px; } /* Tag -------------------------------------------------------------- */ .tag { display: flex; align-items: center; flex-wrap: wrap; } .tag li { margin-left: 14px; margin-bottom: 14px; } .tag li a { font-size: 14px; font-weight: 500; line-height: 17.64px; background-color: #FFFFFF; color: #4F545A; padding: 10px 18px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; display: inline-block; } .tag li a.active { background-color: #44b774; color: #FFFFFF; } .tag li a:hover { background-color: #44b774; color: #FFFFFF; } /* body -------------------------------------------------------------- */ /* video -------------------------------------------------------------- */ .widget-icon-video { width: 80px; height: 80px; border-radius: 100%; background-color: #44b774; animation: pulse_two 2s infinite; cursor: pointer; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .widget-icon-video:hover { background-color: #177ec2; } .widget-icon-video i { font-size: 20px; color: #FFFFFF; } /* video -------------------------------------------------------------- */ .image-list img, .image-list .icon { width: 36px; height: 36px; border-radius: 100%; border: 2px solid #FFFFFF; background-color: #44b774; } .image-list img i, .image-list .icon i { font-size: 8px; } .image-list .item:not(:first-child) { margin-right: -12px; } .client { font-size: 17px; font-weight: 500; line-height: 37px; padding-bottom: 13px; margin-right: 25px; border-bottom: 1px solid #EDEEEE; color: #000000; } /* Next Priev -------------------------------------------------------------- */ .swiper-button-next, .swiper-button-prev { width: 66px; height: 66px; border-radius: 100%; } .swiper-button-next::after, .swiper-button-prev::after { font-size: 20px; } .swiper-button-next::before, .swiper-button-prev::before { font-size: 20px; } .swiper-button-next:hover, .swiper-button-prev:hover { background-color: #177ec2 !important; } /* widget heading -------------------------------------------------------------- */ .sub-title-heading { font-size: 18px; font-weight: 500; line-height: 22.68px; display: inline-block; } /* widget Tour List -------------------------------------------------------------- */ .tour-listing { border-radius: 8px 8px 8px 8px; position: relative; overflow: hidden; } .tour-listing:hover .tour-listing-image img { transform: scale(1.1); } .tour-listing:hover .tour-listing-content .tag-listing { background-color: #44b774; color: #FFFFFF; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .featured-cities .flex-two { justify-content: center; } .tour-listing .tour-listing-image { position: relative; display: block; } .tour-listing .tour-listing-image .badge-top { position: absolute; width: 100%; z-index: 2; right: 0px; left: 0px; padding-right: 12px; padding-left: 16px; top: 12px; } .tour-listing .tour-listing-image .badge-top .feature { font-size: 14px; font-weight: 500; line-height: 20px; color: #FFFFFF; background-color: #14B0C3; padding: 4px 17px; border-radius: 4px; } .tour-listing .tour-listing-image .badge-top .badge-media .media { padding: 6px 8px; background-color: rgba(0, 0, 0, 0.63); border-radius: 2px; box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.05); color: #FFFFFF; font-size: 14px; font-weight: 500; line-height: 16px; display: flex; align-items: center; cursor: pointer; } .tour-listing .tour-listing-image .badge-top .badge-media .media:not(:first-child) { margin-right: 10px; } .tour-listing .tour-listing-image .badge-top .badge-media .media i { font-size: 16px; margin-left: 5px; } .tour-listing .tour-listing-image img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tour-listing .tour-listing-content { padding: 14px 29px 18px 40px; background-color: #FFFFFF; border-radius: 8px; margin-top: -73px; position: relative; text-align: center; } .tour-listing .tour-listing-content .tag-listing { font-size: 14px; font-weight: 500; line-height: 17px; background-color: #FFFFFF; padding: 6px 22px; border-radius: 4px; box-shadow: 0px 6px 9px 0px rgba(0, 0, 0, 0.05); position: absolute; top: -13px; left: 25px; } .tour-listing .tour-listing-content .map { font-size: 15px; font-weight: 400; line-height: 20px; color: #4F545A; font-family: "DM Sans", sans-serif; } .tour-listing .tour-listing-content .map i { color: #44b774; margin-left: 10px; font-size: 12px; } .tour-listing .tour-listing-content .title-tour-list { font-size: 14px; line-height: 30px; margin-top: 0px; margin-bottom: 8px; text-transform: inherit; } .tour-listing .tour-listing-content .review i { color: #177ec2; font-size: 16px; } .tour-listing .tour-listing-content .review span { font-size: 14px; font-weight: 500; line-height: 17px; color: #4F545A; margin-right: 6px; } .tour-listing .tour-listing-content .icon-box { padding-top: 0px; padding-bottom: 8px; border-bottom: 1px solid #EBEBEB; margin-bottom: 8px; flex-wrap: wrap; gap: 18px; justify-content: center; } .tour-listing .tour-listing-content .icon-box .icons i { color: #44b774; margin-left: 10px; font-size: 19px; } .tour-listing .tour-listing-content .icon-box .icons svg { margin-left: 10px; } .tour-listing .tour-listing-content .icon-box .icons svg path { stroke: #44b774; } .tour-listing .tour-listing-content .icon-box .icons span { font-size: 12px; font-weight: bold; color: #83827F; font-family: "Noto Sans Arabic", sans-serif; } .tour-listing .tour-listing-content .price-box { flex-wrap: wrap; gap: 8px; } .tour-listing .tour-listing-content .price-box p { font-size: 15px; font-weight: 500; color: #83827F; } .tour-listing .tour-listing-content .price-box p .price-sale { font-size: 16px; font-weight: 600; line-height: 20px; color: #44b774; } .tour-listing .tour-listing-content .price-box .price { font-size: 14px; font-weight: 500; line-height: 17px; color: #83827F; } .tour-listing .tour-listing-content .icon-bookmark { padding: 0px 10px; cursor: pointer; } .tour-listing .tour-listing-content .icon-bookmark i { font-size: 20px; color: #44b774; } /* widget Counter -------------------------------------------------------------- */ .tf-counter { background-color: #FFFFFF; padding: 50px; border: 1px solid rgba(255, 255, 255, 0.17); border-radius: 23px; box-shadow: 0px 14px 40px 0px rgba(0, 0, 0, 0.03); position: relative; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; z-index: 1; } .tf-counter:hover::before { border: 1px dashed #44b774; } .tf-counter:hover .icon svg { transform: rotateY(-180deg); } .tf-counter::before { content: ""; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); width: 90%; height: 92%; border: 2px dashed rgba(0, 0, 0, 0.17); border-radius: 23px; } .tf-counter .icon { color: #177ec2; height: 75px; } .tf-counter .icon svg { transition: all 0.5s ease; } .tf-counter .number-counter { font-size: 30px; font-weight: 700; color: #44b774; line-height: 40px; position: relative; } .tf-counter .number-counter.percen::after { position: absolute; content: "%"; } .tf-counter .number-counter.plus::after { position: absolute; content: "+"; } .tf-counter .line { height: 3px; width: 50px; border: 1px dashed #44b774; display: inline-block; margin-top: 19px; margin-bottom: 3px; } .tf-counter .title-counter { font-size: 18px; font-weight: 600; line-height: 27px; color: #081E2A; } .counter-item { padding: 50px 20px 45px 20px; border: 1px solid #EDEEEE; } .counter-item span { font-size: 18px; font-weight: 500; line-height: 49px; color: #081E2A; } .counter-item .number-counter { font-size: 42px; font-weight: 700; line-height: 49px; color: #081E2A; } .counter-item .number-counter.plus { position: relative; } .counter-item .number-counter.plus::after { content: "+"; } .counter-item .number-counter.kare { position: relative; } .counter-item .number-counter.kare::after { content: "k"; } /* widget Destination -------------------------------------------------------------- */ .tf-widget-destination:hover .destination-imgae img { transform: scale(1.1); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-destination:hover .destination-content .nation { background-color: #177ec2; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-destination:hover .destination-content .btn-destination .btn-view { background-color: #44b774; color: #FFFFFF; } .tf-widget-destination .destination-imgae { position: relative; overflow: hidden; display: block; border-radius: 10px; } .tf-widget-destination .destination-imgae::before { background: linear-gradient(-180deg, rgba(0, 0, 0, 0), rgb(0, 0, 0)); content: ""; top: 0; left: 0; right: 0; bottom: 0; position: absolute; z-index: 2; } .tf-widget-destination .destination-imgae .tour { font-size: 14px; font-weight: 600; line-height: 16px; padding: 6px 25px 9px 24px; background-color: #177ec2; color: #FFFFFF; text-transform: uppercase; border-radius: 4px; display: inline-block; position: absolute; left: 15px; top: 13px; z-index: 2; } .tf-widget-destination .destination-imgae img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-destination .destination-content { background-color: #FFFFFF; border-radius: 8px; box-shadow: 0px 4px 21px 0px rgba(0, 0, 0, 0.06); margin-right: 14px; margin-left: 26px; margin-top: -40px; z-index: 2; position: relative; overflow: hidden; } .tf-widget-destination .destination-content .nation { max-width: 245px; width: 100%; font-size: 17px; font-weight: 600; line-height: 28.76px; color: #FFFFFF; background-color: #44b774; text-transform: capitalize; display: inline-block; padding: 4px 19px 9px 19px; margin-top: -1px; clip-path: polygon(0 0, 100% 0, 88% 100%, 0% 100%); } .tf-widget-destination .destination-content .btn-destination { padding: 14px 19px 18px 36px; } .tf-widget-destination .destination-content .btn-destination .title { font-size: 18px; font-weight: 500; line-height: 22.68px; color: #000000; text-transform: math-auto; } .tf-widget-destination .destination-content .btn-destination .btn-view { width: 45px; height: 45px; background-color: #F4F6F8; border-radius: 100%; color: #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-destination .destination-content .btn-destination .btn-view:hover { background-color: #177ec2; color: #FFFFFF; } .tf-widget-destination .destination-content .btn-destination .btn-view i { font-size: 8px; } .destination-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 66px; } .destination-tour { margin: 0 auto; } .destination-tour:hover .destination-image>img { transform: scale(1.2) rotate(1deg); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .destination-tour:hover .destination-image::before { visibility: visible; opacity: 0.37; z-index: 2; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .destination-tour .destination-image { width: 160px; height: 160px; position: relative; display: block; overflow: hidden; border-radius: 100%; } .destination-tour .destination-image img { border-radius: 100%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .destination-tour .destination-image::before { position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); content: ""; width: 110px; height: 110px; background-color: rgba(10, 4, 4, 0.83); border-radius: 100%; visibility: hidden; opacity: 0; } .destination-tour .destination-tour-list { position: relative; margin-top: -26px; } .destination-tour .destination-tour-list .tour { font-size: 16px; font-weight: 500; line-height: 27.7px; color: #081E2A; position: absolute; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); } .destination-tour .title-tour { font-size: 20px; line-height: 30px; font-weight: 600; color: #081E2A; text-transform: capitalize; margin-top: 19px; } .destination-style { border-radius: 7px; overflow: hidden; display: block; height: 100%; } .destination-style:hover>img { transform: scale(1.2) rotate(1deg); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .destination-style::before { background: linear-gradient(-180deg, rgba(0, 0, 0, 0), rgb(0, 0, 0)); top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; z-index: 1; } .destination-style>img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; object-fit: cover; height: 430px; } .destination-style .tour { font-size: 14px; font-weight: 600; line-height: 16px; color: #FFFFFF; background-color: #177ec2; text-transform: uppercase; padding: 10px 30px; border-radius: 4px; top: 14px; left: 12px; position: absolute; z-index: 2; } .destination-style .destination-content { bottom: 14px; right: 0; position: absolute; z-index: 2; width: 100%; text-align: center; } .destination-style .destination-content .travel { font-size: 17px; font-weight: 600; line-height: 30px; text-transform: capitalize; } .destination-style .destination-content p { font-size: 16px; font-weight: 400; line-height: 40px; } .destination-style1 .image .mask-ab { height: auto; } .destination-style1:hover .image .mask-ab { bottom: -10px; visibility: visible; opacity: 1; height: auto; } .destination-style1:hover .image>img { transform: scale(1.2) rotate(1deg); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .destination-style1 .image { overflow: hidden; display: block; border-radius: 10px; } .destination-style1 .image>img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; height: 300px; object-fit: cover; } .destination-style1 .image .mask-ab { position: absolute; right: 0px; bottom: -40px; visibility: hidden; opacity: 0; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .destination-grid-6 { display: grid; grid-template-columns: repeat(6, 1fr); gap: 30px; } /* widget Blog -------------------------------------------------------------- */ .tf-widget-blog:hover .blog-image>img { transform: scale(1.1); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-blog .blog-image { position: relative; overflow: hidden; display: block; } .tf-widget-blog .blog-image .category-blog { position: absolute; bottom: 0; right: 0; font-size: 12px; font-weight: 700; line-height: 22px; letter-spacing: 0.135em; color: #FFFFFF; text-transform: uppercase; padding: 7px 20px 7px 27px; background-color: #44b774; z-index: 1; } .tf-widget-blog .blog-image img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-blog .blog-image .admin { position: absolute; top: 15px; right: 16px; background-color: #FFFFFF; border-radius: 80px; } .tf-widget-blog .blog-image .admin:hover span { display: flex !important; transition: all 0.3s ease-out; } .tf-widget-blog .blog-image .admin img { width: 48px; height: 48px; border-radius: 100%; padding: 4px; } .tf-widget-blog .blog-image .admin span { font-size: 12px; font-weight: 600; line-height: 26px; color: #000000; margin-left: 12px; text-transform: uppercase; display: none; } .tf-widget-blog .blog-content { padding: 29px 45px 26px 66px; } .tf-widget-blog .blog-content .meta-list li { font-size: 14px; font-weight: 400; line-height: 17.68px; color: #081E2A; position: relative; } .tf-widget-blog .blog-content .meta-list li:not(:last-child) { margin-left: 44px; } .tf-widget-blog .blog-content .meta-list li i { color: #44b774; margin-left: 6px; } .tf-widget-blog .blog-content .entry-title { font-size: 24px; font-weight: 700; line-height: 33px; margin-top: 10px; margin-bottom: 12px; text-transform: inherit; } .tf-widget-blog .blog-content .des { font-size: 16px; font-weight: 400; line-height: 29px; margin-bottom: 13px; } .blog-style { border: 1px solid #EDEEEE; } .blog-style:hover { box-shadow: 0px 4px 22px 0px rgba(0, 0, 0, 0.11); } .blog-style .blog-content { padding: 29px 45px 26px 66px; } .blog-style .blog-content .meta-list { flex-wrap: wrap; } .blog-style .blog-content .meta-list li { font-size: 14px; font-weight: 400; line-height: 17.68px; color: #081E2A; position: relative; } .blog-style .blog-content .meta-list li:not(:last-child) { margin-left: 44px; } .blog-style .blog-content .meta-list li:not(:last-child)::before { position: absolute; content: ""; width: 9px; height: 1px; background-color: #081E2A; left: -34px; top: 50%; transform: translateY(-50%); } .blog-style .blog-content .meta-list li i { color: #44b774; margin-left: 6px; } .blog-style1 { box-shadow: 0px 4px 11px 0px rgba(0, 0, 0, 0.04); border: unset; } .blog-style1 .blog-content { padding: 25px 45px 46px 45px; position: relative; } .blog-style1 .blog-content .meta-list li:not(:last-child) { margin-left: 20px; } .blog-style1 .blog-content .meta-list li:not(:last-child)::before { content: unset; } .blog-style1 .blog-content .entry-title { font-size: 20px; line-height: 31px; margin-top: 21px; margin-bottom: 0px; text-transform: inherit; } .blog-style1 .blog-content .icon-link { height: 60px; width: 60px; border-radius: 100%; background-color: #44b774; color: #FFFFFF; bottom: -30px; position: absolute; opacity: 0; visibility: hidden; right: 40%; transform: translateX(50%); transition: all 0.3s ease-out; z-index: 1; } .blog-style1 .blog-content .icon-link:hover { background-color: #177ec2; } .blog-style1:hover .blog-content .icon-link { opacity: 1; visibility: visible; right: 50%; transform: translateX(50%); } .blog-style2 { border: unset; } .blog-style2:hover { box-shadow: unset; } .blog-style2 .blog-image { border-radius: 4px; } .blog-style2 .blog-image .category-blog { top: 13px; right: 12px; bottom: unset; border-radius: 4px; padding: 7px 15px 7px 21px; } .blog-style2 .blog-content { background-color: #44b774; margin-right: 21px; margin-left: 41px; margin-top: -102px; position: relative; border-radius: 4px; padding: 35px 36px 26px 9em; z-index: 1; } .blog-style2 .blog-content .meta-list li { color: rgba(255, 255, 255, 0.6); } .blog-style2 .blog-content .meta-list li:not(:last-child) { margin-left: 17px; } .blog-style2 .blog-content .meta-list li:not(:last-child)::before { content: unset; } .blog-style2 .blog-content .meta-list li i { color: #FFFFFF; font-size: 16px; } .blog-style2 .blog-content .entry-title { font-size: 22px; font-weight: 700; line-height: 35px; margin-top: 12px; margin-bottom: 16px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; color: #FFFFFF; } .blog-style2 .blog-content .entry-title a { color: #FFFFFF; } .blog-style2 .blog-content .entry-title a:hover { color: #177ec2; } .blog-style2 .blog-content .btn-read-more { color: #FFFFFF; } .blog-style2 .blog-content .btn-read-more:hover { color: #177ec2; } .blog-style2 .blog-content .btn-read-more i { margin-right: 5px; } .blog-style3:not(:last-child) { margin-bottom: 30px; } .blog-style3 .blog-image { border-radius: 4px; max-width: 229px; width: 100%; } .blog-style3 .blog-content { background-color: #FFFFFF; border-radius: 4px; box-shadow: 0px 3px 10px 0px rgba(57, 106, 191, 0.16); margin-right: -30px; padding: 24px 35px 18px 8em; z-index: 1; } .blog-style3 .blog-content .meta-list li:not(:last-child) { margin-left: 14px; } .blog-style3 .blog-content .meta-list li i { font-size: 18px; } .blog-style3 .blog-content .entry-title { font-size: 18px; font-weight: 700; line-height: 28px; margin-top: 11px; margin-bottom: 5px; text-transform: inherit; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; } .blog-style3 .blog-content .btn-read-more { font-size: 15px; font-weight: 500; line-height: 31px; font-family: "DM Sans", sans-serif; } .blog-style3 .blog-content .btn-read-more i { color: #44b774; } .blog-style4 { box-shadow: 0px 7px 16px 0px rgba(0, 0, 0, 0.04); } .blog-style4:hover .blog-content .button-link i::after { background-color: #44b774; } .blog-style4 .blog-content { padding: 32px 32px 32px 40px; } .blog-style4 .blog-content .meta-list li:not(:last-child) { margin-left: 24px; } .blog-style4 .blog-content .entry-title { font-size: 20px; font-weight: 600; line-height: 33px; margin-top: 17px; margin-bottom: 21px; text-transform: inherit; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; } .blog-style4 .blog-content .button-link { margin-right: 5px; } .blog-style4 .blog-content .button-link i { margin-right: 0px; transition: all 0.3s ease; } /* widget populer -------------------------------------------------------------- */ .tf-widget-populer { border-radius: 8px; overflow: hidden; box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.08); background-color: #FFFFFF; } .tf-widget-populer:hover .content .icon { background-color: #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-populer:hover .content .icon::before { border-top: 8px solid #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-populer .image { overflow: hidden; } .tf-widget-populer .image .mask-populer { position: absolute; bottom: -15px; right: 0; } .tf-widget-populer .content { padding: 47px 33px 45px 34px; } .tf-widget-populer .content .icon { width: 81px; height: 75px; background-color: #177ec2; border-radius: 5px; color: #FFFFFF; position: absolute; top: -32%; right: 50%; transform: translateX(50%); } .tf-widget-populer .content .icon:before { position: absolute; content: ""; width: 0; height: 0; border-right: 6px solid transparent; border-left: 6px solid transparent; border-top: 8px solid #177ec2; bottom: -8px; } .tf-widget-populer .content .icon i { font-size: 35px; } .tf-widget-populer .content .des-populer { font-size: 15px; font-weight: 400; line-height: 27.8px; color: #4F545A; } /* widget places -------------------------------------------------------------- */ .tf-widget-place:hover .content .price-place { color: #081E2A; background-color: #177ec2; } .tf-widget-place:hover .content .place-content { background-color: #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-place:hover .content .place-content .meta-place span, .tf-widget-place:hover .content .place-content .title-place a, .tf-widget-place:hover .content .place-content span { color: #FFFFFF; } .tf-widget-place:hover .content .place-content .icon, .tf-widget-place:hover .content .place-content i { color: #177ec2 !important; } .tf-widget-place .place-image { display: block; border-radius: 5px; overflow: hidden; } .tf-widget-place .place-image .feature { font-size: 14px; font-weight: 500; line-height: 14px; color: #FFFFFF; padding: 8px 20px; background-color: #44b774; border-radius: 4px; top: 8px; right: 7px; position: absolute; } .tf-widget-place .content { margin-top: -85px; margin-right: 16px; margin-left: 14px; z-index: 1; position: relative; transition: all 0.3s ease-in-out; } .tf-widget-place .content .price-place { color: #FFFFFF; background-color: #44b774; font-size: 15px; font-weight: 500; line-height: 18px; padding: 4px 22px 4px 54px; display: inline-block; clip-path: polygon(0 0, 90% 0, 100% 100%, 0% 100%); } .tf-widget-place .content .price-place .price { font-size: 14px; font-weight: 600; line-height: 18px; margin-right: 4.5px; } .tf-widget-place .content .place-content { background-color: #FFFFFF; box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.05); border-radius: 6px; padding: 15px 20px 23px 22px; margin-top: -10px; transition: all 0.3s ease-in-out; } .tf-widget-place .content .place-content .map { font-size: 14px; font-weight: 400; font-family: "DM Sans", sans-serif; color: #83827F; transition: all 0.3s ease-in-out; } .tf-widget-place .content .place-content .map i { margin-left: 5px; color: #44b774; } .tf-widget-place .content .place-content .title-place { font-size: 15px; line-height: 30px; text-transform: inherit; transition: all 0.3s ease-in-out; } .tf-widget-place .content .place-content .meta-place { flex-wrap: wrap; gap: 19px; transition: all 0.3s ease-in-out; } .tf-widget-place .content .place-content .meta-place li .icon { color: #44b774; margin-left: 8px; } .tf-widget-place .content .place-content .meta-place li span { font-size: 15px; font-weight: 500; color: #83827F; line-height: 22px; } /* widget clip text -------------------------------------------------------------- */ .clip-text { font-size: 105px; font-weight: 800; line-height: 89px; text-align: center; text-transform: uppercase; margin-top: -10px; margin-bottom: -5px; } @supports (background-clip: text) or (-webkit-background-clip: text) { .clip-text { color: transparent; -webkit-background-clip: text; background-image: url(../../assets/images/page/clip-text.jpg); background-size: cover; background-position: center; } } /* widget icon box -------------------------------------------------------------- */ .icon-box-style1 { border: 1px solid rgba(224, 224, 224, 0.28); box-shadow: 0px 8px 25px 0px rgba(0, 0, 0, 0.06); padding: 49px 41px 49px 41px; transition: all 0.3s ease-in-out; overflow: hidden; } .icon-box-style1:hover::before, .icon-box-style1:hover::after { opacity: 1; visibility: visible; transition: all 0.3s; left: 0; bottom: 0; } .icon-box-style1:hover::after { left: 0; top: 0; } .icon-box-style1::before { position: absolute; bottom: -50px; right: 0; left: -50px; content: ""; clip-path: polygon(100% 0, 0% 100%, 100% 100%); background: linear-gradient(-180deg, rgba(45, 138, 6, 0.1), rgb(49, 132, 14)); height: 238px; opacity: 0; visibility: hidden; z-index: 1; transition: all 0.6s ease-in-out; } .icon-box-style1::after { position: absolute; left: -50px; top: -50px; content: ""; clip-path: polygon(100% 0, 4% 100%, 100% 66%); background: #428E22; height: 212px; width: 98px; opacity: 0; visibility: hidden; z-index: 1; transition: all 0.3s ease-in-out; } .icon-box-style1 .icon { margin-bottom: 24px; } .icon-box-style1 .icon i { font-size: 55px; } .icon-box-style1 .des-icon { margin-bottom: 38px; } .icon-box-style1 .icons-link { font-size: 14px; font-weight: 600; line-height: 17.64px; letter-spacing: 0.05em; color: #44b774; font-family: "Noto Sans Arabic", sans-serif; } .icon-box-style1 .icons-link:hover { color: #177ec2 !important; } .icon-box-style1 .icons-link i { font-size: 10px; margin-right: 10px; } .icon-box-style1 .title-icon { margin-bottom: 23px; } .icon-box-style2 { padding: 32px 38px 30px 40px; overflow: hidden; } .icon-box-style2:hover::before { top: 0; } .icon-box-style2:hover { background-color: transparent !important; } .icon-box-style2::before { transition: all 0.3s ease-in-out; width: 100%; height: 100%; position: absolute; right: 0; left: 0; top: -100%; background-color: #44b774; content: ""; } .icon-box-style2 .icon { margin-left: 29px; margin-top: 6px; position: relative; } /* .icon-box-style2 .icon::before { position: absolute; content: ""; width: 25px; height: 25px; border-radius: 100px; background-color: #177ec2; right: -8px; top: -2px; z-index: 1; } */ .icon-box-style2 .icon i { font-size: 44px; position: relative; z-index: 2; } .icon-box-style2 .title-icon { margin-bottom: 12px; } .icon-box-style2 .des-icon { text-transform: inherit !important; } .icon-box-style3 .icon { color: #44b774; margin-bottom: 12px; height: 50px; } .icon-box-style3 .des { line-height: 30px; } .icon-box-style-4 .icon { width: 65px; flex-shrink: 0; height: 65px; border-radius: 100%; background-color: #FFFFFF; box-shadow: 0px 4px 13px 0px rgba(0, 0, 0, 0.1); color: #44b774; margin-left: 17px; } .icon-box-style-4 .content .des { line-height: 30px; } .icon-box-style5 { padding: 40px 40px; } .icon-box-style5 .icon { color: #44b774; margin-left: 13px; } .icon-box-style5 .text { font-size: 16px; font-weight: 600; color: #FFFFFF; font-family: "Noto Sans Arabic", sans-serif; } .icon-box-style5 .des { font-size: 16px; font-weight: 400; color: #4F545A; line-height: 30.8px; margin-top: 18px; } .icon-box-style7 .image { width: auto; } .icon-box-style7 .title { font-size: 18px; font-weight: 700; line-height: 33px; color: #081E2A; margin-right: 15px; font-family: "Noto Sans Arabic", sans-serif; } .icon-box-style7 .des { font-size: 15px; font-weight: 400; line-height: 26px; } .cheackmark:hover .icon { background-color: #44b774; color: #FFFFFF; box-shadow: unset; } .cheackmark .icon { width: 65px; flex-shrink: 0; height: 65px; background-color: #FFFFFF; border-radius: 100%; box-shadow: 0px 4px 13px 0px rgba(0, 0, 0, 0.1); color: #44b774; font-size: 40px; transition: all 0.3s ease-in-out; } .cheackmark .content { margin-right: 18px; } .icon-box-style6 .icon { color: #44b774; font-size: 40px; display: inline-block; z-index: 2; height: 40px; margin-bottom: 23px; } /* .icon-box-style6 .icon::before { width: 22px; height: 22px; border-radius: 100%; background-color: #177ec2; position: absolute; content: ""; top: -4px; right: -10px; z-index: 1; } */ .icon-box-style6 .content .title-icon { margin-bottom: 8px; } .icon-box-style6 .content .des-icon { line-height: 30px; } .tf-icon-box { background-color: #FFFFFF; border-radius: 8px; } .tf-icon-box:hover { background-color: #44b774; transition: all 0.3s; } .tf-icon-box:hover .icon, .tf-icon-box:hover .des-icon, .tf-icon-box:hover .icons-link, .tf-icon-box:hover .title-icon a { color: #FFFFFF; z-index: 2; position: relative; transition: all 0.3s; } .tf-icon-box .icon { color: #44b774; } .tf-icon-box .des-icon { font-size: 16px; font-weight: 400; line-height: 30px; color: #4F545A; text-transform: capitalize; } /* widget Testimonial -------------------------------------------------------------- */ .widget-testimonial .testimonial-content .profile .name { font-size: 29px; line-height: 31px; letter-spacing: -0.02em; margin-bottom: 4px; } .widget-testimonial .testimonial-content .profile .job { display: inline-block; font-size: 18px; font-weight: 500; line-height: 31px; letter-spacing: -0.02em; } .widget-testimonial .testimonial-content .tes { font-size: 29px; font-weight: 700; line-height: 57px; color: #081E2A; text-transform: capitalize; letter-spacing: -0.02em; } .widget-testimonial .testimonial-content .line { width: 50px; height: 4px; position: relative; display: inline-block; background-color: #44b774; border-radius: 2px; margin-top: 31px; margin-bottom: 17px; } .widget-testimonial .testimonial-content .icon-tes { width: 92px; height: 86px; background-color: #FFFFFF; border: 1px solid rgba(122, 134, 151, 0.15); position: absolute; bottom: -19%; left: 11%; } .widget-testimonial .testimonial-content .icon-tes i { font-size: 27px; color: #44b774; } .widget-testimonial .testimonial-image .avata { width: auto !important; cursor: pointer; } .widget-testimonial .testimonial-image .avata img { width: 65px; height: 65px; border-radius: 100%; } .widget-testimonial .testimonial-image .swiper-slide { border-radius: 100%; border: 3px solid #FFFFFF; box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.06); } .widget-testimonial .testimonial-image .swiper-slide-thumb-active { border: 3px solid #44b774; } .widget-testimonial-style2 { padding: 60px 75px 60px 50px; background-color: #FFFFFF; box-shadow: 0px 13px 32px 0px rgba(0, 0, 0, 0.02); } .widget-testimonial-style2::before { position: absolute; content: ""; height: 70%; width: 5px; background-color: #44b774; border-radius: 13px; right: 0; top: 50%; transform: translateY(-50%); } .widget-testimonial-style2::after { position: absolute; content: ""; width: 0; height: 0; border-top: 10px solid transparent; border-right: 20px solid #44b774; border-bottom: 10px solid transparent; right: 0; top: 50%; transform: translateY(-50%); } .widget-testimonial-style2 .image { margin-left: 21px; } .widget-testimonial-style2 .image img { width: 70px; height: 70px; border-radius: 100%; } .widget-testimonial-style2 .profile .job { font-size: 16px; font-weight: 600; line-height: 37px; color: #44b774; display: inline-block; } .widget-testimonial-style2 .icon-tes { color: #44b774; } .widget-testimonial-style2 .icon-tes i { font-size: 42px; } .widget-testimonial-style2 .des { font-size: 17px; font-weight: 500; line-height: 35px; padding-left: 50px; } .widget-testimonial-style2 .mask-tes { position: absolute; left: 0; bottom: 0; width: auto; } .widget-testimonial-style3 .testimonial-content .profile .name { margin-bottom: 7px; } .widget-testimonial-style3 .testimonial-content .profile .job { display: inline-block; font-size: 20px; font-weight: 500; line-height: 36px; letter-spacing: -0.02em; } .widget-testimonial-style3 .testimonial-content .tes { font-size: 35px; font-weight: 700; line-height: 60px; color: #081E2A; text-transform: capitalize; letter-spacing: 0em; } .widget-testimonial-style3 .testimonial-content .line { margin-top: 40px; margin-bottom: 23px; } .widget-testimonial-style3 .testimonial-image2 .avata { width: auto !important; cursor: pointer; margin: 0 11px; } .widget-testimonial-style3 .testimonial-image2 .avata img { width: 65px; height: 65px; border-radius: 100%; } .widget-testimonial-style3 .testimonial-image2 .swiper-slide { border-radius: 100%; border: 3px solid #FFFFFF; box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.06); } .widget-testimonial-style3 .testimonial-image2 .swiper-wrapper { justify-content: center; } .widget-testimonial-style3 .testimonial-image2 .line { width: 50px; height: 4px; position: relative; display: inline-block; background-color: #44b774; border-radius: 2px; margin-top: 31px; margin-bottom: 17px; } .widget-testimonial-style3 .testimonial-image2 .swiper-slide-thumb-active { border: 3px solid #44b774; } .widget-testimonial-style4 .des { font-size: 28px; font-weight: 400; line-height: 46px; padding-bottom: 45px; margin-bottom: 60px; border-bottom: 1px solid #EDEEEE; } .widget-testimonial-style4 .image-avata { margin-left: 19px; } .widget-testimonial-style4 .image-avata img { width: 72px; height: 72px; border-radius: 100%; border: 5px solid #FFFFFF; } .widget-testimonial-style4 .content-testimonial .job { font-size: 18px; font-weight: 400; font-family: "DM Sans", sans-serif; } .widget-testimonial-style5 .des { font-size: 24px; font-weight: 500; line-height: 46px; color: #081E2A; margin-bottom: 52px; letter-spacing: -0.7px; } .widget-testimonial-style5 .image-avata { margin-left: 19px; } .widget-testimonial-style5 .image-avata img { width: 79px; width: 79px; border-radius: 100%; border: 6px solid #FFFFFF; } .widget-testimonial-style5 .start { margin-left: 6em; } .widget-testimonial-style5 .start i { color: #44b774; } /* widget Team -------------------------------------------------------------- */ .tf-widget-team:hover .team-image .social-team { opacity: 1; visibility: visible; right: -16px; } .tf-widget-team:hover .team-image::before { opacity: 1; visibility: visible; rotate: -3deg; transition: all 0.3s; } .tf-widget-team .team-image { position: relative; z-index: 2; } .tf-widget-team .team-image::before { width: 100%; height: 100%; top: -15px; left: -16px; position: absolute; content: ""; border: 2px dashed #44b774; border-radius: 13px; rotate: 0deg; z-index: 1; opacity: 0; visibility: hidden; } .tf-widget-team .team-image img { border-radius: 13px; position: relative; z-index: 2; } .tf-widget-team .team-image .social-team { padding: 16px 17px; background-color: #44b774; display: inline-block; text-align: center; position: absolute; right: -30px; top: 50%; transform: translateY(-50%); z-index: 3; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-widget-team .team-image .social-team::before { position: absolute; top: -9px; right: 0px; content: ""; width: 0; height: 0; border-bottom: 10px solid #44b774; border-right: 16px solid transparent; } .tf-widget-team .team-image .social-team::after { position: absolute; top: 52%; transform: translateY(-50%); left: -15px; content: ""; width: 0; height: 0; border-bottom: 18px solid #44b774; border-left: 15px solid transparent; } .tf-widget-team .team-image .social-team li:not(:last-child) { margin-bottom: 12px; } .tf-widget-team .team-image .social-team a { color: #FFFFFF; } .tf-widget-team .team-image .social-team a:hover { color: #177ec2; } .tf-widget-team .team-content .job { font-size: 15px; font-weight: 500; color: #44b774; line-height: 24px; margin-bottom: 6px; } /* widget Gallery -------------------------------------------------------------- */ .grid-gallery { display: grid; grid-gap: 20px; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(6, 118.33px); } .item-1 { grid-row: 1/3; grid-column: 1/2; } .item-2 { grid-row: 1/4; grid-column: 2/4; } .item-3 { grid-row: 1/5; grid-column: 4/4; } .item-4 { grid-row: 3/7; grid-column: 1/2; } .item-5 { grid-row: 4/7; grid-column: 2/4; } .item-6 { grid-row: 5/7; grid-column: 4/4; } .item-1 .tf-gallery .btn-gallery, .item-6 .tf-gallery .btn-gallery { width: 55px; height: 55px; } .item-1 .tf-gallery .btn-gallery i, .item-6 .tf-gallery .btn-gallery i { font-size: 15px; } .item-1 .tf-gallery .gallery-content, .item-6 .tf-gallery .gallery-content { position: absolute; bottom: 20px; } .item-1 .tf-gallery .gallery-content .gallery-title, .item-6 .tf-gallery .gallery-content .gallery-title { font-size: 18px; line-height: 26px; } .item-1 .tf-gallery .gallery-content .sub-title, .item-6 .tf-gallery .gallery-content .sub-title { font-size: 14px; line-height: 18px; } .item-3 .tf-gallery .btn-gallery, .item-4 .tf-gallery .btn-gallery { width: 85px; height: 85px; } .item-3 .tf-gallery .btn-gallery i, .item-4 .tf-gallery .btn-gallery i { font-size: 20px; } .tf-gallery { position: relative; overflow: hidden; border-radius: 6px; height: 100%; } .tf-gallery img { height: 100%; object-fit: cover; } .tf-gallery:hover .btn-gallery { opacity: 1; visibility: visible; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-gallery:hover .gallery-content { opacity: 1; visibility: visible; right: 30px; -webkit-transform: translateX(0px); transform: translateX(0px); } .tf-gallery::before { top: 0; left: 0; right: 0; bottom: 0; position: absolute; content: ""; background: linear-gradient(-180deg, rgba(0, 0, 0, 0), rgb(0, 0, 0)); } .tf-gallery .btn-gallery { width: 110px; height: 110px; color: #FFFFFF; background-color: #44b774; border-radius: 100%; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); cursor: pointer; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; z-index: 1; transition: transform 1000ms ease; } .tf-gallery .btn-gallery:hover { background-color: #177ec2; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-gallery .btn-gallery i { font-size: 30px; } .tf-gallery .gallery-content { position: absolute; right: 0px; bottom: 40px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .tf-gallery .gallery-content .gallery-title { font-size: 24px; line-height: 30px; } .tf-gallery .gallery-content .sub-title { font-size: 16px; font-weight: 500; line-height: 20px; color: rgba(255, 255, 255, 0.6); } /* widget Image Box -------------------------------------------------------------- */ .tf-adventure .adventure-image { margin-left: 19px; display: inline-block; } .tf-adventure .adventure-image img { width: 94px; border-radius: 9px; } .tf-adventure .adventure-image .tour-ad { font-size: 14px; font-weight: 400; display: block; line-height: 16px; } .tf-adventure .adventure-image .title-ad { font-size: 16px; font-weight: 600; line-height: 27px; } .tf-adventure .adventure-image .price-ad { font-size: 14px; font-weight: 600; } .image-box-tesimonial { max-width: 327px; width: 100%; background-color: #FFFFFF; box-shadow: 0px 4px 26px 0px rgba(0, 0, 0, 0.07); padding: 16px 17px 80px 17px; } .tf-image-box:hover .image img { transform: scale(1.1); } .tf-image-box .image { overflow: hidden; margin-bottom: 16px; display: block; } .tf-image-box .image img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } /* Box Tour -------------------------------------------------------------- */ .box-tour-select-wrap { background-color: #FFFFFF; border-radius: 14px; padding: 39px 37px; box-shadow: 0px 3px 30px 0px rgba(0, 0, 0, 0.05); display: grid; grid-template-columns: repeat(5, 1fr); gap: 30px; } .box-tour-select-item { border: 1px solid #EDEEEE; border-radius: 6px; padding: 29px 20px 42px 20px; transition: all 0.3s ease-in-out; overflow: hidden; position: relative; } .box-tour-select-item:before { width: 100%; height: 100%; position: absolute; content: ""; background-color: #44b774; right: 0; top: -100%; left: 0; transition: all 0.3s ease-in-out; } .box-tour-select-item:hover .icon, .box-tour-select-item:hover .content .title, .box-tour-select-item:hover .content .price, .box-tour-select-item:hover .content i { color: #FFFFFF; } .box-tour-select-item:hover .content i { rotate: 34deg; } .box-tour-select-item:hover::before { top: 0; } .box-tour-select-item:hover .content .tour { background-color: #FFFFFF; color: #44b774; } .box-tour-select-item .icon { color: #44b774; font-size: 63px; height: 77px; margin-bottom: 16px; z-index: 2; position: relative; } .box-tour-select-item .content .title { font-size: 20px; font-weight: 600; line-height: 27px; color: #081E2A; margin-bottom: 20px; } .box-tour-select-item .content .tour { font-size: 15px; font-weight: 500; padding: 5px 17px; line-height: 15px; background-color: #44b774; border-radius: 15px; color: #FFFFFF; display: inline-block; margin-bottom: 38px; } .box-tour-select-item .content .price { font-size: 16px; font-weight: 700; line-height: 29px; color: #081E2A; } .box-tour-select-item .content i { font-size: 45px; color: #44b774; position: absolute; left: 1%; bottom: 18%; transition: all 0.3s ease-in-out; } /* Faq -------------------------------------------------------------- */ .faq-list .accordion-item { border: unset !important; border-radius: unset; background-color: #FFFFFF; box-shadow: 0 4px 21px 0px rgba(0, 0, 0, 0.08); } .faq-list .accordion-item:not(:last-child) { margin-bottom: 22px; } .faq-list .accordion-button { padding: 22px 35px 22px 35px; color: #081E2A; font-size: 18px; font-weight: 700; flex-grow: 1; text-transform: capitalize; } .faq-list .accordion-button:hover { background-color: #FFFFFF; } .faq-list .accordion-button:not(.collapsed) { color: #081E2A; background-color: #FFFFFF; box-shadow: unset; } .faq-list .accordion-body { padding: 0px 36px 35px 81px; color: #4F545A; font-size: 15px; font-weight: 400; line-height: 29px; } .faq-list .icon { width: 46px; height: 44px; background-color: #44b774; clip-path: polygon(100% 0, 0% 100%, 100% 100%); position: absolute; bottom: 0; left: 0; } /* Count Down -------------------------------------------------------------- */ .count-down .countdown__timer { display: flex; gap: 20px; } .count-down .countdown__timer .countdown__item { display: flex; flex-direction: column; align-items: center; } .count-down .countdown__timer .countdown__item .countdown__value { font-size: 16px; font-weight: 700; line-height: 23px; color: #44b774; width: 60px; height: 60px; background: #FFFFFF; border-radius: 100%; display: flex; justify-content: center; align-items: center; } .count-down .countdown__timer .countdown__item .countdown__label { font-size: 14px; font-weight: 700; line-height: 23px; text-transform: uppercase; color: #081E2A; margin-top: 7px; } .tab-list .nav-link { font-size: 15px; font-weight: 600; line-height: 18.9px; letter-spacing: 0.03em; color: #081E2A; padding: 10px 22px; background-color: #FFFFFF; border-radius: 10px; border: 1px solid #44b774; margin: 0 7px; position: relative; transition: all 0.3s ease; min-width: 134px; } .tab-list .nav-link::before { position: absolute; content: ""; width: 0; height: 0; border-right: 7px solid transparent; border-left: 5px solid transparent; border-top: 7px solid #44b774; bottom: -7px; right: 50%; transform: translateX(50%); transition: all 0.2s ease; opacity: 0; } .tab-list .nav-link:hover { background-color: #44b774; color: #FFFFFF; } .tab-list .nav-link:hover::before { position: absolute; content: ""; width: 0; height: 0; border-right: 7px solid transparent; border-left: 7px solid transparent; border-top: 7px solid #44b774; bottom: -7px; right: 50%; transform: translateX(50%); transition: all 0.2s ease; opacity: 1; } .tab-list .nav-link.active { background-color: #44b774; color: #FFFFFF; } .tab-list .nav-link.active::before { position: absolute; content: ""; width: 0; height: 0; border-right: 7px solid transparent; border-left: 7px solid transparent; border-top: 7px solid #44b774; bottom: -7px; right: 50%; transform: translateX(50%); opacity: 1; } .nav-tabs-activities { padding-left: 1.5em; } .nav-tabs-activities .nav-item .nav-link { font-size: 18px; font-weight: 700; line-height: 27px; color: #081E2A; background-color: #FFFFFF; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 25px 22px 28px 22px; border: 1px solid #EDEEEE; border-radius: 8px; max-width: 214px; width: 100%; margin: 0px 8.5px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .nav-tabs-activities .nav-item .nav-link:hover, .nav-tabs-activities .nav-item .nav-link.active { background-color: #44b774; color: #FFFFFF; position: relative; } .nav-tabs-activities .nav-item .nav-link:hover::before, .nav-tabs-activities .nav-item .nav-link.active::before { content: ""; position: absolute; width: 0; height: 0; border-right: 15px solid transparent; border-left: 15px solid transparent; border-top: 17px solid #44b774; bottom: -17px; right: 50%; transform: translateX(50%); } .nav-tabs-activities .nav-item .nav-link:hover .icon, .nav-tabs-activities .nav-item .nav-link.active .icon { color: #FFFFFF; } .nav-tabs-activities .nav-item .nav-link:hover .icon { color: #FFFFFF; } .nav-tabs-activities .nav-item .nav-link .icon { color: #44b774; height: 66px; margin-bottom: 15px; } .nav-tabs-activities .nav-item .nav-link .icon i { font-size: 50px; } .nav-tabs-adventure .nav-link { font-size: 18px; font-weight: 600; line-height: 27px; color: #081E2A; padding: 0px 0px 17px 0px; border-bottom: 1px solid #EDEEEE; cursor: pointer; } .nav-tabs-adventure .nav-link:not(:last-child) { margin-left: 43px; } .nav-tabs-adventure .nav-link i { font-size: 40px; color: #44b774; margin-left: 15px; } .nav-tabs-adventure .nav-link:hover, .nav-tabs-adventure .nav-link.active { background-color: transparent; border-bottom: 1px solid #44b774; } .tab-top-destination .nav-item:not(:last-child) { margin-left: 20px; } .tab-top-destination .nav-item .nav-link { padding: 5px 15px 12px 15px; border-radius: 10px; color: #081E2A; font-size: 16px; font-weight: 600; line-height: 27px; background-color: transparent; } .tab-top-destination .nav-item .nav-link i { font-size: 30px; color: #44b774; margin-left: 10px; position: relative; top: 5px; } .tab-top-destination .nav-item .nav-link:hover, .tab-top-destination .nav-item .nav-link.active { background-color: #44b774; color: white; } .tab-top-destination .nav-item .nav-link:hover i, .tab-top-destination .nav-item .nav-link.active i { color: #FFF; } .tab-terms-condition .nav-pills { padding: 50px 30px 70px 22px; margin-left: 56px; max-width: 429px; width: 100%; } .tab-terms-condition .nav-pills .nav-link { font-size: 16px; font-weight: bold; color: #4F545A; padding: 15px 25px; text-align: right; border-right: 2px solid transparent; } .tab-terms-condition .nav-pills .nav-link:hover, .tab-terms-condition .nav-pills .nav-link.active { background-color: #FFFFFF; color: #081E2A; border-right: 2px solid #44b774; } .tab-terms-condition .tab-content { width: 100%; } .tab-tour-single { background-color: #FFFFFF; padding: 10px 13px; border-radius: 47px; box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.05); margin-top: -47px; } .tab-tour-single .nav-link { font-size: 16px; font-weight: 600; line-height: 20px; padding: 26px 34px; border-radius: 47px; color: #081E2A; background-color: transparent; } .tab-tour-single .nav-link:hover, .tab-tour-single .nav-link.active { background-color: #F4F6F8; } .tab-tour-single .nav-link i { color: #44b774; margin-left: 14px; font-size: 20px; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font: inherit; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } /* Elements -------------------------------------------------------------- */ html { margin-left: 0 !important; } * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: "Noto Sans Arabic", sans-serif; font-size: 16px; line-height: 30.8px; font-weight: 400; color: #4F545A; background-color: #FFFFFF; } img { width: 100%; height: auto; } .row { margin-left: -15px; margin-right: -15px; } ul, li { list-style-type: none; margin-bottom: 0; padding-right: 0; list-style: none; } .center { text-align: center; } .tf-container { max-width: 1320px; width: 100%; margin: auto; padding-right: 15px; padding-left: 15px; } .tf-container.w-1456 { max-width: 1475px; width: 100%; margin: auto; padding-right: 15px; padding-left: 15px; } .tf-container.full { max-width: 100%; width: 100%; margin: auto; padding-right: 0px; padding-left: 0px; } .bg-main { background-color: #1D231F; } label { font-size: 15px; font-weight: 600; line-height: 16px; color: rgb(34, 34, 34); margin-bottom: 15px; } textarea, input[type=text], input[type=password], input[type=datetime], input[type=datetime-local], input[type=date], input[type=month], input[type=time], input[type=week], input[type=number], input[type=email], input[type=url], input[type=search], input[type=tel], input[type=color] { border: 1px solid #EDEEEE; outline: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; line-height: 16px; font-size: 16px; font-weight: 500; border-radius: 8px; padding: 20px 17px 20px 17px; width: 100%; background: transparent; color: #4F545A; } textarea::placeholder, input[type=text]::placeholder, input[type=password]::placeholder, input[type=datetime]::placeholder, input[type=datetime-local]::placeholder, input[type=date]::placeholder, input[type=month]::placeholder, input[type=time]::placeholder, input[type=week]::placeholder, input[type=number]::placeholder, input[type=email]::placeholder, input[type=url]::placeholder, input[type=search]::placeholder, input[type=tel]::placeholder, input[type=color]::placeholder { color: #4F545A; line-height: 16px; font-size: 16px; font-weight: 500; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } textarea:focus, input[type=text]:focus, input[type=password]:focus, input[type=datetime]:focus, input[type=datetime-local]:focus, input[type=date]:focus, input[type=month]:focus, input[type=time]:focus, input[type=week]:focus, input[type=number]:focus, input[type=email]:focus, input[type=url]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=color]:focus { border: 1px solid #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } /* Placeholder color */ ::-webkit-input-placeholder { color: #8A8AA0; } :-moz-placeholder { color: #8A8AA0; } ::-moz-placeholder { color: #8A8AA0; opacity: 1; } /* Since FF19 lowers the opacity of the placeholder by default */ :-ms-input-placeholder { color: #8A8AA0; } /* Typography -------------------------------------------------------------- */ h1, h2, h3, h4, h5, h6 { font-family: "Noto Sans Arabic", sans-serif; text-rendering: optimizeLegibility; color: #081E2A; text-transform: capitalize; } h1 { font-size: 65px; line-height: 82px; font-weight: 700; } h2 { font-size: 50px; line-height: 60px; font-weight: 800; } h3 { font-size: 26px; line-height: 44.2px; font-weight: 600; } h4 { font-size: 22px; line-height: 30px; font-weight: 700; } h5 { font-size: 20px; line-height: 25.2px; font-weight: 700; } h6 { font-size: 16px; line-height: 30px; font-weight: 700; } p { font-family: "Noto Sans Arabic", sans-serif; } /* Extra classes -------------------------------------------------------------- */ .msg-success { background: linear-gradient(to left, #E250E5, #4B50E6, #E250E5); background-clip: text; -webkit-background-clip: text; font-weight: 700; background-size: 200% 200%; animation: rainbow 2s ease-in-out infinite; color: rgba(0, 0, 0, 0); transition: color 0.2s ease-in-out; font-size: 18px; font-weight: 400; line-height: 28px; } label.error { color: red; } .text-white { color: #FFFFFF; } .text-24 { font-size: 14px; font-weight: 400; line-height: 24px; } .shaw-box { padding: 50px; margin: -50px; } .flex { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .flex-one { justify-content: space-between; display: flex; } .flex-two { justify-content: space-between; align-items: center; display: flex; } .flex-three { display: flex; align-items: center; } .flex-five { display: flex; justify-content: center; align-items: center; } .flex-six { display: flex; justify-content: flex-end; align-items: center; } .center, .text-center { text-align: center; } .text-end { text-align: end; } .absolute { position: absolute; } .relative { position: relative; } .flex-none { flex: none !important; } .text-t { text-transform: capitalize; } .text-u { text-transform: uppercase; } .text-unset { text-transform: unset !important; } .text-line { text-decoration-line: underline !important; } .justify-center { justify-content: center; } .justify-end { justify-content: end; } .justify-space { justify-content: space-between; } .flex-wrap { flex-wrap: wrap; } .align-center { align-items: center; } .text-end { text-align: end; } .font-italic { font-style: italic; } .al-i-end { align-items: flex-end; } #wrapper { position: relative; overflow: hidden; max-width: 100%; height: 100%; } .wrapper-style { background: #FAF8FF; } .z-index1 { z-index: 1; } .z-index3 { z-index: 3; } .z-index4 { z-index: 4; } button { border: none; font-family: "Noto Sans Arabic", sans-serif; } button:hover { background-color: #177ec2; transition: all 0.3s; border: unset; } button[type=submit]:hover { background-color: #44b774; transition: all 0.3s; border: unset; } button, input[type=submit] { font-family: "Noto Sans Arabic", sans-serif; border: unset; padding: 20px 60px; font-size: 16px; font-weight: 500; line-height: 20px; text-transform: capitalize; color: #FFFFFF; background-color: #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; cursor: pointer; } button:hover, input[type=submit]:hover { background-color: #177ec2; transition: all 0.3s; border: unset; } .fs-28-46 { font-size: 28px; font-weight: 400; line-height: 46px; display: inline-block; } .mt-40 { margin-top: 40px; } .pd-main { padding: 50px 0; } .pb-60 { padding-bottom: 60px; } .m0-auto { margin: 0 auto; } .mb-10 { margin-bottom: 10px; } .mb-15 { margin-bottom: 15px; } .mb-18 { margin-bottom: 18px !important; } .mb-22 { margin-bottom: 22px; } .mb-25 { margin-bottom: 25px; } .mb-30 { margin-bottom: 30px; } .mb-32 { margin-bottom: 32px; } .mb-37 { margin-bottom: 37px; } .mb-40 { margin-bottom: 40px; } .mb-43 { margin-bottom: 43px; } .mb-45 { margin-bottom: 45px; } .mb-50 { margin-bottom: 50px; } .mb-60 { margin-bottom: 60px; } .mb-70 { margin-bottom: 70px; } .mb-75 { margin-bottom: 75px; } .mb-80 { margin-bottom: 80px; } .mb--93 { margin-bottom: -93px; } .mb--7em { margin-bottom: -7.6em; } .mb--14em { margin-bottom: -14em; } .mb--20em { margin-bottom: -20em; } .mb--25em { margin-bottom: -25em; } .mt--50 { margin-top: -50px; } .mt--60 { margin-top: -60px; } .mt--82 { margin-top: -82px; } .pt-25 { padding-top: 25px; } .pt-35 { padding-top: 35px; } .pt-115 { padding-top: 115px; } .mt-20 { margin-top: 20px; } .mt-27 { margin-top: 27px; } .mt-35 { margin-top: 35px; } .mt-44 { margin-top: 44px; } .mt-53 { margin-top: 53px; } .pb-150 { padding-bottom: 150px; } .pr-256 { padding-left: 256px !important; } .lh-32 { line-height: 32px; } .box-sd { box-shadow: 0px 4px 21px 0px rgba(0, 0, 0, 0.07); } .text-white { color: #FFFFFF; } .text-gray { color: #B6C2D4; } .text-black { color: #081E2A; } .text-second { color: #177ec2; } .text-main { color: #44b774 !important; } .font-yes { font-family: "Yesteryear", sans-serif; } .overflow-hidden { overflow: hidden; } .relative { position: relative; } .fs-italic { font-style: italic; } .tour1 { color: #177ec2; } .tour2 { color: #17FBC4; } .tour3 { color: #FB4E17; } .tour4 { color: #17E0FB; } .tour5 { color: #F617FB; } .tour6 { color: #FB1717; } .bg-part-gray { background-color: #EEE9E9; } .bg-part-blue { background-color: #E0F4F3; } .bg-1 { background-color: #F4F6F8; } .bg-2 { background-color: #177ec2 !important; } .bg-3 { background-color: #1D231F; } .bg-4 { background-color: #F3F8F6; } .bg-white { background-color: #FFFFFF; } /* Custom radio buttons */ input[type=radio]+label { display: inline-block; cursor: pointer; position: relative; padding-right: 30px; margin-left: 15px; font-size: 15px; font-weight: 400; } input[type=radio]+label:before { content: ""; display: block; width: 20px; height: 20px; margin-left: 14px; position: absolute; top: -3px; right: 0; border: 1px solid #EDEEEE; background-color: #FFFFFF; border-radius: 50%; } input[type=radio] { display: none !important; display: inline; } input[type=radio]:checked+label:after { content: ""; display: block; position: absolute; top: 1px; right: 4px; width: 12px; height: 12px; border-radius: 50%; background: #44b774; } /* Custom checkbox */ input[type=checkbox]+label { display: inline-block; cursor: pointer; position: relative; padding-right: 30px; margin-left: 15px; font-size: 13px; font-weight: bold; } input[type=checkbox]+label:before { content: ""; display: block; width: 17px; height: 17px; margin-left: 14px; position: absolute; top: 0px; right: 0; border: 1px solid #83827F; } input[type=checkbox] { display: none !important; display: inline; } input[type=checkbox]:checked+label:after { content: "\e9c7"; font-family: "icomoon"; font-size: 10px; line-height: 20px; color: #FFFFFF; background-color: #44b774; display: block; position: absolute; top: 0px; right: 0px; width: 17px; height: 17px; padding-right: 4px; } /* link style -------------------------------------------------------------- */ a { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; text-decoration: none; color: #081E2A; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } a:focus, a:hover { color: #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; text-decoration: none !important; outline: 0; } @keyframes rainbow { 0% { background-position: right; } 50% { background-position: left; } 100% { background-position: right; } } path { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .form-wg { margin-right: -30px; } .form-wg .wg-box { width: calc(50% - 30px) !important; margin-right: 30px; } .form-wg .wg-box2 { width: calc(33.333% - 30px) !important; margin-right: 30px; } .form-wg .wg-box3 { width: calc(25% - 30px); margin-right: 30px; } .boxes { --size: 32px; --duration: 800ms; height: calc(var(--size) * 2); width: calc(var(--size) * 3); position: relative; transform-style: preserve-3d; transform-origin: 50% 50%; margin-top: calc(var(--size) * 1.5 * -1); transform: rotateX(60deg) rotateZ(-45deg) rotateY(0deg) translateZ(0px); } .boxes .box { width: var(--size); height: var(--size); top: 0; right: 0; position: absolute; transform-style: preserve-3d; } .boxes .box:nth-child(1) { transform: translate(-100%, 0); animation: box1 var(--duration) linear infinite; } .boxes .box:nth-child(2) { transform: translate(0, 100%); animation: box2 var(--duration) linear infinite; } .boxes .box:nth-child(3) { transform: translate(-100%, 100%); animation: box3 var(--duration) linear infinite; } .boxes .box:nth-child(4) { transform: translate(-200%, 0); animation: box4 var(--duration) linear infinite; } .boxes .box>div { --background: #44b774; --top: auto; --right: auto; --bottom: auto; --left: auto; --translateZ: calc(var(--size) / 2); --rotateY: 0deg; --rotateX: 0deg; position: absolute; width: 100%; height: 100%; background: var(--background); top: var(--top); left: var(--right); bottom: var(--bottom); right: var(--left); transform: rotateY(var(--rotateY)) rotateX(var(--rotateX)) translateZ(var(--translateZ)); } .boxes .box>div:nth-child(1) { --top: 0; --left: 0; } .boxes .box>div:nth-child(2) { --background: #306719; --right: 0; --rotateY: 90deg; } .boxes .box>div:nth-child(3) { --background: #439023; --rotateX: -90deg; } .boxes .box>div:nth-child(4) { --background: #EDEEEE; --top: 0; --left: 0; --translateZ: calc(var(--size) * 3 * -1); } html { -webkit-font-smoothing: antialiased; } * { box-sizing: border-box; } *:before, *:after { box-sizing: border-box; } body .dribbble { position: fixed; display: block; left: 20px; bottom: 20px; } body .dribbble img { display: block; height: 28px; } .icon-tour { width: 32px !important; position: relative; bottom: 5px; filter: invert(48%) sepia(82%) saturate(371%) hue-rotate(66deg) brightness(88%) contrast(91%); animation: spin 5s linear infinite; } @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(-360deg); } } /* Media Queries -------------------------------------------------------------- */ @media only screen and (max-width: 1400px) { .widget-faq .image-faq { margin-right: 0px; margin-left: 0px; margin-top: 0px; margin-bottom: 0px; } .slider-home3 .slider-home3-content { padding-top: 80px; padding-bottom: 150px; padding-left: 2.7em; } .slider-home3 { padding-right: 3.6%; } .header-top { padding-right: 15px; } .main-header .header-lower .fly-ab { display: none; } .main-header .header-lower { padding-right: 15px; } .slider-home2-image .slider-home2 .prev-slider2 { right: 84%; } .widget-feature .image-feature-wrap .exploring { right: 7%; } } @media only screen and (max-width: 1570px) { .header-lower.is-fixed.is-fixed.is-small { padding-right: 20px; padding-left: 20px; } .has-dashboard .profile-dashboard .favorite-wrap { padding: 34px 20px 64px 20px; } .has-dashboard .footer-dashboard { padding: 30px 15px 30px 15px; } .has-dashboard .profile-dashboard { padding: 80px 30px; } .has-dashboard .profile-dashboard .counter-dashboard .icon { margin-left: 20px; } .has-dashboard .header-dashboard { padding: 0px 15px 0px 15px; } .widget-tes-style3 .content { padding: 4.2em 4em 4em 10em; } .testimonial-section-h4 .content { padding-right: 8.4em; padding-top: 6.6em; padding-left: 5em; padding-bottom: 6.5em; } .widget-feature2 .content-feature2 { padding: 3em 7.3em 1em 8em; } .header-style1 .header-top { padding-left: 15px; padding-right: 15px; } .header-style2 .header-top { padding-left: 15px; padding-right: 15px; } .header-style2 .header-lower { padding-right: 15px; padding-left: 15px; } .header-style1 .header-lower { padding-right: 0px; padding-left: 20px; } } @media only screen and (max-width: 1400px) { .has-dashboard .profile-dashboard .my-listing-grid { grid-template-columns: repeat(1, 1fr); } .has-dashboard .profile-dashboard .my-booking-wrap { overflow-x: auto; } .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-title, .has-dashboard .profile-dashboard .my-booking-wrap .booking-table-content { min-width: 1400px; } } @media only screen and (max-width: 1300px) { .testimonial-section-h4 .gallery-testimonial-h4 { margin-right: 0px; padding-top: 5em; padding-right: 5em; } .testimonial-section-h4 .content { padding-right: 1em; padding-top: 5em; padding-left: 2em; padding-bottom: 5em; } .has-dashboard .header-dashboard .header-search .search-dashboard input { width: auto; } .has-dashboard .profile-dashboard .favorite-wrap .favorite-grid { grid-template-columns: repeat(2, 1fr); } .pr-256 { padding-left: 30px !important; } .counter-grid-dashboard { grid-template-columns: repeat(2, 1fr); } .widget-tes-style3 .content { padding: 4.2em 4em 4em 1em; } .widget-feature2 .content-feature2 { padding: 3em 4.3em 1em 1em; } .destination-grid { gap: 30px; } .travel-video .mask-video { right: 0%; } .main-header { height: auto; } } @media only screen and (max-width: 1280px) { .single-destinaion-content .image-wrap { flex-wrap: wrap; } .nav-tabs-activities .nav-item .nav-link { max-width: 150px; padding: 20px 10px 20px 10px; } .nav-tabs-activities .nav-item .nav-link span { font-size: 15px; } } @media only screen and (max-width: 1199px) { .sidebar-dashboard.actives .db-logo { padding: 29px 24px 28px 10px; } .has-dashboard .header-dashboard { padding: 15px 15px 15px 15px; } .header-dashboard .nav-outer { display: none; } .header-dashboard .mobile-button { display: block; } .header-dashboard .mobile-button i { color: #FFFFFF; } .has-dashboard .profile-dashboard .edit-profile .input-wrap input { width: 100%; } .footer-dashboard p { text-align: center; } .footer-dashboard .menu-footer { justify-content: center; } .tab-terms-condition .nav-pills .nav-link { padding: 20px 25px; } .tab-terms-condition .nav-pills { padding: 50px 20px 50px 20px; margin-left: 56px; max-width: 350px; width: 100%; } .widget-testimonial-style4 .des { font-size: 25px; line-height: 40px; padding-bottom: 20px; margin-bottom: 35px; } .about-us-h5 .content { padding-top: 3.7em; padding-right: 2em; padding-left: 2em; } .about-us-h5 .image { margin-right: 0em; } .slider-home5 .image-slide-home5 { margin-left: 0px; margin-right: 0px; } .blog-style3 .blog-content { padding: 24px 35px 18px 2em; } .impressino .mask-impression { display: none; } .widget-feature3 .image-feature3 { margin-left: 0px; padding-top: 0px; } .about-us-h4 .image-about-h4-wrap { margin-left: 2.5em; } .widget-feature2 .content-feature2 { padding: 3em 1em 1em 1em; } .widget-feature2 .image-feature2 { margin-left: 0px; } .about-us-h3 .about-us-h3-image { padding-right: 0px; padding-left: 30px; } .mobie-app .mobie-app-image { padding: 63px 40px 75px 40px; } .mobie-app .mobie-app-image .qr-code { display: none; } .destination-grid { grid-template-columns: repeat(3, 1fr); } .our-activities .right-side { padding-right: 0em; } .our-activities .activities-wrap { margin: 0px; } .about-us-h2 .image-about-us .mask1, .about-us-h2 .image-about-us .mask2 { display: none; } .blog-style .blog-content { padding: 29px 30px 26px 30px; } .offer-package .on-week-swipper-wrap { margin-left: 0em; } .offer-package .content .title-heading { margin-left: 0em; } .offer-package .content { padding-left: 0em; } .offer-package .feature-ofer { display: none; } .wd-search .form-group .search-bar-group .nice-select { width: auto; } .wd-search .form-group { width: 100%; } .slider-home1 .slider-content .btn-group .btn-w-wa { display: none; } .slider-home1 .silider-image .booking-title { left: 10.6%; top: 6%; } .slider-home1 .slider-content .title-slide { font-size: 50px; line-height: 70px; } .slider-home1 .silider-image .mask-slide { display: none; } .slider-home1 .silider-image .booking-title .booking { font-size: 25px; line-height: 17.69px; } .header-account .language, .header-account .currency { display: none; } .callt-to-action .shape-ab { display: none; } .header-sidebar { display: none !important; } .header-top .header-top-wrap .header-top-left .booking { display: none; } } @media only screen and (max-width: 1024px) { .listing-list-car-wrap-grid3 .listing-list-car-grid.listing-list-car-list { grid-template-columns: repeat(1, 1fr); } .has-dashboard .profile-dashboard .form-add-tour .grid-input-3 { grid-template-columns: repeat(1, 1fr); gap: 35px; } .has-dashboard .profile-dashboard .form-add-tour .grid-input-2 { grid-template-columns: repeat(1, 1fr); } .tour-single .inner-heading-wrap .inner-heading .title { font-size: 20px; line-height: 45px; margin-bottom: 10px; } .blog-style4 .blog-content .meta-list { flex-wrap: wrap; gap: 10px; } .widget-feature4 .feature-wrap-box { padding-left: 0em; gap: 30px 30px; } .box-tour-select-wrap { grid-template-columns: repeat(3, 1fr); } .slider-home3 { flex-direction: column-reverse; padding-right: 15px; padding-left: 15px; } .title-video { font-size: 100px; line-height: 120px; } .swiper-button-next, .swiper-button-prev { display: none; } .tf-widget-activities .tabs-activities-content .activities-content .mask-tab { left: 0em; display: none; } .tf-widget-activities .tabs-activities-content .activities-content { padding: 38px 30px; } .tf-widget-activities .tabs-activities-content .activities-image img { margin-right: 0em; } .tf-widget-activities .tabs-activities-content { margin-left: 0em; margin-right: 0em; padding: 16px 16px 16px 1em; } .nav-tabs-activities { padding-left: 0em; } #main .main-wrap { border-radius: 35px; } .wd-search { flex-wrap: wrap; width: 100%; } .wd-search .form-group { width: calc(50% - 20px); } .wd-search .form-group:not(:last-child)::before { content: none; } .wd-search .form-group:last-child { width: 100%; margin-top: 10px; } .sider-bar-tour-package .widget-filter .row .col-lg-2 { width: 48%; } .search-bar-group input { width: 100% !important; margin-right: 0; } .select2-container--default .select2-selection--single { width: 100% !important; } } @media only screen and (max-width: 991px) { .main-header .navigation li svg:not(:host).svg-inline--fa { color: #44b774; display: inline; } .about-us-h2 .mask2-about { bottom: -4%; } .header-lower.is-fixed.is-fixed.is-small { padding-right: 15px; padding-left: 15px; } .counter-block { display: block !important; } .row>* { padding-left: 15px; padding-right: 15px; } .mobie-mt { margin-top: 10px; } .mobie-mt i { font-size: 20px; } .widget-feature2 .image-feature2 .mask-ft-right { display: none; } .widget-destination1 { padding-top: 50px; } .widget-top-week { padding: 80px 0px 80px 0px; } .tour-package2 { padding-top: 80px; } .main-header .header-account { gap: 5px; } .header-account ul li i { top: 0px; } .has-dashboard .profile-dashboard .widget-dash-board { padding: 60px 30px 92px 30px; } .has-dashboard .header-dashboard .header-search .icon-bars { font-size: 21px; } .sidebar-dashboard.actives { max-width: 320px; right: 0; z-index: 10; } .sidebar-dashboard.actives .db-menu ul li a span { display: inline-block; } .sidebar-dashboard.actives .db-logo span { display: inline-block; } .has-dashboard.actives { margin-right: 0px; } .has-dashboard { margin-right: 0px; } .sidebar-dashboard { right: -350px; } .login .login-wrap .image { display: none; } .header-style3 .header-lower .logo-box { padding: 15px 18px 15px 50px; } .header-style3 .header-lower .header-account, .main-header.header-style2 .header-account { display: none; } .main-header.header-style2 .header-lower { padding: 20px 15px; } .main-header.header-style3 { position: fixed; } .wd-search-form .input-group-grid { grid-template-columns: repeat(2, 1fr); } .contact-us .box-contact { padding: 20px 20px 20px 20px; } .contact-us .contact-us-wrap>.inner-header .title { font-size: 25px; } .has-dashboard .profile-dashboard .edit-profile .grid-input-3 { grid-template-columns: repeat(1, 1fr); } .has-dashboard .profile-dashboard .edit-profile .grid-input-2 { grid-template-columns: repeat(1, 1fr); } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap { margin-right: 0px; margin-top: 20px; width: 100%; } .has-dashboard .profile-dashboard .edit-profile .upload-image-dashboard .upload-image-wrap .upload-file { min-width: 100%; } .upload-image-dashboard { flex-wrap: wrap; } .has-dashboard .profile-dashboard .favorite-wrap .favorite-grid { grid-template-columns: repeat(1, 1fr); } .has-dashboard .profile-dashboard .page-insight { margin-bottom: 30px; } .header-search-faq { padding-top: 80px; } .brand-logo-widget { padding: 50px 0px; } .terms-condition { padding-top: 80px; padding-bottom: 90px; } .tab-terms-condition .nav-pills { margin-left: 0px; margin-bottom: 30px; max-width: 100%; } .tab-terms-condition { flex-direction: column; } .tour-single .review-content-tour .form-review { margin-left: 0em; } .inner-heading-wrap { align-items: flex-start; flex-direction: column; } .inner-heading-wrap .list-wrap-heading { flex-wrap: wrap; } .inner-heading-wrap .inner-heading { margin-bottom: 20px; } .tour-single .inner-heading-wrap .inner-price .price-sale { font-size: 20px; margin-top: 10px; } .tour-single .inner-heading-wrap .inner-price .price { font-size: 16px; line-height: 20px; margin-right: 10px; } .sider-bar-tour-package { margin-left: 0px; margin-bottom: 50px; } .tf-icon-box.icon-box-style1 { margin-bottom: 30px; } .widget-tes-style3 .content { padding: 4.2em 1em 4em 1em; } .widget-tes-style3 .image .about-vector { left: 50px; } .widget-feature4 .mask-faeture4 { display: none; } .widget-feature4 .image-feature4 { display: none; } .discount-h5 .banner-part-item { margin-bottom: 30px; } .slider-home5 .image-slide-home5 .image-svg { bottom: 0%; right: -1%; } .slider-home5 .content-slide-home5 { margin-bottom: 50px; } .tf-widget-blog.blog-style2 { margin-bottom: 30px; } .tf-widget-place { margin-bottom: 30px; } .widget-feature3 .image-feature3 { margin-bottom: 30px; } .video-h4-widget .video-box { width: 100px; height: 100px; } .video-h4-widget .text-video { font-size: 80px; line-height: 100px; } .about-us-h4 { padding-bottom: 100px; } .about-us-h4 .image-about-h4-wrap { margin-left: 0em; margin-bottom: 30px; } .about-us-h4 .image-about-h4-wrap .box-year { bottom: 15.5%; } .about-us-h4 .image-about-h4-wrap .about-wrap-right { display: none; } .home4-content .btn-group { flex-wrap: wrap; } .slider-home4 .home4-content .title-slide { font-size: 50px; line-height: 69px; } .tf-instagram { margin-bottom: 30px; display: block; } .widget-tes-style2 { padding-top: 200px; padding-bottom: 80px; } .widget-counter2 { padding-top: 80px; } .destination-grid-6 { grid-template-columns: repeat(3, 1fr); } .widget-feature .tab-content .tour-listing { margin-bottom: 30px; } .about-us-h2 .image-about-us { margin-bottom: 30px; } .widget-banner-contact .mask-icon-banner { display: none; } .widget-banner-contact .image-banner-contact { display: none; } .widget-testimonial-style01 { padding-top: 200px; padding-bottom: 88px; } .nav-tabs-adventure .nav-link i { font-size: 20px; margin-left: 10px; } .nav-tabs-adventure .nav-link { font-size: 16px; } .adventure-content { padding: 30px 20px 0px 20px; } .tf-counter { margin-bottom: 25px; } .callt-to-action-button { margin-top: 20px; text-align: center !important; } .pd-main { padding: 80px 0; } .nav-tabs-activities .nav-item .nav-link { margin: 8px 8.5px; } .tab-tour-list .tour-listing { margin-bottom: 30px; } .travel-video .mask-video { bottom: 7%; } .btn-nex-prev { display: none; } .header-style1 .header-lower .logo-box { clip-path: polygon(0 0, 90% 0, 100% 100%, 0% 100%); padding: 0px 0 0px 35px; } .main-header.header-style1 .header-account { display: none; } .main-header.header-style1 .header-lower { padding: 10px 15px; } .side-blog-single .blockquote-blog { padding: 38px 35px 23px 7em !important; } .side-blog { margin-left: 0px; } .side-bar-right { padding-right: 0px; padding-top: 50px; } .footer-logo, .footer-service, .footer-gallery, .footer-newsletter { width: 50% !important; padding-left: 2em !important; padding-bottom: 3em; } .footer-style1 .footer-main { flex-wrap: wrap; } .footer-style1 .footer-main .footer-gallery { padding-left: 2em; } .header-account ul li i { font-size: 21px; } .header-account ul li span { display: none; } .header-top .header-top-wrap .header-top-left .follow-social span { display: none; } .header-top .header-top-wrap .header-top-right ul li:not(:nth-child(2)) { display: none; } .main-header .header-lower { padding: 10px 15px; } .mobile-button { display: block; } .main-header { position: relative; } .main-header .main-box .logo-box { position: relative; right: 0px; top: 0px; left: 0px; bottom: 0px; margin: 0px; text-align: right; } .main-header .main-menu { display: none; } .main-header .sticky-header .mobile-nav-toggler { display: block; } .main-header .header-lower .nav-outer { display: none; } } @media only screen and (max-width: 1250px) { .header-top .contacts a, .header-top .contacts a i { font-size: 13px; } } @media only screen and (max-width: 1200px) { .header-top .contacts { display: none; } .slider-home2-image .slider-home2 .image-slider-home2 { height: 450px; } .header-top .follow-social { /* display: none; */ justify-content: center; } .header-top p { padding: 10px; border: none; } } @media only screen and (max-width: 767px) { .alkhaleg-flight-search .switch-div:after, .alkhaleg-flight-search .date-selector:after { display: none; } .switch-div { position: relative; order: 1; } .wd-search-form { margin-top: 5px; } .alkhaleg-flight-search .trip-type-tabs { width: 100%; } .image-about-us .image-main { margin-bottom: 0; margin-top: 30px; } .archieve-tour .tf-my-listing { text-align: center; } .tf-my-listing .group-bar-wrap { justify-content: center; } .offer-details .content { text-align: center; } .offer-details p { margin: 0 auto 5px; } .side-blog-single-content .ux-content h3.title { line-height: 33px; } .tab-top-destination .nav-item .nav-link i { font-size: 22px; } .our-blog { padding-top: 30px !important; } .featured-cities .btn-main { margin-bottom: 80px; } .featured-cities .mt-44 { margin-top: 20px !important; } .login { padding-top: 0; padding-bottom: 80px; } .login .login-wrap { padding: 29px 10px 35px 10px; } .inner-header-login img.logo { display: none; } .mobie-app .mobie-app-image { padding: 35px 10px 35px 10px; } .mobie-app .mobie-app-image a img { height: 30px; } .mobie-app { height: auto; } .widget-mobie-app .mobie-app-content.relative.text-end { display: none; } .footer-style2, .footer-style2 .footer-bottom .copy-right { text-align: center; } .footer-style2 .flex-three { display: flex; align-items: center; justify-content: center; } .home-packages .mb-22 { margin-bottom: 0 !important; } .home-packages a.view-all { text-align: center; font-size: 15px; margin-top: 0; margin-bottom: 20px; } .home-packages .title-heading { text-align: center; font-size: 25px; } .widget-feature .image-feature-wrap { padding-left: 0px; } .about-us-h2 .content-about-us .pl-about { padding-right: 0px; } .icon-box-style5 { padding: 20px 4px; } .footer-style1 .footer-bottom { display: none; } .contact-us .contact-us-wrap { margin-right: 0px; margin-top: 40px; padding: 30px 15px 57px 15px; text-align: center; } .contact-us p.des { font-size: 15px; line-height: 1.8; } .listing-list-car-wrap-grid3 .listing-list-car-grid { grid-template-columns: repeat(2, 1fr); } .impressino .mt-impressino { margin-top: 4em; } .has-dashboard .profile-dashboard { padding: 60px 15px; } .adventure-content .adventure-scroll { overflow-x: scroll; } .adventure-content .nav-tabs-adventure { width: 820px; } .main-header.header-style2 .header-account { display: none; } .main-header.header-style2 .header-lower { padding: 20px 15px; } .testimonial-section-h4 .gallery-testimonial-h4 { display: none; } .icon-box-style6 { margin-bottom: 30px; } .slider-home4 { padding-top: 170px; padding-bottom: 160px; } .main-header.header-style3 .header-lower { margin-top: 15px; } .header-style3 .header-top { display: none; } .tf-widget-blog.blog-style1 { margin-bottom: 60px; } .has-dashboard .header-dashboard .header-search .search-dashboard { display: none; } .contact-us .contact-us-map { padding-left: 0em; } .contact-us .box-contact { margin-bottom: 30px; } .has-dashboard .profile-dashboard .favorite-wrap { padding: 34px 20px 64px 20px; } .counter-grid-dashboard { grid-template-columns: repeat(1, 1fr); } .header-search-faq .inner-header .popular { margin-bottom: 16px; } .header-search-faq .inner-header .tag-wrap .tag-popular li { margin-bottom: 16px; } .header-search-faq .inner-header .tag-wrap .tag-popular li span { padding: 6px 12px; } .tag-popular { flex-wrap: wrap; } .inner-faq .col-md-6:not(:last-child) .faq-list { margin-bottom: 30px; } .header-search-faq .inner-header .title { font-size: 35px; line-height: 50px; } .team-member-page .team-member-grid { grid-template-columns: repeat(2, 1fr); } .tour-single .review-content-tour .client-review .client-review-list .client-review-item { padding-left: 0em; } .tour-single .planing-content-tour .tour-planing-section .content-box { padding-left: 0em; } .expect-wrap .listing-clude { margin-bottom: 10px; } .tf-widget-blog.blog-style4 { margin-bottom: 30px; } .about-us-h5 .content { padding-right: 0em; padding-left: 0em; } .slider-home5 .content-slide-home5 { padding-left: 0em; padding-top: 0px; } .impressino { padding-top: 80px; padding-bottom: 80px; } .impressino-counter { margin-left: 0px; } .widget-feature3 .box-feature-wrap { padding: 0 15px; } .inner-content-about .icon-box-style6:not(:last-child) { margin-bottom: 30px; } .content-feature2 .cheackmark { margin-bottom: 30px; } .faq-question { padding: 22px 35px 22px 35px; } .widget-faq .content-faq { padding-right: 0px; } .about-us-h3 .about-us-h3-image { padding-left: 0px; margin-bottom: 30px; } .about-us-h3 .about-us-h3-image .about-vector { top: -3%; right: 0%; } .footer-bottom .policy-tern { display: none; } .footer-style2 .footer-bottom .policy-tern li:not(:first-child) { margin-right: 15px; } .footer-bottom .policy-tern { justify-content: center; margin-top: 20px; } .footer-item-logo { margin-bottom: 30px; } .footer-style2 .footer-item-quick-link { padding-right: 0px; margin-bottom: 0; margin-top: 20px; } .footer-style2 .mb-30 { margin-bottom: 5px; } .footer-style2 .footer-item-newsletter { margin-right: 0px; } .footer-style2 .footer-item-company { padding-right: 0px; margin-bottom: 0px; } .widget-feature .content-feature-wrap .feature-list-wrap .feature-list .feature-list-iteam { width: 100%; } .widget-feature .content-feature-wrap { padding-right: 0em; margin-top: 30px; padding-left: 0px; } .widget-video { padding-top: 100px; padding-bottom: 100px; } .destination-explore { margin-top: 45px; } .view-all-wrap { justify-content: flex-start; margin-top: 15px; } .our-activities { margin: 0px 15px; } .our-activities .activities-wrap { margin-bottom: 30px; } .about-us-h2 .content-about-us .about-us-list { margin-top: 30px; margin-right: 0px; margin-left: 0px; } .about-us-h2 .image-about-us { padding-left: 0em; padding-top: 0px; } .slider-home2-content .mask-slide2-flan { display: none; } .slider-home2-content .title-slide { font-size: 30px; line-height: 31px; } .slider-home2-content p { font-size: 17px !important; line-height: 1.3; } .slider-home2-content { padding-top: 100px; padding-bottom: 100px; } .tf-widget-blog.blog-style { margin-bottom: 30px; } .widget-testimonial-style01 .box-testimonial2 { right: 45%; top: 2%; } .grid-three-destination { grid-template-columns: repeat(2, 1fr); } .tf-widget-activities .tabs-activities-content .activities-image img { width: 100%; } .tf-widget-activities .tabs-activities-content { flex-direction: column; } .tf-widget-activities .tabs-activities-content .activities-content .icon-activitis { width: 65px; height: 65px; } .tf-widget-activities .tabs-activities-content .activities-content .icon-activitis i { font-size: 20px; } .tf-widget-activities .tabs-activities-content .activities-content .icon-list-wrap:not(:last-child) { margin-left: 0px; margin-bottom: 15px; } .title-activitis.mb-60 { margin-bottom: 30px; } .activities-content .flex-three.mb-30 { flex-direction: column; align-items: flex-start; } .tab-list .nav-link { margin: 6px 12px; } .form-comment { padding: 60px 30px 80px 30px; } .comment-single .comment-blog { padding-left: 0.5em; padding-right: 0.5em; } .side-blog-single-content .share-blog .tag-blog .tag li { margin-bottom: 15px; } .side-blog-single-content .ux-content img { width: 100%; margin-top: 30px; } .callt-to-action { padding: 30px 20px 30px 20px; } .mb--93 { margin-bottom: 20px; } .callt-to-action-content { margin-bottom: 20px; } .callt-to-action .callt-to-action-content .content .title-call { font-size: 29px; line-height: 40px; } .callt-to-action .callt-to-action-content .content .des { font-size: 16px; line-height: 29px; } .callt-to-action { flex-wrap: wrap; justify-content: center; } .footer-style1 .footer-main { padding-top: 80px; padding-bottom: 20px; } .footer-bottom { text-align: center; } .footer-bottom .social { justify-content: center !important; } } @media only screen and (max-width: 600px) { .slider-home4 .home4-content .btn-group .btn-w-wa { line-height: 0px; } .mobile-button i { padding: 0px; } .callt-to-action { margin-bottom: 50px; } .about-us-h4 .image-about-h4-wrap .about-wrap-left .quote { display: none; } .about-us-h4 .image-about-h4-wrap { padding-right: 0px; } .listing-list-car-wrap-grid3 .listing-list-car-grid.listing-list-car-list .tour-listing { flex-direction: column; } .listing-list-car-wrap-grid3 .listing-list-car-grid.listing-list-car-list .tour-listing .tour-listing-content { padding: 25px 20px 20px 20px; } .listing-list-car-wrap-grid3 .listing-list-car-grid.listing-list-car-list .tour-listing .tour-listing-image { max-width: 100%; } .listing-list-car-wrap-grid3 .listing-list-car-grid { grid-template-columns: repeat(1, 1fr); } .widget-testimonial-style01 .box-testimonial1 { animation: unset; } .widget-testimonial-style5 .start { margin-left: 0em; } .row { margin-left: -10px; margin-right: -10px; } .tf-counter .icon.mb-32 { margin-bottom: 15px; } .widget-counter .counter-top, .widget-counter .counter-bottom { display: none; } .tf-counter .icon svg { width: 40px; height: 40px; } .tf-counter .title-counter { font-size: 16px; line-height: 23px; } .tf-counter .number-counter { font-size: 30px; line-height: 30px; margin-top: 10px; } .tf-counter .icon { height: 40px; } .tf-counter { padding: 35px 25px; } .clip-text { font-size: 60px; line-height: 60px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .content { padding-right: 0px; padding-top: 25px; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item { flex-wrap: wrap; } .has-dashboard .profile-dashboard .my-listing-grid .my-listing-item .image img { width: 100%; height: 100%; } .blog-style2 .blog-content { padding: 35px 36px 26px 2em; } .grid-three-destination { grid-template-columns: repeat(1, 1fr); } .wd-search .form-group { width: calc(100% - 20px); } .wd-search .form-group .search-bar-group { width: 100%; } .travel-video .mask-video { width: 150px; } .wd-search-form .input-group-grid { grid-template-columns: repeat(1, 1fr); } .form-search-faq button { max-width: 130px; } .side-blog .blog-content .entry-title { margin-top: 10px; margin-bottom: 10px; font-size: 25px; line-height: 40px; } .side-blog .blog-content .description { margin-bottom: 20px; } .side-blog .top-detail-info ul { flex-wrap: wrap; gap: 6px; } .tour-single .gallery-content-tour { gap: 20px; } .review-content-tour .form-review .inner-review { flex-wrap: wrap; } .review-content-tour .form-review .inner-review .inner-review-item { width: 50%; } .review-content-tour .client-review .inner-header { flex-wrap: wrap; gap: 10px; } .tour-single .review-content-tour .custom-review { padding: 40px 30px 80px 30px; } .tour-single .review-content-tour .custom-review .card-review { margin-left: 0px; margin-bottom: 29px; } .custom-review .flex.card-list { flex-wrap: wrap; } .tour-single .listing-icon li p { line-height: 32px; } .about-us-archieve .bg-archieve-about { display: none; } .breadcumb-section .bcrumb-ab { display: none; } .breadcumb-section .title { font-size: 45px; line-height: 50px; margin-bottom: 26px; } .slider-home5 .content-slide-home5 .image-svg2 { top: 23.3%; } .slider-home5 .content-slide-home5 .title-slide { font-size: 50px; line-height: 65px; } .tf-widget-blog.blog-style3 { flex-direction: column; } .blog-style3 .blog-image { max-width: 100%; } .blog-style3 .blog-content { width: 100%; margin-right: 0px; } .slider-home4 .video-wrap { display: none; } .slider-home4 .home4-content .btn-group .btn-w-wa { padding: 18px 0px; } .widget-testimonial-style3 .testimonial-content .tes { font-size: 25px; line-height: 45px; } .tab-top-destination .nav-item .nav-link { padding: 12px 8px 12px 8px; } .destination-grid-6 { grid-template-columns: repeat(2, 1fr); } .box-tour-select-wrap { grid-template-columns: repeat(2, 1fr); } .slider-home3 .slider-home3-content .title-slide { font-size: 53px; line-height: 55px; } .destination-grid { grid-template-columns: repeat(2, 1fr); } .our-activities .activities-wrap { padding: 40px 20px; } .slider-home2-content .tour-list ul { margin-top: 38px; justify-content: flex-start; align-items: center; flex-wrap: wrap; } .widget-banner-contact address { font-size: 14px; padding: 8px 16px; margin-right: 20px; } .widget-testimonial-style01 .box-testimonial1 { margin-top: 0px; margin-right: 0px; margin-bottom: 30px; rotate: 0deg; z-index: 2; position: relative; } .widget-testimonial-style01 .widget-testimonial { margin-right: 0px; margin-left: 0px; } .widget-testimonial-style01 .box-testimonial2 { display: none; } .widget-brand-logo { padding-top: 40px; padding-bottom: 80px; } .side-blog-single .blockquote-blog { padding: 30px; } .side-blog-single .blockquote-blog p { font-size: 18px; line-height: 33px; } h2 { font-size: 30px; line-height: 35px; } .sub-title-heading { font-size: 16px; line-height: 20.68px; } } @media only screen and (max-width: 575px) { .about-us-h4 .inner-content-about .btn-wrap-about .profile { margin-top: 0px; } .about-us-h4 .image-about-h4-wrap .about-wrap-left { max-width: 100%; width: 100%; } .tf-adventure .adventure-image img { width: 100%; } .tf-adventure { flex-direction: column; margin-bottom: 0px; } .tf-adventure .adventure-image { margin-left: 0px; margin-bottom: 20px; width: 100%; } .archieve-tour .tf-my-listing1 .filter-tour-package { margin-top: 20px; margin-bottom: 20px; flex-wrap: wrap; gap: 20px; } .archieve-tour .tf-my-listing1 .filter-tour-package .nice-select:not(:last-child) { margin-left: 0px; } .archieve-tour .tf-my-listing1 .filter-tour-package .nice-select { width: calc(50% - 20px); } .archieve-tour .tf-my-listing .listing-all-wrap .group-select-recently .nice-select.open .list { width: auto; left: auto; right: 0; } .grid-gallery { display: flex; flex-direction: column; } .footer-logo, .footer-service, .footer-gallery, .footer-newsletter { width: 100% !important; padding-left: 0em !important; padding-bottom: 3em; } .header-style2 .header-top { display: none; } .brand-logo-h4 .line-brand-logo .line-text { width: 80%; } .tf-image-box.center.pt-25 { padding-top: 0px; } .tf-image-box.center { margin-bottom: 30px; } .tour-single .planing-content-tour .tour-planing-section .number-box { margin-left: 0px; margin-top: 0px; margin-bottom: 24px; } .tour-planing-section { flex-wrap: wrap; } .tour-single .planing-content-tour .tour-planing-section:not(:last-child) { margin-bottom: 30px; } .image-gallery-single .col-sm-6 { margin-bottom: 30px; } .listing-list-car-grid { grid-template-columns: 1fr; } .tf-my-listing .group-bar-wrap { justify-content: center; margin-top: 13px; } .archieve-tour .tf-my-listing .listing-all-wrap .group-select-recently .nice-select { padding: 8px 0px 8px 35px; } .archieve-tour .tf-my-listing { padding: 20px 27px; } .inner-content-about .btn-wrap-about { flex-wrap: wrap; } .inner-content-about .btn-wrap-about .profile { margin-right: 0px; margin-top: 20px; } } @media only screen and (max-width: 480px) { .slider-home4 .home4-content .btn-group .btn-main { padding: 11px 20px; } .slider-home4 .home4-content .title-slide { font-size: 35px; line-height: 45px; } .box-tour-select-wrap { padding: 40px 20px; } .tf-gallery img { height: 400px; } .mb-37 { margin-bottom: 30px; } .destination-style>img { height: 400px; } .listing-list-car-grid.listing-list-car-list .tour-listing { flex-direction: column; } .listing-list-car-grid.listing-list-car-list .tour-listing .tour-listing-content { padding: 20px 20px 20px 20px; } .listing-list-car-grid.listing-list-car-list .tour-listing .tour-listing-image { max-width: 100%; } .tab-tour-single .nav-link, .tab-tour-single .nav-item { width: 100%; text-align: right; } .tab-tour-single .nav-link { padding: 20px 30px; } .widget-testimonial-style2 { padding: 40px 35px 40px 30px; } .fs-28-46 { font-size: 15px; line-height: 20px; } .slider-home1 .slider-content .title-slide { font-size: 30px; line-height: 39px; } .slider-home1 .slider-content .title-slide.mb-32 { margin-bottom: 17px; margin-top: 8px; } .nav-tabs-activities .nav-item .nav-link:hover::before, .nav-tabs-activities .nav-item .nav-link.active::before { border-right: 8px solid transparent; border-left: 8px solid transparent; border-top: 13px solid #44b774; bottom: -11px; } .nav-tabs-activities .nav-item .nav-link .icon i, .nav-tabs-activities .nav-item .nav-link .icon svg { font-size: 30px; width: 30px; } .nav-tabs-activities .nav-item .nav-link .icon { height: 20px; margin-bottom: 0px; margin-left: 16px; } .nav-tabs-activities .nav-item .nav-link { padding: 20px 30px 20px 20px; max-width: 100%; width: 100%; justify-content: flex-start; flex-direction: row; margin: 0px 0px; margin-bottom: 25px; } .nav-tabs-activities .nav-item { width: 100%; } .inner-content-about .btn-wrap-about { flex-wrap: wrap; flex-direction: column; align-content: flex-start; } .input-wrap-social .flex-three { flex-wrap: wrap; } .login .login-wrap .content .input-wrap-social .login-social:not(:last-child) { margin-left: 0px; margin-bottom: 20px; } .login .login-wrap .content .input-wrap-social .login-social { width: 100%; justify-content: center; } .team-member-page .team-member-grid { grid-template-columns: repeat(1, 1fr); } .side-blog-single .blockquote-blog { padding: 38px 35px 23px 3em !important; } .side-blog .blog-image .list-categories .new { font-size: 16px; padding: 9px 15px; width: 60px; } .client-review .client-review-list .client-review-item { flex-wrap: wrap; } .tour-single .information-content-tour .expect-wrap .expect span, .tour-single .information-content-tour .expect-wrap .expect p { width: 100%; } .tour-single .information-content-tour .expect-wrap .expect { flex-wrap: wrap; } .instagram-post .instagram-post-grid { grid-template-columns: repeat(1, 1fr); } .widget-feature4 .feature-wrap-box { grid-template-columns: 1fr; } .slider-home4 .home4-content { padding-left: 0em; } .box-tour-select-wrap { grid-template-columns: repeat(1, 1fr); } .slider-home2-content .tour-list ul li:not(:last-child) { margin-left: 0px; } .widget-testimonial .testimonial-content .icon-tes { display: none; } .widget-testimonial .testimonial-image .avata img { width: 45px; height: 45px; } .widget-testimonial .testimonial-content .tes { font-size: 25px; line-height: 44px; } .image-box-tesimonial { max-width: 100%; } .line-brand-logo .line-text { padding: 0 5px; width: 70%; } .widget-counter .cta-wrap { flex-wrap: wrap; justify-content: center; } .widget-counter .content .title-call, .widget-counter .content .des { text-align: center; } .widget-counter .content .title-call { font-size: 30px; line-height: 45px; } .offer-package .count-dow-wrap { flex-wrap: wrap; } .offer-package .content .count-dow-wrap .title-counters { margin-left: 0px; margin-bottom: 15px; margin-top: 10px; width: 100%; } .travel-video .mask-video { display: none; } .about-us .col-lg-12.flex { flex-wrap: wrap; } .about-us .col-lg-12.flex .client { margin-right: 0px; } .wd-search .form-group { width: calc(100% - 20px); } #comment textarea.input-cmt { height: 150px; } #comment .group-gap { grid-template-columns: 1fr; margin-bottom: 20px; } .comment-single .comment-blog .content { padding-right: 0px; padding-top: 20px; } .comment-single .comment-blog { flex-direction: column; } .callt-to-action .callt-to-action-content .content .title-call { margin-top: 15px; } .callt-to-action .callt-to-action-content .content { margin-right: 0px; } .callt-to-action-content { flex-direction: column; text-align: center; } .header-top .header-top-wrap .header-top-left .follow-social ul { padding: 5px 15px; } .header-top .header-top-wrap .header-top-right ul li span { font-size: 13px; } .header-top .header-top-wrap .header-top-right ul li:not(:last-child) { margin-left: 10px; } } @media only screen and (max-width: 414px) { .about-us-h5 .about-wrap { flex-wrap: wrap; } .impressino-counter { grid-template-columns: 1fr; } .about-us-h3-content .about-wrap { flex-wrap: wrap; } .about-us-h3 .about-us-h3-content .about-wrap .btn-main { margin-right: 0px; margin-top: 30px; } } @media only screen and (max-width: 400px) { .main-header .header-account { gap: 5px; } } @media only screen and (max-width: 360px) { .close-btn { right: 260px; top: 25px; color: #FFFFFF; } .mobile-menu-visible .close-btn { transition-delay: 0.2s; } } .search-trip-form .filter-wrapper { margin: 30px auto 0; max-width: 100%; padding: 0; } /* Tab Navigation Styles */ .search-trip-form .nav-buttons .nav-pills { background: #FFFFFF; border-radius: 15px 15px 0 0; padding: 8px; margin-bottom: 30px; justify-content: center; gap: 5px; width: fit-content; margin: auto; } .search-trip-form { position: relative; padding: 40px 20px; } .search-trip-form.offers-p { margin-top: 80px; margin-bottom: -70px; } .search-trip-form form { background: #FFFFFF; display: flex; justify-content: space-between; border-radius: 10px; padding: 10px; } .search-trip-form form button { border-radius: 10px 0 0 10px; transition: all 0.3s ease-in-out; } .search-trip-form form button:hover { background: #045c96; } .search-trip-form .nav-buttons .nav-link { background: transparent; border: none; color: #6c757d; font-weight: 500; padding: 12px 20px; border-radius: 12px; display: flex; align-items: center; gap: 8px; transition: all 0.3s ease; min-width: 120px; justify-content: center; color: black; } .search-trip-form .nav-buttons .nav-link:hover { background: rgba(108, 186, 75, 0.1); color: #44b774; } .search-trip-form .nav-buttons .nav-link.active { background: #44b774; color: white; box-shadow: 0 4px 12px rgba(108, 186, 75, 0.3); } .search-trip-form .nav-buttons .nav-link svg { width: 20px; height: 20px; fill: currentColor; } /* Search Trip Form Parent Styles */ .search-trip-form { margin-bottom: 0; } .search-trip-form .form-row { display: flex; align-items: center; gap: 15px; min-height: 70px; } .search-trip-form .form-fields { display: flex; align-items: center; gap: 15px; flex: 1; background: #f8f9fa; border-radius: 12px; padding: 15px; } /* Filter Area Styles */ .search-trip-form .filter-area { background: transparent; border-radius: 0; padding: 10px; margin-bottom: 0; box-shadow: none; } .search-trip-form .single-search-box { display: flex; align-items: center; gap: 0; padding: 0; background: transparent; border-radius: 0; width: 100%; min-height: auto; } .search-trip-form .single-search-box .icon { /* background: #44b774; */ border-radius: 10px; padding: 0; display: flex; align-items: center; justify-content: center; min-width: 45px; height: 45px; } .search-trip-form .single-search-box .icon svg { width: 22px; height: 22px; fill: #44b774; } .search-trip-form .searchbox-input { flex: 1; } .search-trip-form .searchbox-input label { font-size: 12px; color: #6c757d; font-weight: 500; margin-bottom: 0; display: block; padding: 0; text-align: right; } .search-trip-form .custom-select-dropdown { position: relative; } .search-trip-form .select-input { display: flex; align-items: center; justify-content: space-between; cursor: pointer; padding: 5px 0; z-index: 9; } .search-trip-form .quantity-counter { position: relative; } .search-trip-form input.quantity__input { height: 30px; border: none; } .search-trip-form a.quantity__plus { top: -5px; position: absolute; left: 15px; } .search-trip-form a.quantity__minus { top: 12px; position: absolute; left: 15px; } .search-trip-form .select-input input { border: none; background: transparent; font-weight: 600; color: #333; font-size: 14px; cursor: pointer; width: 100%; /* pointer-events: none; */ padding: 0; } .search-trip-form .select-input input:focus { outline: none; } .search-trip-form .select-input i { color: #6c757d; font-size: 12px; transition: transform 0.3s ease; } .search-trip-form .select-input.active i { transform: rotate(-180deg); } /* Divider Styles */ .search-trip-form .divider { position: relative; } .search-trip-form .divider:not(:last-child)::after { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 40px; background: #e9ecef; } /* Search Button Styles */ .search-trip-form .search-btn { background: #44b774; border: none; color: white; padding: 15px 30px; border-radius: 12px; font-weight: 600; font-size: 16px; transition: all 0.3s ease; box-shadow: 0 4px 12px rgba(108, 186, 75, 0.3); min-width: 120px; height: 70px; display: flex; align-items: center; justify-content: center; gap: 8px; } .search-trip-form .search-btn:hover { background: #5da63f; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(108, 186, 75, 0.4); } .search-trip-form .search-btn svg { width: 20px; height: 20px; fill: currentColor; } /* Custom Dropdown Styles */ .search-trip-form .custom-select-wrap { position: absolute; top: calc(100% + 5px); right: -55px; left: 0; background: white; border-radius: 12px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15); z-index: 1000; min-width: 270px; max-height: 300px; overflow-y: auto; opacity: 0; visibility: hidden; transform: translateY(-10px); transition: all 0.3s ease; } .search-trip-form .custom-select-wrap.show { opacity: 1; visibility: visible; transform: translateY(0); } .search-trip-form .custom-select-search-area { padding: 10px 5px; border-bottom: 1px solid #f0f0f0; display: flex; align-items: center; gap: 10px; } .search-trip-form .custom-select-search-area i { color: #6c757d; font-size: 16px; } .search-trip-form .custom-select-search-area input { width: 100%; border: 1px solid #d1d5db; border-radius: 6px; padding: 8px 12px; font-size: 14px; outline: none; } .search-trip-form .custom-select-search-area input::placeholder { color: #999; } .search-trip-form .option-list { list-style: none; padding: 0; margin: 0; } .search-trip-form .option-list li { padding: 12px 15px; cursor: pointer; border-bottom: 1px solid #f0f0f0; display: flex; justify-content: space-between; align-items: center; transition: background-color 0.2s ease; } .search-trip-form .option-list li:hover { background: #f8f9fa; color: #44b774 !important; } .search-trip-form .option-list li:last-child { border-bottom: none; } .search-trip-form .destination h6 { margin: 0; font-size: 14px; font-weight: 600; color: #333; text-align: right; line-height: 1; } .search-trip-form .destination p { margin: 0; font-size: 12px; color: #6c757d; } .search-trip-form .tour span { background: #44b774; color: white; padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; text-align: center; line-height: 1.2; display: flex; align-items: center; justify-content: center; border-radius: 50%; width: 50px; height: 50px; } .search-trip-form .single-item h6 { margin: 0; font-size: 14px; font-weight: 600; color: #333; } /* Responsive Design */ @media (max-width: 1200px) { .search-trip-form .form-row { flex-wrap: wrap; gap: 10px; } .search-trip-form .form-fields { flex-direction: column; gap: 15px; padding: 20px; } .search-trip-form .search-btn { width: 100%; margin-top: 15px; } } @media (max-width: 768px) { .filter-wrapper { margin: 20px; padding: 20px; } .nav-buttons .nav-pills { flex-direction: column; gap: 5px; } .nav-buttons .nav-link { width: 100%; justify-content: flex-start; } .search-trip-form .form-row { flex-direction: column; gap: 15px; } .search-trip-form .form-fields { flex-direction: column; width: 100%; } .search-trip-form .divider::after { display: none; } .search-trip-form .single-search-box { /* flex-direction: column; */ text-align: center; gap: 10px; padding: 15px; background: #f8f9fa; border-radius: 12px; } .search-trip-form .single-search-box .icon { align-self: center; } .search-trip-form .search-btn { width: 100%; height: 60px; } } @media only screen and (max-width: 767px) { .mobie-app .mobie-app-image .title-heading { font-size: 24px; line-height: 35px; } .order-mob { order: -1; } .mob-order { order: 1; } .search-trip-form .nav-buttons .nav-pills { width: 100% !important; display: grid; grid-template-columns: repeat(2, 1fr); } .search-trip-form form { display: block !important; } /* .search-trip-form { margin-bottom: 20px; display: none; } */ .slider-home2-content { position: unset; z-index: 2; padding-top: 0; padding-bottom: 0; bottom: 0; right: 50%; width: 100%; transform: unset; background: url(../../assets/images/slide/slide2.jpg); background-size: cover; border-radius: 25px; } .slider-home2-content .mask-slide2 { display: none; } .slider-home2-image .slider-home2 .image-slider-home2 { height: 80vh; /* display: none; */ position: absolute; width: 100%; right: 0; padding: 0; filter: brightness(0.8); } .slider-home2-content .tf-container { /* background: rgba(0, 0, 0, 0.5); */ padding: 40px 0 7px !important; border-radius: 25px; } .search-trip-form .filter-area { padding: 20px 0; } .search-trip-form form button { width: 100%; border-radius: 0 0 25px 25px; justify-content: center; } .hero-sec-container { margin: 0; } } button.owl-prev { position: absolute; top: 38%; right: -15px; background: none!important; border: 1px solid #045c96 !important; color: #045c96 !important; width: 30px; height: 30px; border-radius: 50%; text-align: center; transition: all 0.3s ease-in-out; } button.owl-next { position: absolute; top: 38%; left: -15px; background: none !important; border: 1px solid #045c96 !important; color: #045c96 !important; width: 30px; height: 30px; border-radius: 50%; text-align: center; transition: all 0.3s ease-in-out; } button.owl-prev:hover, button.owl-next:hover { background: #44b774 !important; color: #FFF !important; border: 1px solid #44b774 !important; } .owl-carousel button.owl-dot { background: #d0d0d0 !important; width: 26px !important; height: 26px !important; border-radius: 100%; border: 1px solid #FFF !important; box-shadow: 0 0 0 8px #FFF inset; margin: 0 2px; } .owl-dots { text-align: center; margin-top: 10px; } .owl-carousel button.owl-dot.active { background: #44b774 !important; border-radius: 100%; border: 1px solid #44b774 !important; /* box-shadow: 0 0 0 7px #FFF inset; */ } .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { display: none; } footer .image-about-us .mask2 { left: 20%; } footer .image-about-us .mask1 { right: 22%; } @media (max-width:767px) { .sider-bar-tour-package .widget-filter .row .col-lg-2 { width: 100%; margin-right: 0; height: 70px !important; } .owl-nav { display: none; } footer .image-about-us .mask2 { left: 1%; top: 350px; } footer .image-about-us .mask1 { right: -15%; top: 10px; } .mask-bottom { width: 300px; -webkit-animation: toRightFromLeft 10s infinite; animation: toRightFromLeft 10s infinite; } } .offers { padding: 5px; } .all-offers .tour-listing-content .title-tour-list { font-size: 16px !important; } .all-offers .tour-listing-content .title-tour-list:hover { color: #44b774; } .all-offers p { font-size: 15px; margin-bottom: 0px; line-height: 1.3; color: black; /* border-bottom: 1px solid #EBEBEB; */ padding-bottom: 10px; } .offer-details-head { padding: 80px 0 30px; margin-bottom: 90px; } .offer-details-head h1 { text-align: right; margin-top: 15px !important; margin-bottom: 10px !important; line-height: 1.3; } .offer-details-head p { color: white; text-align: right; } .offer-details-head .top-img { width: auto; display: block; } .offer-details .coupon-container { position: relative; display: block; font-family: sans-serif; text-align: center; width: fit-content; margin: auto; } .offer-details .coupon-code { padding: 2px 40px; background-color: #44b774; color: white; display: block; text-align: center; cursor: pointer; font-weight: 500; font-weight: bold; font-size: 14px; border-radius: 40px; user-select: none; transition: all 0.3s ease-in-out; } .offer-details .coupon-code:hover { background: #045c96; } .offer-details .copied-message { position: absolute; top: -25px; right: 50%; transform: translateX(50%); background-color: #44b774; color: white; padding: 4px 10px; border-radius: 4px; font-size: 12px; display: none; } .offer-details { margin: 30px auto; } .offer-details .row { align-items: center; } .offer-details .content { border: 1px dashed #CCC; padding: 20px; border-radius: 10px; transition: all 0.3s ease-in-out; } .offer-details .content:hover { border-color: #44b774; } .offer-details h3 { font-size: 20px; } .offer-details h5 { font-size: 16px; font-weight: 400; } .offer-details p { font-size: 14px; font-weight: bold; background: #44b7742e; width: fit-content; padding: 2px 10px; border-radius: 5px; margin-top: 10px; color: #44b774; } .offer-details small { color: #44b774; font-size: 14px; font-weight: bold; } .regular-price { text-decoration: line-through; color: #777; } .mb-20 { margin-bottom: 15px; } .image-wrapper { position: relative; display: block; overflow: hidden; border-radius: 10px !important; } .image-wrapper img { width: 100%; display: block; border-radius: 10px; } .image-wrapper .overlay { position: absolute; top: 0; right: 0; left: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); border-radius: 10px !important; opacity: 0; transition: all 0.6s ease; transform: scale(0.0); display: flex; justify-content: center; align-items: center; flex-direction: column; } .image-wrapper:hover .overlay { opacity: 1; transform: scale(1.1) } .eye-icon { font-size: 24px; color: #44b774; } .itinerary-accordion .accordion-item { border-radius: 8px; overflow: hidden; border: 1px solid #EEE; margin-bottom: 15px; transition: transform 0.2s; background: white; } .itinerary-accordion .accordion-button { background-color: #fff; color: #333; font-weight: 600; font-size: 1.1rem; padding: 0 0 0 10px; transition: background-color 0.3s ease; } .itinerary-accordion .accordion-button:hover { /* background-color: #e2f0ff; */ } .itinerary-accordion .accordion-button:not(.collapsed) { /* background-color: #d0e8ff; */ /* color: #000; */ box-shadow: none; } .itinerary-accordion .accordion-body { background-color: #ffffff; padding: 1rem 1.5rem; font-size: 0.95rem; line-height: 1.6; color: #444; } .itinerary-accordion .accordion-body p { margin-bottom: 0.75rem; } .itinerary-accordion .accordion-body em { color: #0077b6; font-style: normal; font-weight: 600; } .day-label { background-color: #28a745; color: #fff; padding: 14px 10px; border-radius: 4px; margin-left: 8px; display: inline-block; font-weight: bold; min-width: 100px; } .whatsapp-btn { background: #44b774; border-radius: 5px; color: white !important; padding: 10px 15px; margin: 10px 0 !important; display: block; font-size: 18px; } .spans-sec { position: absolute; font-size: 14px; top: 10px; right: 10px; z-index: 1; } .spans-sec .li-danger { background: #f80000ab; padding: 7px 10px; font-size: 15px; border-radius: 6px; color: white; line-height: 1; } .spans-sec .li-primary { background: #0d02cc57; padding: 7px 10px; font-size: 15px; border-radius: 6px; color: white; line-height: 1; } .spans-sec .li-success { background: #02ff6a57; padding: 7px 10px; font-size: 15px; border-radius: 6px; color: white; line-height: 1; } .select2-container--default .select2-selection--multiple { border-radius: 0; border: 1px solid #ccc; height: 38px; display: flex; align-items: center; position: relative; top: 18px; background: none; width: 70%; right: 45px; border: none !important; background: none; } .select2-has-values .select2-selection--multiple { overflow-x: auto !important; overflow-y: hidden !important; white-space: nowrap; } span.selection { position: relative; top: 5px; font-weight: bold; font-size: 12px; } .search-bar-group input { position: relative; top: 0; right: 0; width: 100%; background: none !important; border: none !important; } .select2-container--default .select2-selection--single .select2-selection__rendered { padding: 0 !important; } .sider-bar-tour-package .search-bar-group input { width: 100% !important; margin-right: 0; padding: 10px 0; } .search-bar-group input:focus { box-shadow: none !important; outline: none !important; border: none !important; } .select2-container--default .select2-selection--single { border-radius: 0; border: 1px solid #ccc; height: 38px; display: flex; align-items: center; position: relative; top: 0; width: 100%; right: 0; border: none !important; background: none; } .select2-container--default .select2-selection__rendered { padding-right: 10px; line-height: 36px; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-flex; list-style: none; padding: 0; /* overflow-x: scroll; */ } .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; font-size: 13px !important; } .select2-container--default .select2-selection--multiple .select2-selection__choice { font-size: 15px; height: 20px; line-height: 20px; } input[type="date"] { font-size: 13px !important; } .select2-container--default .select2-selection--multiple .select2-search--inline .select2-search__field::placeholder { font-size: 13px !important; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-flex !important; position: absolute; } .select2-container--default .select2-selection--single .select2-selection__placeholder, .select2-container--default .select2-search--inline .select2-search__field { color: #555 !important; font-size: 13px !important; } .select2-container { font-weight: bold; font-size: 12px; } .nice-select .option.selected { font-size: 14px; } .nice-select .option { padding-right: 9px !important; } .nice-select .option { font-size: 14px !important; } #pills-information .image-gallery-single .col-md-6 { padding: 5px; } #pills-information .image-gallery-single .col-md-6 img { height: 170px; object-fit: cover; } #pills-information .image-gallery-single .col-md-6.left-col { padding: 15px 10px; } #pills-information .image-gallery-single .col-md-6.right-col { padding: 10px 10px 10px 20px; } #pills-information .image-gallery-single .col-md-6.left-col img { height: 349px; object-fit: cover; } .text-white { color: white; } .accordion-button:not(.collapsed) { border-bottom: 1px solid #EEE; border-radius: 10px; } .accordion-button::after { filter: invert(48%) sepia(79%) saturate(467%) hue-rotate(74deg) brightness(96%) contrast(90%) drop-shadow(0 0 1px #28a745); } .custom-select-dropdown { position: relative; } .select-input { position: relative; border-radius: 4px; cursor: pointer; } .select-input input { border: none; background: none; width: 100%; cursor: pointer; } .select-input svg { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); pointer-events: none; color: #44b774; } .counter-wrapper { font-family: sans-serif; display: flex; flex-direction: column; gap: 6px; } .counter-box { display: flex; align-items: center; gap: 10px; } .counter-btn { width: 30px !important; height: 30px !important; line-height: 30px; padding: 0; border-radius: 50% !important; background-color: #44b774; color: #fff; border: none; font-size: 18px; cursor: pointer; transition: background 0.3s; position: relative; } .counter-btn:disabled { background-color: #ccc; cursor: not-allowed; /* animation: shake 0.3s ease; */ } .counter-input { width: 60px !important; text-align: center; border: none; font-size: 16px; background: none; pointer-events: none; } /* Shake animation */ @keyframes shake { 0% { transform: translateX(0); } 25% { transform: translateX(3px); } 50% { transform: translateX(-3px); } 75% { transform: translateX(2px); } 100% { transform: translateX(0); } } .counter-block { display: flex; align-items: center; justify-content: space-between; gap: 10px; } /* Basic Rules */ .custom-toggle .switch input { display: none; } .custom-toggle .switch { display: inline-block; width: 40px; height: 20px; margin: 8px; /* transform: translateY(50%); */ position: relative; } /* Style Wired */ .custom-toggle .slider { position: absolute; top: 0; bottom: 0; right: 0; left: 0; border-radius: 30px; box-shadow: 0 0 0 2px #777, 0 0 4px #777; cursor: pointer; border: 4px solid transparent; overflow: hidden; transition: .4s; } .custom-toggle label { top: 0 !important; right: 25px !important; } .custom-toggle .slider:before { position: absolute; content: ""; width: 100%; height: 100%; background: #777; border-radius: 30px; transform: translateX(15px); transition: .4s; } .custom-toggle input:checked+.slider:before { transform: translateX(-15px); background: limeGreen; } .custom-toggle input:checked+.slider { box-shadow: 0 0 0 2px limeGreen, 0 0 2px limeGreen; } /* Style Flat */ .custom-toggle .switch.flat .slider { box-shadow: none; } .custom-toggle .switch.flat .slider:before { background: #FFF; } .custom-toggle .switch.flat input:checked+.slider:before { background: white; } .custom-toggle .switch.flat input:checked+.slider { background: limeGreen; } .select2-container--default .select2-selection--single .select2-selection__rendered { padding: 0; } .mob-lang img { width: 17px; } .mob-lang { margin-bottom: 15px; } #activities .input-group-text { color: #FFF; background-color: #44b774; border: 1px solid #44b774; } .code-input { width: 60px; height: 60px; text-align: right; font-size: 24px; border-radius: 10px; margin-bottom: 15px; } .search-trip-form .filter-wrapper { margin: 30px auto 0; max-width: 100%; padding: 0; } /* Tab Navigation Styles */ .search-trip-form .nav-buttons .nav-pills { background: #FFFFFF; border-radius: 15px 15px 0 0; padding: 8px; margin-bottom: 30px; justify-content: center; gap: 5px; width: fit-content; margin: auto; } .search-trip-form { position: relative; padding: 40px 20px; } .search-trip-form.offers-p { margin-top: 80px; margin-bottom: -70px; } .search-trip-form form { background: #FFFFFF; display: flex; justify-content: space-between; border-radius: 10px; } .search-trip-form form button { border-radius: 10px 0 0 10px; transition: all 0.3s ease-in-out; } .search-trip-form form button:hover { background: #045c96; } .search-trip-form .nav-buttons .nav-link { background: transparent; border: none; color: #6c757d; font-weight: 500; padding: 12px 20px; border-radius: 12px; display: flex; align-items: center; gap: 8px; transition: all 0.3s ease; min-width: 120px; justify-content: center; color: black; } .search-trip-form .nav-buttons .nav-link:hover { background: rgba(108, 186, 75, 0.1); color: #44b774; } .search-trip-form .nav-buttons .nav-link.active { background: #44b774; color: white; box-shadow: 0 4px 12px rgba(108, 186, 75, 0.3); } .search-trip-form .nav-buttons .nav-link svg { width: 20px; height: 20px; fill: currentColor; } /* Search Trip Form Parent Styles */ .search-trip-form { margin-bottom: 0; } .search-trip-form .form-row { display: flex; align-items: center; gap: 15px; min-height: 70px; } .search-trip-form .form-fields { display: flex; align-items: center; gap: 15px; flex: 1; background: #f8f9fa; border-radius: 12px; padding: 15px; } /* Filter Area Styles */ .search-trip-form .filter-area { background: transparent; border-radius: 0; padding: 10px; margin-bottom: 0; box-shadow: none; } .search-trip-form .single-search-box { display: flex; align-items: center; gap: 0; padding: 0; background: transparent; border-radius: 0; width: 100%; min-height: auto; } .search-trip-form .single-search-box .icon { /* background: #44b774; */ border-radius: 10px; padding: 0; display: flex; align-items: center; justify-content: center; min-width: 45px; height: 45px; } .search-trip-form .single-search-box .icon svg { width: 22px; height: 22px; fill: #44b774; } .search-trip-form .searchbox-input { flex: 1; } .search-trip-form .searchbox-input label { font-size: 12px; color: #6c757d; font-weight: 500; margin-bottom: 0; display: block; padding: 0; text-align: right; } .search-trip-form .custom-select-dropdown { position: relative; } .search-trip-form .select-input { display: flex; align-items: center; justify-content: space-between; cursor: pointer; padding: 5px 0; } .search-trip-form .quantity-counter { position: relative; } .search-trip-form input.quantity__input { height: 30px; border: none; } .search-trip-form a.quantity__plus { top: -5px; position: absolute; left: 15px; } .search-trip-form a.quantity__minus { top: 12px; position: absolute; left: 15px; } .search-trip-form .select-input input { border: none; background: transparent; font-weight: 600; color: #333; font-size: 14px; cursor: pointer; width: 100%; /* pointer-events: none; */ padding: 0; } .search-trip-form .select-input input:focus { outline: none; } .search-trip-form .select-input i { color: #6c757d; font-size: 12px; transition: transform 0.3s ease; } .search-trip-form .select-input.active i { transform: rotate(-180deg); } /* Divider Styles */ .search-trip-form .divider { position: relative; } .search-trip-form .divider:not(:last-child)::after { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 40px; background: #e9ecef; } /* Search Button Styles */ .search-trip-form .search-btn { background: #44b774; border: none; color: white; padding: 15px 30px; border-radius: 12px; font-weight: 600; font-size: 16px; transition: all 0.3s ease; box-shadow: 0 4px 12px rgba(108, 186, 75, 0.3); min-width: 120px; height: 70px; display: flex; align-items: center; justify-content: center; gap: 8px; } .search-trip-form .search-btn:hover { background: #5da63f; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(108, 186, 75, 0.4); } .search-trip-form .search-btn svg { width: 20px; height: 20px; fill: currentColor; } /* Custom Dropdown Styles */ .search-trip-form .custom-select-wrap { position: absolute; top: calc(100% + 5px); right: -55px; left: 0; background: white; border-radius: 12px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15); z-index: 1000; min-width: 270px; max-height: 300px; overflow-y: auto; opacity: 0; visibility: hidden; transform: translateY(-10px); transition: all 0.3s ease; } .search-trip-form .custom-select-wrap.show { opacity: 1; visibility: visible; transform: translateY(0); } .search-trip-form .custom-select-search-area { padding: 10px 5px; border-bottom: 1px solid #f0f0f0; display: flex; align-items: center; gap: 10px; } .search-trip-form .custom-select-search-area i { color: #6c757d; font-size: 16px; } .search-trip-form .custom-select-search-area input { width: 100%; border: 1px solid #44b774; border-radius: 6px; padding: 8px 12px; font-size: 14px; outline: none; } .search-trip-form .custom-select-search-area input::placeholder { color: #999; } .search-trip-form .option-list { list-style: none; padding: 0; margin: 0; } .search-trip-form .option-list li { padding: 12px 15px; cursor: pointer; border-bottom: 1px solid #f0f0f0; display: flex; justify-content: space-between; align-items: center; transition: background-color 0.2s ease; } .search-trip-form .option-list li:hover { background: #f8f9fa; color: #44b774 !important; } .search-trip-form .option-list li:last-child { border-bottom: none; } .search-trip-form .destination h6 { margin: 0; font-size: 14px; font-weight: 600; color: #333; text-align: right; line-height: 1; } .search-trip-form .destination p { margin: 0; font-size: 12px; color: #6c757d; } .search-trip-form .tour span { background: #44b774; color: white; padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; text-align: center; line-height: 1.2; display: flex; align-items: center; justify-content: center; border-radius: 50%; width: 50px; height: 50px; } .search-trip-form .single-item h6 { margin: 0; font-size: 14px; font-weight: 600; color: #333; } /* Responsive Design */ /* @media (max-width: 1200px) { */ .search-trip-form .form-row { flex-wrap: wrap; gap: 10px; } .custom-suggestions { position: absolute; background: #fff; border: 1px solid #ccc; border-radius: 0 0 10px 10px; width: 100%; z-index: 10; display: none; max-height: 200px; overflow-y: auto; text-align: right; } .input-group { position: relative; width: 100%; height: 100%; } #suggestionsBox { top: 100%; right: 0; } .custom-suggestions div { padding: 8px 12px; cursor: pointer; } .custom-suggestions div:hover { background-color: #f1f1f1; color: #44b774; } .input-container { position: relative; width: 100%; } .input-container input { width: 100%; height: 100%; padding: 10px; } .input-container input:focus { box-shadow: none !important; } .travellers-form { background: white; border-radius: 12px; width: 100%; margin: 0 auto; overflow: hidden; } .travellers-form .header { display: flex; justify-content: space-between; align-items: center; padding: 0; border-bottom: 1px solid #e9ecef; } .travellers-form .header h2 { font-size: 18px; font-weight: 600; color: #333; } .travellers-form .header .close-btn { width: 32px; height: 32px; border-radius: 50%; background-color: #44b774; border: none; color: white; font-size: 18px; cursor: pointer; display: flex; align-items: center; justify-content: center; } .travellers-form .header .close-btn:hover { background-color: #045c96; } .close-wg { width: 32px; position: absolute; height: 32px; padding: 0; border-radius: 50%; background-color: #44b774; border: none; color: white; font-size: 18px; cursor: pointer; display: flex; align-items: center; justify-content: center; visibility: visible; opacity: 1; display: block; } .travellers-form .content { padding: 24px 24px 0; } .travellers-form .content .room-section { margin-bottom: 24px; padding-bottom: 24px; position: relative; } .travellers-form .content .room-section:not(:last-child) { border-bottom: 1px solid #e9ecef; } .travellers-form .content .room-section .room-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; } .travellers-form .content .room-section .room-header .room-title { display: flex; align-items: center; color: #6c757d; font-size: 14px; font-weight: 500; } .travellers-form .content .room-section .room-header .room-title .room-icon { width: 20px; height: 16px; margin-left: 8px; background-color: #44b774; border-radius: 2px; position: relative; } .travellers-form .content .room-section .room-header .room-title .room-icon::before { content: ''; position: absolute; top: 2px; right: 2px; left: 2px; height: 8px; background-color: white; border-radius: 1px; } .travellers-form .content .room-section .room-header .remove-room-btn { width: 30px; height: 30px; padding: 0; border-radius: 50%; background-color: #44b774; border: none; color: white; font-size: 20px; cursor: pointer; display: flex; align-items: center; justify-content: center; } .travellers-form .content .room-section .room-header .remove-room-btn:hover { background-color: #045c96; } .travellers-form .content .room-section .traveller-types { display: flex; gap: 20px; align-items: center; } .travellers-form .content .room-section .traveller-types .traveller-type { min-width: 120px; } .travellers-form .content .room-section .traveller-types .traveller-type .type-header { margin-bottom: 12px; } .travellers-form .content .room-section .traveller-types .traveller-type .type-header .type-title { font-size: 16px; font-weight: 500; color: #333; margin-bottom: 4px; } .travellers-form .content .room-section .traveller-types .traveller-type .type-header .type-subtitle { font-size: 12px; color: #6c757d; } .travellers-form .content .room-section .traveller-types .traveller-type .counter { display: flex; align-items: center; gap: 12px; } .travellers-form .content .room-section .traveller-types .traveller-type .counter .counter-btn { width: 32px; height: 32px; border-radius: 50%; /* border: 2px solid #44b774; */ background: #44b774; color: #FFF; font-size: 18px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.2s; } .travellers-form .content .room-section .traveller-types .traveller-type .counter .counter-btn:hover { background-color: #045c96; color: white; } .travellers-form .content .room-section .traveller-types .traveller-type .counter .counter-btn:disabled { border-color: #44b774; color: #FFF; cursor: not-allowed; } .travellers-form .content .room-section .traveller-types .traveller-type .counter .counter-value { font-size: 15px; font-weight: 600; color: #333; min-width: 20px; text-align: center; } .travellers-form .content .room-section .traveller-types .child-age-selector { min-width: 100px; } .travellers-form .content .room-section .traveller-types .child-age-selector .type-header .type-title { font-size: 14px; font-weight: 500; color: #333; margin-bottom: 4px; } .travellers-form .content .room-section .traveller-types .child-age-selector .age-select { width: 100%; padding: 8px 12px; border: 2px solid #dee2e6; border-radius: 6px; font-size: 14px; color: #333; background: white; cursor: pointer; appearance: none; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e"); background-position: left 8px center; background-repeat: no-repeat; background-size: 16px; padding-left: 32px; } .travellers-form .content .room-section .traveller-types .child-age-selector .age-select:focus { outline: none; border-color: #44b774; } .travellers-form .footer { display: flex; justify-content: space-between; align-items: center; padding: 0 24px 24px; } .travellers-form .footer .add-room-btn { background: none; border: none; color: #44b774; font-size: 14px; cursor: pointer; text-decoration: none; font-weight: 500; display: flex; align-items: center; gap: 8px; padding: 0; } .travellers-form .footer .add-room-btn:hover { text-decoration: underline; } .travellers-form .footer .add-room-btn::before { content: '+'; width: 20px; height: 20px; border-radius: 50%; background-color: #44b774; color: white; display: flex; align-items: center; justify-content: center; font-size: 16px; } .travellers-form .footer .action-buttons { display: flex; gap: 12px; } .travellers-form .footer .action-buttons .btn { padding: 10px 20px; border-radius: 24px; font-size: 14px; font-weight: 500; cursor: pointer; transition: all 0.2s; } .travellers-form .footer .action-buttons .btn-reset { background: white; border: 2px solid #dee2e6; color: #6c757d; } .travellers-form .footer .action-buttons .btn-reset:hover { border-color: #adb5bd; color: #495057; } .travellers-form .footer .action-buttons .btn-apply { background: #44b774; border: 2px solid #44b774; color: white; } .travellers-form .footer .action-buttons .btn-apply:hover { background: #045c96; border-color: #045c96; } /* Animation for room addition/removal */ .travellers-form .content .room-section { animation: slideIn 0.3s ease-out; } @keyframes slideIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } } .travellers-form .child-age-selectors { display: flex; gap: 20px; } /* Main Almosafer Flight Search Styles */ .alkhaleg-flight-search { background: white; border-radius: 12px; padding: 10px; margin: 0; width: 100%; } .all-flights-search-block { margin: -30px 0 10px !important; padding: 10px !important; z-index: 2; } /* Flight Tabs Container */ .alkhaleg-flight-search .flight-tabs-container { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; padding: 12px 20px 0; gap: 20px; } .alkhaleg-flight-search .alkhaleg-flight-search { padding: 15px !important; } .alkhaleg-flight-search .trip-type-tabs { display: flex; gap: 8px; } .alkhaleg-flight-search .trip-type-tabs .tab-btn { background: #f3f4f6; border: none; border-radius: 20px; padding: 8px 16px; font-size: 14px; font-weight: 500; color: #6b7280; cursor: pointer; transition: all 0.3s ease; } .alkhaleg-flight-search .trip-type-tabs .tab-btn:hover { background: #e5e7eb; color: #374151; } .alkhaleg-flight-search .trip-type-tabs .tab-btn.active { background: #44b774; color: white; } .alkhaleg-flight-search .flight-options-checkboxes { display: flex; gap: 20px; } .alkhaleg-flight-search .flight-options-checkboxes .checkbox-option { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 14px; color: #000; margin: 0; transition: all 0.3s ease-in-out; } .alkhaleg-flight-search .flight-options-checkboxes .checkbox-option:hover { color: #44b774; } .alkhaleg-flight-search .flight-options-checkboxes .checkbox-option input[type="checkbox"] { display: none; } .alkhaleg-flight-search .flight-options-checkboxes .checkbox-option .checkmark { width: 18px; height: 18px; border: 2px solid #000; border-radius: 4px; position: relative; transition: all 0.3s ease; } .alkhaleg-flight-search .flight-options-checkboxes .checkbox-option input[type="checkbox"]:checked+.checkmark { background: #44b774; border-color: #44b774; } .alkhaleg-flight-search .flight-options-checkboxes .checkbox-option input[type="checkbox"]:checked+.checkmark::after { content: '✓'; position: absolute; top: -2px; right: 2px; color: white; font-size: 12px; font-weight: bold; } /* Search Form */ .alkhaleg-flight-search .flight-search-form { width: 100%; padding: 10px; } .alkhaleg-flight-search .search-inputs-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; width: 100%; } /* Airport Selector */ .alkhaleg-flight-search .airport-selector { position: relative; flex: 1; min-width: 200px; margin-right: 20px; } .alkhaleg-flight-search .airport-selector .airport-input-wrapper { display: flex; align-items: center; /* background: #f9fafb; */ /* border: 1px solid #d1d5db; */ border-radius: 8px; padding: 2px 5px; cursor: pointer; transition: all 0.3s ease; } .alkhaleg-flight-search .airport-selector .airport-input-wrapper:after, .alkhaleg-flight-search .airport-selector .airport-input-wrapper:before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 40px; background: #e9ecef; } /* .alkhaleg-flight-search .airport-selector .airport-input-wrapper:hover { border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1); } */ .alkhaleg-flight-search .airport-selector .airport-icon { color: #ef4444; margin-left: 12px; flex-shrink: 0; } .alkhaleg-flight-search .airport-selector .airport-input-content { display: flex; align-items: center; gap: 8px; flex: 1; } .alkhaleg-flight-search .airport-selector .airport-code-badge { background: #44b7742b; color: #44b774; padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; flex-shrink: 0; } .alkhaleg-flight-search .airport-selector .airport-display-input { border: none; background: transparent; outline: none; font-size: 14px; color: #000; font-weight: bold; cursor: pointer; flex: 1; } .alkhaleg-flight-search .airport-selector .airport-dropdown { position: absolute; top: 100%; right: 0; left: 0; background: white; border: 1px solid #d1d5db; border-radius: 8px; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); z-index: 1000; margin-top: 4px; display: none; } .alkhaleg-flight-search .airport-selector .airport-dropdown.active { display: block !important; } .alkhaleg-flight-search .airport-selector .dropdown-search { padding: 12px; border-bottom: 1px solid #e5e7eb; } .alkhaleg-flight-search .airport-selector .dropdown-search .search-input { width: 100%; border: 1px solid #d1d5db; border-radius: 6px; padding: 8px 12px; font-size: 14px; outline: none; } .alkhaleg-flight-search .airport-selector .dropdown-search .search-input:focus { border-color: #44b774; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1); } .alkhaleg-flight-search .airport-selector .airport-options { list-style: none; padding: 0; margin: 0; max-height: 200px; overflow-y: auto; } .alkhaleg-flight-search .airport-selector .airport-options li { padding: 12px; cursor: pointer; border-bottom: 1px solid #f3f4f6; transition: background-color 0.2s ease; } .alkhaleg-flight-search .airport-selector .airport-options li:hover { background: #f9fafb; } .alkhaleg-flight-search .airport-selector .airport-options li:last-child { border-bottom: none; } .alkhaleg-flight-search .airport-selector .airport-option { display: flex; align-items: center; gap: 12px; } .alkhaleg-flight-search .airport-selector .airport-option .airport-code { background: #f3f4f6; color: #6b7280; padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; min-width: 40px; text-align: center; } .alkhaleg-flight-search .airport-selector .airport-details .city-name { font-size: 14px; font-weight: 500; color: #374151; margin-bottom: 2px; text-align: right; } .alkhaleg-flight-search .airport-selector .airport-details .airport-name { font-size: 12px; color: #6b7280; } /* Swap Button */ .alkhaleg-flight-search .swap-airports-btn { background: white; border: 2px solid #e5e7eb; border-radius: 50%; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.3s ease; color: #3b82f6; flex-shrink: 0; } .alkhaleg-flight-search .swap-airports-btn:hover { border-color: #f0f9ff; background: #f0f9ff; } /* Date Selector */ .alkhaleg-flight-search .date-selector { flex: 0 0 140px; position: relative; } .alkhaleg-flight-search .date-selector .date-input-wrapper { display: flex; align-items: center; /* background: #f9fafb; */ /* border: 1px solid #d1d5db; */ border-radius: 8px; padding: 2px 5px; cursor: pointer; transition: all 0.3s ease; } .alkhaleg-flight-search .date-selector:after { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 40px; background: #e9ecef; } .switch-div { position: relative; } .alkhaleg-flight-search .switch-div:after { content: ''; position: absolute; left: -15px; top: 50%; transform: translateY(-50%); width: 1px; height: 40px; background: #e9ecef; } .alkhaleg-flight-search .date-selector .date-icon { color: #6b7280; margin-left: 8px; } .alkhaleg-flight-search .date-selector .date-display-input { border: none; background: transparent; outline: none; font-size: 14px; color: #000; font-weight: bold; cursor: pointer; width: 100%; padding: 20px 0; } /* Travelers Selector */ .alkhaleg-flight-search .travelers-selector { position: relative; flex: 0 0 180px; } .alkhaleg-flight-search .travelers-selector .travelers-input-wrapper { display: flex; align-items: center; /* background: #f9fafb; */ /* border: 1px solid #d1d5db; */ border-radius: 8px; padding: 2px 5px; cursor: pointer; transition: all 0.3s ease; } .alkhaleg-flight-search .travelers-selector .travelers-icon { color: #6b7280; margin-left: 0; } .alkhaleg-flight-search .travelers-selector .travelers-display-input { border: none; background: transparent; outline: none; font-size: 14px; color: #000; font-weight: bold; cursor: pointer; width: 100%; padding: 20px 5px; } .alkhaleg-flight-search .travelers-selector .travelers-dropdown { position: absolute; top: 100%; left: 0; background: white; border: 1px solid #d1d5db; border-radius: 8px; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); z-index: 1000; margin-top: 4px; width: 300px; display: none; } .alkhaleg-flight-search .travelers-selector .travelers-dropdown.active { display: block; left: -20px !important; right: auto; } .alkhaleg-flight-search .travelers-selector .travelers-content { padding: 20px; } .alkhaleg-flight-search .travelers-selector .travelers-title { font-size: 16px; font-weight: 600; color: #374151; margin: 0 0 16px 0; } .alkhaleg-flight-search .travelers-selector .traveler-type { display: flex; justify-content: space-between; align-items: center; padding: 12px 0; border-bottom: 1px solid #f3f4f6; } .alkhaleg-flight-search .travelers-selector .traveler-type:last-of-type { border-bottom: none; margin-bottom: 16px; } .alkhaleg-flight-search .travelers-selector .traveler-info .traveler-label { display: block; font-size: 14px; font-weight: 500; color: #374151; } .alkhaleg-flight-search .travelers-selector .traveler-info .traveler-age { display: block; font-size: 12px; color: #6b7280; margin-top: 2px; } .alkhaleg-flight-search .travelers-selector .counter-controls { display: flex; align-items: center; gap: 12px; } .alkhaleg-flight-search .travelers-selector .counter-btn { width: 30px; height: 30px; /* border: 2px solid #44b774; */ border-radius: 50%; background: #44b774; color: #FFF; font-size: 12px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; display: flex; align-items: center; justify-content: center; } .alkhaleg-flight-search .travelers-selector .counter-btn:hover { border-color: #177ec2; color: #FFF !important; background: #177ec2; } .custom-arrow { order: 1; position: relative; left: 10px; } .airport-input-content svg, .airport-input-content i { color: black !important; fill: black !important; } .alkhaleg-flight-search .travelers-selector .counter-btn .fa-minus, .alkhaleg-flight-search .travelers-selector .counter-btn .fa-plus { color: #FFF !important; fill: #FFF !important; } .alkhaleg-flight-search .travelers-selector .counter-btn:hover i, .alkhaleg-flight-search .travelers-selector .counter-btn:hover svg { color: white !important; } .alkhaleg-flight-search .travelers-selector .counter-btn:disabled { opacity: 0.5; cursor: not-allowed; } .alkhaleg-flight-search .travelers-selector .counter-value { font-size: 16px; font-weight: 500; color: #374151; min-width: 20px; text-align: center; } .alkhaleg-flight-search .travelers-selector .cabin-class-section { border-top: 1px solid #f3f4f6; padding-top: 16px; } .alkhaleg-flight-search .travelers-selector .cabin-class-title { font-size: 14px; font-weight: 600; color: #374151; margin: 0 0 12px 0; } .counter-block { display: flex; align-items: center; justify-content: space-between; gap: 10px; } /* Basic Rules */ .custom-toggle .switch input { display: none; } .custom-toggle .switch { display: inline-block; width: 40px; height: 20px; margin: 8px; /* transform: translateY(50%); */ position: relative; } /* Style Wired */ .custom-toggle .slider { position: absolute; top: 0; bottom: 0; right: 0; left: 0; border-radius: 30px; box-shadow: 0 0 0 2px #777, 0 0 4px #777; cursor: pointer; border: 4px solid transparent; overflow: hidden; transition: .4s; } .custom-toggle label { top: 0 !important; right: 25px !important; } .custom-toggle .slider:before { position: absolute; content: ""; width: 100%; height: 100%; background: #777; border-radius: 30px; transform: translateX(15px); transition: .4s; } .custom-toggle input:checked+.slider:before { transform: translateX(-15px); background: limeGreen; } .custom-toggle input:checked+.slider { box-shadow: 0 0 0 2px limeGreen, 0 0 2px limeGreen; } /* Style Flat */ .custom-toggle .switch.flat .slider { box-shadow: none; } .custom-toggle .switch.flat .slider:before { background: #FFF; } .custom-toggle .switch.flat input:checked+.slider:before { background: white; } .custom-toggle .switch.flat input:checked+.slider { background: limeGreen; } .select2-container--default .select2-selection--single .select2-selection__rendered { padding: 0; } .mob-lang img { width: 17px; } .mob-lang { margin-bottom: 15px; } #activities .input-group-text { color: #FFF; background-color: #44b774; border: 1px solid #44b774; } .code-input { width: 60px; height: 60px; text-align: right; font-size: 24px; border-radius: 10px; margin-bottom: 15px; } .custom-suggestions { position: absolute; background: #fff; border: 1px solid #ccc; border-radius: 0 0 10px 10px; width: 100%; z-index: 10; display: none; max-height: 200px; overflow-y: auto; text-align: right; } .input-group { position: relative; width: 100%; height: 100%; } #suggestionsBox { top: 100%; right: 0; } .custom-suggestions div { padding: 8px 12px; cursor: pointer; } .custom-suggestions div:hover { background-color: #f1f1f1; color: #44b774; } .input-container { position: relative; width: 100%; } .input-container input { width: 100%; height: 100%; padding: 10px; } .input-container input:focus { box-shadow: none !important; } .travellers-form { background: white; border-radius: 12px; width: 100%; margin: 0 auto; overflow: hidden; } .travellers-form .header { display: flex; justify-content: space-between; align-items: center; padding: 0; border-bottom: 1px solid #e9ecef; } .travellers-form .header h2 { font-size: 18px; font-weight: 600; color: #333; } .travellers-form .header .close-btn { width: 25px; height: 25px; border-radius: 50%; background-color: #44b774; border: none; color: white; font-size: 14px; cursor: pointer; display: flex; align-items: center; justify-content: center; } .travellers-form .header .close-btn:hover { background-color: #045c96; } .close-wg { width: 32px; position: absolute; height: 32px; padding: 0; border-radius: 50%; background-color: #44b774; border: none; color: white; font-size: 18px; cursor: pointer; display: flex; align-items: center; justify-content: center; visibility: visible; opacity: 1; display: block; } .travellers-form .content { padding: 24px 24px 0; } .travellers-form .content .room-section { margin-bottom: 24px; padding-bottom: 24px; position: relative; } .travellers-form .content .room-section:not(:last-child) { border-bottom: 1px solid #e9ecef; } .travellers-form .content .room-section .room-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; } .travellers-form .content .room-section .room-header .room-title { display: flex; align-items: center; color: #6c757d; font-size: 14px; font-weight: 500; } .travellers-form .content .room-section .room-header .room-title .room-icon { width: 20px; height: 16px; margin-left: 8px; background-color: #44b774; border-radius: 2px; position: relative; } .travellers-form .content .room-section .room-header .room-title .room-icon::before { content: ''; position: absolute; top: 2px; right: 2px; left: 2px; height: 8px; background-color: white; border-radius: 1px; } .travellers-form .content .room-section .room-header .remove-room-btn { width: 30px; height: 30px; padding: 0; border-radius: 50%; background-color: #44b774; border: none; color: white; font-size: 20px; cursor: pointer; display: flex; align-items: center; justify-content: center; } .travellers-form .content .room-section .room-header .remove-room-btn:hover { background-color: #045c96; } .travellers-form .content .room-section .traveller-types { display: flex; gap: 20px; align-items: center; } .travellers-form .content .room-section .traveller-types .traveller-type { min-width: 120px; } .travellers-form .content .room-section .traveller-types .traveller-type .type-header { margin-bottom: 12px; } .travellers-form .content .room-section .traveller-types .traveller-type .type-header .type-title { font-size: 16px; font-weight: 500; color: #333; margin-bottom: 4px; } .travellers-form .content .room-section .traveller-types .traveller-type .type-header .type-subtitle { font-size: 12px; color: #6c757d; } .travellers-form .content .room-section .traveller-types .traveller-type .counter { display: flex; align-items: center; gap: 12px; } .travellers-form .content .room-section .traveller-types .traveller-type .counter .counter-btn { width: 30px; height: 30px; border-radius: 50%; /* border: 2px solid #44b774; */ background: #44b774; color: #FFF; font-size: 18px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.2s; } .travellers-form .content .room-section .traveller-types .traveller-type .counter .counter-btn:hover { background-color: #177ec2 !important; border: 1px solid #177ec2; color: white; } .travellers-form .content .room-section .traveller-types .traveller-type .counter .counter-btn:disabled { cursor: not-allowed; } .travellers-form .content .room-section .traveller-types .traveller-type .counter .counter-value { font-size: 15px; font-weight: 600; color: #333; min-width: 20px; text-align: center; } .travellers-form .content .room-section .traveller-types .child-age-selector { min-width: 100px; } .travellers-form .content .room-section .traveller-types .child-age-selector .type-header .type-title { font-size: 14px; font-weight: 500; color: #333; margin-bottom: 4px; } .travellers-form .content .room-section .traveller-types .child-age-selector .age-select { width: 100%; padding: 8px 12px; border: 2px solid #dee2e6; border-radius: 6px; font-size: 14px; color: #333; background: white; cursor: pointer; appearance: none; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e"); background-position: left 8px center; background-repeat: no-repeat; background-size: 16px; padding-left: 32px; } .travellers-form .content .room-section .traveller-types .child-age-selector .age-select:focus { outline: none; border-color: #44b774; } .travellers-form .footer { display: flex; justify-content: space-between; align-items: center; padding: 0 24px 24px; } .travellers-form .footer .add-room-btn { background: none; border: none; color: #44b774; font-size: 14px; cursor: pointer; text-decoration: none; font-weight: 500; display: flex; align-items: center; gap: 8px; padding: 0; } .travellers-form .footer .add-room-btn:hover { text-decoration: underline; } .travellers-form .footer .add-room-btn::before { content: '+'; width: 20px; height: 20px; border-radius: 50%; background-color: #44b774; color: white; display: flex; align-items: center; justify-content: center; font-size: 16px; } .travellers-form .footer .action-buttons { display: flex; gap: 12px; } .travellers-form .footer .action-buttons .btn { padding: 10px 20px; border-radius: 24px; font-size: 14px; font-weight: 500; cursor: pointer; transition: all 0.2s; } .travellers-form .footer .action-buttons .btn-reset { background: white; border: 2px solid #dee2e6; color: #6c757d; } .travellers-form .footer .action-buttons .btn-reset:hover { border-color: #adb5bd; color: #495057; } .travellers-form .footer .action-buttons .btn-apply { background: #44b774; border: 2px solid #44b774; color: white; } .travellers-form .footer .action-buttons .btn-apply:hover { background: #045c96; border-color: #045c96; } /* Animation for room addition/removal */ .travellers-form .content .room-section { animation: slideIn 0.3s ease-out; } @keyframes slideIn { from { opacity: 0; transform: translateY(-10px); } } .alkhaleg-flight-search .travelers-selector .cabin-class-options { display: flex; flex-direction: column; gap: 8px; } .alkhaleg-flight-search .travelers-selector .cabin-option { display: flex; align-items: center; gap: 8px; cursor: pointer; } .alkhaleg-flight-search .travelers-selector .cabin-option input[type="radio"] { display: none; } .alkhaleg-flight-search .travelers-selector .cabin-option .radio-custom { width: 16px; height: 16px; border: 2px solid #d1d5db; border-radius: 50%; position: relative; transition: all 0.3s ease; } .alkhaleg-flight-search .travelers-selector .cabin-option input[type="radio"]:checked+.radio-custom { border-color: #3b82f6; } .alkhaleg-flight-search .travelers-selector .cabin-option input[type="radio"]:checked+.radio-custom::after { content: ''; position: absolute; top: 2px; right: 2px; width: 8px; height: 8px; background: #3b82f6; border-radius: 50%; } .alkhaleg-flight-search .travelers-selector .cabin-option .cabin-label { font-size: 14px; color: #374151; } /* Search Button */ .alkhaleg-flight-search .search-button { background: linear-gradient(-135deg, #ef4444 0%, #dc2626 100%); border: none; border-radius: 8px; padding: 12px 24px; color: white; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; display: flex; align-items: center; gap: 8px; flex-shrink: 0; } .alkhaleg-flight-search .search-button:hover { background: linear-gradient(-135deg, #dc2626 0%, #b91c1c 100%); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3); } .alkhaleg-flight-search svg { color: #44b774; fill: #44b774; } /* Responsive Design */ @media (max-width: 1024px) { .alkhaleg-flight-search .search-inputs-row { flex-wrap: wrap; } .alkhaleg-flight-search .airport-selector { flex: 1 1 200px; } .alkhaleg-flight-search .date-selector { flex: 1 1 120px; } .alkhaleg-flight-search .travelers-selector { flex: 1 1 160px; } } @media (max-width: 768px) { .alkhaleg-flight-search .flight-tabs-container { flex-direction: column; gap: 16px; align-items: flex-start; padding: 0; } .alkhaleg-flight-search .search-inputs-row { flex-direction: column-reverse; gap: 16px; } .alkhaleg-flight-search .airport-selector, .alkhaleg-flight-search .date-selector, .alkhaleg-flight-search .travelers-selector { width: 100%; flex: none; } .alkhaleg-flight-search .swap-airports-btn { align-self: center; order: 2; } .alkhaleg-flight-search .from-airport { order: 1; margin-right: 0; } .alkhaleg-flight-search .to-airport { order: 3; margin-right: 0; } .alkhaleg-flight-search .travelers-selector .travelers-dropdown { left: auto; right: 0; width: 100%; } } .search-tit-top { font-size: 16px; } .all-hotels-wg .header-tabs { background: white; border-radius: 25px; padding: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); margin-bottom: 20px; } .all-hotels-wg .header-tabs .nav-link { border-radius: 20px; color: #666; border: none; padding: 10px 20px; margin: 0 2px; } .all-hotels-wg .header-tabs .nav-link.active { background-color: #17a2b8; color: white; } .all-hotels-wg .hotel-card { background: white; border-radius: 12px; box-shadow: 0 2px 15px rgba(0, 0, 0, 0.08); margin-bottom: 20px; overflow: hidden; transition: transform 0.2s; } .all-hotels-wg .hotel-card:hover { transform: translateY(-2px); box-shadow: 0 4px 25px rgba(0, 0, 0, 0.12); } .all-hotels-wg .rating-badge { background: #28a745; color: white; border-radius: 8px; padding: 8px 12px; font-weight: bold; font-size: 18px; } .all-hotels-wg .rating-text { color: #666; font-size: 12px; margin-top: 5px; } .all-hotels-wg .hotel-image { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; } .all-hotels-wg .location-text { color: #045c96; font-weight: bold; font-size: 14px; } .all-hotels-wg .price-text { color: #44b774; font-weight: bold; font-size: 14px; } .all-hotels-wg .offer-btn { background: linear-gradient(-45deg, #44b774, #44b774); border: none; border-radius: 25px; color: white; padding: 8px 20px; font-size: 14px; font-weight: bold; width: fit-content; transition: all 0.3s; display: block; } .all-hotels-wg .offer-btn:hover { background: linear-gradient(-45deg, #045c96, #045c96); transform: translateY(-1px); } .all-hotels-wg .prices-list { padding-bottom: 15px; } .all-hotels-wg .prices-list b { font-weight: bold; font-size: 15px; } .all-hotels-wg .prices-list .list-inline-item:not(:last-child) { padding-left: 20px; } .all-hotels-wg .stars { color: #ffc107; margin: 5px 0; } .all-hotels-wg .sidebar { background: white; border-radius: 12px; padding: 20px; box-shadow: 0 2px 15px rgba(0, 0, 0, 0.08); margin-bottom: 20px; } .all-hotels-wg .map-toggle { background: #17a2b8; color: white; border: none; border-radius: 25px; padding: 10px 20px; font-weight: bold; margin-bottom: 20px; } .all-hotels-wg .filter-section h6 { color: #333; font-weight: bold; margin-bottom: 15px; padding-bottom: 10px; border-bottom: 2px solid #e9ecef; } .all-hotels-wg .price-range { margin: 20px 0; } .all-hotels-wg .price-inputs { display: flex; gap: 10px; margin-bottom: 15px; margin-top: 10px; } .all-hotels-wg .price-inputs input { flex: 1; padding: 8px; border: 1px solid #ddd; border-radius: 5px; text-align: center; } .all-hotels-wg .range-slider { width: 100%; margin: 10px 0; } .all-hotels-wg .filter-item { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid #f0f0f0; } .all-hotels-wg .filter-item:last-child { border-bottom: none; } .all-hotels-wg .filter-count { background: #045c96; color: white; padding: 2px 8px; border-radius: 12px; font-size: 12px; font-weight: bold; min-width: 37px; text-align: center; } .all-hotels-wg .search-box { position: relative; margin-bottom: 20px; } .all-hotels-wg .search-box input { width: 100%; padding: 12px 15px 12px 40px; border: 1px solid #ddd; border-radius: 12px; background: #ffffff; margin-top: 10px; } .all-hotels-wg .search-box svg { position: absolute; left: 15px; top: 60%; transform: translateY(-50%); color: #44b774; } .listing-list-car-wrap-grid3 .tf-my-listing .nice-select i { padding-left: 15px; } .listing-list-car-wrap-grid3 .tf-my-listing .nice-select { width: 150px; } .search-form-wrap-center { /* margin-bottom: 5em; */ display: block; position: relative; } .search-form-wrap-center .search-form .form-group { position: relative; } .search-form-wrap-center input { padding: 10px !important; } .search-form-wrap-center .search-form .form-group #s { padding-left: 50px; background: #f7f7f7; /* padding: 15px 15px; */ border: none; } .search-form-wrap-center button { position: absolute; border: none !important; top: 50% !important; color: white !important; left: 0; background: #44b774; transform: translateY(-50%); transition: all 0.3s ease-in-out; } .search-form-wrap-center button:hover { background: #045c96; } .multi-city-form { margin-top: 20px; } .multi-city-segment { border-radius: 8px; padding: 0 10px; margin-bottom: 15px; position: relative; animation: slideIn 0.3s ease-out; display: flex; align-items: center; } .multi-city-segment:first-of-type { width: 100%; } .multi-city-segment .travelers-selector { display: none; } .multi-city-segment:first-of-type .travelers-selector { display: block !important; } @keyframes slideIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } } .segment-title { font-weight: 600; font-size: 16px; color: #333; } .remove-segment-btn { /* background: #dc3545; */ color: white; border: none; border-radius: 50% !important; width: 30px !important; height: 30px !important; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 14px; transition: background-color 0.3s; position: absolute; left: 0; top: 0; padding: 0; z-index: 1; } .remove-segment-btn:hover { background: #c82333; } .segment-inputs { display: grid; grid-template-columns: 1fr auto 1fr 1fr; gap: 15px; align-items: end; } .add-flight-section { text-align: center; margin: 20px 0; } .add-flight-btn { background: transparent; border: 2px dashed #44b774; color: #44b774; padding: 12px 24px; border-radius: 8px !important; cursor: pointer; font-weight: 500; transition: all 0.3s; display: inline-flex; align-items: center; gap: 8px; } .add-flight-btn:hover { background: #44b774 !important; color: white; border: 2px dashed #44b774; } .add-flight-btn:hover svg { color: white; } .multi-city-bottom-row { display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: end; margin-top: 20px; padding-top: 20px; border-top: 1px solid #e9ecef; } .multi-city-search { min-width: 200px; } /* Tab styling */ .tab-btn { background: transparent; border: 1px solid #ddd; padding: 8px 16px; margin-left: 5px; cursor: pointer; border-radius: 4px; transition: all 0.3s; } .tab-btn.active { background: #007bff; color: white; border-color: #007bff; } .tab-btn:hover { background: #f8f9fa; } .tab-btn.active:hover { background: #0056b3; } /* Airport dropdown styling */ .airport-dropdown { display: none; position: absolute; top: 100%; right: 0; left: 0; background: white; border: 1px solid #ddd; border-radius: 4px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); z-index: 1000; max-height: 300px; overflow-y: auto; } .airport-selector { position: relative; } /* .airport-input-wrapper { } .travellers-form .child-age-selectors { display: flex; gap: 20px; } /* Main Almosafer Flight Search Styles */ .alkhaleg-flight-search { background: white; border-radius: 12px; padding: 0px 0 0 0; margin: 0; width: 100%; } /* Flight Tabs Container */ .alkhaleg-flight-search .flight-tabs-container { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; padding: 12px 20px 0; gap: 20px; } .alkhaleg-flight-search .trip-type-tabs { display: flex; gap: 8px; } .alkhaleg-flight-search .trip-type-tabs .tab-btn { background: #f3f4f6; border: none; border-radius: 20px; padding: 8px 16px; font-size: 14px; font-weight: 500; color: #6b7280; cursor: pointer; transition: all 0.3s ease; } .alkhaleg-flight-search .trip-type-tabs .tab-btn:hover { background: #e5e7eb; color: #374151; } .alkhaleg-flight-search .trip-type-tabs .tab-btn.active { background: #44b774; color: white; } .alkhaleg-flight-search .flight-options-checkboxes { display: flex; gap: 20px; } .alkhaleg-flight-search .flight-options-checkboxes .checkbox-option { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 13px; color: #000; margin: 0; transition: all 0.3s ease-in-out; } .alkhaleg-flight-search .flight-options-checkboxes .checkbox-option:hover { color: #44b774; } .alkhaleg-flight-search .flight-options-checkboxes .checkbox-option input[type="checkbox"] { display: none; } .alkhaleg-flight-search .flight-options-checkboxes .checkbox-option .checkmark { width: 18px; height: 18px; border: 1px solid #000; border-radius: 4px; position: relative; transition: all 0.3s ease; } .alkhaleg-flight-search .flight-options-checkboxes .checkbox-option input[type="checkbox"]:checked+.checkmark { background: #44b774; border-color: #44b774; } .alkhaleg-flight-search .flight-options-checkboxes .checkbox-option input[type="checkbox"]:checked+.checkmark::after { content: '✓'; position: absolute; top: -2px; right: 2px; color: white; font-size: 12px; font-weight: bold; } /* Search Form */ .alkhaleg-flight-search .flight-search-form { width: 100%; } .alkhaleg-flight-search .search-inputs-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; width: 100%; } /* Airport Selector */ .alkhaleg-flight-search .airport-selector { position: relative; flex: 1; min-width: 200px; margin-right: 20px; } .alkhaleg-flight-search .airport-selector .airport-input-wrapper { display: flex; align-items: center; /* background: #f9fafb; */ /* border: 1px solid #d1d5db; */ border-radius: 8px; padding: 2px 5px; cursor: pointer; transition: all 0.3s ease; } .alkhaleg-flight-search .airport-selector .airport-input-wrapper:after, .alkhaleg-flight-search .airport-selector .airport-input-wrapper:before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 40px; background: #e9ecef; } /* .alkhaleg-flight-search .airport-selector .airport-input-wrapper:hover { border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1); } */ .alkhaleg-flight-search .airport-selector .airport-icon { color: #ef4444; margin-left: 12px; flex-shrink: 0; } .alkhaleg-flight-search .airport-selector .airport-input-content { display: flex; align-items: center; gap: 8px; flex: 1; } .alkhaleg-flight-search .airport-selector .airport-code-badge { background: #44b7742b; color: #44b774; padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; flex-shrink: 0; } .alkhaleg-flight-search .airport-selector .airport-display-input { border: none; background: transparent; outline: none; font-size: 14px; color: #000; font-weight: bold; cursor: pointer; flex: 1; } .alkhaleg-flight-search .airport-selector .airport-dropdown { position: absolute; top: 100%; right: 0; left: 0; background: white; border: 1px solid #d1d5db; border-radius: 8px; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); z-index: 1000; margin-top: 4px; display: none; } .alkhaleg-flight-search .airport-selector .airport-dropdown.active { display: block !important; } .alkhaleg-flight-search .airport-selector .dropdown-search { padding: 12px; border-bottom: 1px solid #e5e7eb; } .alkhaleg-flight-search .airport-selector .dropdown-search .search-input { width: 100%; border: 1px solid #d1d5db; border-radius: 6px; padding: 8px 12px; font-size: 14px; outline: none; } .alkhaleg-flight-search .airport-selector .dropdown-search .search-input:focus { border-color: #44b774; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1); } .alkhaleg-flight-search .airport-selector .airport-options { list-style: none; padding: 0; margin: 0; max-height: 200px; overflow-y: auto; } .alkhaleg-flight-search .airport-selector .airport-options li { padding: 12px; cursor: pointer; border: 1px solid #ddd; border-radius: 4px; padding: 10px; background: white; display: flex; align-items: center; gap: 10px; } */ .airport-code-badge { background: #007bff; color: white; padding: 2px 8px; border-radius: 3px; font-size: 12px; font-weight: bold; } .airport-display-input { border: none; outline: none; background: transparent; flex: 1; } .airport-options { list-style: none; padding: 0; margin: 0; } .airport-options li { padding: 10px; cursor: pointer; border-bottom: 1px solid #eee; } .airport-options li:hover { background: #f8f9fa; } .airport-option { display: flex; align-items: center; gap: 10px; } .airport-details { /* flex: 1; */ } .city-name { font-weight: 500; } .airport-name { font-size: 12px; color: #666; } .dropdown-search { padding: 10px; border-bottom: 1px solid #eee; } .search-input { width: 100%; padding: 8px; border: 1px solid #ddd; border-radius: 4px; outline: none; } /* Date and travelers styling */ /* .date-input-wrapper, .travelers-input-wrapper { border: 1px solid #ddd; border-radius: 4px; padding: 10px; background: white; display: flex; align-items: center; gap: 10px; cursor: pointer; } */ .date-display-input, .travelers-display-input { border: none; outline: none; background: transparent; flex: 1; } .travelers-dropdown { display: none; position: absolute; top: 100%; right: 0; left: 0; background: white; border: 1px solid #ddd; border-radius: 4px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); z-index: 1000; padding: 15px; } .travelers-selector { position: relative; } .traveler-type { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; } .counter-controls { display: flex; align-items: center; gap: 10px; } .counter-btn { background: #f8f9fa; border: 1px solid #ddd; border-radius: 50%; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; cursor: pointer; } .counter-btn:hover { background: #e9ecef; } .counter-btn:disabled { opacity: 0.5; cursor: not-allowed; } .cabin-class-options { display: flex; flex-direction: column; gap: 8px; } .cabin-option { display: flex; align-items: center; gap: 8px; cursor: pointer; } /* Swap button styling */ .swap-airports-btn { background: #f8f9fa; border: 1px solid #ddd; border-radius: 50%; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.3s; } .swap-airports-btn:hover { background: #e9ecef; transform: rotate(-180deg); } /* Search button styling */ .order-mob { /* background: #007bff; */ color: white; border: none; padding: 12px 24px; border-radius: 4px !important; cursor: pointer; font-weight: 500; transition: background-color 0.3s; } /* .order-mob:hover { background: #0056b3; } */ /* Responsive adjustments */ @media (max-width: 768px) { .segment-inputs { grid-template-columns: 1fr; gap: 10px; } .switch-div { order: 4; justify-self: center; } .alkhaleg-flight-search .search-inputs-row .switch-div { order: 3; } .search-trip-form { position: relative; padding: 20px 0px 0; } div#pills-tab2Content { border-radius: 0; padding: 20px 5px; } .multi-city-bottom-row { grid-template-columns: 1fr; gap: 15px; } .search-inputs-row { display: flex; flex-direction: column; gap: 15px; } } /* Hide/show forms */ .hidden { display: none !important; } /* Basic form styling */ /* div#multiCitySegments { height: 220px; overflow-y: auto; } */ .searh-form-hotels { padding: 0; margin-top: -30px; } .searh-form-hotels .tab-content { box-shadow: 0 0 7px 0 #DDD; margin-bottom: 50px; min-height: auto !important; } .all-hotels-wg .sidebar-title { cursor: pointer; padding: 10px 0; } .all-hotels-wg .toggle-arrow { transition: transform 0.3s ease; } .all-hotels-wg .toggle-arrow.rotate { transform: rotate(-180deg); } .all-hotels-wg .sidebar { position: relative; } .all-hotels-wg .reset-button { position: absolute; top: 37px; left: 40px; background: none !important; color: green; z-index: 9; } .hotel-header-sec { background: #44b774; color: white; padding: 50px 0 100px; } .hotel-header-sec .circle { background: white; border: 2px solid #FFF; color: #44b774 !important; width: 38px; height: 38px; text-align: center; line-height: 38px; border-radius: 50%; display: block; color: #FFF; font-weight: bold; margin: auto; } .hotel-header-sec .circle.checked { background: #FFF; border: 2px solid #44b774; color: #44b774 !important; } /* Step Connector Styles */ .step-connector { position: absolute; top: 20px; right: 0; left: 0; z-index: 1; pointer-events: none; } .connector-line { position: absolute; height: 2px; background: #cccccc; top: 0; transition: background-color 0.3s ease; } .connector-line.line-1 { right: 16.5%; width: 16.66%; } .connector-line.line-2 { right: 41.53%; width: 16.66%; } .connector-line.line-3 { right: 66.53%; width: 16.66%; } .connector-line.active { background: white; } /* Responsive adjustments */ @media (max-width: 768px) { .connector-line.line-1 { right: 20%; width: 26.66%; } .connector-line.line-2 { right: 53.33%; width: 26.66%; } } /* Ensure circles are above the lines */ .hotel-header-sec .circle { position: relative; z-index: 2; } .tabs-section-hotel-details { margin-top: -50px; background: white; padding: 20px; border-radius: 20px; box-shadow: 0 0 7px 0 #DDD; } .tabs-section-hotel-details i { color: #44b774; } .tabs-section-hotel-details .image-gallery-single .col-md-6 { padding: 5px; } .tabs-section-hotel-details .image-gallery-single .col-md-6 img { height: 170px; object-fit: cover; } .tabs-section-hotel-details .image-gallery-single .col-md-6.left-col { padding: 15px 10px; } .tabs-section-hotel-details .image-gallery-single .col-md-6.right-col { padding: 10px 10px 10px 20px; } .tabs-section-hotel-details .image-gallery-single .col-md-6.left-col img { height: 349px; object-fit: cover; } #rooms .hotel-card { border-radius: 12px; overflow: hidden; padding: 0; box-shadow: 0 0 7px 0 #DDD; background-color: #fff; display: flex; /* align-items: center; */ justify-content: space-between; flex-wrap: wrap; text-align: right; gap: 20px; margin-top: 20px; } #rooms .hotel-details { flex: 1 1 40%; padding: 10px; } .hotel-details .features { font-size: 14px; } .hotel-details .features svg { color: #15803d; } #rooms .content { padding: 10px; } #rooms .content p { line-height: 1.2; } #rooms .p { line-height: 1.2; font-size: 13px; font-weight: 600; } #rooms .hotel-image { flex: 1 1 55%; text-align: right; } #rooms .hotel-image img { border-radius: 10px; max-width: 100%; height: auto; cursor: pointer; } #rooms .stars { color: #f5c518; font-size: 1rem; } #rooms .price-btn { padding: 7px 14px; border-radius: 25px; font-weight: bold; margin-top: 20px; border: unset; font-size: 14px; font-weight: bold; line-height: 20px; text-transform: capitalize; color: #FFFFFF; background-color: #44b774; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; cursor: pointer; } #rooms .price-btn:hover { background: #045c96; } #rooms .price { font-size: 15px; font-weight: bold; margin-top: 6px; display: block; color: #44b774; } #rooms .rating-box { background-color: #e2f8d5; color: #3a8b2e; padding: 4px 10px; border-radius: 5px; font-weight: 600; display: inline-block; font-size: 0.9rem; } #rooms .points { background-color: #eaf8e6; color: #3a8b2e; padding: 3px 8px; font-size: 0.85rem; border-radius: 5px; display: inline-block; margin-bottom: 6px; margin-top: 5px; } #rooms .installment { color: green; font-size: 0.9rem; font-weight: 600; } .tabs-section-hotel-details .box-content ul, .tabs-section-hotel-details .box-content ul li { list-style: disc; } .tabs-section-hotel-details .box-content ul { margin-right: 20px; } .tabs-section-hotel-details #faq .accordion-button:focus { box-shadow: none !important; } .tabs-section-hotel-details #faq .accordion-button:hover { background: none; } .tabs-section-hotel-details .accordion-button:not(.collapsed) { color: #44b774; background-color: transparent; box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125); } .tabs-section-hotel-details .faq-header { font-weight: bold; font-size: 18px; } /* Parent-Child CSS Structure */ .booking-form-container .booking-summary .summary-card { border: 1px solid #e5e7eb; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); background: white; } .booking-form-container .booking-summary .summary-header { background-color: #f8f9fa; border-bottom: 1px solid #e5e7eb; padding: 0.4rem; border-radius: 8px 8px 0 0; } .booking-form-container .booking-summary .summary-title { color: #045c96; font-size: 1rem; font-weight: 600; text-align: center; margin: 0; } .booking-form-container .booking-summary .summary-content { padding: 1.5rem; } .booking-form-container .booking-summary .hotel-info { display: flex; gap: 1rem; margin-bottom: 1.5rem; } .booking-form-container .booking-summary .hotel-thumbnail { width: 80px; height: 80px; border-radius: 8px; object-fit: cover; } .booking-form-container .booking-summary .hotel-name { color: #16a34a; font-size: 1.1rem; font-weight: 600; margin: 0 0 0.5rem 0; } .booking-form-container .booking-summary .hotel-rating { display: flex; gap: 2px; margin-bottom: 0.5rem; } .booking-form-container .booking-summary .star-icon { width: 16px; height: 16px; color: #fbbf24; font-size: 14px; } .booking-form-container .booking-summary .hotel-location { display: flex; align-items: center; gap: 0.25rem; color: #6b7280; font-size: 0.9rem; margin: 0; } .booking-form-container .booking-summary .location-icon { width: 14px; height: 14px; font-size: 12px; } .booking-form-container .booking-summary .booking-details { margin-bottom: 1.5rem; } .booking-details svg { color: #15803d; } .booking-form-container .booking-summary .detail-row { display: flex; justify-content: space-between; margin-bottom: 0.75rem; } .booking-form-container .booking-summary .detail-label { color: black; font-weight: bold; font-size: 0.9rem; } .booking-form-container .booking-summary .detail-value { color: #374151; font-weight: 500; font-size: 0.9rem; } .booking-form-container .booking-summary .pricing-section { border-top: 1px solid #e5e7eb; padding-top: 1rem; margin-top: 1.5rem; } .booking-form-container .booking-summary .price-row { display: flex; justify-content: space-between; margin-bottom: 0.5rem; } .booking-form-container .booking-summary .price-label { color: black; font-weight: bold; font-size: 0.9rem; } .booking-form-container .booking-summary .price-value { color: #374151; font-weight: 500; } .booking-form-container .booking-summary .total-row { display: flex; justify-content: space-between; padding-top: 0.75rem; border-top: 1px solid #e5e7eb; margin-top: 0.75rem; } .booking-form-container .booking-summary .total-label { color: #16a34a; font-weight: 600; font-size: 1.1rem; } .booking-form-container .booking-summary .total-value { color: #16a34a; font-weight: 700; font-size: 1.2rem; } .booking-form-container .booking-summary .follow-up-btn { width: 100%; display: block; text-align: center; background-color: #16a34a; color: white; border: none; padding: 0.75rem; border-radius: 6px; font-weight: 600; margin: 1.5rem 0 1rem 0; cursor: pointer; transition: background-color 0.2s; font-size: 1rem; } .booking-form-container .booking-summary .follow-up-btn:hover { background-color: #045c96; } .booking-form-container .booking-summary .cancellation-policy { text-align: center; } .booking-form-container .booking-summary .policy-text { color: #16a34a; font-size: 0.9rem; margin: 0; cursor: pointer; text-decoration: underline; } /* Forms Section Styles */ .booking-form-container .forms-section .contact-form, .booking-form-container .forms-section .guest-form-card, .booking-form-container .forms-section .info-card { margin-bottom: 1.5rem; border: 1px solid #e5e7eb; border-radius: 10px; background: white; overflow: hidden; } .booking-form-container .forms-section .form-header, .booking-form-container .forms-section .info-header { background-color: #f8f9fa; border-bottom: 1px solid #e5e7eb; padding: 0.4rem; border-radius: 8px 8px 0 0; } /* .booking-form-container .forms-section .info-title { cursor: pointer; } */ .booking-form-container .forms-section .form-title, .booking-form-container .forms-section .info-title { color: #045c96; font-size: 1rem; padding: 0 1.5rem; font-weight: 600; margin: 0; } .booking-form-container .forms-section .form-content, .booking-form-container .forms-section .info-content { padding: 1.5rem; } .booking-form-container .forms-section .member-question { background-color: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 6px; padding: 0.5rem; margin-bottom: 1.5rem; text-align: center; display: flex; align-items: center; justify-content: center; gap: 20px; text-align: right; } .booking-form-container .forms-section .member-question i { color: #15803d; font-size: 30px; position: relative; top: 4px; } .booking-form-container .forms-section .question-text { color: #16a34a; margin: 0 0 0 0; font-weight: 500; } .booking-form-container .forms-section .login-link { color: #16a34a; text-decoration: underline; font-weight: 500; cursor: pointer; background: none; border: none; padding: 0; } .booking-form-container .forms-section .room-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0; padding: 15px 20px; background-color: #f8f9fa; border-radius: 10px 10px 0 0; cursor: pointer; border-bottom: 1px solid #DDD; } .booking-form-container .forms-section .room-badge { background-color: #16a34a; color: white; padding: 0.25rem 0.75rem; border-radius: 4px; font-size: 0.9rem; font-weight: 500; } .booking-form-container .forms-section .room-number { color: #6b7280; font-weight: 500; } .booking-form-container .forms-section .form-label { color: #374151; font-weight: 500; margin-bottom: 0.5rem; display: block; } .booking-form-container .forms-section .form-input, .booking-form-container .forms-section .form-select, .booking-form-container .forms-section .form-textarea { border: 1px solid #d1d5db; border-radius: 6px; padding: 0.75rem; width: 100%; margin-bottom: 1rem; font-size: 0.85rem; } .booking-form-container .forms-section .form-input, .booking-form-container .forms-section .form-select { height: 40px; } .booking-form-container .forms-section .form-input:focus, .booking-form-container .forms-section .form-select:focus, .booking-form-container .forms-section .form-textarea:focus { border-color: #16a34a; outline: none; box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.1); } .booking-form-container .forms-section .additional-guest-checkbox { display: flex; align-items: center; gap: 0.5rem; margin-top: 1rem; } .booking-form-container .forms-section .checkbox-label { color: #374151; font-size: 0.9rem; margin: 0; cursor: pointer; } .booking-form-container .forms-section .section-title { color: #045c96; font-size: 1rem; font-weight: 600; margin: 0 0 0 0; cursor: pointer; width: 100%; } .booking-form-container .forms-section .requests-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.5rem; padding-top: 20px; ; } .booking-form-container .forms-section .request-item { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; } .booking-form-container .forms-section .request-label { color: #374151; font-size: 0.9rem; margin: 0; cursor: pointer; } .booking-form-container .forms-section .form-check-input { margin: 0; cursor: pointer; } .booking-form-container .forms-section .form-check-input:checked { background-color: #16a34a; border-color: #16a34a; } .booking-form-container .forms-section .additional-requests { margin-top: 1.5rem; } .booking-form-container .forms-section .form-textarea { min-height: 100px; resize: vertical; font-family: inherit; } .booking-form-container .forms-section .policy-note { margin-top: 1rem; padding: 1rem; background-color: #fef3c7; border: 1px solid #fbbf24; border-radius: 6px; } .booking-form-container .forms-section .note-text { color: #92400e; font-size: 1rem; margin: 0; line-height: 1.5; } .booking-form-container .forms-section .info-text { color: #374151; font-size: 0.9rem; line-height: 1.6; margin-bottom: 1rem; } .booking-form-container .forms-section .info-text p { margin-bottom: 1rem; font-size: 15px; } .booking-form-container .forms-section .more-info-btn { color: #16a34a; text-decoration: none; font-weight: 500; } .booking-form-container .forms-section .more-info-btn:hover { text-decoration: underline; } /* Custom Bootstrap Modal Styles */ .sign-in-modal .modal-header { background-color: #16a34a; color: white; border-bottom: none; } .sign-in-modal .modal-content { box-shadow: none !important; border: none !important; } .sign-in-modal .modal-title { color: white; font-weight: 600; } .sign-in-modal .btn-close { /* filter: invert(1); */ background: #16a34a !important; color: white !important; } #cancellationModal .btn-close { color: black; background: none !important; } .sign-in-modal .modal-body { padding: 2rem; } .sign-in-modal .welcome-text { text-align: center; margin-bottom: 2rem; } .sign-in-modal .welcome-text h5 { color: #16a34a; font-weight: 600; margin-bottom: 0.5rem; } .sign-in-modal .welcome-text p { color: #6b7280; font-size: 0.9rem; margin: 0; line-height: 1.4; } .sign-in-modal input { height: 40px; } .sign-in-modal .form-label { color: #374151; font-weight: 500; } .sign-in-modal .form-control:focus { border-color: #16a34a; box-shadow: 0 0 0 0.2rem rgba(22, 163, 74, 0.25); } .sign-in-modal .btn-success { background-color: #16a34a; border: none; } .sign-in-modal .btn-success:hover { background-color: #045c96; } .sign-in-modal .forgot-password { text-align: left; margin-bottom: 1.5rem; } .sign-in-modal .forgot-password a { color: #16a34a; text-decoration: none; font-size: 0.9rem; } .sign-in-modal .forgot-password a:hover { text-decoration: underline; } .sign-in-modal .divider { text-align: center; margin: 1.5rem 0; position: relative; color: #6b7280; font-size: 0.9rem; } .sign-in-modal .divider::before { content: ''; position: absolute; top: 50%; right: 0; left: 0; height: 1px; background-color: #e5e7eb; z-index: 1; } .sign-in-modal .divider span { background-color: white; padding: 0 1rem; position: relative; z-index: 2; } .sign-in-modal .signup-link { text-align: center; color: #6b7280; font-size: 0.9rem; } .sign-in-modal .signup-link a { color: #16a34a; text-decoration: none; font-weight: 500; } .sign-in-modal .signup-link a:hover { text-decoration: underline; } /* Responsive Design */ @media (max-width: 991px) { .booking-form-container .forms-section .requests-grid { grid-template-columns: 1fr; } .booking-form-container .booking-summary { margin-bottom: 2rem; } } @media (max-width: 768px) { .booking-form-container .container-fluid { padding: 1rem; } .tabs-section-hotel-details .image-gallery-single .col-md-6.right-col { padding: 0 5px; } .tabs-section-hotel-details .image-gallery-single .col-md-6.left-col { padding: 5px 0; } .booking-form-container .booking-summary .summary-content, .booking-form-container .forms-section .form-content, .booking-form-container .forms-section .info-content { padding: 1rem; } .booking-form-container .booking-summary .hotel-info { flex-direction: column; text-align: center; } .booking-form-container .booking-summary .hotel-thumbnail { align-self: center; } .modal-body { padding: 0.5rem; } } /* Progress Steps Styles */ .payment-page-container .progress-steps-container { background: white; border: 1px solid #e5e7eb; border-radius: 8px; padding: 2rem; margin-bottom: 2rem; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .payment-page-container .progress-steps-container .steps-wrapper { display: flex; justify-content: space-between; align-items: center; position: relative; } .payment-page-container .progress-steps-container .step-item { display: flex; flex-direction: column; align-items: center; position: relative; flex: 1; } .payment-page-container .progress-steps-container .step-circle { width: 50px; height: 50px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 1.1rem; margin-bottom: 0.75rem; position: relative; z-index: 2; transition: all 0.3s ease; } .payment-page-container .progress-steps-container .step-circle.completed { background-color: #16a34a; color: white; border: 3px solid #16a34a; } .payment-page-container .progress-steps-container .step-circle.active { background-color: #16a34a; color: white; border: 3px solid #16a34a; box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.2); } .payment-page-container .progress-steps-container .step-circle.pending { background-color: #f3f4f6; color: #6b7280; border: 3px solid #d1d5db; } .payment-page-container .progress-steps-container .step-title { font-size: 0.9rem; font-weight: 500; text-align: center; color: #374151; margin: 0; max-width: 120px; } .payment-page-container .progress-steps-container .step-title.completed, .payment-page-container .progress-steps-container .step-title.active { color: #16a34a; font-weight: 600; } .payment-page-container .progress-steps-container .step-title.pending { color: #6b7280; } .payment-page-container .progress-steps-container .step-line { position: absolute; top: 25px; right: 50%; left: -50%; height: 3px; background-color: #e5e7eb; z-index: 1; } .payment-page-container .progress-steps-container .step-item:last-child .step-line { display: none; } .payment-page-container .progress-steps-container .step-line.completed { background-color: #16a34a; } .payment-page-container .progress-steps-container .step-line.active { background: linear-gradient(to left, #16a34a 50%, #e5e7eb 50%); } /* Booking Summary Styles */ .payment-page-container .booking-summary .summary-card { border: 1px solid #e5e7eb; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); background: white; } .payment-page-container .booking-summary .summary-header { background-color: #f8f9fa; border-bottom: 1px solid #e5e7eb; padding: 0.4rem; border-radius: 8px 8px 0 0; } .payment-page-container .booking-summary .summary-title { color: #045c96; font-size: 1rem; text-align: center; font-weight: 600; margin: 0; } .payment-page-container .booking-summary .summary-content { padding: 1.5rem; } .payment-page-container .booking-summary .hotel-info { display: flex; gap: 1rem; margin-bottom: 1.5rem; } .payment-page-container .booking-summary .hotel-thumbnail { width: 80px; height: 80px; border-radius: 8px; object-fit: cover; } .payment-page-container .booking-summary .hotel-name { color: #16a34a; font-size: 1.1rem; font-weight: 600; margin: 0 0 0.5rem 0; } .payment-page-container .booking-summary .hotel-rating { display: flex; gap: 2px; margin-bottom: 0.5rem; } .payment-page-container .booking-summary .star-icon { width: 16px; height: 16px; color: #fbbf24; font-size: 14px; } .payment-page-container .booking-summary .hotel-location { display: flex; align-items: center; gap: 0.25rem; color: #6b7280; font-size: 0.9rem; margin: 0; } .payment-page-container .booking-summary .location-icon { width: 14px; height: 14px; font-size: 12px; } .payment-page-container .booking-summary .booking-details { margin-bottom: 1.5rem; } .payment-page-container .booking-summary .detail-row { display: flex; justify-content: space-between; margin-bottom: 0.75rem; } .payment-page-container .booking-summary .detail-label { color: black; font-weight: bold; font-size: 0.9rem; } .payment-page-container .booking-summary .detail-value { color: #374151; font-weight: 500; font-size: 0.9rem; } .payment-page-container .booking-summary .pricing-section { border-top: 1px solid #e5e7eb; padding-top: 1rem; margin-top: 1.5rem; } .payment-page-container .booking-summary .price-row { display: flex; justify-content: space-between; margin-bottom: 0.5rem; } .payment-page-container .booking-summary .price-label { color: black; font-weight: bold; font-size: 0.9rem; } .payment-page-container .booking-summary .price-value { color: #374151; font-weight: 500; } .payment-page-container .booking-summary .total-row { display: flex; justify-content: space-between; padding-top: 0.75rem; border-top: 1px solid #e5e7eb; margin-top: 0.75rem; } .payment-page-container .booking-summary .total-label { color: #16a34a; font-weight: 600; font-size: 1.1rem; } .payment-page-container .booking-summary .total-value { color: #16a34a; font-weight: 700; font-size: 1.2rem; } /* Payment Form Styles */ .payment-page-container .payment-section .payment-card { margin-bottom: 1.5rem; border: 1px solid #e5e7eb; border-radius: 8px; background: white; } .payment-page-container .payment-section .payment-header { background-color: #f8f9fa; border-bottom: 1px solid #e5e7eb; padding: 0.4rem; border-radius: 8px 8px 0 0; } .payment-page-container .payment-section .payment-title { color: #045c96; font-size: 1rem; text-align: center; font-weight: 600; margin: 0; } .payment-page-container .payment-section .payment-content { padding: 1.5rem; } .payment-page-container .payment-section .payment-methods { display: flex; gap: 1rem; margin-bottom: 2rem; flex-wrap: wrap; } .payment-page-container .payment-section .payment-method { border: 2px solid #e5e7eb; border-radius: 8px; padding: 1rem; cursor: pointer; transition: all 0.3s ease; display: flex; flex-direction: column; align-items: center; gap: 0.5rem; min-width: 80px; background: white; } .payment-page-container .payment-section .payment-method:hover { border-color: #16a34a; background-color: #f0fdf4; } .payment-page-container .payment-section .payment-method.active { border-color: #16a34a; background-color: #f0fdf4; } .payment-page-container .payment-section .payment-method .method-icon { font-size: 1.5rem; color: #374151; } .payment-page-container .payment-section .payment-method .method-label { font-size: 0.8rem; color: #6b7280; text-align: center; margin: 0; } .payment-page-container .payment-section .form-label { color: #374151; font-weight: 500; margin-bottom: 0.5rem; display: block; } .payment-page-container .payment-section .form-input, .payment-page-container .payment-section .form-select { border: 1px solid #d1d5db; border-radius: 6px; padding: 0.75rem; width: 100%; margin-bottom: 1rem; font-size: 1rem; } .payment-page-container .payment-section .form-input:focus, .payment-page-container .payment-section .form-select:focus { border-color: #16a34a; outline: none; box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.1); } .payment-page-container .payment-section .card-icons { display: flex; gap: 0.5rem; margin-bottom: 1rem; } .payment-page-container .payment-section .card-icon { width: 40px; height: 25px; border: 1px solid #e5e7eb; border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 0.8rem; color: #6b7280; } .payment-page-container .payment-section .security-info { background-color: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 6px; padding: 1rem; margin-bottom: 1.5rem; } .payment-page-container .payment-section .security-text { color: #16a34a; font-size: 0.9rem; margin: 0; display: flex; align-items: center; gap: 0.5rem; } .payment-page-container .payment-section .pay-button { width: 100%; background-color: #16a34a; color: white; border: none; padding: 1rem; border-radius: 6px; font-weight: 600; font-size: 1.1rem; cursor: pointer; transition: background-color 0.2s; margin-bottom: 1rem; } .payment-page-container .payment-section .pay-button:hover { background-color: #045c96; } .payment-page-container .payment-section .terms-text { color: #6b7280; font-size: 0.85rem; text-align: center; line-height: 1.5; margin: 0; } .payment-page-container .payment-section .terms-link { color: #16a34a; text-decoration: none; } .payment-page-container .payment-section .terms-link:hover { text-decoration: underline; } /* Responsive Design */ @media (max-width: 991px) { .payment-page-container .booking-summary { margin-bottom: 2rem; } } @media (max-width: 768px) { .payment-page-container .container-fluid { padding: 1rem; } .payment-page-container .booking-summary .summary-content, .payment-page-container .payment-section .payment-content { padding: 1rem; } .payment-page-container .booking-summary .hotel-info { flex-direction: column; text-align: center; } .payment-page-container .booking-summary .hotel-thumbnail { align-self: center; } .payment-page-container .progress-steps-container { padding: 1.5rem 1rem; } .payment-page-container .progress-steps-container .step-circle { width: 40px; height: 40px; font-size: 0.9rem; } .payment-page-container .progress-steps-container .step-title { font-size: 0.8rem; max-width: 80px; } .payment-page-container .progress-steps-container .step-line { top: 20px; } .payment-page-container .payment-section .payment-methods { display: grid; grid-template-columns: repeat(2, 1fr); } } .hotel-header .hotel-name { font-size: 25px; font-weight: 700; color: #343a40; } .hotel-header .hotel-address { font-size: 15px; font-weight: bold; color: #6c757d; } .hotel-header .star-rating { color: #ffc107; /* Bootstrap yellow for stars */ font-size: 1rem; } /* Booking Summary Section */ .booking-summary-card { background-color: #fff; border-radius: 0.75rem; box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); padding: 1.5rem; margin-bottom: 2rem; } .booking-summary-card .summary-item { display: flex; align-items: center; margin-bottom: 0.5rem; } .booking-summary-card .summary-item i { margin-left: 0.75rem; color: #007bff; /* Primary blue for icons */ font-size: 1.2rem; } .booking-summary-card .summary-item span { font-weight: 500; color: #495057; } /* Tabs Section */ .tabs-section .nav-tabs { border-bottom: 1px solid #dee2e6; margin-bottom: 1.5rem; border-radius: 0.75rem; /* Rounded corners for the tab container */ overflow: hidden; /* Ensures rounded corners apply correctly */ } .tabs-section .nav-tabs .nav-item { flex-grow: 1; /* Distribute tabs evenly */ text-align: center; } .tabs-section .nav-tabs .nav-link { border: none; border-radius: 0.75rem 0.75rem 0 0; /* Rounded top corners */ color: #495057; padding: 1rem 1.25rem; font-weight: 600; transition: all 0.3s ease; background-color: #e9ecef; /* Light background for inactive tabs */ margin-left: 0.25rem; /* Small gap between tabs */ } .tabs-section .nav-tabs .nav-link:last-child { margin-left: 0; } .tabs-section .nav-tabs .nav-link.active { background-color: #007bff; /* Active tab background */ color: #fff; /* Active tab text color */ border-color: #007bff #007bff #fff; /* Border to match content area */ border-bottom: 3px solid #007bff; /* Stronger active indicator */ } .tabs-section .nav-tabs .nav-link:hover:not(.active) { background-color: #cfe2ff; /* Lighter hover background */ color: #0056b3; } .tabs-section .tab-content { background-color: #fff; border-radius: 0.75rem; box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); padding: 2rem; } /* Image Gallery within Overview Tab */ .overview-tab .gallery-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1rem; } .overview-tab .gallery-grid .gallery-item { border-radius: 0.5rem; overflow: hidden; box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); transition: transform 0.2s ease-in-out; } .overview-tab .gallery-grid .gallery-item:hover { transform: translateY(-5px); } .overview-tab .gallery-grid .gallery-item img { width: 100%; height: 150px; /* Fixed height for consistency */ object-fit: cover; /* Cover the area, crop if necessary */ display: block; } /* Content within tabs */ .tab-pane h3 { color: #343a40; margin-bottom: 1.5rem; font-weight: 600; text-align: center; } .filter-group .tab-pane p { color: #495057; line-height: 1.6; font-size: 14px; margin-bottom: 1rem; padding: 0 0 10px 0; } .tab-pane ul { list-style: none; padding-right: 0; } .tab-pane ul li { margin-bottom: 0.5rem; color: #495057; font-size: 18px; } .tab-pane ul li i { margin-left: 0.75rem; color: #28a745; /* Green for checkmarks/success icons */ } /* Responsive adjustments */ @media (max-width: 768px) { .hotel-header .hotel-name { font-size: 1.8rem; } .hotel-header .hotel-address { font-size: 0.9rem; } .tabs-section .nav-tabs .nav-link { padding: 0.75rem 0.5rem; font-size: 0.9rem; } .overview-tab .gallery-grid { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); } .overview-tab .gallery-grid .gallery-item img { height: 120px; } } /* Custom styles for the new sections */ .guest-details-section .card-header, .payment-section .card-header, .booking-summary-section .card-header { background-color: #28a745; /* Green background */ color: #fff; font-weight: 600; border-bottom: none; border-radius: 0.7rem 0.7rem 0 0; } .guest-details-section .card, .payment-section .card, .booking-summary-section .card { border-radius: 0.75rem; box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); margin-bottom: 1.5rem; } .guest-details-section .form-label, .payment-section .form-label { font-weight: 500; color: #343a40; } .guest-details-section .btn-primary, .payment-section .btn-primary { background-color: #28a745; /* Green button */ border-color: #28a745; } .guest-details-section .btn-primary:hover, .payment-section .btn-primary:hover { background-color: #218838; /* Darker green on hover */ border-color: #1e7e34; } .guest-details-section .special-request-options .form-check-label { color: #495057; } .booking-summary-section .total-price { font-size: 1.5rem; font-weight: 700; color: #28a745; /* Green for total price */ } .booking-summary-section .btn-continue { background-color: #28a745; border-color: #28a745; color: #fff; font-size: 1.2rem; padding: 0.75rem 1.5rem; border-radius: 0.5rem; width: 100%; } .booking-summary-section .btn-continue:hover { background-color: #218838; border-color: #1e7e34; } .booking-summary-section .important-notes { font-size: 0.9rem; color: #6c757d; margin-top: 1rem; padding: 1rem; background-color: #f0f0f0; border-radius: 0.5rem; } /* Custom Nav Tabs Styling */ .hotel-tabs .nav-tabs { border-bottom: 2px solid #e9ecef; background: #ffffff; padding: 0; margin-bottom: 2rem; border-radius: 8px 8px 0 0; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); } .hotel-tabs .nav-tabs .nav-item { margin-bottom: 0; } .hotel-tabs .nav-tabs .nav-link { border: none; border-radius: 8px 8px 0 0; padding: 10px 20px; font-weight: bold; font-size: 15px; color: #6c757d; } .add-flight-btn { background: transparent; border: 2px dashed #44b774; color: #44b774; padding: 6px 12px; border-radius: 8px !important; cursor: pointer; font-size: 14px; font-weight: bold; transition: all 0.3s; display: inline-flex; align-items: center; gap: 8px; } .add-flight-btn:hover { background: #44b774 !important; color: white; border: 2px dashed #44b774; } .add-flight-btn:hover svg { color: white; } .multi-city-bottom-row { display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: end; margin-top: 20px; padding-top: 20px; border-top: 1px solid #e9ecef; } .multi-city-search { min-width: 200px; } /* Tab styling */ .tab-btn { background: transparent; transition: all 0.3s ease; position: relative; text-transform: capitalize; letter-spacing: 0.5px; } .hotel-tabs .nav-tabs .nav-link:hover { border: none; background: #f8f9fa; color: #44b774; transform: translateY(-2px); } .hotel-tabs .nav-tabs .nav-link.active { background: #44b774 !important; color: #ffffff !important; border: none; font-weight: 600; box-shadow: 0 4px 8px rgba(68, 183, 116, 0.3); } .hotel-tabs .nav-tabs .nav-link.active::after { content: ''; position: absolute; bottom: -2px; right: 0; left: 0; height: 2px; background: #44b774; } /* Responsive design */ @media (max-width: 768px) { .hotel-tabs .nav-tabs { flex-wrap: wrap; border-radius: 8px; display: flex; } #rooms .hotel-details .d-flex { display: block !important; } .hotel-tabs .nav-tabs .nav-item { min-width: auto; } .hotel-tabs .nav-tabs .nav-link { padding: 10px 16px; font-size: 13px; margin: 2px; border-radius: 6px; } .hotel-tabs .nav-tabs .nav-item { flex: 1; min-width: calc(50% - 4px); } } @media (max-width: 480px) { .hotel-tabs .nav-tabs .nav-link { text-align: center; margin: 1px 0; } } /* Animation for tab content */ .hotel-tabs .tab-content { padding: 2rem 1rem; background: #ffffff; border-radius: 0 0 8px 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); min-height: 200px; } .hotel-tabs .tab-pane { opacity: 0; transition: opacity 0.3s ease-in-out; } .hotel-tabs .tab-pane.active { opacity: 1; } /* Optional: Add icons support */ .hotel-tabs .nav-tabs .nav-link i { margin-left: 8px; font-size: 16px; } /* Hover effect enhancement */ .hotel-tabs .nav-tabs .nav-link:not(.active):hover { background: linear-gradient(-135deg, #f8f9fa 0%, #e9ecef 100%); } /* Active tab enhancement with gradient */ .hotel-tabs .nav-tabs .nav-link.active { background: linear-gradient(-135deg, #44b774 0%, #3a9d63 100%) !important; } #form-contact-us .select2-container--default .select2-selection--single .select2-selection__rendered { border: 1px solid #EEE !important; height: 40px; border-radius: 10px; padding-right: 10px !important; line-height: 40px !important; margin-top: -15px; font-size: 14px; } #form-contact-us .select2-container--default .select2-selection--single .select2-selection__rendered::focus { border: 1px solid #15803d !important; } #form-contact-us .select2-container--default .select2-selection--single .select2-selection__arrow b { top: 65% !important; width: 0; } @media (min-width:1310px) { .multi-city-segment { width: 84.5%; } .remove-segment-btn { left: -120px !important; top: 14px !important; } } .room-toggle-icon, .room-toggle-icon i, .room-toggle-icon svg { font-size: 20px !important; float: left; } .forms-section .card-content { border: 1px solid #DDD; border-radius: 10px; overflow: hidden; } .forms-section .card-content form.guest-form.cpntent { padding: 15px; } .guest-form-card .form-content { padding: 0; } .guest-form-card .form-content .section-title { padding: 15px 20px; background: #fafafa; border-radius: 10px 10px 0 0; border-bottom: 1px solid #DDD; } .guest-form-card .form-content .special-requests-content.content { padding: 15px; } .guest-form-card .form-content .special-requests { border: 1px solid #DDD; border-radius: 10px; overflow: hidden; } .logo-check { width: 30px; height: 30px; border-radius: 50%; margin-left: 7px; } .button-group-pills .btn { border-radius: 20px; line-height: 1.2; margin-bottom: 15px; margin-right: 10px; border-color: #DDD; background-color: #FFF; color: #000; font-size: 14px; } .button-group-pills .btn.active { border-color: #44b774 !important; background-color: #44b774; color: #FFF; box-shadow: none; } .button-group-pills .btn:hover { border-color: #44b774; background-color: #44b774; color: #FFF; } .custom-radios { /* display: flex; */ gap: 20px; /* spacing between radios */ font-family: Arial, sans-serif; } .custom-radios label { display: flex; align-items: center; cursor: pointer; font-size: 14px; color: #333; } .custom-radios input[type="radio"] { display: none; /* hide default radio */ } .custom-radios .radio-btn { width: 18px; height: 18px; border: 2px solid #44b774; border-radius: 50%; margin-left: 8px; position: relative; transition: border-color 0.3s ease; } .custom-radios input[type="radio"]:checked+.radio-btn { background-color: #44b774; border-color: #44b774; } .custom-radios .radio-btn::after { content: ""; position: absolute; top: 50%; right: 53.8%; width: 6px; height: 6px; background: white; border-radius: 50%; transform: translate(50%, -50%) scale(0); transition: transform 0.2s ease; } .custom-radios input[type="radio"]:checked+.radio-btn::after { transform: translate(50%, -50%) scale(1); } .listing-flights { max-width: 900px; margin: 0 auto; padding: 0; } .listing-flights .top-section { display: flex; justify-content: flex-end; align-items: center; margin-bottom: 20px; } .listing-flights .filter-options { display: flex; gap: 8px; } .listing-flights .filter-option { border-radius: 4px; padding: 2px 12px; font-size: 12px; transition: all 0.2s; font-weight: 500; } .listing-flights .filter-option:first-of-type { background: rgb(234, 245, 235); color: green; } .listing-flights .filter-option:nth-of-type(2) { background: rgb(233, 246, 248); color: #045c96; } .listing-flights .filter-option:nth-of-type(3) { background: rgb(233, 246, 248); color: #045c96; } .listing-flights .filter-option.active { background: #3498db; color: white; border-color: #3498db; box-shadow: 0 3px 6px rgba(52, 152, 219, 0.3); } .listing-flights .flight-card { background: white; border-radius: 6px; border: 1px solid #e0e0e0; margin-bottom: 12px; display: flex; overflow: hidden; min-height: 120px; } .listing-flights .price-section { background: #fafafa; border-right: 1px solid #e0e0e0; padding: 16px; width: 180px; display: flex; flex-direction: column; align-items: center; justify-content: center; } .listing-flights .price-badge { color: #44b774; font-size: 11px; margin-bottom: 6px; display: flex; align-items: center; gap: 4px; text-align: center; } .listing-flights .price-amount { font-size: 22px; font-weight: bold; color: #333; margin-bottom: 12px; } .listing-flights .select-flight-btn { background: #44b774; border: none; border-radius: 18px; padding: 6px 20px; color: white; font-size: 13px; font-weight: 500; width: 100%; margin-bottom: 6px; transition: all 0.3s ease-in-out; } .listing-flights .select-flight-btn:hover { background: #045c96; } .listing-flights .flight-details-link { color: #3498db; text-decoration: none; font-size: 13px; } .listing-flights .flight-info { flex: 1; padding: 16px 20px; display: flex; align-items: center; justify-content: center; position: relative; flex-direction: column; align-items: stretch; } .listing-flights .flight-route { display: flex; align-items: center; gap: 30px; margin-top: 20px; justify-content: space-between; } .listing-flights .time-info { text-align: center; min-width: 60px; } .listing-flights .departure-time, .listing-flights .arrival-time { font-size: 16px; font-weight: bold; color: #333; margin-bottom: 0; } .listing-flights .airport-code { font-size: 15px; color: #666; } .listing-flights .flight-duration { text-align: center; color: #858585; font-weight: bold; font-size: 13px; position: relative; } .listing-flights .duration-line { min-width: 150px; height: 1px; background: #ddd; margin: 4px auto; position: relative; } .listing-flights .duration-line::before { content: '✈'; position: absolute; top: -8px; right: 50%; transform: translateX(50%); font-size: 10px; color: #666; background: white; padding: 0 2px; height: 17px; display: flex; align-items: center; } .listing-flights .cart-icon { width: 28px; height: 28px; /* background: #27ae60; */ border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; font-size: 19px; position: relative; } .listing-flights .cart-icon::after { content: '✓'; position: absolute; top: -8px; left: -2px; background: #44b774; width: 20px; height: 20px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; line-height: 20px; border: 1px solid white; color: white; } .listing-flights .cart-icon.x::after { content: 'x' !important; background: red; color: white; } .listing-flights .airline-section { display: flex; align-items: center; gap: 8px; flex-direction: row-reverse; } .listing-flights .airline-info { display: flex; flex-direction: column; text-align: right; } .listing-flights .airline-name { font-size: 16px; color: #333; font-weight: 500; } .listing-flights .airline-description { font-size: 13px; color: #999; line-height: 1.2; } .listing-flights .airline-logos { display: flex; gap: 4px; } .listing-flights .airline-logo { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: bold; color: white; border: 1px solid white; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); } .listing-flights .destination-badge { background: #f39c12; color: white; padding: 2px 6px; border-radius: 3px; font-size: 15px; font-weight: bold; letter-spacing: 0.5px; } .listing-flights .heart-icon { color: #44b774; margin-left: 2px; } .baggage-info { max-width: 400px; padding: 10px; border-radius: 8px; color: #fff; text-align: right; } .baggage-info h4 { font-size: 15px; font-weight: 600; margin-bottom: 16px; color: #FFF; } .baggage-item { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 16px; color: #FFF; } .baggage-item:last-child { margin-bottom: 0; color: #FFF; } .check-icon { width: 24px; height: 24px; border-radius: 50%; background-color: #319E37; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: #FFF; } .check-icon.x { background-color: #DDD; color: #000; } .baggage-details h5 { font-size: 12px; font-weight: 500; margin: 0 0 4px 0; color: #FFF; line-height: 1.3; } .baggage-details p { font-size: 10px; color: #FFF; margin: 0; } @media (max-width: 1200px) { .listing-flights .flight-route { gap: 10px; } } @media (max-width: 767px) { .listing-flights .flight-card { display: block; } .listing-flights .price-section { width: 100%; } .listing-flights .flight-route { gap: 20px; flex-direction: column; } .all-flights-search-block { width: 94%; } } .fare-options { max-width: 800px; margin: 0 auto; padding: 10px; } .fare-options .card-container { display: flex; gap: 1rem; flex-wrap: wrap; } .fare-options .fare-card { flex: 1; min-width: auto; border: 2px solid #e0e0e0; border-radius: 12px; padding: 0 0 20px; background: white; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); } .fare-options .modal-body { padding: 0.5rem; } .fare-options .card-header { text-align: center; margin-bottom: 0.2rem; display: flex; justify-content: space-between; } .fare-options .price { font-size: 13px; font-weight: bold; color: #333; margin-bottom: 0; } .fare-options .fare-type { font-size: 13px; font-weight: 600; color: #666; text-transform: uppercase; letter-spacing: 0.5px; } .fare-options .features-section { margin-bottom: 0; padding: 10px; } .fare-options .features-section svg { width: 10px; height: 10px; padding: 5px; line-height: 15px; text-align: center; } .flight-summary .features-section svg { width: 10px; height: 10px; padding: 5px; line-height: 15px; text-align: center; margin-left: 5px; } .fare-options .section-title { font-size: 0.9rem; font-weight: 600; color: #333; margin-bottom: 0.2rem; text-align: center; } .fare-options .owl-prev, .fare-options .owl-next { background: #44b774 !important; color: white !important; } .fare-options .owl-prev:hover, .fare-options .owl-next:hover { background: #045c96 !important; } .fare-options .feature-list { list-style: none; padding: 0; margin: 0; } .fare-options .feature-item { display: flex; align-items: center; justify-content: start; padding: 0; font-size: 0.85rem; color: #555; flex-direction: row-reverse; gap: 7px; } .fare-options .feature-icon { width: 16px; height: 16px; flex-shrink: 0; } .fare-options .icon-check { color: #28a745; } .fare-options .icon-dollar { color: #007bff; } .fare-options .select-button { background-color: #44b774; color: white; border: none; border-radius: 25px; padding: 0.75rem 1.5rem; font-weight: 600; font-size: 0.9rem; cursor: pointer; transition: background-color 0.3s ease; margin: 0 auto; width: 90%; display: block; } .fare-options .select-button:hover { background-color: #045c96; } .fare-options .select-button.selected { background-color: #045c96 !important; } @media (max-width: 768px) { .fare-options .card-container { flex-direction: column; } } .bottom-foot { align-items: center; margin-top: 13px; } .bottom-foot a { background: #15803d; color: white; display: block; text-align: center; border-radius: 50px; max-width: fit-content; margin-right: auto; padding: 7px 25px; color: white !important; transition: all 0.3s ease-in-out; } .bottom-foot a:hover { background: #045c96; } .booking-form { /* background-color: #f8f9fa; */ /* min-height: 100vh; */ padding: 20px 0; } .booking-form .main-container { max-width: 1200px; margin: 0 auto; } .booking-form .form-section { background: white; border-radius: 12px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); margin-bottom: 20px; overflow: hidden; } .booking-form .section-header { background: #f8f9fa; padding: 10px 20px; border-bottom: 1px solid #e9ecef; display: flex; align-items: center; gap: 15px; } .booking-form .section-header h4 { font-size: 18px; } .booking-form .section-content { padding: 25px; } .booking-form .user-icon { width: 60px; height: 60px; background: linear-gradient(-135deg, #e6ffe1, #d2fbbb); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #44b774; font-size: 24px; } .booking-form .sign-in-banner { /* background: linear-gradient(135deg, #e8f5e8, #c8e6c9); */ border: 1px solid #4caf50; border-radius: 12px; padding: 20px; margin-bottom: 25px; } .booking-form .title-chips { display: flex; gap: 10px; margin-bottom: 20px; } .booking-form .title-chip { padding: 8px 16px; border: 2px solid #dee2e6; border-radius: 20px; background: white; cursor: pointer; transition: all 0.2s; } .booking-form .title-chip:hover, .booking-form .title-chip.active { border-color: #44b774; background: #e7f9fd; } .booking-form .form-control { border-radius: 8px; border: 2px solid #dee2e6; padding: 12px 16px; font-size: 14px; } .booking-form .form-control:focus { border-color: #44b774; box-shadow: 0 0 0 0.2rem rgba(13, 202, 240, 0.25); } .booking-form .addon-card { border: 2px solid #e9ecef; border-radius: 12px; padding: 20px; margin-bottom: 15px; transition: all 0.2s; } .booking-form .addon-card:hover { border-color: #44b774; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); } .booking-form .addon-icon { width: 50px; height: 50px; border-radius: 8px; display: flex; align-items: center; justify-content: center; margin-left: 15px; } .booking-form .insurance-icon { background: linear-gradient(-135deg, #fff3e0, #ffe0b2); color: #f57c00; } .booking-form .discount-icon { background: linear-gradient(-135deg, #e8f5e8, #c8e6c9); color: #388e3c; } .booking-form .baggage-item { display: flex; align-items: center; gap: 12px; padding: 12px; background: #f8f9fa; border-radius: 8px; margin-bottom: 10px; } .booking-form .check-icon { width: 24px; height: 24px; background: #4caf50; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; font-size: 12px; } .booking-form .flight-summary { position: sticky; top: 20px; } .booking-form .flight-card { background: white; border-radius: 12px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); padding: 20px; margin-bottom: 20px; } .booking-form .airline-logo { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; } .booking-form .flight-route { display: flex; align-items: center; gap: 15px; margin: 15px 0; } .booking-form .flight-time { font-size: 24px; font-weight: bold; color: #212529; } .booking-form .flight-divider { flex: 1; height: 2px; background: #dee2e6; position: relative; } .booking-form .flight-divider::after { content: '✈️'; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); background: white; padding: 0 8px; } .booking-form .btn-primary { background: #44b774; border: none; border-radius: 8px; padding: 12px 30px; font-weight: 600; } .booking-form .btn-primary:hover { background: #045c96; border-color: #045c96; } .booking-form .btn-outline-primary { border-color: #44b774; color: #44b774; border-radius: 8px; padding: 10px 25px; } .booking-form .btn-outline-primary:hover { background: #44b774; color: white; } .booking-form .expandable-section { border: 1px solid #e9ecef; border-radius: 8px; margin-bottom: 15px; } .booking-form .expandable-header { padding: 15px 20px; /* background: #f8f9fa; */ cursor: pointer; display: flex; align-items: center; justify-content: space-between; } .booking-form .expandable-content { padding: 20px; border-top: 1px solid #e9ecef; } @media (max-width: 768px) { .booking-form .main-container { padding: 0 15px; } .booking-form .flight-summary { position: static; margin-top: 30px; } } .booking-form .section-header { display: flex; align-items: center; padding: 20px; cursor: pointer; transition: background-color 0.3s ease; position: relative; } .booking-form .section-header .check-icon { width: 30px; height: 30px; background-color: #28a745; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; margin-left: 5px; flex-shrink: 0; } .booking-form .section-header .chevron-icon { position: absolute; left: 20px; transition: transform 0.3s ease; color: #6c757d; } .booking-form .section-header.collapsed .chevron-icon { transform: rotate(90deg); } .booking-form .section-content { padding: 20px; transition: all 0.3s ease; overflow: hidden; } .booking-form .section-content.collapsed { max-height: 0; padding-top: 0; padding-bottom: 0; opacity: 0; } .price-breakdown { background: white; overflow: hidden; } .price-breakdown .traveler-item { border-bottom: 1px solid #eee; } .price-breakdown .traveler-header { padding: 15px 0; cursor: pointer; transition: background-color 0.2s; user-select: none; } .price-breakdown .arrow { width: 0; height: 0; border-right: 6px solid transparent; border-left: 6px solid transparent; border-top: 8px solid #666; transition: transform 0.3s ease; margin-right: 10px; } .price-breakdown .arrow.expanded { transform: rotate(-180deg); } .price-breakdown .traveler-details { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; background: white; } .price-breakdown .traveler-details.show { max-height: 300px; } .price-breakdown .details-content { padding: 15px 20px; border-top: 1px solid #eee; } .price-breakdown .detail-row { display: flex; justify-content: space-between; margin-bottom: 8px; font-size: 14px; } .price-breakdown .total-section { padding: 15px 0; border-top: 2px solid #dee2e6; font-weight: bold; font-size: 16px; } .code-air { color: white !important; background: #045c96; border-radius: 5px; font-size: 13px !important; line-height: 1.2; padding: 5px !important; max-width: 40px; } #select-flight .owl-carousel .owl-nav button { border: none !important; }