/*==================================================================== Custom CSS File for most of Desktop and Mobile look for Kipya Template Developed by Amazing LWEGATECH LTD team. ===================================================================**/ :root{ --kpy-font: "Arial", Helvetica, sans-serif; --kpy-primary: #0a8c44; --kpy-primary-rgb: rgba(10, 140, 68, 0.5); --kpy-secondary: #4b291f; --kpy-tertiary: #f4a300; --kpy-secondary-rgb: 253, 199, 11; --kpy-white: #ffffff; --kpy-white-rgb: 255, 255, 255; --kpy-black: #211F20; --kpy-black-rgb: 33, 31, 32; --kpy-green2: #65B84C; --kpy-green2-rgb: 101, 184, 76; --kpy-font-size: 20px; --kpy-font-small:16px; --kpy-regular: 400; --kpy-medium: 500; --kpy-bold: 700; --kpy-bolder:900; } *{ margin: 0; padding: 0; text-shadow: rgba(0, 0, 0, .01) 0 0 1px; scrollbar-width: thin; font-optical-sizing: auto; } html, body{ font-family: var(--kpy-font-6) !important; color: var(--kpy-black) !important; font-size: var(--kpy-font-size) !important; font-weight: var(--kpy-regular) !important; line-height: 1.6; min-height:100vh; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; font-optical-sizing: auto; width:100%; } h1,h2,h3,h4,h5,h6{font-family: var(--kpy-font-5);} h1 { font-size: 2.5rem; line-height: 1.2; } h2 { font-size: 2rem; line-height: 1.3; } h3 { font-size: 1.75rem; } h4 { font-size: 1.5rem; } h5 { font-size: 1.25rem; } h6 { font-size: 1rem; } h2{color:var(--kpy-primary);} a {color: var(--kpy-primary);transition: color 0.3s ease;text-decoration: none !important;} a:focus, button:focus, input:focus {outline: 0px solid var(--kpy-secondary);outline-offset: 2px;} .text-primary { color: var(--kpy-primary) !important; } .bg-primary { background-color: var(--kpy-primary) !important; } .btn {display: inline-block;padding: 0.75rem 1.5rem;border-radius: 4px;font-weight: var(--kpy-medium); text-align: center;transition: all 0.3s ease;} .btn-primary {background: var(--kpy-primary) !important;border: 1px solid var(--kpy-primary) !important;; color: var(--kpy-white) !important;} .btn-primary:hover {background: var(--kpy-green2) !important;} .wp-block-button__link{border-radius: 20px !important;transition: 0.4ms all;background:var(--kpy-primary);} .wp-block-button__link:hover{background:var(--kpy-white);color:var(--kpy-primary);border:solid 2px var(--kpy-primary);} .mt-1 { margin-top: 0.5rem !important; } .mt-2 { margin-top: 1rem !important; } /** Fade Effect **/ .fadeUp { opacity: 0; transform: translateY(30px); animation: fadeUp 0.8s ease-out forwards; } @keyframes fadeUp { to { opacity: 1; transform: translateY(0); } } /*background: linear-gradient(135deg, var(--kpy-white) 0%, #f8f9fa 100%); box-shadow: 0 4px 20px rgba(0,0,0,0.08);*/ /** ========================================================== Header Section ===========================================================**/ .finance-menu{font-family:var(--kpy-font);background:white} .top-bar{background:var(--kpy-primary);color:var(--kpy-white);padding:8px 0;font-size:16px} .top-contact span{margin-right:20px;font-weight:500}.top-contact i{margin-right:5px;color:var(--kpy-tertiary)} .top-social{text-align:right} .top-social a{color:var(--kpy-white);margin-left:12px;font-size:16px;transition:transform .3s,color .3s} .top-social a:hover{transform:translateY(-2px);color:var(--kpy-tertiary)} .main-nav{padding:0;position:relative;background:white;} .nav-container{display:flex;align-items:center;justify-content:space-between;padding:5px 0} .logo-container{flex:0 0 auto;margin-right:30px} .logo{height:55px;transition:all .3s ease;margin-right:100px} .nav-menu-container{display:flex;align-items:center;flex:1} .main-menu-wrapper{flex:1 1 auto} .main-menu{display:flex;list-style:none;margin:0;padding:0;align-items:center}.main-menu>li{position:relative;margin:0 3px} .main-menu>li>a{display:block;position:relative;background:transparent;color:var(--kpy-black);font-weight:var(--kpy-medium);padding:12px 35px;margin-right:5px;text-decoration:none;border-radius:30px;transition:all .4s cubic-bezier(0.175, 0.885, 0.32, 1.275);font-size:16px;overflow:hidden;border:1px solid rgba(0,0,0,0.1)} .main-menu>li>a::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:var(--kpy-primary);z-index:-1;transform:scaleX(0);transform-origin:right;transition:transform .4s ease;border-radius:30px} .main-menu>li>a::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:0;height:2px;background:var(--kpy-tertiary);transition:width .3s ease} .main-menu>li>a:hover{transform:translateY(-3px);color:var(--kpy-primary);box-shadow:0 5px 15px rgba(10,140,68,0.4)} .main-menu>li.current-menu-item>a{background:var(--kpy-primary);color:var(--kpy-white);transform:translateY(-3px);box-shadow:0 5px 15px rgba(10,140,68,0.4)} .main-menu>li.current-menu-item>a::after{width:70%;background:var(--kpy-tertiary)} .main-menu>li.dropdown>a::after{content:none} .main-menu>li.dropdown>a{padding-right:40px} .dropdown-menu{background:white;border:1px solid rgba(0,0,0,0.1);border-radius:15px;box-shadow:0 15px 40px rgba(0,0,0,0.25);padding:20px;min-width:280px;margin-top:10px;display:none;flex-wrap:wrap} .dropdown-menu.show{display:flex} .dropdown-menu::before{content:'';position:absolute;top:-10px;left:35px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid white} .dropdown-menu::after{content:'';position:absolute;top:-8px;left:37px;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid white} .dropdown-menu .dropdown-item{color:var(--kpy-black);padding:12px 18px;transition:all .4s cubic-bezier(0.175, 0.885, 0.32, 1.275);font-size:16px;white-space:nowrap;width:100%;margin-bottom:5px;position:relative;border:none;background:none;overflow:hidden;border-radius:8px} .dropdown-menu .dropdown-item::before{content:'▶';position:absolute;left:5px;top:50%;transform:translateY(-50%);opacity:0;transition:all .4s ease;font-size:10px;color:var(--kpy-primary)} .dropdown-menu .dropdown-item::after{content:'';position:absolute;left:0;top:0;width:0;height:100%;background:var(--kpy-primary);transition:width .4s ease;z-index:-1;border-radius:8px} .dropdown-menu .dropdown-item:hover{color:var(--kpy-white);transform: scale(1.02);box-shadow:0 3px 10px rgba(10,140,68,0.3)} .dropdown-menu .dropdown-item:hover::before{opacity:1;left:10px;color:var(--kpy-white)} .dropdown-menu .dropdown-item:hover::after{width:100%} .dropdown-menu .dropdown-header{color:var(--kpy-primary);font-weight:var(--kpy-bold);padding:10px 15px;border-bottom:1px solid rgba(0,0,0,0.1);margin-bottom:10px} .dropdown-item.active,.dropdown-item:active{color:var(--kpy-white);text-decoration:none;background-color:var(--kpy-primary)!important}.mega-menu{position:static} .mega-menu .dropdown-menu{width:100%;left:0;right:0;padding:30px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:30px} .mega-menu-content{display:grid;grid-template-columns:repeat(4,1fr);gap:30px} .mega-menu-column h5{color:var(--kpy-primary);margin-bottom:15px;font-weight:var(--kpy-bold);border-bottom:1px solid rgba(0,0,0,0.1);padding-bottom:10px} .mega-menu-column ul{list-style:none;padding:0;margin:0} .mega-menu-column ul li{margin-bottom:10px} .mega-menu-column ul li a{color:var(--kpy-black);text-decoration:none;transition:all .3s;display:block;padding:5px 0;border-radius:5px;padding-left:10px} .mega-menu-column ul li a:hover{color:var(--kpy-primary);padding-left:15px;background:rgba(10,140,68,0.05)} .nav-actions{display:flex;align-items:center;margin-left:20px} .search-btn{background:var(--kpy-primary);border:none;font-size:16px;color:var(--kpy-white);padding:10px 12px;border-radius:50%;cursor:pointer;transition:all .3s;margin-right:15px;box-shadow:0 3px 10px rgba(10,140,68,0.3)} .search-btn:hover{background:var(--kpy-primary);transform:scale(1.05);color:var(--kpy-white);box-shadow:0 5px 15px rgba(10,140,68,0.4)} .nav-toggle{display:none;flex-direction:column;background:var(--kpy-primary);border:none;width:30px;height:24px;justify-content:space-between;cursor:pointer;border-radius:4px;padding:4px} .nav-toggle span{display:block;height:3px;width:100%;background:var(--kpy-white);transition:all .3s;border-radius:2px} .finance-search-modal .modal-content{border-radius:12px;border:2px solid var(--kpy-primary);overflow:hidden;background:white} .finance-search-modal .modal-header{background:var(--kpy-primary);color:var(--kpy-white);border-bottom:none} .finance-search-modal .btn-close{filter:invert(1)} .finance-search-modal .btn-primary{background:var(--kpy-primary);border-color:var(--kpy-primary);border-radius:0 8px 8px 0} .finance-search-modal .form-control{border-radius:8px 0 0 8px;border-right:none;background:white;color:var(--kpy-black);border-color:var(--kpy-primary)} .finance-search-modal .form-control::placeholder{color:rgba(0,0,0,0.6)} .live-search-results { position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: 1px solid #ddd; border-top: none; z-index: 9999; max-height: 250px; overflow-y: auto; display: none; } .live-search-results ul { list-style: none; margin: 0; padding: 0; } .live-search-results li { padding: 10px; border-bottom: 1px solid #eee; } .live-search-results li:hover { background: #f5f5f5; } .live-search-results a { text-decoration: none; color: #333; display: block; } @media (min-width:992px){ .dropdown-menu li:nth-child(6)~li{width:50%} .dropdown-menu:has(li:nth-child(6)){width:500px;flex-direction:row} .dropdown-menu:has(li:nth-child(11)){width:750px} .dropdown-menu:has(li:nth-child(11)) li:nth-child(11)~li{width:33.333%}.dropdown-menu:has(li:nth-child(16)){width:1000px} .dropdown-menu:has(li:nth-child(16)) li:nth-child(16)~li{width:25%}} .main-nav.kpy-sticky{position:fixed;top:0;left:0;right:0;z-index:1000;background:white;backdrop-filter:blur(10px);box-shadow:0 2px 25px rgba(0,0,0,0.2)}.main-nav.kpy-sticky .logo{height:45px} .main-nav.kpy-sticky .sticky-logo{display:block!important} .main-nav.kpy-sticky .normal-logo{display:none!important}@media (max-width:991px){.nav-menu-container{position:relative} .main-menu-wrapper{position:absolute;top:100%;left:-60px;right:0;background:white;box-shadow:0 5px 20px rgba(0,0,0,0.25);z-index:1000;display:none;border-radius:0 0 15px 15px;border:2px solid var(--kpy-primary);border-top:none} .main-menu{flex-direction:column;align-items:stretch} .main-menu>li{margin:5px 0}.main-menu>li>a{clip-path:none;border-radius:8px;margin-bottom:0;border:1px solid rgba(0,0,0,0.1)} .nav-toggle{display:flex} .mega-menu-content{grid-template-columns:1fr} .dropdown-menu{position:static;box-shadow:none;border:1px solid rgba(0,0,0,0.1);border-radius:8px;margin-top:10px;width:100%!important} .dropdown-menu::before{display:none} .dropdown-menu li{width:100%!important}} @media (max-width:767px){ .top-bar .row{flex-direction:column;gap:10px } .top-contact,.top-social{text-align:center} .top-social a{margin:0 6px} .nav-container{padding:20px 0} .logo{height:45px!important;transition:all .3s ease;margin-right:50px} .main-menu>li>a{padding:10px 20px 12px 20px;font-size:13px} .top-bar{display:none}} /** ===================================================================== *search =======================================================================**/ .header-search input{visibility: hidden;} .header-search ul.search-dropdown{display: none;} .header-search label{position: relative;display: block;cursor: pointer;margin-top: -20px} .header-search input:checked~ul.search-dropdown{display: block;position: absolute;z-index: 119;} .search-dropdown .input-group{right:100%;flex-wrap: unset;margin-top:28px;} .search-dropdown ul li{list-style: none !important;} .search-dropdown .input-group input{visibility:visible;width: 600px !important;height: 60px;} .search-dropdown .input-group .btn-search{background:#0b5a5f;color:#fff;} #search-results {display: none;right: 100%;position: relative;background: rgba(255,255,255,0.93);padding: 1em; font-size: small;list-style: none;max-height: 300px;overflow-y: auto;width: 100%;border: 1px solid #ccc;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);} #search-results a{color:#125e63} .search-result-item {margin-bottom: 3px;padding: 5px;} .search-result-item h5 {margin: 0;font-size: 1.1em;} .search-result-item p {margin-top: 2px;color: #666;font-size: 0.9em;margin-bottom: 5px;} .search-result-item:hover{background: rgba(245, 227, 225, 0.92);} .navbar-toggler {border:0 !important;} /**modal search**/ .modal-search{background: rgba(0, 0, 0, 0.6);} .modal-search .modal-body{align-items: center;} .modal-search input{height: 60px;width: 600px;} .modal-search .input-group .btn-search{background: var(--kpy-primary) !important;color:#fff;height:60px;margin-top: 0px;} .modal-search #search-results {display: none;right: 0;position: relative;background: transparent; padding: 1em;list-style: none;width: 100%;border: 0px solid #ccc;color:#fff;} .modal-search #search-results a{color:#ff9;text-decoration:underline;} .modal-search .search-result-item {margin-bottom: 3px;padding: 5px;} .modal-search .search-result-item h5 {margin: 0;font-size: 1.15em;} .modal-search .search-result-item p {margin-top: 2px;color: #eee;font-size: 0.95em;margin-bottom: 5px;} .modal-search .search-result-item:hover{background: rgba(0, 175, 239, 0.139);} /** ========================================================== Main Slides ===========================================================**/ .btn-one { position: relative; display: inline-block; overflow: hidden; padding-left: 30px; padding-right: 30px; background-color: transparent; color: var(--kpy-black); font-size: 18px; line-height: 60px; font-weight: 500; text-transform: capitalize; border-radius: 0px; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; z-index: 2; } .btn-one:before { position: absolute; top: 110px; left: -50px; right: -50px; height: 170px; content: ""; background: var(--kpy-primary); -webkit-transform: translateY(-50px); transform: translateY(-50px); border-radius: 50%; transition-duration: 800ms; z-index: 1; } .btn-one:hover:before { top: 0%; left: -70px; right: -70px; } .btn-one:after { content: ""; position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; border-radius: 0px; background-color: #ffffff; opacity: 1; transform: scaleX(1.0); transition-duration: 800ms; z-index: -1; } .btn-one:hover:after { transform: scaleX(0); transition-duration: 1500ms; } .btn-one .txt { position: relative; z-index: 1; } .btn-one:hover, .btn-one:focus { color: #ffffff; } .btn-one i { position: relative; display: inline-block; padding-left: 5px; font-size: 12px; font-weight: 500; } .btn-btn { color: var(--kpy-white); background: var(--kpy-primary); border-radius: 0px; padding: 11px 24px; display: inline-block; box-shadow: inset 0 0 0 0 var(--kpy-black); -webkit-transition: ease-out 0.4s; -moz-transition: ease-out 0.4s; transition: ease-out 0.4s; } .btn-btn:hover { color: var(--kpy-white); box-shadow: inset 400px 0 0 0 var(--kpy-black); } /* Carousel Styles */ .carousel { position: relative; overflow: hidden; padding-left: 30px; padding-right: 30px; } .carousel-inner { position: relative; width: 100%; border-radius: 25px; overflow: hidden; } .carousel-item { position: relative; max-height: 700px; border-radius: 25px; height: 600px; } .carousel-item .image-layer { position: relative; width: 100%; height: 100%; border-radius: 25px; overflow: hidden; } .image-layer img { width: 100%; height: 100%; object-fit: cover; object-position: center; border-radius: 25px; } .carousel-item::after { content: ''; position: absolute; top: 0; left: 0; height: 100%; width: 100%; background: rgba(10, 140, 68, 0.4); border-radius: 25px; z-index: 1; } .carousel-capt { position: absolute; z-index: 3; top: 50%; left:630px; text-align: center; max-width: 700px; height: max-content; padding: 30px; transform: translate(-50%, -50%) translateY(30px); opacity: 0; transition: all 0.6s ease; background-color: rgba(var(--kpy-primary-rgb), 0.1); border-radius: 3px; } .carousel-item.active .carousel-capt{ transform: translate(-50%, -50%); opacity: 1; } .carousel-capt h2 { font-size: 42px; font-weight: 700; color: var(--kpy-white); margin-bottom: 1.5rem; font-family: var(--kpy-font-2); line-height: 1.15; text-shadow: 1px 1px 1px #000; text-transform: none; letter-spacing: 0.5px; transform: translateY(20px); opacity: 0; transition: all 0.6s ease 0.2s; text-align: center; align-items: center; justify-content: center; } .carousel-capt p { font-size: 18px; color: var(--kpy-white); margin-bottom: 2rem; text-shadow: 0 1px 3px rgba(0,0,0,.3); transform: translateY(20px); opacity: 0; transition: all 0.6s ease 0.3s; font-weight: 300; line-height: 1.4em; width: 100%; text-align: center; margin-left: auto; margin-right: auto; align-items: center; justify-content: center;} .carousel-item.active .carousel-capt h2, .carousel-item.active .carousel-capt p { transform: translateY(0); opacity: 1; } .carousel-control-prev, .carousel-control-next { display: none; } .carousel-indicator { position: absolute; z-index: 3; right: 60px; top: 50%; transform: translateY(-50%); left: auto; bottom: auto; flex-direction: column; margin: 0; width: auto; } .carousel-indicator [data-bs-target] { width: 12px; height: 12px; border-radius: 50%; margin: 8px 0; background-color: rgba(255, 255, 255, 0.5); border: none; transition: all 0.3s ease; display:none; } .carousel-indicator .active { background-color: var(--kpy-white); transform: scale(1.3); } .carousel-indicator [data-bs-target]:hover { transform: scale(1.2); background-color: var(--kpy-primary); } .carousel-capt .btn-one { margin: 0 auto; display: block; width: fit-content; } /* Responsive Design */ @media (max-width: 1200px) { .carousel-capt { width: 50%; } .carousel-indicator { right: 45px; } } @media (max-width: 992px) { .carousel { padding-left: 20px; padding-right: 20px; } .carousel-capt { width: 60%; } .carousel-capt h2 { font-size: 36px; } } @media (max-width: 768px) { .carousel { padding-left: 15px; padding-right: 15px; } .carousel-item { height: 60vh; } .carousel-capt { width: 75%;left: 180px; } .carousel-capt h2 { font-size: 28px; } .carousel-capt p { font-size: 16px; } .carousel-indicator { right: 30px; } .carousel-indicator [data-bs-target] { width: 10px; height: 10px; margin: 6px 0; } } @media (max-width: 576px) { .carousel { padding-left: 10px; padding-right: 10px; } .carousel-capt { width: 90%; padding: 20px; left:210px; } .carousel-capt h2 { font-size: 24px; margin-bottom: 0.5rem; } .carousel-capt p { margin-bottom: 1rem; font-size: 14px; } .carousel-indicators { right: 20px; } .carousel-indicators [data-bs-target] { width: 8px; height: 8px; margin: 5px 0; } } /*========================================================== Package tabs ==========================================================**/ /* Tabs Container */ .safari-packages-tabs { font-family: var(--kpy-font-2); margin-top: 20px; } /* Nav Tabs */ .safari-packages-tabs .nav-tabs { border-bottom: 2px solid var(--kpy-primary); justify-content: center; margin-bottom: 20px; } /* Tab Buttons */ .safari-packages-tabs .nav-tabs .nav-link { font-size: var(--kpy-font-size); font-weight: var(--kpy-bold); color: var(--kpy-black); padding: 10px 20px; border: none; border-radius: 6px 6px 0 0; transition: all 0.3s ease; background-color: #f5f5f5; margin-right: 20px; } /* Active / Hover State */ .safari-packages-tabs .nav-tabs .nav-link.active, .safari-packages-tabs .nav-tabs .nav-link:hover { background-color: var(--kpy-primary); color: var(--kpy-white); font-weight: var(--kpy-bold); border-radius: 6px 6px 0 0; } /* Tab Content */ .safari-packages-tabs .tab-content { background: var(--kpy-white); padding: 20px; } /* Inside content styling */ .safari-packages-tabs .tab-content h3 { font-family: var(--kpy-font-3); font-size: 22px; font-weight: var(--kpy-bold); color: var(--kpy-secondary); } /*========================================================== Home Experience Cards ==========================================================**/ .destination-cards-container { margin: 20px 0; } .destination-cards-heading { margin-bottom: 20px; text-align: center; color: var(--kpy-primary); font-size: 45px; } .destination-cards { display: flex; justify-content: center; align-items: center; gap: 45px; flex-wrap: nowrap; overflow-x: auto; padding: 10px 0; } .destination-card { width: 160px; height: 200px; border-radius: 60px; overflow: hidden; position: relative; flex-shrink: 0; transition: transform 0.3s ease, box-shadow 0.3s ease; box-shadow: 0 2px 8px rgba(0,0,0,0.1); } .destination-card:hover { transform: scale(1.05); box-shadow: 0 4px 12px rgba(0,0,0,0.2); } .destination-card img { width: 100%; height: 100%; object-fit: cover; display: block; } .destination-card p { position: absolute; bottom: 0; left: 0; right: 0; margin: 0; padding: 5px 8px; background: linear-gradient(transparent, rgba(0,0,0,0.7)); color: white; font-size: 18px; font-weight: bold; text-align: center; text-shadow: 1px 1px 2px rgba(0,0,0,0.8); overflow: hidden; text-overflow: ellipsis; } @media (max-width: 768px) { .destination-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; overflow-x: hidden; padding: 10px; } .destination-card { width: 100%; height: 120px; border-radius: 20px; } .destination-cards-heading { font-size: 35px; } } /*========================================================== Travel Card ==========================================================**/ .travel-cards-container { text-align: center; } .travel-cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; max-width: 1200px; margin: 0 auto; padding: 40px 20px; } .travel-card { position: relative; height: 350px; border-radius: 15px; overflow: hidden; box-shadow: 0 5px 20px rgba(0,0,0,0.15); transition: all 0.3s ease; cursor: pointer; } .travel-card:hover { transform: translateY(-10px); box-shadow: 0 15px 35px rgba(0,0,0,0.25); } .travel-card a { display: block; height: 100%; width: 100%; text-decoration: none; position: relative; color: inherit; } .travel-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center; background-repeat: no-repeat; transition: all 0.5s ease; } .travel-card:hover .travel-image { transform: scale(1.05); } .travel-overlay { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(transparent, rgba(0,0,0,0.8)); color: white; padding: 40px 25px 25px; text-align: center; transition: all 0.3s ease; } .travel-card:hover .travel-overlay { background: linear-gradient(transparent, rgba(0,0,0,0.9)); padding-bottom: 30px; } .travel-overlay h3 { margin: 0; font-size: 22px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; text-shadow: 2px 2px 4px rgba(0,0,0,0.5); line-height: 1.3; } .travel-card::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: 15px; border: 2px solid transparent; background: linear-gradient(45deg, #ff6b6b, #4ecdc4, #45b7d1, #96ceb4) border-box; -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; opacity: 0; transition: opacity 0.3s ease; } .travel-card:hover::after { opacity: 1; } @media (max-width: 1024px) { .travel-cards-grid { grid-template-columns: repeat(2, 1fr); gap: 25px; padding: 30px 20px; } } @media (max-width: 768px) { .travel-cards-grid { grid-template-columns: 1fr; gap: 20px; max-width: 500px; padding: 20px 15px; } .travel-card { height: 300px; } .travel-overlay h3 { font-size: 20px; } .travel-cards-container::before { font-size: 2rem; margin-bottom: 30px; } } @media (max-width: 480px) { .travel-card { height: 250px; } .travel-overlay { padding: 30px 20px 20px; } .travel-overlay h3 { font-size: 18px; } .travel-cards-container::before { font-size: 1.8rem; margin-bottom: 25px; } } /*========================================================== Partner Template Styles ==========================================================**/ .partner-container { max-width: 1200px; margin: 0 auto; padding: 40px 20px; } .partner-form-group input.error, .partner-form-group select.error, .partner-form-group textarea.error { border-color: #e74c3c; } .partner-form-group textarea { resize: vertical; min-height: 100px; } /* Form Submit */ .partner-form-submit { text-align: center; margin-top: 30px; } .partner-submit-btn { background: var(--kpy-primary); color: white; border: none; padding: 15px 30px; border-radius: 8px; font-size: 16px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 10px; transition: all 0.3s ease; } .partner-submit-btn:hover { background: var(--kpy-secondary); transform: translateY(-2px); } .partner-submit-btn svg { transition: transform 0.3s ease; } .partner-submit-btn:hover svg { transform: translateX(3px); } /* Shared styles for Benefits and Why Partner sections */ .partner-benefits-section, .why-partner-section { display: flex; flex-direction: column; gap: 30px; } .partner-benefits-card, .why-partner-content { background: white; border-radius: 12px; padding: 30px; box-shadow: 0 4px 20px rgba(0,0,0,0.1); } .benefits-header, .why-partner-text { margin-bottom: 25px; } .benefits-image, .partner-image-main { margin-top: 15px; height: 180px; overflow: hidden; border-radius: 8px; } .benefits-image img, .partner-image-main img { width: 100%; height: 100%; object-fit: cover; } .benefits-title, .why-partner-text h2 { color: var(--kpy-primary); font-size: 22px; margin-bottom: 0; font-weight: 700; } .benefit-item, .partner-reason { display: flex; align-items: flex-start; gap: 15px; margin-bottom: 25px; margin-top: 30px;} .benefit-item:last-child, .partner-reason:last-child { margin-bottom: 0; } .benefit-icon, .reason-icon { width: 45px; height: 45px; background: var(--kpy-primary); border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .benefit-icon i, .reason-icon i { color: white; font-size: 18px; } .benefit-text h4, .reason-content h4 { color: var(--kpy-primary); margin-bottom: 6px; font-size: 16px; font-weight: 600; } .benefit-text p, .reason-content p { color: #666; line-height: 1.5; margin: 0; font-size: 14px; } /* Partner Contact Card */ .partner-contact-card { background: #f8f9fa; border-radius: 12px; padding: 25px; } .partner-contact-card h4 { color: var(--kpy-primary); margin-bottom: 10px; font-size: 18px; font-weight: 600; } .partner-contact-card p { color: #666; margin-bottom: 20px; line-height: 1.5; font-size: 14px; } .partner-contact-info { display: flex; flex-direction: column; gap: 12px; } .contact-item { display: flex; align-items: center; gap: 10px; color: #555; font-size: 14px; } .contact-item i { color: var(--kpy-primary); width: 16px; } /* Partnership Overview */ .partnership-overview { margin-bottom: 60px; text-align: center; } .partner-intro { margin-bottom: 50px; } .partner-intro h2 { font-size: 36px; color: var(--kpy-primary); margin-bottom: 15px; font-weight: 700; } .partner-intro p { font-size: 18px; color: #666; max-width: 700px; margin: 0 auto; line-height: 1.6; } .partnership-types { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 50px; } .partnership-type-card { background: white; border-radius: 12px; padding: 30px; box-shadow: 0 4px 20px rgba(0,0,0,0.1); transition: transform 0.3s ease, box-shadow 0.3s ease; text-align: center; } .partnership-type-card:hover { transform: translateY(-5px); box-shadow: 0 8px 30px rgba(0,0,0,0.15); } .partner-type-icon { width: 60px; height: 60px; background: var(--kpy-primary); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; } .partner-type-icon i { color: white; font-size: 24px; } .partnership-type-card h3 { color: var(--kpy-primary); font-size: 20px; margin-bottom: 12px; font-weight: 600; } .partnership-type-card p { color: #666; margin-bottom: 20px; line-height: 1.6; } .partner-benefits { list-style: none; padding: 0; margin: 0; text-align: left; } .partner-benefits li { color: #555; padding: 5px 0; padding-left: 20px; position: relative; font-size: 14px; } .partner-benefits li:before { content: '✓'; color: var(--kpy-primary); font-weight: bold; position: absolute; left: 0; } /* Partner Form Layout */ .partner-form-card {background:#fff;border-radius:10px;padding:25px;box-shadow:0 3px 12px rgba(0,0,0,0.08);max-width:800px;margin:0 auto;} .partner-form-title {color:var(--kpy-primary);font-size:24px;margin-bottom:6px;font-weight:700;text-align:center;} .partner-form-subtitle {color:#666;margin-bottom:20px;line-height:1.5;text-align:center;font-size:14px;} .form-section {margin-bottom:25px;padding-bottom:20px;border-bottom:1px solid #eee;} .form-section:last-child {border-bottom:none;margin-bottom:0;padding-bottom:0;} .section-title {color:var(--kpy-primary);font-size:18px;margin-bottom:15px;font-weight:600;} .partner-form-row {display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:15px;} .partner-form-group {margin-bottom:15px;} .partner-form-group label {display:block;color:#333;font-weight:500;margin-bottom:6px;font-size:13px;} .partner-form-group label span {color:var(--kpy-primary);} .partner-form-group input,.partner-form-group select,.partner-form-group textarea {width:100%;padding:10px 12px;border:2px solid #e1e1e1;border-radius:6px;font-size:13px;transition:border-color 0.3s ease;box-sizing:border-box;} .partner-form-group input:focus,.partner-form-group select:focus,.partner-form-group textarea:focus {outline:none;border-color:var(--kpy-primary);} .partner-form-submit {text-align:center;} .partner-submit-btn {background:var(--kpy-primary);color:#fff;border:none;padding:12px 20px;border-radius:6px;cursor:pointer;font-weight:500;transition:background 0.3s ease;display:inline-flex;align-items:center;gap:6px;} .partner-submit-btn:hover {background:var(--kpy-secondary);} .partner-sections-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin: 40px 0; } @media (max-width: 768px) { .partner-sections-wrapper { grid-template-columns: 1fr; /* one column */ } } /* Success Popup */ .partner-success-popup { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 9999; display: flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; transition: all 0.3s ease; } .partner-success-popup.active { opacity: 1; visibility: visible; } .partner-success-content { background: white; padding: 40px; border-radius: 12px; text-align: center; max-width: 400px; transform: scale(0.8); transition: transform 0.3s ease; } .partner-success-popup.active .partner-success-content { transform: scale(1); } .partner-checkmark { width: 60px; height: 60px; margin: 0 auto 20px; } .partner-checkmark svg { width: 100%; height: 100%; } .partner-success-content h3 { color: var(--kpy-primary); font-size: 24px; margin-bottom: 15px; font-weight: 600; } .partner-success-content p { color: #666; margin-bottom: 25px; line-height: 1.6; } .partner-close-popup { background: var(--kpy-primary); color: white; border: none; padding: 12px 24px; border-radius: 6px; cursor: pointer; font-weight: 500; transition: background 0.3s ease; } .partner-close-popup:hover { background: var(--kpy-secondary); } /* Responsive Design */ @media (max-width: 1024px) { .why-partner-content { grid-template-columns: 1fr; gap: 30px; } .why-partner-stats { grid-template-columns: repeat(2, 1fr); gap: 20px; } } @media (max-width: 768px) { .partner-container { padding: 20px 15px; } .partnership-types { grid-template-columns: 1fr; gap: 20px; } .partnership-type-card { padding: 25px; } .partner-intro h2 { font-size: 28px; } .partner-intro p { font-size: 16px; } .why-partner-section { padding: 30px 20px; } .why-partner-text h2 { font-size: 26px; } .why-partner-stats { grid-template-columns: 1fr; gap: 15px; } .partner-stat { padding: 20px 15px; } .stat-number { font-size: 28px; } .partner-form-card { padding: 25px; } .partner-form-title { font-size: 24px; } .partner-form-row { grid-template-columns: 1fr; gap: 15px; } .section-title { font-size: 18px; } .partner-reason { flex-direction: column; align-items: center; text-align: center; gap: 10px; } .reason-content h4 { font-size: 16px; } .benefit-item { flex-direction: column; align-items: center; text-align: center; gap: 10px; } .benefit-text h4 { font-size: 15px; } } @media (max-width: 480px) { .partner-success-content { padding: 25px; margin: 20px; } .partner-success-content h3 { font-size: 20px; } .partner-intro h2 { font-size: 24px; } .partnership-type-card { padding: 20px; } .partner-type-icon { width: 50px; height: 50px; } .partner-type-icon i { font-size: 20px; } .why-partner-section { padding: 25px 15px; } .partner-form-card { padding: 20px; } .partner-form-title { font-size: 22px; } .partner-submit-btn { padding: 12px 25px; font-size: 15px; } .partner-benefits-card, .partner-contact-card { padding: 20px; } .benefits-title { font-size: 20px; } } /* Animation Classes */ .fade-in { animation: fadeIn 0.6s ease-in; } @keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } .slide-in-right { animation: slideInRight 0.6s ease-out; } @keyframes slideInRight { from { opacity: 0; transform: translateX(30px); } to { opacity: 1; transform: translateX(0); } } /*========================================================== # Waves ==========================================================**/ body.fl-builder-edit .wave {min-height:50px;} .wave .fl-photo-content.fl-photo-img-svg {overflow:hidden} body.fl-builder-edit .wave .fl-photo-content.fl-photo-img-svg {background:rgb(255 255 255 / 0.5);} .wave.white path {fill:#fff;} .wave.blue_light path {fill:var(--blue-light);} .wave.blue_lighter path {fill:var(--blue-lighter);} .wave.blue_lightest path {fill:var(--blue-lightest);} .wave.green_dark path {fill:var(--green-dark);} .wave.green_light path {fill:var(--green-light);} body:not(.fl-builder-edit) .wave svg.even { left: -20vw; } body:not(.fl-builder-edit) .wave .fl-photo {height:auto} body:not(.fl-builder-edit) .wave .fl-photo-content.fl-photo-img-svg { overflow:hidden; width:100%; position: absolute; left:0; z-index:1; height: auto; transform:translateY(250px) } .fl-photo-img-svg {height:auto;width: initial;position: relative;margin-top: -50px;z-index:50;} .wave :not(.fl-photo-img-svg) {width:initial} body:not(.fl-builder-edit) footer .wave.top .fl-photo-content.fl-photo-img-svg {top: 2px;} body:not(.fl-builder-edit) .wave.bottom .fl-photo-content.fl-photo-img-svg {bottom: -5px;} body:not(.fl-builder-edit) .wave svg { position:relative; width:120vw; height: 15vh; transition:transform 1.75s ease-out; } body:not(.fl-builder-edit) .wave.resize svg { transition:all 0s ease-out;} body:not(.fl-builder-edit) .wave svg.even { left:-20vw; } body:not(.fl-builder-edit) .wave svg.odd { left:0vw; } body:not(.fl-builder-edit) .wave.blue_light path {fill:#E8F4FC} body:not(.fl-builder-edit) .wave.white path {fill:#fff} .wave.pushdown {transform: translateY(1px);} .wave.pullup {transform: translateY(-1px);} /*========================================================== Single Page Packages ==========================================================**/ .safari-package-container{margin:0 auto;padding:0;} .package-hero{position:relative;width:100%;height:400px;margin-bottom:40px;overflow:hidden;border-radius:0;} .package-hero-bg{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;} .package-hero-bg img{width:100%;height:100%;object-fit:cover;display:block;} .package-hero::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(180deg,rgba(0,0,0,0.1) 0%,rgba(0,0,0,0.3) 60%,rgba(0,0,0,0.7) 100%);z-index:2;} .package-hero-overlay{position:absolute;bottom:0;left:0;right:0;z-index:3;color:var(--kpy-white);text-align:center;padding:40px 20px;} .package-title{font-size:2.8em;margin-bottom:25px;font-weight:bold;text-shadow:2px 2px 8px rgba(0,0,0,0.5);line-height:1.2;} .package-meta{display:flex;justify-content:center;flex-wrap:wrap;gap:15px;margin-top:20px;} .package-meta-item{background:rgba(255,255,255,0.25);padding:12px 18px;border-radius:30px;display:flex;align-items:center;gap:8px;backdrop-filter:blur(15px);border:1px solid rgba(255,255,255,0.2);box-shadow:0 4px 15px rgba(0,0,0,0.2);transition:all 0.3s ease;} .package-meta-item:hover{background:rgba(255,255,255,0.35);transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,0.3);} .meta-icon{font-size:1.2em;} .meta-value{font-weight:600;font-size:0.95em;} .package-content-wrapper{padding:0 20px;} .package-description h2,.package-itinerary h2,.package-costs h2{color:var(--kpy-primary);font-size:2em;margin-bottom:20px;position:relative;padding-bottom:10px;} .package-description h2::after,.package-itinerary h2::after,.package-costs h2::after{content:'';position:absolute;bottom:0;left:0;width:60px;height:3px;background:linear-gradient(90deg,#8B4513,#D2B48C);border-radius:2px;} .package-description{background:var(--kpy-white);padding:30px;border-radius:15px;box-shadow:0 8px 25px rgba(139,69,19,0.1);border:1px solid #f0f0f0;margin-bottom:30px;} .safari-accordion{background:var(--kpy-white);border-radius:15px;overflow:hidden;box-shadow:0 8px 25px rgba(139,69,19,0.1);border:1px solid #f0f0f0;} .accordion-item{border-bottom:1px solid #e8e8e8;transition:all 0.3s ease;} .accordion-item:last-child{border-bottom:none;} .accordion-header{padding:25px 30px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(90deg,#f8f6f3,#ffffff);transition:all 0.3s ease;position:relative;} .accordion-header::before{content:'';position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,#8B4513,#D2B48C);transform:scaleY(0);transition:transform 0.3s ease;} .accordion-header:hover::before{transform:scaleY(1);} .accordion-header:hover{background:linear-gradient(90deg,#f5f3f0,#fafafa);transform:translateX(5px);} .accordion-day{display:flex;flex-direction:column;gap:5px;} .day-number{font-size:0.9em;font-weight:bold;color:#8B4513;text-transform:uppercase;letter-spacing:1px;} .day-title{font-size:1.2em;font-weight:600;color:#333;} .accordion-icon{color:#8B4513;transition:transform 0.3s ease;display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:rgba(139,69,19,0.1);border-radius:50%;} .accordion-item.active .accordion-icon{transform:rotate(180deg);background:rgba(139,69,19,0.2);} .accordion-content{max-height:0;overflow:hidden;transition:all 0.3s ease;background:var(--kpy-white);} .accordion-item.active .accordion-content{max-height:550px;} .accordion-body{padding:30px;background:linear-gradient(135deg,#fafafa 0%,#f8f8f8 100%);border-top:2px solid #f0f0f0;} .accordion-body p{margin:0;line-height:1.8;color:#555;font-size:1.05em;} .costs-tabs-container{background:var(--kpy-white);border-radius:15px;box-shadow:0 8px 25px rgba(139,69,19,0.1);border:1px solid #f0f0f0;overflow:hidden;position:sticky;top:20px;} .costs-nav-tabs{background:linear-gradient(90deg,#f8f6f3,#ffffff);margin-bottom:0;padding:0 20px;display:flex;flex-wrap:nowrap;justify-content:space-around;} .costs-nav-tabs .nav-item{flex:1;display:flex;} .costs-nav-tabs .nav-link{border:none;border-radius:0;color:#666;font-weight:600;padding:15px 20px;transition:all 0.3s ease;position:relative;background:transparent;flex:1;text-align:center;white-space:nowrap;} .costs-nav-tabs .nav-link::after{content:'';position:absolute;bottom:-3px;left:50%;width:0;height:3px;background:#8B4513;transition:all 0.3s ease;transform:translateX(-50%);} .costs-nav-tabs .nav-link:hover{color:#8B4513;background:rgba(139,69,19,0.05);} .costs-nav-tabs .nav-link.active{color:#8B4513;background:rgba(139,69,19,0.1);} .costs-nav-tabs .nav-link.active::after{width:100%;} .costs-tab-content{padding:0;} .costs-list{padding:25px;} .costs-title{font-size:1.4em;font-weight:bold;margin-bottom:20px;color:#333;} .inclusive-costs .costs-title{color:#228B22;} .exclusive-costs .costs-title{color:#dc3545;} .cost-items{list-style:none;padding:0;margin:0;} .cost-item{display:flex;align-items:flex-start;gap:12px;padding:12px 0;transition:all 0.3s ease;} .cost-item:last-child{border-bottom:none;} .cost-item:hover{background:rgba(139,69,19,0.03);padding-left:10px;margin-left:-10px;margin-right:-10px;border-radius:8px;} .inclusive-costs .cost-item i{color:#228B22;font-size:1.1em;margin-top:2px;flex-shrink:0;} .exclusive-costs .cost-item i{color:#dc3545;font-size:1.1em;margin-top:2px;flex-shrink:0;} .cost-item span{font-size:0.95em;line-height:1.5;color:#555;} .standard-safari-form-container{max-width:600px;margin:40px auto;padding:0;font-family:var(--kpy-font);} .standard-safari-form-wrapper{background:linear-gradient(135deg,var(--kpy-primary) 0%,var(--kpy-secondary) 100%);overflow:hidden;position:relative;} .standard-safari-header{text-align:center;padding:40px 30px 30px;color:var(--kpy-white);position:relative;z-index:2;} .standard-safari-header h1{margin:0 0 10px;font-size:2.2em;font-weight:var(--kpy-bold);text-shadow:0 2px 8px rgba(0,0,0,0.3);background:linear-gradient(45deg,var(--kpy-white),#f0f0f0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;} .standard-safari-header p{margin:0;font-size:1.1em;opacity:.95;font-weight:var(--kpy-regular);} .standard-safari-package-info{background:rgba(255,255,255,0.15);margin:20px 30px 0;padding:20px;border-radius:15px;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.2);position:relative;z-index:2;} .standard-safari-package-name{font-size:1.3em;font-weight:var(--kpy-medium);color:var(--kpy-white);margin:0;text-align:center;text-shadow:0 2px 4px rgba(0,0,0,0.3);} .standard-safari-form-content{background:var(--kpy-white);padding:40px;position:relative;z-index:2;} .standard-safari-form-group{margin-bottom:25px;} .standard-safari-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;} .standard-safari-label{display:block;margin-bottom:8px;font-weight:var(--kpy-medium);color:var(--kpy-black);font-size:.95em;letter-spacing:.5px;} .standard-safari-input,.standard-safari-select,.standard-safari-textarea{width:100%;padding:12px 16px;border:2px solid #e9ecef;border-radius:10px;font-size:1em;transition:all .3s ease;background:var(--kpy-white);box-sizing:border-box;} .standard-safari-input:focus,.standard-safari-select:focus,.standard-safari-textarea:focus{outline:none;border-color:var(--kpy-primary);box-shadow:0 0 0 3px rgba(var(--kpy-green2-rgb),0.2);transform:translateY(-1px);} .standard-safari-textarea{resize:vertical;min-height:100px;} .required{color:var(--kpy-tertiary);font-weight:var(--kpy-bold);} .standard-safari-submit-section{text-align:center;margin-top:40px;padding-top:30px;border-top:1px solid #e9ecef;} .standard-safari-btn{background:linear-gradient(135deg,var(--kpy-primary) 0%,var(--kpy-secondary) 100%);color:var(--kpy-white);border:none;padding:16px 40px;font-size:1.1em;font-weight:var(--kpy-medium);border-radius:50px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:1px;box-shadow:0 8px 25px rgba(10,140,68,0.3);position:relative;overflow:hidden;} .standard-safari-btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.3),transparent);transition:left .5s;} .standard-safari-btn:hover::before{left:100%;} .standard-safari-btn:hover{transform:translateY(-3px);box-shadow:0 15px 40px rgba(10,140,68,0.4);} .standard-safari-btn:active{transform:translateY(-1px);} .standard-submit-note{margin-top:15px;font-size:.9em;color:#6c757d;font-style:italic;} .standard-form-section{margin-bottom:35px;} .standard-form-section h3{margin:0 0 20px;color:var(--kpy-black);font-size:1.3em;font-weight:var(--kpy-medium);padding-bottom:10px;border-bottom:2px solid var(--kpy-primary);position:relative;} .standard-form-section h3::after{content:'';position:absolute;left:0;bottom:-2px;width:50px;height:2px;background:linear-gradient(45deg,var(--kpy-tertiary),#ff8e53);border-radius:1px;} @media(max-width:768px){.standard-safari-form-container{margin:20px auto;padding:0 15px;}.standard-safari-form-content{padding:30px 20px;}.standard-safari-grid{grid-template-columns:1fr;gap:15px;}.standard-safari-header h1{font-size:1.8em;}} .standard-safari-success-message{background:linear-gradient(135deg,#d4edda 0%,#c3e6cb 100%);color:#155724;padding:15px 20px;border-radius:10px;margin-bottom:20px;border-left:4px solid #28a745;font-weight:var(--kpy-medium);} .standard-safari-error-message{background:linear-gradient(135deg,#f8d7da 0%,#f5c6cb 100%);color:#721c24;padding:15px 20px;border-radius:10px;margin-bottom:20px;border-left:4px solid #dc3545;font-weight:var(--kpy-medium);} .standard-field-error{border-color:#dc3545!important;box-shadow:0 0 0 3px rgba(220,53,69,0.1)!important;} .error-message{color:#dc3545;font-size:.9em;margin-top:5px;font-weight:var(--kpy-medium);} @media(max-width:768px){.safari-package-container{padding:0;}.package-hero{height:300px;}.package-hero-overlay{padding:30px 15px;}.package-title{font-size:2.2em;}.package-meta{gap:10px;}.package-meta-item{padding:10px 15px;font-size:0.9em;}.package-content-wrapper{padding:0 15px;}.accordion-header{padding:20px;flex-direction:column;align-items:flex-start;gap:15px;}.accordion-icon{align-self:center;}.costs-tabs-container,.booking-container{position:static;margin-top:20px;}.costs-nav-tabs{padding:0 15px;}.costs-nav-tabs .nav-link{padding:12px 15px;font-size:0.9em;}.costs-list{padding:20px;}} @media(max-width:480px){.package-hero{height:250px;}.package-title{font-size:1.8em;}.package-meta{flex-direction:column;align-items:center;gap:8px;}.accordion-header{padding:15px;}.accordion-body{padding:20px;}.costs-nav-tabs .nav-link{padding:10px 12px;}.costs-list{padding:15px;}.booking-container{padding:20px;} } /*========================================================== Packages Cards ==========================================================**/ .safari-packages-shortcode {margin:30px 0;} .packages-shortcode-grid {display:grid;gap:25px;grid-template-columns:repeat(4,1fr);} .package-shortcode-card {background:white;border-radius:15px;overflow:hidden;box-shadow:0 8px 25px rgba(139,69,19,0.1);transition:all 0.3s ease;border:1px solid #f0f0f0;position:relative;height:400px;} .package-shortcode-card:hover {transform:translateY(-5px);box-shadow:0 15px 35px rgba(139,69,19,0.15);} .package-shortcode-image {height:100%;overflow:hidden;} .package-shortcode-image img {width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease;} .package-shortcode-card:hover .package-shortcode-image img {transform:scale(1.05);} .package-shortcode-content {position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,0.85) 30%,transparent);padding:20px;color:white;transition:all 0.3s ease;height:120px;overflow:hidden;} .package-shortcode-card:hover .package-shortcode-content {height:100%;background:rgba(0,0,0,0.5);padding-top:30px;} .package-shortcode-title {margin:0 0 12px 0;font-size:1.2em;position:absolute;bottom:20px;left:20px;right:20px;transition:bottom 0.3s ease;} .package-shortcode-card:hover .package-shortcode-title {position:relative;bottom:0;left:0;right:0;} .package-shortcode-title a {color:white;text-decoration:none;font-weight:600;transition:color 0.3s ease;} .package-shortcode-title a:hover {color:#d4af37;} .package-shortcode-meta {display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px;opacity:0;transform:translateY(10px);transition:all 0.3s ease 0.1s;} .package-shortcode-card:hover .package-shortcode-meta {opacity:1;transform:translateY(0);} .shortcode-duration,.shortcode-location {background:rgba(255,255,255,0.2);padding:4px 10px;border-radius:12px;font-size:0.85em;font-weight:600;color:#fff;backdrop-filter:blur(5px);} .package-shortcode-excerpt {color:#ddd;line-height:1.5;margin-bottom:15px;font-size:0.95em;opacity:0;transform:translateY(10px);transition:all 0.3s ease 0.2s;} .package-shortcode-card:hover .package-shortcode-excerpt {opacity:1;transform:translateY(0);} .package-shortcode-button {display:inline-block;background:#0a8c44;color:white;padding:8px 18px;text-decoration:none;border-radius:20px;font-weight:600;font-size:0.9em;transition:all 0.3s ease;opacity:0;transform:translateY(10px);transition:all 0.3s ease 0.3s;} .package-shortcode-card:hover .package-shortcode-button {opacity:1;transform:translateY(0);} .package-shortcode-button:hover {background:linear-gradient(135deg,#A0522D 0%,#8B4513 100%);transform:translateY(-1px);color:white;} @media (max-width:768px){.packages-shortcode-grid{grid-template-columns:1fr!important;gap:20px;}.package-shortcode-content{padding:15px;}.package-shortcode-card{height:350px;}} /*========================================================== #About Page Intro Sections ==========================================================**/ .intro-sections {max-width: 1200px; margin: 0 auto; padding: 60px 20px; overflow: hidden;} .intro-sections .wp-block-columns {margin-bottom: 120px; display: flex; align-items: center; position: relative; } .intro-sections .wp-block-column {margin: 0; padding: 0; position: relative; } .intro-sections .wp-block-column.text-column {padding: 40px; background: #ffffff; border-radius: 15px; box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1); z-index: 2; } .intro-sections .wp-block-column.image-column { border-radius: 15px; overflow: hidden; z-index: 1;} .intro-sections img {width: 100%; height: 100%; min-height: 350px; object-fit: cover; display: block; transition: transform 0.6s ease;} .intro-sections .wp-block-columns:not(.even-layout) .image-column {margin-right: -60px; } .intro-sections .wp-block-columns:not(.even-layout) .text-column {margin-left: 60px; } .intro-sections .wp-block-columns.even-layout .text-column {margin-right: -60px; z-index: 3; } .intro-sections .wp-block-columns.even-layout .image-column {margin-left: 60px; } .intro-sections .wp-block-columns {opacity: 0; transition: all 0.8s ease-out;} .intro-sections .wp-block-columns:not(.even-layout) { transform: translateX(-100px);} .intro-sections .wp-block-columns.even-layout {transform: translateX(100px);} .intro-sections .wp-block-columns.animate-in {opacity: 1; transform: translateX(0);} .intro-sections h2, .intro-sections h3 {color: #2c3e50; margin-bottom: 20px; font-size: 2.2rem; font-weight: 600; line-height: 1.2;} .intro-sections p {color: #5a6c7d; line-height: 1.6; margin-bottom: 20px; font-size: 1rem;} .intro-sections .wp-block-button {margin-top: 20px;} .intro-sections .wp-block-button__link {background: #6b8a7a; color: #fff; padding: 12px 30px; border-radius: 15px; text-decoration: none; font-weight: 500; text-transform: uppercase; letter-spacing: 0.5px; transition: all 0.3s ease; border: none; cursor: pointer;} .intro-sections .wp-block-button__link:hover {background: #5a7968;transform: translateY(-2px);box-shadow: 0 4px 12px rgba(107, 138, 122, 0.3);} /* MOBILE RESPONSIVENESS */ @media (max-width: 768px) { .intro-sections {padding: 40px 15px;} .intro-sections .wp-block-columns {margin-bottom: 60px; flex-direction: column;} .intro-sections .wp-block-columns .image-column, .intro-sections .wp-block-columns .text-column {margin: 0 !important; width: 100%; } .intro-sections .wp-block-column.text-column {padding: 30px 20px; order: 2; } .intro-sections .wp-block-column.image-column {border: 1; margin-bottom: -30px !important; } .intro-sections h2, .intro-sections h3 {font-size: 1.8rem;} .intro-sections .wp-block-columns {transform:translateY(50px);} .intro-sections .wp-block-columns.animate-in {transform: translateY(0);}} /*========================================================== # Back to top button ==========================================================**/ .back-to-top { position: fixed; visibility: hidden; opacity: 0; left: 15px; bottom: 15px; z-index: 99999; background: var(--kpy-primary); width: 40px; height: 40px; border-radius: 4px; transition: all 0.4s; } .back-to-top i { font-size: 24px; color: #fff; line-height: 0; } .back-to-top:hover { background: var(--kpy-secondary); color: #fff; } .back-to-top.active { visibility: visible; opacity: 1; } /*========================================================== # Contact Page ==========================================================**/ /* Contact Us Styles */ .alt-contact-container {max-width:1400px;margin:-90px auto 100px;padding:0 20px;position:relative;z-index:2;} .alt-contact-layout {display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:30px;margin-top:80px;} .alt-contact-info-col,.alt-contact-form-col,.alt-contact-map-col {display:flex;flex-direction:column;} .alt-contact-info-card,.alt-contact-form-card,.alt-contact-map-card {background:var(--kpy-white);border-radius:10px;box-shadow:0 10px 30px rgba(var(--kpy-black-rgb),0.05);padding:30px;height:100%;} .alt-contact-info-title,.alt-form-title,.alt-map-title {font-family:var(--kpy-font-3);font-size:1.8rem;margin-bottom:20px;position:relative;padding-bottom:15px;color:var(--kpy-primary); font-weight:500;} .alt-contact-info-title:after,.alt-form-title:after,.alt-map-title:after {content:'';position:absolute;bottom:0;left:0;width:50px;height:3px;background:var(--kpy-secondary);} .alt-contact-info-item {display:flex;align-items:flex-start;margin-bottom:25px;} .alt-contact-icon {flex-shrink:0;width:50px;height:50px;background:rgba(var(--kpy-primary-rgb),0.1);border-radius:50%;display:flex;align-items:center;justify-content:center;margin-right:15px;} .alt-contact-icon svg {width:24px;height:24px;} .alt-contact-text h4 {font-size:1.1rem;margin-bottom:5px;color:var(--kpy-black);font-family:var(--kpy-font);} .alt-contact-text p {margin:0;color:var(--kpy-grey);line-height:1.5;} .alt-contact-hours {margin-top:40px;padding-top:20px;border-top:1px solid rgba(var(--kpy-black-rgb),0.1);} .alt-contact-hours h4 {font-size:1.1rem;margin-bottom:10px;color:var(--kpy-black);font-family:var(--kpy-font);} .alt-contact-hours p {margin:0;color:var(--kpy-grey);line-height:1.6;} .alt-contact-social {margin-top:auto;padding-top:30px;} .alt-contact-social h4 {font-size:1.1rem;margin-bottom:15px;color:var(--kpy-black);} .alt-social-icons {display:flex;gap:10px;} .alt-social-icon {width:40px;height:40px;border-radius:50%;background:rgba(var(--kpy-primary-rgb),0.1);color:var(--kpy-primary);display:flex;align-items:center;justify-content:center;transition:all 0.3s ease;text-decoration:none;} .alt-social-icon:hover {background:var(--kpy-primary);color:var(--kpy-white);} .alt-form-subtitle {color:var(--kpy-grey);margin-bottom:25px;} .alt-form-group {margin-bottom:20px;} .alt-form-group label {display:block;margin-bottom:8px;font-weight:500;color:var(--kpy-black);} .alt-form-group label span {color:var(--kpy-primary);} .alt-form-group input,.alt-form-group textarea {width:100%;padding:12px 15px;border:1px solid rgba(var(--kpy-black-rgb),0.1);border-radius:5px;font-family:inherit;font-size:1rem;transition:all 0.3s ease;} .alt-form-group input:focus,.alt-form-group textarea:focus {outline:none;border-color:var(--kpy-primary);box-shadow:0 0 0 3px rgba(var(--kpy-primary-rgb),0.1);} .alt-form-row {display:flex;gap:20px;} .alt-form-half {flex:1;} .alt-form-submit {margin-top:30px;} .alt-submit-btn {display:inline-flex;align-items:center;justify-content:center;padding:12px 25px;background:var(--kpy-primary);color:var(--kpy-white);border:none;border-radius:5px;font-weight:500;font-size:1rem;cursor:pointer;transition:all 0.3s ease;} .alt-submit-btn svg {margin-left:8px;transition:transform 0.3s ease;} .alt-submit-btn:hover {background:#08823c;} .alt-submit-btn:hover svg {transform:translateX(3px);} .alt-map-container {height:300px;border-radius:8px;overflow:hidden;margin-bottom:20px;} .alt-map-container iframe {width:100%;height:100%;border:none;} .alt-directions-btn {display:inline-flex;align-items:center;padding:8px 15px;background:rgba(var(--kpy-primary-rgb),0.1);color:var(--kpy-primary);border-radius:5px;font-weight:500;transition:all 0.3s ease;text-decoration:none;} .alt-directions-btn svg {margin-left:5px;} .alt-directions-btn:hover {background:var(--kpy-primary);color:var(--kpy-white);} .alt-contact-success-popup {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(var(--kpy-black-rgb),0.7);display:flex;align-items:center;justify-content:center;z-index:9999;opacity:0;visibility:hidden;transition:all 0.3s ease;} .alt-contact-success-popup.active {opacity:1;visibility:visible;} .alt-success-content {background:var(--kpy-white);padding:40px;border-radius:10px;text-align:center;max-width:400px;position:relative;transform:translateY(20px);transition:all 0.3s ease;} .alt-contact-success-popup.active .alt-success-content {transform:translateY(0);} .alt-checkmark {width:80px;height:80px;margin:0 auto 20px;} .alt-checkmark svg {width:100%;height:100%;} .alt-success-content h3 {font-size:1.5rem;margin-bottom:10px;color:var(--kpy-primary);} .alt-success-content p {margin-bottom:20px;color:var(--kpy-grey);} .alt-close-popup {background:var(--kpy-primary);color:var(--kpy-white);border:none;padding:8px 20px;border-radius:5px;cursor:pointer;transition:all 0.3s ease;} .alt-close-popup:hover {background:#08823c;} /* Responsive Styles */ @media (max-width:1200px){.alt-contact-layout{grid-template-columns:1fr 1fr;}.alt-contact-map-col{grid-column:span 2;margin-top:30px;}} @media (max-width:768px){.alt-contact-layout{grid-template-columns:1fr;}.alt-contact-map-col{grid-column:span 1;}.default-title{font-size:2.5rem;}} @media (max-width:480px){.alt-form-row{flex-direction:column;gap:0;}.header-wrap1{padding:100px 0 60px;} .large-img img{display:none;} .smaller-img img{display:none;} } /** ========================================================== Container CSS ===========================================================**/ @media (min-width: 1200px) { .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1140px!important; } } /** ========================================================== Homepage Intro Section ===========================================================**/ .experience-heading{color: var(--kpy-primary);font-size: 45px; text-align:center;} .home-intro h1{color:var(--kpy-primary);font-size:45px;} /*.home-intro h1::first-letter{text-decoration: underline;text-decoration-color:var(--kpy-primary);padding-bottom:5px;font-size:45px;}*/ .home-intro p{width:100%;margin:auto;font-size:var(--kpy-font-size);} .popular-packages img{height:350px;object-fit:cover;border-radius:10px;} .popular-packages .package-info {margin-top:-150px;margin-left:5px; color:var(--kpy-white);text-shadow:3px 3px 5px rgba(0, 0, 0, 0.5);} .popular-packages .package-info p{background:rgba(10, 140, 68, 0.5);} .call-to-action{ background: url(https://lwegatech.net/brecosafaris/wp-content/uploads/2025/08/Breco-Safaris-scaled.jpg); background-size: cover; background-attachment: fixed; height:300px; color:var(--kpy-white); } .home-first-relaxer{background:var(--kpy-primary);color:var(--kpy-white);height:300px;align-items:center;} .smaller-img{margin-top:-350px;} .large-img img{border:solid 3px var(--kpy-white); margin-top:30px;} /** ========================================================== Single Article Page ===========================================================**/ .post-content { box-shadow: 3px 3px 17px 0 rgba(0,0,0,.05); padding: 20px; border-radius: 6px; background: linear-gradient(0deg,rgba(223, 223, 223, 0.03) 20%,#fff 70%,#fff 100%); } .post-content h1 { font-size: 26px; font-weight: 700; color: #000; margin-bottom: 0px; } .post-content img { width: 100%; height: 500px; object-fit: cover; margin-bottom: 20px; } .post-content p { margin: 0 0 1.6875rem; } .post-content h3 {font-size:1.25rem;} .post-content img { width: 100%; height: auto; } p.author { line-height: 3; border-bottom: dotted 1px #eee; margin-bottom: 2rem; color: #062e85; } p.post-meta { position: relative; color: #fec679; font-size: 20px; margin: -18px 0 25px; } p.post-meta i { margin-right: 10px; } .newsletter h2 { font-size: 36px; font-weight: 700; color: #062e85; text-align: center; margin-bottom: 2.5rem; } .about-side .post-thumbnail img { width: 100%; height: 150px; object-fit: cover; } .about-side .card-body h5 { font-size: 16px; } .about-side .card-body .catz { font-size: 12px; color: #cd7312; } .about-intro{padding-top:50px;padding-bottom:30px;} .about-intro h2{font-weight:700;} .about-intro h5{color:#cd7312;margin-bottom:0;} .about-intro img{border-radius: 10px; } /** ========================================================== Other Page ===========================================================**/ .header-wrap-programs{height:300px; padding-top: 150px;position: relative;color: #fff;} .page-titlez{color: #fff;background-color:#062e85;width: 45%;padding: 30px 50px;} .page-titlez .entry-title{font-weight:800;} .page-titlez .breadcrumb{font-size:12px;font-weight:400!important;} .page-titlez .breadcrumb a{color:#cd7312;} .about-programz .container{width: 65%;margin:0 auto;margin-top:60px;margin-bottom:40px;} .header-wrap1{min-height: 400px;position: relative;color: #fff;} .default-title{font-size: 50px;font-weight: 700;color: #fff;margin-top:200px;} .header-wrap1 .entry-title h1{ color: #fff;font-size: 45px;font-weight: 700 !important;width: auto;max-width: 100%; text-align: center;box-sizing: border-box;} .header-wrap1 .breadcrumb{font-size: 12px;color: #eee;} .header-wrap1 .breadcrumb a{color:rgb(220, 169, 16);} .kpy-reduced-container{width:75% !important;margin:0 auto;padding-top:10px;padding-bottom: 30px;} .header-programs{min-height:500px;position:relative;overflow:hidden;} .header-programs .overlay {position:absolute;height:100%;width:100%;top:0;left:0;background:linear-gradient(to right, rgba(70, 31, 14, 0.451), rgba(70, 31, 14, 0.12));color:white;display:flex;align-items:center;justify-content:center;box-sizing:border-box;z-index: 9;} .header-programs h1{font-weight: 700;text-shadow: 0 0 20px #000;width: 100%;} .header-programs p{text-shadow: 0 0 20px #000;} .header-programs .breadcrumb{font-size: 12px;color: #ff0;} .header-programs .breadcrumb a{color:#ff9;} .about-us-page{padding-top:50px;padding-bottom:20px;} .about p::first-letter { font-size: 40px; /* makes the first letter bigger */ font-weight: bold; /* optional, makes it stand out */ float: left; /* optional, gives a drop-cap effect */ margin-right: 5px; /* spacing between the letter and text */ line-height: 1; color:var(--kpy-primary);/* keeps the letter aligned nicely */ } .about-mv{padding-top:20px;padding-bottom:30px;} .about-mv h5{background-color: var(--kpy-secondary);padding: 0.3rem 0.8rem;border-radius: 20px;width: fit-content;font-size: 85%;margin-bottom:-2px;} .about-mv h2{font-weight:700;margin-top:0px;} .mv{border-top: 5px solid var(--kpy-secondary);box-shadow: 2px 3px #00000012;padding: 20px;border-radius: 10px;height: auto;background: var(--kpy-green2);color: var(--kpy-white);} .mv h3{font-weight:700;} .mv .wp-block-list{list-style-type:none;padding-left:5px;} .mv .wp-block-list li{padding-top:5px;padding-bottom:5px;} .mv .wp-block-list li a{color:var(--kpy-white);} .objective{border-left: 3px solid var(--kpy-secondary);padding: 0.3rem 0.8rem;color:var(--kpy-green2);background: rgba(var(--kpy-secondary-rgb),0.1);} .impacti{min-height: 300px;color: #000;background-color: rgba(0, 0, 255, 0.13); padding: 30px;border-radius: 10px;display: flex;border: 1px solid rgba(0, 0, 255, 0.11);align-items: center;} .impacti h4{font-weight:700;} .newz-card img{width: 100%;height:250px;object-fit: cover;} .newz-card .kipya-post-title{color: #000;font-weight:800;font-size:20px;} .newz-card a{color: #000 !important;} .bg-dark h2 {font-weight: 700;font-size: 50px;} .bg-dark h2::after { content: "";display: block;margin:10px auto 0;width: 100px;height: 10px;background-color: #cd7312;} /** ========================================================= Event Details - Canvas ===============================================================**/ .kpy_event_details { height: calc(100vh - 6px ); padding: 20px 30px 20px 25px; margin-bottom: 6px; } .kpy_event_details img.wp-post-image { height: 200px !important; } .kpy_event_details .offcanvas-header { padding: 10px 10px 0; } .kpy_event_details .offcanvas-title { font-size: 20px; font-weight: 500; line-height: 2; color: #F72331; border-bottom: dotted 1px #eee; } .kpy_event_details .time, .kpy_event_details .location { color: #F72331; font-weight: 500; } .kpy_event_details .btn-close { width: 35px; height: 35px; display: inline-block; text-align: center; border: 1px solid transparent; position: relative; cursor: pointer; transition: all .2s; top: 0; } /** ========================================================== Upcoming Events Page ===========================================================**/ .kpy_events .card{min-height:300px;} .kpy_events img {width: 100%; height: 150px; object-fit: cover;} .kpy_events .date {font-size: 13px;font-weight: 500; color: #F72331; margin-bottom: 1rem;} .kpy_events h3 {font-size: 17px;font-weight: 500;color: #333;overflow: hidden; text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;line-clamp: 3; -webkit-box-orient: vertical;} .kpy_events .location {color: #F72331;} .kpy_event .descr{overflow: hidden; text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;line-clamp: 3; -webkit-box-orient: vertical;} .kpy_event img{width: 200px;height:auto;object-fit:cover} .upcoming-events{background-color: rgba(101, 93, 93, 0.05);padding:30px 15px;font-size:var(--kpy-font-small) !important;} .upcoming-events h2{color: #5EC401;font-weight: 600;margin-bottom: 20px;} /**=================================================== *Photo Gallery ====================================================**/ .gallery-grid .card-img-top{height: 200px; object-fit: cover;} .gallery-grid h5{font-family:var(--kpy-font)} .allgallery img{height:300px;width: 100%; object-fit: cover;object-position: top;} .allgallery .card-body h3{font-size:15px;font-family:var(--kpy-font);} .allgallery .card-body:hover{background: var(--kpy-primary);transition:.5s all;} .allgallery .card-body:hover h3{color:#fff;} .mygallery .ksmall{height: 200px;width: 300px; object-fit: cover;object-position: top;} .about-side h5{font-family:var(--kpy-font);} /** ========================================================= TEAM section ===============================================================**/ .team{padding-right: 15px;} .team .card{min-height: 320px;margin-bottom: 2rem !important;} .team .post-thumbnail img{height:400px;width:100%;object-fit: cover;object-position: top;filter: grayscale(100%);-webkit-filter: grayscale(100%);} .team .team-details{padding: 10px 10px 20px;margin:0 auto;text-align: center;position: absolute;bottom: 0;background-image: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));width: 100%;color: #fff;} .team-details h4 {font-size:26px; font-weight: 500;} .team-details p {font-size: 15px;margin-bottom: 10px;} .team .team-details .btn-outline-primary{color: #fff;font-size: 14px;padding: 5px 20px;border: solid 1px #fff;border-radius: 50px;} .team .team-details .btn-outline-primary:hover{border:1px solid #062E85 !important;color:#fff;background-color:#062E85;} .member-details img{height:400px;width:100%;object-fit: cover;object-position: top;} .member-details .btx{margin-left: 90%; margin-top: 10px;} .member-details h4, .partner-details h4{font-weight: 500; font-size: 25px !important; line-height: 1.5;} .member-details .modal-body span::after, .partner-details .modal-body span::after {border-bottom: 2px solid #eee; padding-bottom:10px;margin-bottom: 10px;} .member-details .modal-body p.title,.partner-details .modal-body p.title{border-bottom: dotted 2px #eee; color:#F72331;} .modal.show .modal-dialog {padding: 20px; background: #fff;} .modal-content {max-height: 400px; overflow-y: auto;} /** ========================================================= PARTNERS section ===============================================================**/ .partners{padding: 15px 10px;} .partner{display: flex;overflow: hidden;position: relative;} .partner .card{min-height: 100px; white-space: nowrap;animation: marquee-animation 10s linear infinite;} .partner img{height: 100px; object-fit: contain;object-position: center; display: grid; gap: 10px; padding: 10px;width: 200px;} @keyframes marquee-animation { 0% { transform: translateX(0); } 100% { transform: translateX(-100%); }} .marquee a {animation: marquee-animation 5s linear infinite;} .partnerlist img{width:100%;height:100px;object-fit: contain;object-position: center;} .urreno_assoc img {width:100%;height: auto;} .urreno_assoc h3{font-size:1rem;font-family: 'Roboto', sans-serif;letter-spacing: -.5px;} .urreno_assoc .card {height:200px; padding:15px; margin-bottom:20px;} .all_partners .card{min-height: 150px;} .all_partners img{height: 100px;width:auto;object-fit: cover;margin: 0 auto;display:block;} /** ========================================================= NEWSLETTER section ===============================================================**/ .newsletter { background-image: linear-gradient(to bottom, #fff, #fff, #fff, #fffffff0, #ffffffe8, #fff3, #fff0, #fff0, #fff0, #fff0, #fff0, #fff0),url(../images/NGO-Forum-Members.jpg); min-height: 600px; background-position: top; background-repeat: no-repeat; padding: 3rem 0 0; background-size: auto; } .newsletter .form-control, .newsletter .btn-info { font-size: 16px; padding: 7px 30px; border: solid 2px #F72331; border-radius: 50px; font-weight: 500; } .newsletter .btn-info { background-color: #F72331; color: #fff; } .newsletter .form-control { background-color: #ffffffcf; color: #F72331; } .newsletter-form .form-control::placeholder, .contact-pg p a { color: #F72331; } .newsletter .newsletter-desc { font-size:20px; font-weight:500; } /** ============================================================ Error 404 Page Not Found CSS =============================================================**/ .Error_404 {overflow: hidden; padding:80px 0 120px;} .Error_404 .error_pic {width: 35%; float: left; text-align: center;} .Error_404 .error_pic i {color: #F72331; font-size: 250px; line-height: 250px; margin-right: .2em; text-align: center; font-variant: normal; text-transform: none; margin-left: .2em;} .Error_404 .error_desk {width: 65%; float: left; padding-top: 40px;} .Error_404 .error_desk h2 {font-size: 55px; line-height: 60px;color: #F72331;font-weight: 500;} .Error_404 .error_desk h4 {font-size: 28px; line-height: 30px;} .Error_404 .error_desk p .check {line-height: 45px; font-size: 16px;} .Error_404 .error_desk p .button {padding: 13px 20px; margin: 0; border-radius: 5px; display: inline; margin-left: 10px; box-shadow: inset 0 0 0 0;} .Error_404 .error_desk p .button:hover{color:#f9f9f9; text-decoration: none; background: #F72331;} a.button, a.tp-button {transition:.2s all; background: transparent; color: #F72331; border:solid 2px;} .wp-block-ub-tabbed-content-tab-title strong {font-weight:500!important;} /* Hide when loaded */ body.kipya-loaded .kipya-loader { opacity: 0; pointer-events: none; } /** ============================================================ Footer CSS =============================================================**/ /* footer */ .footer {background-color: #000; color:#ccc; padding: 2rem 0 0rem; background-repeat: no-repeat; background-size: cover; margin-bottom: 0; background-position: top center; font-size:14px; opacity: 0.95; } .footer a {color:inherit;} .footer-menus h3, .footer-contacts h3, .footer-links h3{font-weight: 700;font-size: 22px;} .footer-menus li::before{font-family: "bootstrap-icons"; content: "\F285";margin-right:5px;} .footer-menus li a{color: #ccc;} .footer-policy ul li{list-style-type: none;display: inline-block;padding-right: 5px;font-size: 18px;} .footer .footer-top { border-bottom: dotted .5px #E6E6E6; padding-bottom: 1rem; margin-bottom:0.5rem; display:flex;justify-content:center; } .footer .footer-logo img { margin-top: 10px; margin-bottom: 1rem; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; width: 130px; } .footer .footer-top h4 { font-size:22px; margin-bottom:5px; text-align: center; line-height: 2.5; font-weight: 500;border-bottom:solid 1px var(--kpy-white); width:60%;margin:auto;} .footer ul { padding-left: 0; display: block; list-style-type: none; line-height: 1.8; margin-bottom: 2rem; } .footer .member-ft {background: #fff; border-radius: 15px; padding: 5px 10px; margin-bottom: 0;} .form-control {border-radius:0!important;} .footer .wp-block-button__link{background-color: var(--kpy-primary);padding: 5px 20px;} .footer .copyright { font-weight: 300; font-size: 11px; text-align: center;} .footer .copyright a {color:#ddd;} .footer .footer-top .socials{list-style: none !important;} .footer .footer-top .socials li{background-color: var(--kpy-primary);} .footer .footer-top .socials li:hover{background-color: var(--kpy-secondary);} .footer .footer-top .socials li::before {font-family:unset;content: "";margin-right: 0px;} /*------------------------------------*\ RESPONSIVE \*------------------------------------*/ @media only screen and (max-width: 480px) { .menu-section{height:220px;} .smaller-img{margin-top:-20px;margin-left:-5px;} .wrapper .mainz { width:100%; height:100%; float:left; padding: 15px; background-color: transparent; } .topbar{display: none !important;} .carousel-item{height: 400px; border-radius: 25px;} .menu-section .navbar-toggler {color:var(--kpy-white);} .menu-section img {height: 70px;width: auto;object-fit: cover;} .carousel-item img {height: 400px;width:100%; object-fit: cover; object-position: top; border-radius: 25px;} .main-slider .swiper-slide { position: relative;height:400px;object-fit: cover;} .video-slide{position: relative;top: 0;left: 0;width: 100%;height: 400px;object-fit: cover;} @media only screen and (max-width: 767px) {.fl-photo-img-svg{ height: auto; width: 400px; position: relative; margin-top: -20px; z-index: 50;} .offcanvas{background-color: rgba(var(--kpy-green2-rgb), 0.912) !important;} .offcanvas-body {padding: 0px !important;} .sticky-header { padding:10px 0; display: none;} .header-wrap-services .page-title {width: 95%;} .menu-section .main-header-menu {margin-left: auto;} .menu-section img {margin-top: 0;} #offcanvasExample { max-width: 400px; padding: 15px; margin: auto; width:100%; } .offcanvas-body ul li { font-size: 20px; font-weight: 600; margin-bottom: 0px; color: #0b5a5f;width: 100%; } .offcanvas-body ul li .dropdown-toggle::after { margin-left: 0.55em; float: right; margin-top: 10px; content: "\F282"; font-family: bootstrap-icons !important; font-style: normal; font-variant: normal; text-transform: none; border:none!important; } .offcanvas-body .dropdown-menu { border: none; padding: 5px; width: 100%; border-left: 1px solid #eee;background-color: rgba(10, 10, 10, 0.912) !important; } .offcanvas-body ul.dropdown-menu li a, .offcanvas-body ul.dropdown-menu li a.nav-link { color:#f9f9f9; font-weight:400; } .dropdown-item { padding: 5px; font-size: 17px; } .menu-section .menu-item .nav-link {padding-left: 10px !important;width: 100%;} .header-wrap-services .page-title h1.entry-title {font-size: 28px;} .header-wrap-services .overlay {padding: 0 0 0 10px;line-height: 1.2;} .breadcrumb {display: block !important;font-size: 11px;} .carousel-caption h2 {font-size: 30px;margin-top: 30px;} .carousel-caption p {font-size: 14px;font-weight: 400;width: 100%} .carousel-caption .btn-lg{font-size: 1.025rem;} .kpy-intro .content .photo img {height: auto;} .kpy-pkges h2 { font-size: 38px;} .kpy-pkges p {width: 90%;} .footer-menus ul{columns: 1;column-gap: 20;} .default-title {font-size: 36px;} .sticky-header, .menu-section { padding:10px 0; } .menu-section .member-btn a {padding:3px 15px;} .menu-section .main-header-menu {margin-left: auto;} .sticky-header img {margin-top:0;} .menu-section img { height: auto;} .home-intro-bottom .card {margin-top: unset;} .menu-section .menu-item .nav-link.active, .menu-section .menu-item .nav-link:hover {color: var(--kpy-secondary);} .sticky-header i.bi-list { color:#333!important; } .footer .footer-logo img { margin-top: 0; padding: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; } .main-slider .main-slider-content .big-title h2 { font-size:24px; } .main-slider .main-slider-content .text p { font-size:14px; line-height:inherit; } .main-slider .main-slider-content__inner, .focus-areas .focus-area-items { width:100%; } .main-slider__nav, .focus-areas h1, .nhp-news h1, .nhp-numbers h1 { display:none; } .nhp-news .nhp-news-feed {padding: 0 20px;} .main-slider .swiper-slide { height:400px; } .main-slider .container { padding-top:150px; } .nhp-intro,.nhp-prog, .focus-areas, .nhp-numbers, .nhp-news,.page-content{ padding:30px 20PX!important; } .footer { padding:10px;} .breadcrumb{display:none!important;} .header-search input:checked~ul.search-dropdown{display: block;position: absolute;z-index: 119;} .header-search ul.search-dropdown {display: none;} .search-dropdown .input-group {right: 75%;margin-top: 40px;} .search-dropdown .input-group input{visibility:visible;width: 250px !important;height: 60px;} .menu-section .member-btn a {margin-left: 0px;} /**modal search**/ .modal-search input{height: 60px;width: 320px;} .modal-search .input-group .btn-search{background: var(--kpy-primary);color:#fff;} .modal-search #search-results {display: none;right: 0;position: relative;background: var(--kpy-primary); padding: 1em;list-style: none;width: 100%;border: 0px solid #ccc;color:var(--kpy-white);} .nhp-pubs {padding:3rem 0} .pub-item {margin-bottom:20px} .nhp-numbers .nhp-cta-box .wp-block-button__link {padding:5px 10px;font-size: 15px;} .focus-area-items .focus-heading h4 {font-size:18px;} .nhp-pubs .nhp-pubs-content, .nhp-numbers .numbers-cont{width:95%; margin:auto;} .nhp-numbers .numbers-cont .nhp-cta {width:100%;} .team .team-details{padding:20px 30px;} .offcanvas{width: 350px !important;} .menu-section .navbar-nav {align-items: flex-start;gap: 0.2rem;} /*.menu-section .menu-item .nav-link {height:40px;display:flex;align-items: unset;}*/ .header-wrap-services .page-title {width: 100%;} .header-wrap-services .overlay {padding: 5%;} .header-wrap-services .page-title h1.entry-title {font-size: 26px;font-weight: 600;} .service-content-area{background-color: rgba(0, 129, 92, 0.07);background-image: unset;} .home-intro .wp-block-button__link {margin-bottom: 15px;} .about-page {width: 100%;} .about-page .wp-block-image img {height: 100% !important;} .about-page .experience, .experience2{displafy: none !important;} .about-page .wp-block-spacer{display: none;} .home-services h2 {font-size: 30px;margin-top: 1.6rem;} .collapse.navbar-collapse:not(.show) {display: block !important;} .post-content { padding: unset;} .about-mv .container { width: 100%;} .header-wrap .overlay {padding: 0 0 0 5px;} .header-wrap-services {min-height: 400px;} .pub-meta-item { flex-direction: column; } .pub-meta-label { margin-bottom: 5px; } .footer .footer-top .footer-contacts {margin-top: 0.5rem;} .home-banner .wp-block-columns {width: 95%;} .home-banner h2{font-size: 35px;} .kpy-reduced-container {width: 100% !important;} .kpy-all-news h3 {font-size: 26px;} .topbar {background: linear-gradient(to right, rgba(var(--kpy-white-rgb),0.5) 0%, rgba(var(--kpy-green2-rgb),0.99)) 100%;} } @media only screen and (max-width: 1024px) and (min-width: 768px) { .menu-section .menu-item .nav-link {font-size: 16px;} .carousel-item{height: 600px; border-radius: 25px;} .carousel-item img {height: 600px;width:100%; object-fit: cover; object-position: top; border-radius: 25px;} .main-slider .swiper-slide { position: relative;height:400px;object-fit: cover;} .video-slide{position: relative;top: 0;left: 0;width: 100%;height: 600px;object-fit: cover;} .carousel-caption{bottom:unset !important;max-width: 650px;background-color: rgba(var(--kpy-black-rgb),0.25);} .carousel-caption h2{font-size: 38px;text-transform: inherit;font-weight: 700;letter-spacing: 0.5;line-height: 1.15;text-shadow: 1px 1px 1px #000;} .carousel-caption p{font-size: 18px;font-weight: 300;} .about-us-page {padding-top: 20px;padding-bottom: 10px;} .kpy-intro h2 {font-size: 40px;} } @media only screen and (min-width:1140px) { } @media only screen and (min-width:1440px) { .carousel-item{height: 800px; border-radius: 25px;} .carousel-item img {height: 800px;width:100%; object-fit: cover; object-position: top; border-radius: 25px;} .kpy-news .card {min-height: 400px;} } @media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-resolution:144dpi) { } /*------------------------------------*\ TYPOGRAPHY \*------------------------------------*/