/* header_design */
@import url('https://fonts.googleapis.com/css2?family=Mukta:wght@200;300;400;500;600;700;800&display=swap');
*{
    font-family: 'Mukta', sans-serif !important;
}
.logo_header {
    display: grid;
    /* grid-template-columns: 0.5fr 1fr; */
    margin: 10px 0;
    align-items: center;
}
.logo_header .date_social{
    display:flex;
    margin:auto;
    grid-gap:15px;
}
.header_nav li a{
    font-weight: 600;
    font-size: 15px;
}
.header_nav ul.navbar-nav{
    width: 100% !important;
    display: flex !important;
    flex-flow: row wrap !important;
    justify-content: space-between !important;
}
.logo_header .date_social ul{
    display:flex;
    grid-gap:15px;
}
.logo_header .date_social ul li{
list-style: none;
}
.logo_todays_date{
    align-self: center;
}

.logo_header .nav_charity {
    align-self: center;
    text-align: center;
}
.logo_header .nav_charity img {
    width: 100%;
    margin-bottom: 5px;
}
.logo_header .todays_date{
    text-align: center;
    font-size: 15px;
    font-weight: 500;
}
.logo_header .logo{
    text-align: center;
}
.logo_header .logo img{
    width:100%;
    height: 100px;
    object-fit:contain;

}
.header_nav{
    padding: 0 1rem ;
    background: #6b0f0f;
        box-shadow: 0 5px 5px -1px rgb(197 197 197 / 72%);
}
.header_nav li{
    padding: 3px 0;
    position: relative;
}
.header_nav a{
    color:#fff;
}

.header_nav li::after {
    content: '';
  position: absolute;
  width: 0;
  height: 1px;
  left: 50%;
  bottom:0;
  background-color: white;
  transition: all ease-in-out .2s;
}
.header_nav li:hover {
  border-bottom: 1px solid #FFFFFF;

}
.header_nav li:hover::after{
  width: 100%;
  left: 0;
}
.navbar-toggler-icon{
    width: 27px;
    height: 3px;
    background-color: black;
    margin: 6px 0;
    display: grid;
}
.navbar .icon-bar {
    padding: 3px 0;
    display: block;
    border-bottom: 2px solid #fff;
    width: 25px;}
    .fa{
        font: normal normal normal 14px/1 FontAwesome !important;
    }
    .date_social img{
        width:25px;
        height:auto;
    }
@media only screen and (max-width: 500px) {
    .logo_header .date_social {
        display: grid;
    }
  }
@media only screen and (max-width: 768px) {
    .logo_header .todays_date {
        font-size: 12px;
        font-weight: 600;
    }
  }
@media only screen and (max-width: 462px) {
    .logo_header {

        grid-template-columns: 1fr;

        grid-gap: 20px;

    }
  }