/*********************************************/
/***Volunteer Page Responsive Design Changes***/
/*********************************************/

@media screen and (min-width: 200px) and (max-width: 1024px){
    body{
        overflow-x: hidden !important;
    }
}

@media screen and (min-width: 200px) and (max-width: 1024px){
    body{
        overflow-x: hidden !important;
    }
}
@media screen and (min-width: 200px) and (max-width: 1024px){
    .volmidmenu{
        display:none !important;
    }
}
@media screen and (min-width: 200px) and (max-width: 475px){
    .zoneMiddleHeaderWrapNoBlue{
        font-size: 10pt !important;
    }
}
@media screen and (max-width: 364px){
    .threelinebreadcrumb{
        height: 52px !important;
        padding-right: 15px;
        width: 95vw !important;
    }
}
@media screen and (max-width: 394px){
    .threelinebreadcrumblarge{
        height: 52px !important;
        padding-right: 15px;
        width: 95vw !important;
    }
}

@media screen and (max-width: 767px){
  /*Phones breakpoint*/
    .BottomColumns{
        width: 90vw !important;
        border-left: none !important;
        border-right: none !important;
    }
    .aboutpara span{
        font-size: 4.5vmin !important;
    }
    .zoneMiddleMenuWrap2{
        width: 100% !important;
        position: relative !important;
        overflow: hidden !important;
    } 
    .menuBackGroundLayerThreeJoinLMHS, .aboutlmhssubbackgroundLayer2, .aboutlmhssubbackgroundLayer1{
        background-repeat: no-repeat !important;
        background-size: contain !important;
        height: 55.5vw !important;
    }
    .aboutlmhssubbackgroundLayer2 h2{
        display:none !important;
    }
    .MobileVolFact{
        position: relative;
         height: 60vw;
     }
     .MobileVolFact::before {
        content: "About Us";
        font-size: 20px; 
        color: #003b6f; 
        font-family: verdana, geneva, sans-serif;
        font-weight:bold;
        position: relative;
        /* top: 2px; */
        margin-top:0px;
        padding-left: 1em;
    } 
    .zoneMiddleHeaderWrapNoBlue{
        font-size: 9pt !important;
        padding-left: 1.5em;
        min-width: 0px !important;
        width: 98vw;
    }
    .longbreadcrumb{
        height: 38px !important;
        padding-right: 15px;
    }
    .threelinebreadcrumb{
        height: 38px;
        padding-right: 15px !important;
    }
    .threelinebreadcrumblarge{
        height: 38px;
        padding-right: 15px !important;
    }

}
@media screen and (min-width: 768px) and (max-width: 1024px){
    /* Tablet breakpoint */
    .BottomColumns{
        width: 96vw !important; 
        border: none !important;   
    }
    .aboutpara span{
        font-size: 2.0vmin !important;
    }
    .zoneMiddleMenuWrap2{
        width: 100% !important;
        position: relative !important;
        overflow: hidden !important;
    }
    .menuBackGroundLayerThreeJoinLMHS, .aboutlmhssubbackgroundLayer2, .aboutlmhssubbackgroundLayer1{
        background-repeat: no-repeat !important;
        background-size: contain !important;
        height: 27.5vw !important;
    }
    .menuBackGroundLayerThreeJoinLMHS a{
        position: relative; bottom:45px;
        font-size:  13px !important;
    }
    .menuBackGroundLayerThreeJoinLMHS h1{
        position: relative; bottom: 25px;
        font-size:  22px !important;
    }
    .MobileVolFact{
        position: relative;
         height: 47vw;
     }
     .MobileVolFact::before {
        content: "About Us";
        font-size: 20px; 
        font-weight:bold;
        color: #003b6f; 
        font-family: verdana, geneva, sans-serif;
        position: relative;
        top: 1vw;
        padding-left: 1em;
    } 
    .zoneMiddleHeaderWrapNoBlue{
        font-size: 9pt !important;
        padding-left: 1.5em;
    }
    .Slogan-Div{
        padding-left: 1.5em !important;
    }
}
