/*
Theme Name: Gofly Child
Theme URI: https://www.gofly-wp.egenstheme.com/
Template: gofly-main
Author: Egenslab
Author URI: https://themeforest.net/user/egenslab/
Description: GoFly is a modern, responsive, and feature-rich WordPress theme designed for travel agencies, tour operators, and online booking platforms. Whether you’re offering tours, hotels, visa services, or unique travel experiences, GoFly provides a powerful all-in-one solution to manage your business online. With advanced booking functionality, customizable layouts, multilingual support, and seamless payment integration, GoFly helps you attract global travelers, showcase destinations, and increase bookings effortlessly.
Version: 1.2.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags:  blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks, accessibility-ready,This theme, like WordPress, is licensed under the GPL.Use it to make something cool, have fun, and share what you've learned with others.

*/

@font-face {
    font-family: "Reddit Sans";
    src: url("./assets/fonts/RedditSans-VariableFont_wght.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: "Reddit Sans Italic";
    src: url("./assets/fonts/RedditSans-Italic-VariableFont_wght.ttf") format("truetype");
    font-weight: 400;
    font-style: italic;
	font-display: swap;
}

@font-face {
    font-family: "Sora";
    src: url("./assets/fonts/Sora-VariableFont_wght.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
	font-display: swap;
}

* {
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
}

::-moz-selection {
    color: var(--white-color);
    background-color: var(--primary-color1);
}

::selection {
    color: var(--white-color);
    background-color: var(--primary-color1);
}

:root {
    --font-reddit-sans: 'Reddit Sans', sans-serif;
    --font-redditsans-italic: 'Reddit Sans Italic', sans-serif;
    --font-sora: 'Sora', sans-serif;
    --font-poppins: 'Poppins', sans-serif;
    --font-roboto: 'Roboto', sans-serif;
    --font-courgette: 'Courgette', sans-serif;
    --font-billy-ohio: 'Billy Ohio', sans-serif;
    --white-color: #fff;
    --white-color-opc: 255, 255, 255;
    --black-color: #110F0F;
    --black-color-opc: 17, 15, 15;
    --title-color: #552E0E;
    --title-color-opc: 17, 15, 15;
    --title-color2: #FFCD6B;
    --title-color2-opc: 246, 243, 188;
    --text-color: #2B2B2B;
    --white-text-color: #F2F1EC;
    --primary-color1: #552E0E;
    --primary-color1-opc: 23, 129, 254;
    --primary-color2: #552E0E;
    --primary-color2-opc: 14, 169, 208;
    --primary-color3: #285340;
    --primary-color3-opc: 40, 83, 64;
    --primary-color4: #1B2072;
    --primary-color4-opc: 27, 32, 114;
    --borders-color: #E8E8E8;
}

/*================================================
02. Mixins Css
=================================================*/
.sec-mar {
    margin: 100px 0;
}
@media (max-width: 991px) {
    .sec-mar {
        margin: 80px 0;
    }
}

html {
    font-size: 100%;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    font-family: var(--font-sora), sans-serif;
    color: var(--text-color);
    font-size: 16px;
    font-weight: 400;
}
body.experience-01 #ball {
    border-color: var(--primary-color2);
    background-color: var(--primary-color2);
}
body.experience-01 {
    /* Ball view
  ============= */
}
body.experience-01 #ball.ball-view {
    background-image: linear-gradient(112.83deg, rgba(255, 255, 255, 0.47) 0%, rgba(255, 255, 255, 0) 110.84%);
    background-color: rgba(var(--primary-color2-opc), 0.5);
}
body.experience-01 #ball .ball-drag::before,
body.experience-01 #ball .ball-drag::after {
    color: var(--primary-color2);
}
body.experience-01 #ball.magnetic-active {
    background-image: linear-gradient(112.83deg, rgba(255, 255, 255, 0.47) 0%, rgba(255, 255, 255, 0) 110.84%);
    background-color: rgba(var(--primary-color2-opc), 0.5);
}
body.experience-01 #ball .ball-close {
    color: var(--primary-color2);
}
body.experience-01 .progress-wrap svg.progress-circle {
    stroke: var(--primary-color2);
}
body.experience-01 .progress-wrap .arrow {
    fill: var(--primary-color2);
}
body.experience-01 .progress-wrap:hover {
    background-color: var(--primary-color2);
}
body.experience-01 .progress-wrap:hover .arrow {
    fill: var(--white-color);
}
body.experience-01 .daterangepicker td.active,
body.experience-01 .daterangepicker td.active:hover {
    background-color: var(--primary-color2);
}
body.experience-01 .daterangepicker td.in-range {
    background-color: rgba(var(--primary-color2-opc), 0.2);
}
body.experience-01 .daterangepicker td.active {
    background-color: var(--primary-color2);
}
body.experience-01 .daterangepicker .btn-primary {
    background-color: var(--primary-color2);
    border-color: var(--primary-color2);
}
body.experience-01 .daterangepicker.single td.active,
body.experience-01 .daterangepicker.single td.active:hover {
    background-color: var(--primary-color2);
}
body.experience-01 .daterangepicker.single .btn-primary {
    background-color: var(--primary-color2);
    border-color: var(--primary-color2);
}
body.experience-02 #ball {
    border-color: var(--primary-color3);
    background-color: var(--primary-color3);
}
body.experience-02 {
    /* Ball view
  ============= */
}
body.experience-02 #ball.ball-view {
    background-image: linear-gradient(112.83deg, rgba(255, 255, 255, 0.47) 0%, rgba(255, 255, 255, 0) 110.84%);
    background-color: rgba(var(--primary-color3-opc), 0.5);
}
body.experience-02 #ball .ball-drag::before,
body.experience-02 #ball .ball-drag::after {
    color: var(--primary-color3);
}
body.experience-02 #ball.magnetic-active {
    background-image: linear-gradient(112.83deg, rgba(255, 255, 255, 0.47) 0%, rgba(255, 255, 255, 0) 110.84%);
    background-color: rgba(var(--primary-color3-opc), 0.5);
}
body.experience-02 #ball .ball-close {
    color: var(--primary-color3);
}
body.experience-02 .progress-wrap svg.progress-circle {
    stroke: var(--primary-color3);
}
body.experience-02 .progress-wrap .arrow {
    fill: var(--primary-color3);
}
body.experience-02 .progress-wrap:hover {
    background-color: var(--primary-color3);
}
body.experience-02 .progress-wrap:hover .arrow {
    fill: var(--white-color);
}
body.visa-agency #ball {
    border-color: var(--primary-color4);
    background-color: var(--primary-color4);
}
body.visa-agency {

}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--title-color);
    font-family: var(--font-reddit-sans);
    font-weight: 600;
    line-height: 1.4;
    word-wrap: break-word;
}

/*=====================================================
 Header 3 menu customization
 ====================================================== */
header.style-3 .main-menu > ul > li > a {
	color: var(--white-color);
	display: block;
	letter-spacing: 0.4px;
	padding: 5px 12px;
	line-height: 1;
	position: relative;
	font-family: var(--font-sora);
	font-weight: 600;
	font-size: 15px;
	transition: all 0.5s ease-out 0s;
	position: relative;
	border: 1px dashed transparent;
	border-radius: 100px;
}

header.style-3 .main-menu > ul > li ul.sub-menu > li > a {
	display: block;
	padding: 12px 20px;
	color: var(--title-color);
	font-weight: 500;
	font-family: var(--font-sora);
	font-size: 14px;
	line-height: 1.2;
	transition: all 0.4s ease-out 0s;
	position: relative;
}

header.style-3 .main-menu > ul > li .mega-menu .menu-row .menu-single-item .menu-title h5 {
	color: var(--title-color);
	font-family: var(--font-sora);
	font-weight: 600;
	font-size: 20px;
	line-height: 30px;
	margin-bottom: 0;
}

header.style-3 .main-menu > ul > li .mega-menu .menu-row .menu-single-item ul li > a {
	color: var(--text-color);
	font-family: var(--font-sora);
	font-weight: 600;
	font-size: 16px;
	line-height: 1;
	transition: 0.5s;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

header.style-3 .header-logo {
	width: 160px;
}

header.style-3 .contact-area .content a:hover {
	color: #DC780A;
}

.breadcrumb-section .banner-content h1 {
	font-family: var(--font-reddit-sans);
	font-weight: 800;
}

.breadcrumb-section .banner-content .breadcrumb-list li {
	font-family: var(--font-sora);
}

p {
	font-family: var(--font-sora);
}

/*=================================
 Sticky Header Customization
 ================================== */
header.style-3.sticky {
	box-sizing: border-box;
	background-color: #552E0E;
	box-shadow: 5px 3px 40px rgba(0, 72, 88, 0.1);
	z-index: 9999;
}

/*===========================================
 Home banner slider pagination modifications
 ============================================ */
.home3-banner-section .paginations .swiper-pagination-bullet.swiper-pagination-bullet-active {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background-color: #FFCD6B;
}

.home3-banner-section .paginations {
	position: absolute;
	bottom: 110px;
}

@media (min-width: 1400px) and (max-width: 1599px) {
  .home3-banner-section .paginations {
    bottom: 110px;
  }
}

@media (max-width: 1139px) {
  .home3-banner-section .paginations {
    bottom: 110px;
  }
}

/*=================
 Button hover color
 ================== */
.primary-btn1 {
    background-color: #552E0E;
    font-family: var(--font-sora);
    font-size: 15px;
    color: var(--white-color);
}
.primary-btn1::after {
	content: "";
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transform: translateY(110%);
	background-color: #DC780A;	
	overflow: hidden;
	transition: opacity 0.5s, transform 0.5s;
	z-index: -1;
}

/*========================
 Search bar customization
 ========================= */
.filter-wrapper .filter-input-wrap .filter-input .single-search-box .custom-select-wrap .option-list li .destination span, .filter-wrapper .filter-input-wrap .filter-input .single-search-box .custom-select-wrap .option-list-destination li .destination span {
	font-family: var(--font-sora);
}

.daterangepicker .calendar-table td {
	font-family: var(--font-sora);
}

.daterangepicker .calendar-table th.month {
	font-family: var(--font-sora);
}

.daterangepicker .drp-buttons .btn {
	font-family: var(--font-sora);
}

.daterangepicker .calendar-table th {
	font-family: var(--font-sora);
}

.filter-wrapper .filter-input-wrap .filter-input .single-search-box .custom-select-wrap .option-list li.single-item h6, .filter-wrapper .filter-input-wrap .filter-input .single-search-box .custom-select-wrap .option-list-destination li.single-item h6 {
	font-family: var(--font-sora);
}

.elementor-9686 .elementor-element.elementor-element-35927bf .filter-wrapper .filter-input-wrap > p a {
    background: #FFB52A;
    padding: 0.5rem 1rem;
    border-radius: 5px;
}

.elementor-9686 .elementor-element.elementor-element-35927bf .filter-wrapper .filter-input-wrap > p a:hover {
    background: #DC780A;
	color: #fff;
    padding: 0.5rem 1rem;
    border-radius: 5px;
}

/*====================================================================================
 Change Special Offers section in Travel Agency 02 style
 ===================================================================================== */
.service-wrapper .service-list .single-service:nth-child(2) .icon {
	background-color: #FFB52A;
}

.elementor-9686 .elementor-element.elementor-element-11f4f50 .service-wrapper.three .section-title a:hover {
	background-color: #FFB52A;
	padding: 13px 14px;
	border-radius: 10px;
}

.service-wrapper.three .section-title h2 span::before {
	content: "";
	position: absolute;
	top: 30px;
	left: 50%;
	transform: translateX(-50%);
	background-image: url(../gofly/assets/img/home3/vector/service-title-underline4.svg);
	width: 250px;
	height: 30px;
	background-size: cover;
	background-repeat: no-repeat;
}

.service-wrapper.three .section-title h2 {
    max-width: 600px;
}

/*====================================================================================
 Change to Destination cards and section in Widget Style 04 in EG Destinations Slider
 ===================================================================================== */
.home3-destination-section {
	background-image: url(../img/home3/home3-destination-bg.png), linear-gradient(180deg, rgba(242,241,236,0.7) 0%, rgba(242,241,236,0.9) 100%);
	background-size: cover;
	background-repeat: no-repeat;
	padding: 100px 0;
}

.destination-card2.two .destination-img {
	width: 305px;
	height: 305px;
	border-radius: 10px;
}

.destination-card2.two .destination-img img {
	width: 305px;
	height: 305px;
	border-radius: 10px;
}

.home3-destination-section .feature-and-rating-area .single-feature .icon {
	background-color: #FFB52A;
}

/*==============================
 Journey image pagination bullet
 ===============================*/
.package-card .package-img-wrap .slider-pagi-wrap .paginations .swiper-pagination-bullet.swiper-pagination-bullet-active {
	width: 25px;
	background-color: #FFCD6B;
}

/*==========================
 Journeys Card Modifications
 =========================== */
@media (min-width: 992px) and (max-width: 1199px) {
  .package-card {
    padding: 10px;
  }
}

.package-card .package-img-wrap .batch span {
	color: var(--white-color);
	font-family: var(--font-sora);
	font-weight: 600;
	font-size: 14px;
	line-height: 1;
	display: block;
	padding: 6px 14px;
	background-color: #FF3927;
	border-radius: 100px;
}

.package-card .package-img-wrap .batch span.yellow-bg {
	background-color: #FFCD6B;
	color: var(--title-color);
}

.package-card .package-content h5 a {
	color: var(--title-color);
	font-family: var(--font-reddit-sans);
	font-weight: 700;
	font-size: 20px;
	line-height: 1.4;
	transition: 0.5s;
}

.package-card .package-content .location-and-time .location a {
	color: var(--text-color);
	font-family: var(--font-sora);
	font-weight: 600;
	font-size: 14px;
	line-height: 1;
	transition: 0.5s;
}

.package-card .package-content .location-and-time span {
	color: var(--text-color);
	font-family: var(--font-sora);
	font-weight: 600;
	font-size: 14px;
	line-height: 1;
}

.package-card .package-content .btn-and-price-area .price-area h6 {
	color: var(--text-color);
	font-family: var(--font-sora);
	font-weight: 600;
	font-size: 14px;
	line-height: 1;
	margin-bottom: 10px;
	text-align: end;
}

.package-card .package-content .btn-and-price-area .price-area span {
	color: #DC780A;
	font-family: var(--font-sora);
	font-weight: 600;
	font-size: 25px;
	line-height: 1;
	display: flex;
	align-items: baseline;
	justify-content: end;
	gap: 5px;
	flex-wrap: wrap;
	background-color: #F2F1EC;
	padding: 3px 5px;
	border-radius: 5px;
}

.package-card .package-content .bottom-area ul li {
	display: flex;
	align-items: center;
	gap: 5px;
	color: var(--title-color);
	font-family: var(--font-sora);
	font-weight: 500;
	font-size: 14px;
	line-height: 1;
	position: initial;
}

.package-card .package-content .location-and-time .location a {
	color: #DC780A;
	font-family: var(--font-sora);
	font-weight: 600;
	font-size: 14px;
	line-height: 1;
	transition: 0.5s;
	/* background-color: var(--primary-color1); */
	/* padding: 5px 5px; */
	/* border-radius: 5px; */
}

.package-card:hover {
	padding: 10px;
	border-radius: 20px;
	border: 1px solid var(--borders-color);
	background-color: #F2F1EC;
}

.package-card .package-content .divider {
    fill: #DED6C8;
    width: 100%;
}

/*=============================
 Destination Page Modifications
 ============================== */
.section-title h2 {
	color: var(--title-color);
	font-family: var(--font-reddit-sans);
	font-size: 40px;
	font-weight: 800;
	line-height: 1.1;
	margin-bottom: 0;
}

.destination-dt-travel-season-section .travel-season-card .travel-season-top-area .travel-season-content span {
	font-family: var(--font-sora);
}

.destination-dt-travel-season-section .travel-season-card .travel-season-top-area .travel-season-content .highlights-area h6 {
	font-family: var(--font-sora);
}

.destination-dt-travel-season-section .travel-season-card .travel-season-top-area .travel-season-content .highlights-area ul li {
	font-family: var(--font-sora);
}

.destination-dt-travel-season-section .travel-season-card .note {
	font-family: var(--font-sora);
}

.section-title p {
	font-family: var(--font-sora);
}

.faq-wrap .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
	font-family: var(--font-sora);
}

.faq-wrap .accordion .accordion-item .accordion-header .accordion-button {
	font-family: var(--font-sora);
}

.destination-dt-travel-season-section .travel-season-card .note {
    font-family: var(--font-sora);
    background-color: #F2F1EC;
}

/*====================
 Counter Modifications
 ===================== */
.counter-section .single-counter .content .number h2, .counter-section .single-counter .content .number span {
	font-family: var(--font-sora);
}

.counter-section .single-counter .content span {
	font-family: var(--font-sora);
}

/*======================
 Blog Card Modifications
 ======================= */
.blog-card2 .blog-content h4 a {
	font-family: var(--font-reddit-sans);
	font-weight: 700;
}

.blog-card2.two .blog-content .blog-date {
	font-family: var(--font-sora);
}

.blog-card2 .blog-content p {
	font-family: var(--font-sora);
}


/*======================
 Journeys Modifications
 ======================= */
.breadcrumb-section .banner-content > span {
	font-family: var(--font-sora);
}

.breadcrumb-section .banner-content .batch span {
	font-family: var(--font-sora);
}

.tour-itinerary-area .itinerary-list .single-itinerary .location-title h5 {
	font-family: var(--font-sora);
}

h4 {
	font-weight: 700;
}

.tour-itinerary-area .itinerary-list .single-itinerary .tour-plan-wrap .accordion .accordion-item .accordion-header .accordion-button h6 {
	font-family: var(--font-sora);
}

.tour-itinerary-area .itinerary-list .single-itinerary .tour-plan-wrap .accordion .accordion-item .accordion-body {
	font-family: var(--font-sora);
}

.tour-itinerary-area .itinerary-list .single-itinerary .tour-plan-wrap .accordion .accordion-item .accordion-body .facilities-list li .single-item .facilities-title h6 {
	font-family: var(--font-sora);
}

.tour-itinerary-area .itinerary-list .single-itinerary .tour-plan-wrap .accordion .accordion-item .accordion-body .facilities-list li .single-item {
	font-family: var(--font-sora);
}

.tour-itinerary-area .itinerary-list .single-itinerary .tour-plan-wrap .accordion .accordion-item .accordion-body .facilities-list li a {
	font-family: var(--font-sora);
}

.customer-rating-area .rating-wrapper .rating-area > span {
	font-family: var(--font-sora);
}

.customer-rating-area .rating-wrapper .rating-area P {
	font-family: var(--font-sora);
}

.customer-rating-area .rating-wrapper .progress-list .progress-item > span {
	font-family: var(--font-sora);
}

.tour-itinerary-area .itinerary-title .expand-btn {
	font-family: var(--font-sora);
}

.primary-btn1 {
	font-family: var(--font-sora);
}


.elementor-10837 .elementor-element.elementor-element-25a2e1c .elementor-icon-box-title, .elementor-10837 .elementor-element.elementor-element-25a2e1c .elementor-icon-box-title a {
	font-family: var(--font-sora);
}

.elementor-10837 .elementor-element.elementor-element-25a2e1c .elementor-icon-box-description {
	font-family: var(--font-sora);
}

.elementor-10837 .elementor-element.elementor-element-a5b0144 .elementor-heading-title {
	font-family: var(--font-reddit-sans);
	font-size: 25px;
	font-weight: 700;
	color: #552e0e;
}

/*===================
 Gravity Forms Styling
 ===================== */
.nice-select {
	
}

/*===================
 Footer Modifications
 ==================== */
.blog-and-newsletter-section .newsletter-section .newsletter-wrapper {
	background-image: url(../img/home3/home3-newsletter-bg.png), linear-gradient(180deg, #CDEDD9 0%, #CDEDD9 100%);
	background-size: cover;
	background-repeat: no-repeat;
	padding: 45px 50px 55px;
	border-radius: 20px;
	text-align: center;
	position: relative;
	margin-bottom: -20px;
	z-index: 1;
}

.footer-noborder span a {
	color: var(--white-text-color);
	font-family: var(--font-sora);
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;
	transition: 0.5s;
}

.footer-noborder .elementor-icon-list-items li a span {
	color: var(--white-text-color);
	font-family: var(--font-sora);
	font-weight: 400;
	font-size: 16px;
	line-height: 1;
	transition: 0.5s;
}

.elementor-9622 .elementor-element.elementor-element-22770c76:not(.elementor-motion-effects-element-type-background), .elementor-9622 .elementor-element.elementor-element-22770c76 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    background-color: #552E0E;
    background-image: url("https://privatesafaris.co.ke/staging/wp-content/uploads/2026/04/psea_footer-bg.webp");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.progress-wrap .arrow {
	fill: #FFCD6B;
}

.progress-wrap svg.progress-circle {
	stroke: #FFCD6B;
	stroke-width: 4;
}

.footer-noborder p {
	font-family: var(--font-sora);
}