@media screen and (max-width: 1024px) and (min-width: 240px){
    .page_width{padding: 0px 15px;}
    .gerenric-padding{padding: 40px 0px;}
    .gerenric-content .content-col{width: 100%;}
    .gerenric-project .project-col{width: 50%; padding: 15px;}
    .gerenric-project .project-card img{height: 400px;}
    .inner-heading{font-size: 30px; margin-bottom: 25px;}

    #logo{width: 120px;}
    #header-secton{height: auto;}
    #header-secton .header-title .eastern-logo{width: 90px;}
    #header-secton .header-title h1{font-size: 22px; line-height: 70%;}
    #header-secton .header-title h1 span{font-size: 9px;}
    #header-secton .header-account .header-website-link{font-size: 12px;}
    #header-secton .header-account .account-dropdown{top: 45px;}
    #navigation-bottom{ display: block; padding: 0px 15px; height: auto;}
    .nav-icon ul li a {padding: 18px 18px;}
    .nav-icon ul li a img{width: 18px;}
    .nav-icon{ display: inline-block; margin: 10px 0px;}
    .select-project{margin: 10px 0px;}
    .image-form{margin: 10px 0px;}

    #footer-section{font-size: 14px;padding: 25px 0px}

}
@media screen and (max-width: 800px) and (min-width: 240px){}

@media screen and (max-width: 650px) and (min-width: 240px){
    .gerenric-content .content-heading{height: 65px;}
    .gerenric-content .content-heading h2{font-size: 16px;}
    .gerenric-content .content-detail{padding: 20px;}
    .gerernic-button{height: 55px; font-size: 16px; min-width: 180px;}
    .gerernic-input{height: 55px; font-size: 16px; padding: 15px 15px;}
    .gerenric-form ul li{font-size: 16px;}
    .gerenric-form ul li .form-left{width: 100%; padding-right: 0px; margin-bottom: 15px;}
    .gerenric-form ul li .form-right{width: 100%; padding-left: 0px;}
    .social-media{flex-wrap: wrap; justify-content: center;}
    .social-media .social-div{font-size: 14px;}
    .social-media .social-div:first-child{width: 100%; margin-bottom: 8px;}
    .social-media .social-div img{width: 27px;}
    .inner-heading{font-size: 28px;}
    .gerenric-project .project-col{width: 320px;margin: auto;}
    .gerenric-project .project-card img{height: 360px;}
    .gerenric-project .project-card .project-overlay{height: 55px; font-size: 18px;}
    
    #header-secton {padding: 9px 0px 30px 0px; display: flex; justify-content: center; position: relative;}
    #logo{width: 100px;}
    #header-secton .header-title{position: absolute; justify-content: center;bottom: 5px; left: 0%; right: 0%; margin: auto;}
    #header-secton .header-title .eastern-logo{width: 60px; margin-bottom: 4px;}
    #header-secton .header-title h1{font-size: 16px; line-height: 70%;}
    #header-secton .header-title h1 span{font-size: 7px;font-weight: 400;}
    #header-secton .header-account .account-dropdown{top: 55px;}

    .weather-block .weather-location-title{font-size: 16px;}
    .weather-block .weather-centi-text{font-size: 30px;}
    .weather-block .weather-cloud{font-size: 16px;}
    .weather-block .now-div .now-text{font-size: 16px;}
    .map-section iframe{height: 350px;}

}

@media screen and (max-width: 480px) and (min-width: 240px){}

@media screen and (max-width: 380px) and (min-width: 240px){}

@media screen and (max-width: 320px) and (min-width: 240px){}

@media screen and (max-width: 270px) and (min-width: 240px){}