*{
    padding:0;
    margin:0;
    box-sizing:border-box;
    font-family:'Poppins',sans-serif;
    color:black;
    text-align:center;
}

.navBar{
    background-color:#FFF9E9;
    display:flex;
    justify-content:space-evenly;
    align-items:center;
    width:100%;
}

.logo{
    height:5.3rem;
    position:relative;
    left:-0.5rem;
    padding-top:0.3rem;
    padding-bottom:0.3rem;
    padding-left:0.5rem;
    padding-right:0.5rem;
}

.options{
    display:flex;
    width:45vw;
    justify-content:space-evenly;
    position:relative;
    top:1rem;
}

#whatsapp{
    background-color:#ffc629;
    height:2.8rem;
    width:13rem;
    border:none;
    border-radius:1.5rem;
}

#whatsapp:hover{
    opacity:0.7;
}

.wpicon{
    font-size:1.5rem;
    position:relative;
    right:0.5rem;
}

span{
    font-weight:600;
    position:relative;
    top:-0.2rem;
    font-size:0.9rem;
}

#hamburgermenu{
    background:none;
    border:none;
    display:none;
}

.option{
    font-weight:400;
    font-size:0.8rem;
    width:4rem;
    height:1.8rem;
    text-decoration:none;
}

#home{
    border-bottom: 0.2rem solid #ffc629;
    font-weight:900;
}

.option:hover{
    border-bottom: 0.2rem solid #ffc629;
    opacity:0.7;
}

.mainContactSection{
    padding:4rem;
    display:flex;
    flex-direction:column;
}

#contactHead{
    font-size:7rem;
    font-weight:550;
    font-family:'Times New Roman', Times, serif;
    white-space:nowrap;
}

#contactMain{
    color:#62666D;
    font-size:1.5rem;
    font-weight:500;
    padding:1rem;
    white-space:nowrap;
}

.detailBox{
    background-color:#FFF9E9;
    display:flex;
    justify-content:center;
    padding:5rem;
    flex-wrap:wrap;
    gap:40px;
}

.box{
    height:12rem;
    width:19rem;
    background-color:white;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:space-evenly;
    border-radius:1rem;
}

#icon{
    background-color:#FFF9E9;
    height:4rem;
    width:4rem;
    border-radius:50%;
}

#allIcon{
    font-size:2rem;
    position:relative;
    top:0.9rem;
}

#boxhead{
    font-size:1.5rem;
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}

#boxmain{
    color:#62666D;
}

@media (max-width:1100px) and (min-width:850px){
    .logo{
        height:4.3rem;
    }
    .option{
        font-size:0.7rem;
        width:2.8rem;
        height:1.4rem;
    }
    #whatsapp{
        height:2.4rem;
        width:10.5rem;
    }
    .wpicon{
        font-size:1.2rem;
        position:relative;
        left: -3px;
    }
    span{
        font-size:0.7rem;
    }
    .mainContactSection{
    padding-top:3rem;
    padding-bottom:3rem;
    padding-left:0rem;
    padding-right:0rem;
    }
    #contactHead{
    font-size:5rem;
    }
    #contactMain{
    font-size:1.1rem;
    }
}

@media (max-width:850px) and (min-width:600px){
    .logo{
        height:3.5rem;
        position:relative;
        left:0.4rem;
    }
    .option{
        font-size:0.6rem;
        width:2.5rem;
        height:1.2rem;
    }
    #whatsapp{
        height:2.2rem;
        width:9.2rem;
    }
    .wpicon{
        font-size:1.1rem;
        position:relative;
        left:-3px;
    }
    span{
        font-size:0.6rem;
    }
    .mainContactSection{
    padding-top:3rem;
    padding-bottom:3rem;
    padding-left:0rem;
    padding-right:0rem;
    }
    #contactHead{
    font-size:4rem;
    }
    #contactMain{
    font-size:0.8rem;
    padding-left:0rem;
    padding-right:0rem;
    }
    .detailBox{
    padding:0rem;
    padding-top:2rem;
    padding-bottom:2rem;
    }
}

@media (max-width:600px) and (min-width:400px){
    .logo{
        height:2.9rem;
    }
    .options{
        display:none;
    }
    .open{
        display:flex;
        flex-direction:column;
        position:absolute;
        right:0rem;
        align-items:center;
        top:3rem;
        z-index: 1;
        width:10rem;
        background-color:#FFF9E9;
        gap:10px;
        padding:0.5rem;
    }
    #whatsapp{
        height:1.8rem;
        width:8.5rem;
    }
    .wpicon{
        font-size:0.9rem;
        position:relative;
        left:-1px;
    }
    span{
        font-size:0.6rem;
        position:relative;
        top:-1px;
    }
    #hamburgermenu{
        display:block;
    }
    .mainContactSection{
    padding-top:2rem;
    padding-bottom:2rem;
    padding-left:0rem;
    padding-right:0rem;
    }
    #contactHead{
    font-size:2.5rem;
    }
    #contactMain{
    font-size:0.5rem;
    padding-left:0rem;
    padding-right:0rem;
    }
    .detailBox{
    padding:0rem;
    padding-top:2rem;
    padding-bottom:2rem;
    }
}

@media (max-width:400px) and (min-width:350px){
    .logo{
        height:2.9rem;
    }
    .options{
        display:none;
    }
    .open{
        display:flex;
        flex-direction:column;
        position:absolute;
        right:0rem;
        align-items:center;
        top:3rem;
        z-index: 1;
        width:10rem;
        background-color:#FFF9E9;
        gap:10px;
        padding:0.5rem;
    }
    #whatsapp{
        height:1.8rem;
        width:8.5rem;
    }
    .wpicon{
        font-size:0.9rem;
        position:relative;
        left:-1px;
    }
    span{
        font-size:0.6rem;
        position:relative;
        top:-1px;
    }
    #hamburgermenu{
        display:block;
    }
    .mainContactSection{
    padding-top:1rem;
    padding-bottom:1rem;
    padding-left:0rem;
    padding-right:0rem;
    }
    #contactHead{
    font-size:2.1rem;
    }
    #contactMain{
    font-size:0.45rem;
    padding-left:0rem;
    padding-right:0rem;
    }
    .detailBox{
    padding:0rem;
    padding-top:2rem;
    padding-bottom:2rem;
    }
}
