/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {

    #manuArea {
        display: none;

    }

    .manubar {
        display: block;

    }

    #mainDiv {
        flex-direction: column;
    }



    #textContant {
        order: 2;
        width: 100%;
    }


    #textContant h1 {
        font-size: 64px;
        line-height: 102.4px;
        color: #069d54;
        font-weight: 600;
    }

    #textContant h2 {

        line-height: 38px;
        font-weight: 600;
        margin-top: 20px;

    }




    #imageContant {
        order: 1;
        width: 100%;
    }

    #secondMainDiv {

        flex-direction: column;
    }

    #secondIMageContant {
        order: 1;
        width: 100%;
    }

    #socondTextContant {
        order: 2;
        width: 100%;
    }



    #mainTextContant {
        flex-direction: column;

    }

    .text1 {
        order: 1;
        width: 100%;
    }

    #mainMenuBox {
        flex-direction: column;
        gap: 30px;
        height: 800px
    }

    .MenuBox1 {
        order: 1;
        width: 100%;
        height: 1000px;


    }

    .MenuBox2 {
        order: 2;
        width: 100%;
        height: 1000px;


    }

    .MenuBox3 {
        order: 3;
        width: 100%;
        height: 1000px;

    }

    .fiveMainDiv {
        flex-direction: column;
        margin-top: 450px;
    }


    #fiveTextContant {
        order: 1;
    }

    #fiveImageContant {
        order: 2;
    }

    .extra {
        width: 300px;
        height: 100%;

    }


    #fiveImageContant {
        width: 100%;

        margin-top: 30px;

    }


    #sixMainDiv {
        flex-direction: column;
        margin-top: 80px;
    }

    #sixTexContant {
        order: 1;
    }

    #contact {

        order: 2;
    }


    #sixTexContant span {

        line-height: 38px;
    }

    #sixTexContant p {

        line-height: 20px;

    }



    #contact {
        padding: 12px 10px;
        top: 200px;
        left: 205px;
    }

    .sevenMainDiv{
        margin-top:300px;
       
    }


    .towDiv{
        display: block;
    }
    .five{
        display: block;
       
    }





    .sevenMainDiv{
       display: flex;
    }



    .div1 {
        width:  70px;
        height: 100%;
        /* background-color: crimson; */
        position: relative;
    }
    
    .div2 {
        width:  70px;
        height: 100%;
        /* background-color: rgb(228, 218, 84); */
    }
    
    .div3 {
        width: 70px ;
        height: 100%;
        /* background-color: rgba(20, 67, 220, 0.267); */
    }
    
    .div4 {
        width: 70px;
        height: 100%;
        /* background-color: rgb(196, 54, 231); */
    }

    .end{
        margin-top: 300px;
    }
    





}




/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {

    #manuArea {
        display: none;

    }

    .manubar {
        display: block;

    }





}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {

    #manuArea {
        display: block;

    }

    .manubar {
        display: none;

    }

}