@media screen and (max-width: 600px){
    .nav{
        width: 80%;
        justify-content: space-evenly;
    }
    .nav a{
        font-size: 15px;
    }
    .section1{
        height: 85vh;
    }
    .sec3Container{
        flex-direction: column-reverse;
        height: 1100px;
        width: 100%;
    }
    .description{
        width: 100%;
        height: 42%;
        justify-content: space-evenly;

    }
    .description p{
        height: 65%;
        width: 345px;
        font-size: 14px;
        margin-left: auto;
        margin-right: auto;
        /* line-break: anywhere; */
        text-align: justify;
    }
    .section2{
        display: none;
    }
    .pillar{
        display: none;
    }
    .section3{
        height: 1000px;
    }

    .sec3Container{
        justify-content: space-evenly;
    }
    .phoneImg{
        height: 450px;
        width: auto;
        overflow: hidden;
    }
    .section4{
        padding-top: 0px;
    }
    .phone{
        height: 420px;
        overflow: hidden;
    }
    .phone:hover{
        transform: none;
    }
    .clip{
        height: 398px;
        width: 96%;
        object-fit: cover;
    }
    .footer{
        height: 100px;
        width: 100%;
        background-color: transparent;
    }
    .foot{
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        height: 100%;
        align-items: center;
        display: flex;
        justify-content: space-evenly;

    }
    .left{
        display: flex;
        flex-direction: column-reverse;
        justify-content: center;
        align-items: start;
        font-size: 10px;
        padding-left: 5px;
        color: white;
    }
    .left a{
        color: white;
    }
    .swiperOut{
        display: block;
    }
    .banner{
        height: 70vh;
    }
    .footer{
        height: 75px;
    }
    .playstore{
        height: 50px;
    }
}
@media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape){
    .pillar32 {
        left: 33%;
        top: 77%;
        width: 41%;
    }
    .pillar31 {
        left: 50%;
        top: -5%;
    }
    .pillar12 {
        left: -12%;
        top: 75%;
    }
    .pillar41 {
        left: 74%;
        top: -16%;
    }
    
    .pillar42 {
        left: 59%;
        top: 65%;
    }

    .pillar42 {
        left: 59%;
        top: 65%;
    }
}

/* @media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait){ */
    @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation : portrait){
    .pillar41 {
        position: absolute;
        left: 79%;
        top: -2%;
        transform: rotate(180deg);
        height: 350px;
        width: 100px;
        object-fit: cover;
    }
    .clip {
        width: 100%;
        height: 450px;
    }
    .pillar12{
        position: absolute;
        height: 350px;
        left: -21%;
        top: 75%;

    }
    .pillar31{
        left: 55%;
        top: -17%;
    }
    .pillar32{
        left: 8%;
        top: 74%;
    }
    .pillar21{
        left: 31%;
        top: -6%;
    }
    .pillar22{
        left: 31%;
        
    }
    .pillar42{
        left: 55%;
        top: 73%;
    }
}