@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');
    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        text-decoration: none;
        border: none;
        outline: none;
        scroll-behavior: smooth;
        font-family: 'Poppins', sans-serif;
    }
    
     :root {
        --bg-color: #DADDC5;
        --second-bg-color: #F1EFEC;
        --text-color: #ffffff;
        --another: #b86338;
        --main-color: #1E460F;
    }
    
    a {
        text-decoration: none;
    }
    
    img {
        width: 100%;
    }
    
    html {
        font-size: 62.8%;
        overflow-x: hidden;
    }
    /* li {
        list-style: none;
    } */
    
    nav ul,
    li {
        transition: .3s ease;
        text-decoration: none;
        align-items: center;
    }
    
    .sidebar li {
        list-style: none;
    }
    
    .para-heading {
        list-style: none;
        font-size: 20px;
        padding: 10px;
    }
    
    .park-content {
        color: #F1E2B7;
        font-size: 20px;
    }
    
    .lake-content {
        font-size: 20px;
        color: #F1E2B7;
    }
    
    .strong {
        color: yellow;
    }
    
    nav {
        background-color: #2E6613;
        padding: 10px 10px;
        display: flex;
        top: 0;
        width: 100%;
        align-items: center;
        justify-content: space-between;
        position: fixed;
        height: 80px;
        z-index: 999;
        transition: .3s ease;
    }
    
    nav ul {
        transition: .3s ease;
        display: flex;
        gap: 30px;
    }
    
    nav ul,
    a,
    i {
        color: #F1E2B7;
        font-size: 20px;
        cursor: pointer;
    }
    
    body {
        background: var(--main-color);
        color: var(--text-color);
    }
    
    .logo-heading {
        text-transform: uppercase;
        cursor: pointer;
        font-size: 2.5rem;
        color: yellow;
    }
    
    .logo-heading:hover {
        color: var(--text-color);
    }
    
    .sidebar a:hover {
        color: var(--text-color);
    }
    
    .active {
        border-bottom: 2px solid yellow;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
        padding: 5px;
    }
    
    #menu-icon {
        font-size: 3.6rem;
        color: var(--text-color);
        cursor: pointer;
    }
    
    section {
        min-height: 100vh;
        padding: 10rem 9% 2rem;
    }
    
    .home {
        position: relative;
        display: flex;
        margin-left: auto;
        margin-right: auto;
        justify-content: center;
        align-items: center;
        animation: change 30s infinite ease-out;
    }
    
    .home-content h3 {
        color: yellow;
        margin-top: 40px;
        text-align: center;
        font-size: 20px;
    }
    
    .home-content h1 {
        margin-bottom: 20px;
        text-align: center;
        line-height: 20rem;
        font-size: 100px;
    }
    
    .destination-plan {
        color: yellow;
        margin-bottom: 20px;
        margin-top: 10px;
        position: absolute;
        top: 85%;
        left: 50%;
        transform: translate(-50%, -50%);
        display: inline-block;
        font-size: 20px;
        align-items: center;
        padding: 20px;
        text-align: center;
        background-color: #2E6613;
        border-radius: 60px;
        justify-content: center;
    }
    
    .arrow-down {
        color: yellow;
        position: absolute;
        bottom: 0;
        margin: 0 auto;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    
    .btn {
        display: inline-block;
        padding: 1rem 2.8rem;
        border-radius: 4rem;
        background: var(--main-color);
        transition: .5s ease;
        letter-spacing: .2rem;
        color: #F1E2B7;
        text-transform: uppercase;
        margin-top: 1rem;
        margin-bottom: 3rem;
        padding: 10px;
        margin-left: 10px;
    }
    
    .card img {
        height: 350px;
        object-fit: cover;
    }
    
    .card-content h1 {
        color: #b86338;
    }
    
    .btn:hover {
        box-shadow: 0 0 .5rem yellow;
    }
    
    .contactheading {
        text-align: center;
        font-size: 4rem;
        color: #F1E2B7;
    }
    
    .heading {
        text-align: center;
        font-size: 4rem;
        color: #F1E2B7;
    }
    
    .visionp {
        color: #2E6613;
    }
    
    .servivces h2 {
        margin-bottom: 5rem;
        justify-content: center;
        font-size: 2rem;
    }
    
    .services-container {
        margin-top: 2rem;
        grid-template-columns: repeat(3, 1fr);
        display: grid;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        gap: 3.8rem;
    }
    
    .services {
        background-color: #2E6613;
    }
    
    .service-listings {
        line-height: 40px;
    }
    
    .portfolio-box img {
        width: 200px;
        height: 200px;
        object-fit: cover;
    }
    
    .services-box {
        background: var(--bg-color);
        padding: 3rem;
        border-radius: 5rem;
        border: .2rem solid var(--bg-color);
        height: 500px;
        transition: .5s ease;
    }
    
    .services-box:hover {
        background-color: var(--bg-color);
        transform: scale(1.02);
        box-shadow: 0 0 1rem yellow;
    }
    
    .services-box i {
        font-size: 7rem;
        color: var(--main-color);
    }
    
    .services-box h1 {
        margin: 10px 0px;
        color: #A86022;
        font-size: 24px;
    }
    
    .services-box h3 {
        margin-top: 20px;
        font-size: 18px;
    }
    
    .ceo img {
        width: 400px;
        height: 300px;
        align-items: center;
        margin: 0 auto;
        background-size: cover;
        border-radius: 150px;
        padding: 30px;
    }
    
    .about-content h1 {
        color: yellow;
        font-size: 35px;
    }
    
    .ceop {
        color: #F1E2B7;
        font-size: 25px;
        line-height: 35px;
    }
    
    .ceo-heading {
        font-size: 30px;
        margin-top: 20px;
        text-align: center;
        color: #F1E2B7;
    }
    
    .ceo {
        background-color: var(--main-color);
        align-items: center;
        margin-top: 30px;
        gap: 40px;
        display: flex;
        justify-content: space-between;
    }
    
    .send-btn {
        padding: 15px;
        background-color: #2E6613;
        color: #F1E2B7;
        border-radius: 30px;
        font-size: 15px;
    }
    
    .send-btn:hover {
        cursor: pointer;
        box-shadow: 0 0 5px yellow;
    }
    
    .ceo-container {
        display: flex;
        flex-direction: column;
        padding: 10px;
    }
    
    .services-box p {
        font-size: 2.6rem;
        font-size: large;
    }
    
    .services-box h3 {
        color: var(--main-color);
    }
    
    .projects {
        background-color: var(--main-color);
    }
    
    .projects h2 {
        margin-bottom: 2rem;
    }
    
    .portfolio-container {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        align-items: center;
        gap: 2rem;
    }
    
    .portfolio-container .portfolio-box {
        position: relative;
        border-radius: .2rem;
        /* box-shadow: 0 0 1rem var(--bg-color); */
        overflow: hidden;
        display: flex;
    }
    
    .portfolio-box img {
        width: 100%;
        height: 400px;
        transition: .5s ease;
        background-size: cover;
        object-fit: cover;
    }
    
    .portfolio-box:hover img {
        transform: scale(1.1)
    }
    
    .portfolio-box .portfolio-layer {
        width: 100%;
        height: 100%;
        left: 0;
        position: absolute;
        bottom: 0;
        background: linear-gradient(rgba(0, 0, 0, .5), #dcaf85);
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 0 4rem;
        transform: translateY(100%);
        transition: .5s ease;
        text-align: center;
    }
    
    .portfolio-box:hover .portfolio-layer {
        transform: translateY(1);
    }
    
    .portfolio-layer h4 {
        font-size: 3rem;
    }
    
    .portfolio-layer p {
        font: 1.6rem;
        margin: .3rem 0 1rem;
    }
    
    .portfolio-layer a {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        width: 5rem;
        height: 5rem;
        background: var(--text-color);
        border-radius: 50%;
    }
    
    .portfolio-layer i {
        font-size: 1rem;
        color: var(--bg-color);
        background-color: var(--main-color);
    }
    
    .contact h2 {
        margin-bottom: 3rem;
    }
    
    .contact form {
        max-width: 70rem;
        margin: 1rem auto;
        text-align: center;
        margin-bottom: 3rem;
    }
    
    .contact form .input-box {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        color: var(--text-color);
    }
    
    .input-box input,
    .contact form textarea {
        width: 100%;
        padding: 1.5rem;
        font-size: 1.3rem;
        color: #b86338;
        background-color: #F1E2B7;
        border-radius: .8rem;
        margin: .7rem 0;
        margin-top: 20px;
    }
    
    .input-box input {
        width: 49%;
    }
    
    .contact form textarea {
        resize: none;
    }
    
    .contact form.btn {
        margin-top: 2rem;
        cursor: pointer;
    }
    
    .journey h2 {
        margin-bottom: 3rem;
    }
    
    .journey form {
        max-width: 70rem;
        margin: 1rem auto;
        text-align: center;
        margin-bottom: 3rem;
    }
    
    .journey form input-box {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        color: #F1E2B7;
    }
    
    .journeyinput-box input {
        width: 100%;
        padding: 1.5rem;
        font-size: 1.3rem;
        color: var(--another);
        background-color: #F1E2B7;
        border-radius: .8rem;
        margin: 1rem 0;
        margin-top: 20px;
        border: 1px solid #2E6613;
    }
    
    .journeyinput-box label {
        display: flex;
        font-size: 15px;
        margin-top: 20px;
        justify-content: flex-start;
    }
    
    .journey form textarea {
        resize: none;
    }
    
    .journey form .journey-btn {
        margin-top: 2rem;
        cursor: pointer;
    }
    
    .journey-btn {
        padding: 15px;
        background-color: #2E6613;
        color: #F1E2B7;
        border-radius: 30px;
        font-size: 15px;
    }
    
    .journey-btn:hover {
        cursor: pointer;
        box-shadow: 0 0 5px var(--text-color);
    }
    
    .journey h2 {
        margin-bottom: 3rem;
    }
    
    .contactus-body {
        margin-top: 60px;
        background-color: var(--main-color)
    }
    
    .contactus-heading {
        color: #F1E2B7;
        font-size: 35px;
        text-align: center;
    }
    
    #contactus-footer {
        width: 100%;
        background-color: #2E6613;
        padding: 20px;
    }
    
    .contact-us form {
        max-width: 70rem;
        margin: 5rem auto;
        text-align: center;
        /* margin-bottom: 3rem; */
    }
    /* .contact-us form .input-box {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        color: var(--text-color);
    }
     */
    
    .contactinput-box input,
    .contact-us form textarea {
        width: 100%;
        padding: 1.5rem;
        font-size: 1.3rem;
        color: #A86022;
        background-color: #F1E2B7;
        border-radius: .8rem;
        margin: 1rem 0;
        margin-top: 20px;
        border: 1px solid #2E6613;
    }
    
    .contactinput-box input {
        width: 49%;
    }
    
    .journey form textarea {
        resize: none;
    }
    
    .journey form .journey-btn {
        margin-top: 2rem;
        cursor: pointer;
    }
    
    .contact-btn {
        margin-top: 20px;
        margin-left: 450px;
        padding: 15px;
        background-color: #2E6613;
        color: #F1E2B7;
        border-radius: 30px;
        font-size: 15px;
    }
    
    .card-container {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        justify-content: center;
        flex-wrap: wrap;
        margin-top: 100px;
    }
    
    .card {
        width: 350px;
        background-color: #F1EFEC;
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0px 2px 4px rgba(0, 0, 0, .2);
        margin: 20px;
    }
    
    .card-content {
        padding: 10px;
    }
    
    .contact-btn:hover {
        cursor: pointer;
        box-shadow: 0 0 5px yellow;
    }
    
    .footer {
        font-size: 1.7rem;
        justify-content: space-between;
        display: flex;
        flex-wrap: wrap;
        gap: 5rem;
        padding: 30px;
        background: #2E6613;
    }
    
    .footer-box {
        display: flex;
        flex-direction: column;
        gap: 2rem;
    }
    
    .footer-box a h1 {
        color: #F1E2B7;
    }
    
    .footer-box h3 {
        color: #F1E2B7;
    }
    
    .footer-text p {
        font-size: 1.6rem;
        color: var(--main-color);
    }
    
    .footer-box i {
        color: #F1E2B7;
    }
    
    .footer-box span {
        color: #F1E2B7;
    }
    
    .vision {
        justify-content: center;
        margin: 0 auto;
        background-color: #F1E2B7;
        background-size: cover;
        object-fit: cover;
        display: flex;
        flex-direction: column;
        border-bottom: 20px solid var(--main-color);
    }
    
    .vision h1 {
        text-align: center;
        color: #A86022;
    }
    
    .vision .spanheading {
        margin-bottom: 40px;
        font-size: 50px;
    }
    
    .vision-content p {
        color: #2E6613;
    }
    
    .vision-content .spanp {
        font-size: 20px;
    }
    /* mision */
    
    .mission {
        justify-content: center;
        margin: 0 auto;
        background-color: #F1E2B7;
        background-size: cover;
        object-fit: cover;
        display: flex;
        flex-direction: column;
    }
    
    .mission h1 {
        text-align: center;
        color: #A86022;
    }
    
    .mission .spanheading {
        margin-bottom: 40px;
        font-size: 50px;
    }
    
    .mission-content p {
        color: #2E6613;
    }
    
    .mission-content .spanp {
        font-size: 20px;
    }
    
    .service {
        justify-content: center;
        margin: 0 auto;
        background-color: #F1E2B7;
        background-size: cover;
        object-fit: cover;
        display: flex;
        flex-direction: column;
    }
    
    .service .service-content p {
        font-size: 25px;
    }
    
    .service h1 {
        text-align: center;
        color: #A86022;
    }
    
    .service .serviceheading {
        margin-bottom: 40px;
        font-size: 50px;
    }
    
    .service p {
        color: #2E6613;
    }
    
    .home-image img {
        width: 300px;
        height: 300px;
        border-radius: 30px;
        margin-right: 20px;
        object-fit: cover;
    }
    
    .starter {
        background-repeat: no-repeat;
        object-fit: cover;
        display: flex;
        position: relative;
        flex-direction: column;
        background-image: url(../images/mur-antelope.jpg);
        background-position: center;
        background-size: cover;
    }
    
    .starter-content {
        width: 100%;
        margin-top: 150px;
        justify-content: center;
        text-align: center;
        align-items: center;
    }
    
    .starter-content h1 {
        margin-top: 100px;
        font-size: 50px;
        color: #F1E2B7;
        background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, .7), rgba(0, 0, 0, .4), rgba(0, 0, 0, 0));
    }
    
    .home-box {
        font-family: 'Poppins', sans-serif;
        color: #dcaf85;
        font-size: 10px;
        text-align: center;
    }
    
    .interest-container {
        margin-top: 20px;
        font-size: 15px;
        align-items: center;
        justify-content: flex-start;
    }
    
    .interest-container label {
        color: #F1E2B7;
    }
    
    .journey-footer {
        width: 100%;
        background-color: #2E6613;
        padding: 20px;
    }
    
    .journey-footer span {
        color: red;
    }
    
    .about-content p {
        color: #F1E2B7;
    }
    
    .about-content .content-para {
        font-size: 25px;
        line-height: 35px;
    }
    
    .home-content h3 {
        /* animation: textchange 15s infinite; */
        margin-bottom: 13px;
    }
    
    .home-content h1 {
        color: var(--second-bg-color);
        /* animation: textchange 15s infinite; */
    }
    
    .copyrit {
        display: flex;
        flex-direction: column;
    }
    
    .menu-icon {
        display: none;
    }
    
    .menu-icon1 {
        display: none;
    }
    
    .expert-btn {
        background-color: yellow;
        color: var(--main-color);
        padding: 10px 10px;
        border-radius: 20px;
    }
    
    .expert-btn a {
        color: var(--main-color);
    }
    
    .sidebar .close {
        width: 0px;
    }
    
    .journey-box {
        margin-top: 30px;
    }
    
    .heading-journey {
        text-align: center;
        font-size: 20px;
    }
    
    .journey-footer .footer-box h1,
    h3 {
        color: #F1E2B7;
    }
    
    .journey-footer .footer-box h3 {
        color: #F1E2B7;
    }
    
    .journey-footer .footer-box i {
        color: #F1E2B7;
    }
    
    .journey-footer .footer-box span {
        color: #F1E2B7;
    }
    
    .contact-body {
        background-color: var(--main-color);
        color: #F1E2B7;
    }
    
    .expert-btn:hover {
        color: #000000;
        box-shadow: 0 0 1rem var(--text-color);
    }
    
    .expert-btn a:hover {
        color: #272727;
    }
    
    .rafting-container {
        background-image: url(../images/eye.jpg);
        background-repeat: no-repeat;
        /* object-fit: cover; */
        background-position: center;
    }
    
    .btn-container {
        text-align: center;
    }
    
    .adventure-btn1 {
        margin-top: 40px;
        background-color: #1E460F;
        padding: 20px;
        border-radius: 30px;
    }
    
    .adventure-btn1:hover {
        box-shadow: 0 0 1rem yellow;
    }
    
    .adventure-btn1 a {
        color: yellow;
    }
    
    .safari-footer {
        background-color: var(--main-color);
    }
    
    .nile {
        background-image: url(../images/Source-of-the-River-Nile-2.jpeg);
        position: relative;
        background-position: center;
        background-size: cover;
        animation: nilechange 15s infinite ease-out;
    }
    
    .nile-heading {
        position: absolute;
        margin: 0 auto;
        left: 0;
        bottom: 900px;
    }
    
    .nile-heading {
        font-size: 30px;
        color: yellow;
        line-height: 80px;
    }
    
    .primate-heading {
        position: absolute;
        color: yellow;
        bottom: 10px;
    }
    
    .headings-lake {
        margin-top: 20px;
        color: #F1E2B7;
    }
    
    .logoimg {
        width: 40px;
        height: 40px;
    }
    
    .hey {
        font-size: 20px;
        color: #F1E2B7;
    }
    
    .culture-content {
        color: #F1E2B7;
        font-size: 20px;
    }
    
    .bannerimage {
        width: 800px;
        height: 800px;
    }
    
    .primate-heading {
        margin-bottom: 20px;
        font-size: 30px;
        color: yellow;
    }
    
    .primate-content {
        font-size: 20px;
        color: #F1E2B7;
    }
    
    .logo {
        display: flex;
        gap: 5px;
    }
    
    .nile-content,
    .park-content,
    .culture-content,
    .lake-content,
    .busuwoko-content {
        line-height: 3rem;
    }
    
    .culture-content {
        line-height: 3.5rem;
    }
    
    .culture-heading {
        margin-bottom: 20px;
    }
    
    .busuwoko {
        background-image: url(../images/kampala-jpg.webp);
        position: relative;
        background-size: cover;
        background-position: center;
        animation: kampalachange 15s infinite ease-out;
        ;
    }
    
    .busowoko-content .listings {
        color: #F1E2B7;
    }
    
    .busuwoko-heading {
        position: absolute;
        margin: 0 auto;
        left: 0;
        bottom: 0;
    }
    
    .group label {
        line-height: 40px;
    }
    
    .busuwoko-heading {
        font-size: 60px;
        color: yellow;
    }
    
    .busuwoko-para {
        font-size: 20px;
        color: #F1E2B7;
    }
    
    .lake {
        position: relative;
        background-image: url(../images/murchision\ falls.webp);
        object-fit: cover;
        background-size: cover;
        animation: murchisionchange 15s infinite ease-in-out;
    }
    
    .lake-container {
        position: absolute;
        left: 0;
        bottom: 0;
    }
    
    .lake-heading {
        margin: 0 auto;
        font-size: 60px;
        color: yellow;
    }
    
    .lake-para {
        color: #F1E2B7;
        font-size: 20px;
    }
    
    .nile-para {
        font-size: 20px;
        color: #F1E2B7;
    }
    
    .culture {
        background-image: url(../images/cultural.png);
        background-size: cover;
        position: relative;
    }
    
    .culture-heading {
        color: yellow;
        font-size: 60px;
        position: absolute;
        left: 0;
        bottom: 0;
    }
    
    .culture-para {
        color: #F1E2B7;
        font-size: 25px;
    }
    
    .tooro {
        background-image: url(../images/toro.jpeg);
        background-position: center;
        position: relative;
        background-repeat: no-repeat;
        background-size: cover;
    }
    
    .primatesec {
        line-height: 30px;
    }
    
    .tooro-heading {
        position: absolute;
        left: 0;
        bottom: 0;
        font-size: 60px;
        color: yellow;
    }
    
    .tooro-para {
        color: #F1E2B7;
        font-size: 25px;
    }
    
    .card:hover {
        border-radius: 10px;
        box-shadow: 0 0 .5rem yellow;
        ;
    }
    
    .grandsection {
        color: #F1E2B7;
        font-size: 20px;
        line-height: 30px;
    }
    
    .grandimg {
        background-image: url(../images/mur-antelope.jpg);
        object-fit: cover;
        justify-content: center;
        background-position: center;
        animation: grandchange 30s infinite ease-out;
    }
    
    .park {
        background-image: url(../images/Gorilla.jpg);
        position: relative;
        background-size: cover;
        animation: chimpchange 30s infinite ease-out;
    }
    
    .primate-section {
        background-image: url(../images/lions-in-Uganda-1200x675.webp);
        object-fit: cover;
        background-size: cover;
        background-repeat: no-repeat;
        justify-content: center;
        animation: primatechange 30s infinite ease-out;
    }
    
    .park-heading {
        position: absolute;
        left: 0;
        bottom: 0;
        font-size: 60px;
        color: yellow;
    }
    
    .listings {
        font-size: 20px;
        color: #F1E2B7;
        margin-left: 50px;
        margin-top: 10px;
    }
    
    .service-listings {
        font-size: 20px;
        color: #2E6613;
        margin-left: 50px;
        margin-top: 10px;
    }
    
    .treking {
        background-image: url(../images/chimp3.JPG);
        background-repeat: no-repeat;
        background-size: cover;
        position: relative;
    }
    
    .treking-heading {
        position: absolute;
        left: 0;
        bottom: 0;
        color: yellow;
        font-size: 60px;
    }
    
    .treking-para {
        color: #F1E2B7;
        font-size: 25px;
    }
    
    .wrapper {
        margin: 40px 0px;
        font-size: 20px;
        display: flex;
        gap: 10px;
        flex-direction: column;
        align-items: flex-start;
    }
    
    .select-wrapper {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }
    
    .select {
        width: 200px;
        background-color: #2E6613;
        color: var(--bg-color);
        padding: 10px;
        font-size: 20px;
    }
    
    .select-box {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        margin: 20px 0px;
    }
    
    .select-box h1 {
        font-size: 20px;
        text-align: left;
        margin-bottom: 10px;
    }
    
    .tailorinput-box input {
        border-radius: 5px;
        margin-left: 200px;
        margin-bottom: 20px;
        padding: 10px;
        display: flex;
        width: 300px;
        justify-content: flex-start;
        background-color: #F1E2B7;
    }
    
    .tailorinput-box p {
        margin-left: 200px;
        margin-bottom: 12px;
        font-size: 20px;
        display: flex;
        font-weight: 600;
        justify-content: flex-start;
    }
    
    .sidebar.open {
        display: flex;
        padding: 10px;
        position: absolute;
        left: 0;
        right: 0;
        height: 500px;
        background-color: var(--main-color);
        margin-top: 550px;
        flex-direction: column;
        opacity: 1;
    }
    
    .grandheading {
        color: yellow;
        position: absolute;
        left: 10px;
        bottom: 10px;
        font-size: 40px;
    }
    
    .textareadivision {
        display: flex;
        flex-wrap: wrap;
    }
    
    .textareawrapper {
        margin-right: 200px;
    }
    
    .contacttextareawrapper #message {
        width: 690px;
    }
    
    .contacttextareawrapper .send-btn {
        margin-left: 450px;
    }
    
    .send-btn {
        margin-top: 20px;
        margin-left: 380px;
    }
    
    .textareawraper #message {
        width: 690px;
    }
    
    @keyframes change {
        10% {
            background-image: url(../images/ken.jpeg);
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        30% {
            background-image: url(../images/ele5.JPG);
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        40% {
            background-image: url(../images/ele5.JPG);
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        50% {
            background-image: url(../images/hand.jpeg);
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        60% {
            background-image: url(../images/ele1.JPG);
            background-size: cover;
            object-fit: cover;
        }
        70% {
            background-image: url(../images/hippo.jpg);
            background-size: cover;
            object-fit: cover;
        }
        80% {
            background-image: url(../images/chimpanzee-safari-tours-1536x980.jpg);
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        90% {
            background-image: url(../images/ken15.jpeg);
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        100% {
            background-image: url(../images/mur-antelope.jpg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
    }
    
    @keyframes nilechange {
        10% {
            background-image: url(../images/Source-of-the-River-Nile-2.jpeg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        50% {
            background-image: url(../images/source1.jpg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
    }
    
    @keyframes murchisionchange {
        10% {
            background-image: url(../images/Murchison-Falls.jpg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        30% {
            background-image: url(../images/murchison-falls-NP-scaled.jpg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
    }
    
    @keyframes primatechange {
        10% {
            background-image: url(../images/lions-in-Uganda-1200x675.webp);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        50% {
            background-image: url(../images/lioon1.jpeg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        50% {
            background-image: url(../images/lioon4.jpeg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
    }
    
    @keyframes kampalachange {
        10% {
            background-image: url(../images/kampala-city-night.jpg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        50% {
            background-image: url(../images/Kampala-City-2.jpg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        90% {
            background-image: url(../images/kampala-road.webp);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        50% {
            background-image: url(../images/kampala-jpg.webp);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
    }
    
    @keyframes primatechange {
        0% {
            color: yellow;
        }
        10% {
            background-image: url(../images/lions-in-Uganda-1200x675.webp);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        30% {
            background-image: url(../images/lioon1.jpeg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
    }
    
    @keyframes chimpchange {
        10% {
            background-image: url(../images/Gorilla-Habituation-Expereince-1.jpg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        50% {
            background-image: url(../images/mountaingoril.jpg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
    }
    
    @keyframes grandchange {
        10% {
            background-image: url(../images/Goat.jpeg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        50% {
            background-image: url(../images/mountaingoril.jpg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        50% {
            background-image: url(../images/ken19.jpeg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
        100% {
            background-image: url(../images/.jpeg);
            background-size: cover;
            background-size: cover;
            background-position: center;
            object-fit: cover;
        }
    }
    
    #message {
        width: 550px;
        margin-left: 200px;
        margin-top: 30px;
        flex-wrap: wrap;
        border-radius: 16px;
        padding: 30px;
        color: #b86338;
        background-color: #F1E2B7;
    }
    
    .select-wrapper {
        margin-left: 200px;
    }
    
    .select-box {
        margin-left: 200px;
    }
    
    .journey-btn {
        margin-left: 400px;
        margin-top: 30px;
    }
    
    .wrapper {
        margin-left: 200px;
    }
    
    .textareadiv {
        display: flex;
        /* flex-direction: column; */
    }
    
    @media(max-width:1200px) {
        html {
            font-size: 55%;
        }
        .expert-btn {
            display: none;
        }
        .home-content h1 {
            margin-top: 30px;
            line-height: 5rem;
            text-align: center;
        }
        .home-content h1 {
            font-size: 40px;
            line-height: 10rem;
        }
    }
    
    @media(max-width:1075px) {
        .home-content h1 {
            margin-top: 30px;
            line-height: 5rem;
            text-align: center;
        }
        .home-content h1 {
            line-height: 8rem;
            margin-bottom: 20px;
        }
        .home-content .welcome {
            font-size: 70px;
        }
        .home-content.destination-wrapper {
            display: flex;
            background-color: red;
        }
    }
    
    @media(max-width:1024px) {
        .textareawraper #message {
            width: 600px;
            margin-left: 110px;
        }
        .contact-btn {
            margin-left: 340px;
        }
        .card-container {
            grid-template-columns: repeat(2, 1fr);
        }
        #message input {
            margin-left: 250px;
        }
        .select-wrapper,
        .select-box,
        .wrapper,
        #message {
            margin-left: 90px;
        }
        .tailorinput-box input,
        .tailorinput-box p {
            margin-left: 65px;
        }
        .sidebar {
            display: none;
        }
        .menu-icon,
        .menu-icon1 {
            display: flex;
        }
        .menu-icon1 img {
            height: 40px;
        }
        .services-box {
            height: 550px;
        }
        .projects .heading,
        .services .heading,
        .contactheading {
            font-size: 50px;
        }
        .send-btn {
            margin-top: 20px;
        }
        .home-content .welcome {
            margin-top: 20px;
            line-height: 13rem;
            margin-bottom: 10px;
        }
    }
    
    @media(max-width:1000px) {
        .home-content h1 {
            margin-top: 30px;
            line-height: 15rem;
            text-align: center;
            font-size: 40px;
        }
        .services-container {
            grid-template-columns: repeat(2, 1fr);
        }
        .services-box {
            min-height: 550px;
        }
        .starter-content h1 {
            font-size: 60px;
        }
    }
    
    @media(max-width:991px) {
        .header {
            padding: 2rem 3%;
        }
        .home-content .welcome {
            line-height: 20rem;
            font-size: 80px;
        }
        section {
            padding: 10rem 3%;
        }
        .footer {
            padding: 2rem 3%;
        }
        .starter-content h1 {
            margin-bottom: 100px;
        }
        .sidebar {
            display: flex;
            padding: 10px;
            position: absolute;
            left: 0;
            right: -300px;
            margin-top: 550px;
            transition: 0.3s ease;
            flex-direction: column;
            opacity: 0;
        }
        .sidebar ul {
            margin-top: 10px;
            padding: 20px;
        }
        .sidebar .expert-btn {
            margin-bottom: 10px;
        }
    }
    
    @media(max-width:917px) {
        .home-content .welcome {
            line-height: 20rem;
        }
        .starter .starter-heading {
            margin-top: 40rem;
        }
    }
    
    @media(max-width:883px) {
        .home-content h1 {
            text-align: center;
        }
    }
    
    @media(max-width:892px) {
        .home-content h1 {
            margin-top: 30px;
            line-height: 5rem;
            text-align: center;
        }
        .home-content h1 {
            font-size: 50px;
            line-height: 10rem;
        }
    }
    
    @media(max-width:891px) {
        .home-content h1 {
            text-align: center;
        }
    }
    
    @media(max-width:856px) {
        .menu-icon {
            display: flex;
            height: 40px;
        }
        .menu-icon1 {
            display: none;
        }
        .navbar {
            display: none;
        }
    }
    
    @media(max-width:841px) {
        .ceo {
            display: flex;
            flex-direction: column;
        }
        .services-container {
            grid-template-columns: repeat(2, 1fr);
        }
        .home-content .welcome {
            font-size: 70px;
        }
    }
    
    @media(max-width:820px) {
        .sidebar {
            display: none;
        }
        .menu-icon,
        .menu-icon1 {
            display: flex;
        }
        .textareawraper #message {
            width: 600px;
            margin-left: 75px;
        }
        .contact-btn {
            margin-left: 290px;
        }
        .tailorinput-box input,
        .tailorinput-box p {
            margin-left: 40px;
        }
        .home-content .welcome {
            line-height: 20rem;
        }
        .starter-content .starter-heading {
            margin-top: 30rem;
        }
        .starter {
            background-size: contain;
        }
        .services .heading,
        .projects .heading,
        .contactheading {
            font-size: 50px;
        }
        .send-btn {
            margin-top: 20px;
        }
        .services-box {
            margin-top: 20px;
        }
        .select-wrapper,
        .select-box,
        .wrapper,
        #message {
            margin-left: 50px;
        }
    }
    
    @media(max-width:800px) {
        .home-content .welcome {
            font-size: 60px;
        }
        .adventure-btn1 {
            margin-top: 30px;
        }
    }
    
    @media(max-width:768px) {
        .home {
            flex-direction: column;
        }
        .sidebar {
            display: none;
        }
        .menu-icon {
            display: flex;
        }
        .menu-icon1 {
            display: flex;
        }
        .home-content .welcome {
            line-height: 15rem;
        }
        .home-content h3 {
            font-size: 2.6rem;
        }
        .home-content h1 {
            font-size: 5rem;
        }
        .tailorinput-box input,
        .tailorinput-box p {
            margin-left: 40px;
        }
        .select-wrapper,
        .select-box,
        .wrapper,
        #message {
            margin-left: 30px;
        }
        .home-image img {
            width: 70vh;
            margin-top: 4rem;
        }
        .home {
            flex-direction: column;
        }
        #home i {
            color: black
        }
        .about img {
            width: 70vh;
            margin-top: 4rem;
        }
        .contact {
            min-height: auto;
        }
        .services h2 {
            margin-bottom: 3rem;
        }
        .projects h2 {
            margin-bottom: 3rem;
        }
        .portfolio-container {
            grid-template-columns: repeat(2, 1fr);
        }
        .projects {
            padding-bottom: 1rem;
        }
        .about-content .content-para {
            font-size: 20px;
        }
        .destination-plan {
            display: inline-block;
            width: 400px;
            margin: 0 auto;
        }
        .starter-content .starter-heading {
            font-size: 45px;
        }
        .starter-content h1 {
            margin-top: 25rem;
        }
        .starter {
            background-size: cover;
        }
        .services .heading,
        .contactheading,
        .projects .heading {
            font-size: 50px;
        }
        .textareawraper #message {
            width: 600px;
            margin-left: 60px;
        }
        .contact-btn {
            margin-left: 270px;
        }
    }
    
    @media(max-width:737px) {
        .sidebar {
            display: flex;
            padding: 10px;
            position: absolute;
            left: 0;
            right: -300px;
            margin-top: 550px;
            transition: 0.3s ease;
            flex-direction: column;
            opacity: 0;
        }
        .card-container {
            grid-template-columns: repeat(2, 1fr);
        }
        .card {
            width: 250px;
            margin: 0 auto;
            margin-bottom: 20px;
            align-items: center;
            justify-content: center;
        }
        .sidebar ul {
            margin-top: 10px;
            padding: 20px;
        }
        .sidebar .expert-btn {
            margin-bottom: 10px;
        }
        .menu-icon {
            display: flex;
        }
        .menu-icon1 {
            display: flex;
        }
        .group input {
            margin-left: 30px;
            border: 1px solid red;
        }
        .select-box {
            margin-left: 30px;
        }
        .tailorinput-box {
            margin-left: 30px;
        }
    }
    
    @media(max-width:656px) {
        .home-content .welcome {
            font-size: 50px;
        }
        .destination-plan {
            display: inline-block;
            width: 300px;
            font-size: 15px;
        }
        .services .heading {
            font-size: 50px;
        }
    }
    
    @media(max-width:617px) {
        .portfolio-container {
            grid-template-columns: 1fr;
        }
        .home-content h1 {
            text-align: center;
            font-size: 30px;
        }
        .services-box {
            height: 500px;
        }
    }
    
    @media(max-width:590px) {
        .home-content h1 {
            font-size: 20px;
        }
        .home-content h3 {
            font-size: 15px;
        }
        .home-content h1 {
            margin-top: 30px;
            line-height: 10rem;
        }
        .home-content h1 {
            font-size: 30px;
        }
        .destination-plan {
            margin: 0 auto;
        }
    }
    
    @media(max-width:540px) {
        .textareawraper #message {
            width: 500px;
            margin-left: 10px;
        }
        .contact-btn {
            margin-left: 180px;
        }
        .bout-content p {
            font-size: 20px;
        }
        .home-content .welcome {
            font-size: 45px;
        }
        .destination-plan {
            width: 300px;
            font-size: 15px;
        }
        .card-container {
            grid-template-columns: repeat(1, 1fr);
        }
        .card {
            width: 450px;
            margin: 0 auto;
            margin-bottom: 20px;
            align-items: center;
            justify-content: center;
        }
        .starter {
            background-position: center;
            background-size: cover;
        }
        .starter .starter-heading {
            margin-bottom: 40rem;
        }
        .services-container {
            grid-template-columns: repeat(1, 1fr);
        }
        .tailorinput-box {
            margin-left: 30px;
            text-align: left;
        }
        #message {
            width: 480px;
        }
        .journey-btn {
            margin-left: 200px;
        }
    }
    
    @media(max-width:500px) {
        .para-heading,
        .culture-heading {
            line-height: 7rem;
        }
        .culture-heading {
            margin-left: 10px;
        }
        .footer {
            display: flex;
            flex-direction: column;
        }
    }
    
    @media(max-width:471px) {
        .home-content h1 {
            line-height: 10rem;
        }
        .home-content .welcome {
            font-size: 40px;
        }
        .home-content h1 {
            margin-top: 20px;
        }
        .about-content p {
            font-size: 10px;
        }
        .destinationplan {
            margin: 0 auto;
            margin-bottom: 70px;
        }
        .tailorinput-box {
            margin-left: 30px;
        }
    }
    
    @media(max-width:450px) {
        .logo-heading {
            font-size: 20px;
            margin-top: 40px;
        }
        .vision-content p {
            font-size: 18px;
        }
        .home-content {
            margin-top: 50px;
        }
        .destination-plan {
            margin: 0 auto;
            width: 300px;
            font-size: 13px;
        }
        .arrow-down {
            color: yellow;
            position: absolute;
            bottom: 10px;
            margin: 0 auto;
            left: 50%;
            transform: translate(-50%, -50%);
        }
        .card {
            width: 350px;
            margin: 0 auto;
            margin-bottom: 20px;
            align-items: center;
            justify-content: center;
        }
        .logo-heading {
            font-size: 10px;
        }
        .group label {
            font-size: 15px;
        }
        .logoimg {
            width: 60px;
            height: 70px;
        }
    }
    
    @media(max-width:430px) {
        .home-content .welcome {
            line-height: 10rem;
        }
        .destination-plan {
            width: 250px;
            font-size: 10px;
            margin-bottom: 30px;
        }
        .textareawraper #message {
            width: 400px;
        }
        .contact-btn {
            margin-left: 120px;
        }
        .about-content h1 {
            font-size: 20px;
        }
        .logo-heading {
            margin-top: 60px;
        }
        .starter-content h1 {
            font-size: 40px;
        }
        .about-content h3 {
            font-size: 15px;
            letter-spacing: 1.5rem;
        }
        .home-content h1 {
            margin-bottom: 50px;
        }
        #Accomodation {
            margin-bottom: 20px;
        }
        .home-content .welcome {
            font-size: 35px;
        }
        .ceo img {
            width: 200px;
            height: 200px;
            border-radius: 200px;
        }
        .ceo p {
            font-size: 15px;
        }
        .ceo-heading {
            font-size: 25px;
        }
        .vision-content .spanheading,
        .mission-content .spanheading,
        .services .heading,
        .projects .heading,
        .starter-content .starter-heading,
        .service .serviceheading,
        .contactheading {
            font-size: 30px;
        }
        .send-btn {
            margin-top: 20px;
        }
        .tailorinput-box input,
        .tailorinput-box p {
            margin-left: 10px;
        }
        .logo {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .logoimg {
            width: 50px;
            height: 50px;
        }
        .logo-heading {
            margin-bottom: 55px;
            font-size: 20px;
        }
        .select-wrapper {
            margin: 0 auto;
        }
        .select-box {
            margin: 0 auto;
        }
        .wrapper {
            margin: 10px auto;
        }
        .textareawrappper {
            display: flex;
            justify-content: flex-start;
            flex-wrap: wrap;
        }
        #message {
            width: 380px;
            margin: 0 auto;
        }
        .journey-btn {
            margin-left: 120px;
        }
    }
    
    .about {
        flex-direction: column-reverse;
    }
    
    .about-content p {
        font-size: 18px;
    }
    
    .footer-box h1 {
        color: var(--main-color);
        font-size: 18px;
    }
    
    .vision-content p {
        font-size: 15px;
    }
    
    .vision-content h1 {
        font-size: 28px;
    }
    
    @media(max-width:414px) {
        .projects .heading,
        .contactheading,
        .service-content .serviceheading,
        .vision-content .spanheading,
        .services .heading {
            font-size: 30px;
        }
        .park-heading,
        .lake-heading,
        .culture-heading,
        .busuwoko-heading,
        .nile-heading {
            font-size: 50px;
        }
        .logo {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .logoimg {
            width: 50px;
            height: 50px;
        }
        .logo-heading {
            margin-bottom: 55px;
            font-size: 20px;
        }
        .textareawraper #message {
            width: 380px;
        }
        .contact-btn {
            margin-left: 100px;
        }
    }
    
    @media(max-width:400px) {
        .destination-plan {
            width: 250px;
            font-size: 10px;
        }
        .services-box {
            height: 520px;
        }
        .starter-content h1 {
            margin-bottom: 250px;
        }
        .ceo img {
            width: 250px;
            height: 250px;
        }
        .adventure-btn1 a {
            font-size: 15px;
        }
        .vision-content .spanheading {
            font-size: 30px;
        }
        .about-content h1 {
            font-size: 20px;
        }
        .content-para {
            font-size: 15px;
        }
        .services .heading {
            font-size: 30px;
        }
        .heading-journey {
            text-align: left;
        }
        #activities {
            justify-content: center;
        }
        .service-content .serviceheading {
            font-size: 30px;
        }
    }
    
    @media(max-width:386px) {
        .vision-content h1 {
            font-size: 20px;
        }
        .vision-content p {
            font-size: 15px;
        }
        .starter-content h1 {
            font-size: 25px;
        }
    }
    
    @media(max-width:386px) {
        .home-content .welcome {
            font-size: 30px;
            line-height: 70px;
        }
        .destinationplan {
            margin-bottom: 20px;
        }
        .contactheading {
            font-size: 30px;
        }
        .projects .heading {
            font-size: 30px;
        }
        .send-btn {
            margin-top: 15px;
        }
    }
    
    @media(max-width:375px) {
        .park-heading,
        .lake-heading,
        .busuwoko-heading,
        .nile-heading,
        .culture-heading {
            font-size: 30px;
        }
        .home-content.welcome {
            margin-top: 10px;
        }
        .textareawraper #message {
            width: 330px;
        }
        .contact-btn {
            margin-left: 70px;
        }
        .destination-plan {
            margin: 0 auto;
        }
        .arrow-down {
            margin-top: 80px;
        }
        #message {
            width: 330px;
        }
        .logo {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .logoimg {
            width: 50px;
            height: 50px;
        }
        .logo-heading {
            margin-bottom: 55px;
            font-size: 15px;
        }
    }
    
    @media(max-width:365px) {
        #menu-icon {
            display: block;
        }
        .home img {
            width: 90vw;
        }
        .about img {
            width: 70vw;
        }
        .footer {
            flex-direction: column-reverse;
        }
        .footer p {
            text-align: center;
            margin-top: 2rem;
        }
        .ceo-heading {
            font-size: 20px;
        }
        .ceo-heading {
            font-size: 15px;
        }
        .services-box h1 {
            font-size: 20px;
        }
        .services-box h3 {
            font-size: 15px;
        }
        .services-box a {
            font-size: 15px;
        }
        .logo-heading {
            font-size: 15px;
        }
        .menu-icon1 {
            width: 20px;
        }
        .navbar {
            width: 10%;
        }
        .home-content {
            width: 100%;
        }
        .vision-content h1 {
            font-size: 20px;
        }
        .vision-content p {
            font-size: 15px;
        }
        .services-box {
            height: 450px;
        }
        .home-content .welcome {
            font-size: 30px;
        }
        .destination-plan {
            width: 200px;
            font-size: 9px;
        }
    }
    
    @media(max-width:360px) {
        #menu-icon {
            display: block;
        }
        .contact-btn {
            margin-left: 100px;
        }
        .home img {
            width: 90vw;
        }
        .about img {
            width: 70vw;
        }
        .footer {
            flex-direction: column-reverse;
        }
        .footer p {
            text-align: center;
            margin-top: 2rem;
        }
        .ceo-heading {
            font-size: 20px;
        }
        .ceo-heading {
            font-size: 15px;
        }
        .services-box h1 {
            font-size: 20px;
        }
        .services-box h3 {
            font-size: 15px;
        }
        .services-box a {
            font-size: 15px;
        }
        .logo-heading {
            font-size: 15px;
        }
        .menu-icon1 {
            width: 20px;
        }
        .navbar {
            width: 10%;
        }
        .home-content {
            width: 100%;
        }
        .vision-content h1 {
            font-size: 20px;
        }
        .vision-content p {
            font-size: 15px;
        }
        .services-box {
            height: 450px;
        }
        .home-content .welcome {
            font-size: 30px;
        }
        .destination-plan {
            width: 200px;
            font-size: 9px;
            margin-bottom: 20px;
        }
    }
    
    @media(max-width:350px) {
        .ceo img {
            width: 100px;
            height: 100px;
        }
        .ceo-heading {
            font-size: 15px;
        }
        .starter-content h1 {
            font-size: 25px;
        }
        .footer-box h1 {
            font-size: 15px;
        }
        .footer-box i {
            font-size: 15px;
        }
        .contact h2 {
            font-size: 15px;
        }
        .ceo img {
            width: 230px;
            height: 230px;
        }
        .ceo-heading {
            font-size: 25px;
        }
        .vision-content p {
            font-size: 2px;
        }
        .vision-content .spanheading {
            font-size: 30px;
        }
        .contact .heading {
            font-size: 30px;
        }
        .services .heading {
            font-size: 30px;
        }
        .projects .heading {
            font-size: 25px;
        }
        .services-box {
            height: 400px;
        }
        .adventure-btn1 {
            width: 200px;
        }
        .adventure-btn1 a {
            font-size: 10px;
        }
        .tailorinput-box input {
            width: 240px;
        }
        .card {
            width: 280px;
            margin: 0 auto;
            margin-bottom: 20px;
            align-items: center;
            justify-content: center;
        }
    }
    
    @media(max-width:344px) {
        .destination-plan {
            margin-bottom: 20px;
            margin: 0 auto;
        }
        .group label {
            font-size: 12px;
        }
    }
    
    @media(max-width:338px) {
        .destination-plan {
            width: 200px;
            font-size: 9px;
        }
        .footer-box {
            width: 100%;
        }
    }
    
    @media(max-width:328px) {
        .home-content .welcome {
            font-size: 25px;
        }
    }
    
    @media(max-width:320px) {
        .park-heading,
        .lake-heading,
        .nile-heading,
        .culture-heading,
        .busuwoko-heading {
            font-size: 30px;
        }
        #message {
            width: 300px;
        }
        .textareawraper #message {
            width: 300px;
        }
        .contact-btn {
            margin-left: 70px;
        }
        .journey-btn {
            margin-left: 80px;
        }
        .destination-plan {
            margin-bottom: 20px;
        }
        .wrapper h3 {
            text-align: left;
            margin-left: 30px;
            line-height: 30px;
        }
        .select-box h1 {
            line-height: 30px;
        }
        .logoimg {
            width: 40px;
            height: 40px;
            align-items: center;
            margin: 0 auto;
        }
        .logo {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .logo-heading {
            margin-bottom: 55px;
        }
    }
    
    @media(max-width:270px) {
        .starter-content h1 {
            font-size: 30px;
            line-height: 10rem;
        }
        .ceo-heading {
            font-size: 10px;
        }
        .heading {
            font-size: 10px;
        }
        .services-box h1 {
            font-size: 15px;
        }
        .services-box h3 {
            font-size: 10px;
        }
        .services-box a {
            font-size: 10px;
        }
        .home-content {
            width: 100%;
        }
        .home-content .welcome {
            font-size: 20px;
        }
        .destination-plan {
            width: 200px;
            font-size: 9px;
        }
    }
    
    @media(max-width:261px) {
        .starter-content h1 {
            padding: 10px;
            line-height: 2rem;
        }
        .ceo-heading {
            font-size: 10px;
        }
        .heading {
            font-size: 10px;
        }
        .services-box h1 {
            font-size: 15px;
        }
        .services-box h3 {
            font-size: 10px;
        }
        .services-box a {
            font-size: 15px;
        }
        .home-content {
            width: 100%;
        }
        .destination-plan {
            margin: 0 auto;
            width: 200px;
            font-size: 9px;
        }
        .footer-box span {
            font-size: 12px;
        }
        .home-content .welcome {
            font-size: 20px;
        }
        .starter-content .starter-heading {
            font-size: 20px;
        }
        .service-listings {
            line-height: 30px;
        }
        .contact .contactheading {
            font-size: 20px;
        }
        .wrapper h3 {
            text-align: left;
            margin-left: 30px;
            line-height: 30px;
        }
        .select-box h1 {
            line-height: 30px;
        }
    }
    
    @media(max-width:250px) {
        .destination-plan {
            width: 150px;
            font-size: 7px;
        }
        .services-box {
            height: 200px;
        }
        .home-content .welcome {
            margin-top: 40px;
            line-height: 5rem;
            font-size: 20px;
        }
        .services-box {
            width: 100%;
        }
        .starter-content .starter-heading {
            font-size: 15px;
        }
    }
    
    @media(max-width:228px) {
        .home-content {
            width: 100%;
        }
        .wrapper h3 {
            line-height: 4rem;
        }
        .ceo img {
            width: 100px;
            height: 100px;
        }
        .vision-content .spanheading {
            font-size: 30px;
        }
        .vision-content p {
            font-size: 10px;
        }
        .heading {
            font-size: 30px;
        }
        .services-box h1 {
            font-size: 24px;
        }
        .services-box h3 {
            font-size: 15px;
        }
    }
    
    @media(max-width:200px) {
        .home-content {
            width: 100%;
        }
        .home-content .welcome {
            font-size: 17px;
        }
        .starter-heading {
            font: 10px;
        }
        .adventure-btn1 {
            width: 180px;
        }
        .logo-heading {
            font-size: 10px;
        }
        .ceo img {
            width: 100px;
            height: 100px;
        }
        .footer-box {
            font-size: 10px;
        }
        .footer-box a {
            font-size: 13px;
        }
        .services-box a {
            font-size: 10px;
        }
        .footer-box {
            font-size: 7px;
        }
        .footer-box h1 {
            font-size: 15px;
        }
        .footer-box a {
            font-size: 15px;
        }
        .footer-box i {
            font-size: 10px;
        }
        .ceo p {
            font-size: 10px;
        }
        .services-box a {
            font-size: 10px;
        }
        .btn {
            font-size: 5px;
            width: 80px;
        }
        .vision-content p {
            font-size: 10px;
        }
        .destination-plan {
            font-size: 5px;
            width: 130px;
        }
        .starter-content h1 {
            line-height: 10rem;
        }
        .services-box {
            height: 330px;
        }
        .services-box {
            width: 100%;
            padding: 10px;
        }
        .services-box {
            height: 400px;
            padding: 10px;
        }
        .logo-heading {
            font-size: 12px;
        }
        .ceo img {
            width: 150px;
            height: 150px;
        }
        .footer-box span {
            font-size: 8px;
        }
    }
    
    @media(max-width:150px) {
        .home-content {
            width: 100%;
        }
        .ceo img {
            width: 100px;
            height: 100px;
        }
        .footer-box {
            font-size: 7px;
        }
        .footer-box a {
            font-size: 15px;
        }
        .footer-box i {
            font-size: 15px;
        }
        .services-box a {
            font-size: 15px;
        }
        .btn {
            font-size: 10px;
            width: 80px;
        }
        .logo-heading {
            font-size: 10px;
        }
    }