:root {
    --h_red: #97130b;
    --mbg: #393e46;
    --hover_bg: #393e4699;
    --hyperli: #5e5c43;
    --hyperh: #97130f;
    --dark_h: #22222299;
    --mbg2: #222222;
    --main2: #e3e3de;
    --colp: #f1f1f1;
    --link: #5e5c43;
    --fcolor: #5e5c43;
    --bg2: 230 229 209;
  }

@font-face {
    font-family: rich;
    src: url(./fonts/English\ strong\ font.otf);
    display: swap;

}

@font-face {
    font-family: graph;
    src: url(./fonts/GraphikRegular.otf);
    display: swap;
}

@keyframes menu_log {
    0% {
        opacity: 0;
        transform: translateY(20px);
      }
      100% {
        opacity: 1;
        transform: translateY(0);
      }
}

/* start of custom classes for tailwind */

.beige_bg:hover {
    background-color: rgb( var(--bg2) / var(--tw-bg-opacity));
}

/* start of custom classes for tailwind */

.nav_links{
    border-radius: 0px 0px 0px 11px;
}

@media (max-width: 1024px){
    .hide{
        display: none;
    }
}

@media only screen and (min-width: 1024px){
    #sub_menu:hover > .sub_links{
        display: block;
        animation: menu_log 0.4s ease-in-out;
    }
}

#sub_menu .sub_links li:hover > a{
    color: #97130b;
}

p{
    color: black !important;
}
.s_btn{
    background-color: var(--hyperh);
}

.initiative_d{
    background-image: url('./img/initiative01.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.vision_d{
    background-image: url('./img/vision01.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.s_menu a:hover{
    background-color: #fbfbfb;
    box-shadow: 1px 1px 1px var(--dark_h);
}
.all_d{
    background-image: url('./img/ods-materia-opacity-70.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.contact_d{
    background-image: url('./img/contact-us-opacity70.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.signup_d{
    background-image: url('./img/sign-up-opacity75.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;   
}
.donate_d{
    background-image: url('./img/donate-opacity80.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;   
}