/*!This is for responsiveness of my website */





@media only screen and (max-width: 1100px){
    body {
        width: 100%;
    }
    .main-header--all{
        max-width: 100%;
    }
    .main-section--all{
        max-width: 100%;
    }
    .nav-list{
        flex-direction: column;

    }
    .navbar{
        width: 100%;
        height: 478px;
        flex-direction: column;
        transition: all 0.3s ease-out;

    }
    .right-nav{
        width: 100%;
    }
    .section{
        padding: 10px;
    }
    .right-nav{
        width: 60%;
        text-align: center;
    }
    #Search{
        width: 100%;
    }
    .burger{
        display: block;
    }
    .logo-resp{
        display: block;
    }
    .h-nav-resp{
        height: 72px;
    }
    .v-class-resp{
        opacity: 0;
    }
    .box-main{
        flex-direction: column-reverse;
        max-width: 100%;
        padding: 20px;
    }
    .section{
        flex-direction: column-reverse;
        height: auto;
    }
    .big-text{
        text-align: center;
        font-size: 25px;
        font-weight: 700;
        
    }
    .small-text{
        text-align: center;
        font-size: 15px;
        margin: 20px 0px;
    }
    .header-main{
        padding: 0;
    }
    .button{
        text-align: center;
    }
    .button a{
        font-size: 15px;
        font-weight: 700;
    }
    .paras{
        padding: 0;
    }
    .SectionSubTag{
        text-align: center;
    }
    footer{
        display: grid;
        grid-template-columns: 1fr ;
    }
    .follow{
        font-size: 10px;
    }
    .social-icon-wrap {
        font-size: 10px;
        text-align: center;
    }
    .secondHalf img{
        width: 100%;
        border: 4px solid whitesmoke;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        -o-border-radius: 5px;
        display: block;
        margin: auto;
    }
    footer h1{
        font-size: 20px;
    }
    footer .address{
    font-size: 10px;
    text-align: center;
    }
    .my {
        font-size: 2.4rem;
    }
    .logo {
        display: none;
    }
    [popover] {
        position: fixed;
        top: 75%;
        left: 85%;
        transform: translate(-50%, -50%);
    }

    .background-h {
        max-width: 100%;
}
.button-pop--up {
    width: 50px;
    height: 50px;
}

}