/********************* Mobile Stylesheet ********************/

@media only screen and (min-width: 320px) and (max-width: 1080px) {
    
    /* Home Page Start */

    #top-bar {
        width: 100%;
        height: 50px;
        background-image: url(../images/top-header-back.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }

    #header {
        background-image: url(../images/menu-back.jpg);
        background-repeat: repeat-x;
        background-size: cover;
        background-position: center;
        width: 100%;
        display: block;
        transition: top 0.3s;
        padding: 20px 0px !important;

    }

    #header .social img{
        width: 19px !important;
        height: 18px !important;
    }
    
    #header .social {

    margin: 10px 0px 0px 10px;

    }

    #intro-slider img {
        width: 100%;
        height: 200px;
    }

    #intro-slider {
        background-image: url(../images/content-back.jpg);
        background-repeat: repeat;
        background-size: contain;
        padding: 30px 0px;
    }

    #intro-slider h4 {
        font-size: 0.5em;
        color: #fff;
        font-weight: 400;
        font-family: 'Roboto', sans-serif !important;
        text-transform: uppercase;
        margin-top: -21px;
        margin-bottom: 40px;
    }

    #home-hero {
        background-image: url(../images/body-bg.jpg);
        background-repeat: repeat;
        background-size: contain;
        padding: 10px 10px;
    }

    #foot h5 {
        font-family: 'Roboto', sans-serif !important;
        font-style: normal;
        font-weight: 400;
        font-size: 0.9em;
        text-align: center;
        line-height: 24px;
        letter-spacing: 0.14em;
        color: #40210e !important;
        margin-bottom: 25px;
    }

    

    /* Home Page End */

    /* Whoe We are Start*/

    #who-we-are {
        padding: 20px 10px;
        background-image: url(../images/body-bg.jpg);
        background-repeat: repeat;
        background-size: auto;
    }

    #who-we-are img {
        float: left;
        margin: 10px 25px 40px 0px;
    }

    #who-we-are-right {
        padding: 0px 30px;
        margin-top: 30px;
    }

    /* Whoe We are End*/

    /* Vocations Start */
    #vocations {
        padding: 50px 20px;
        background-image: url(../images/body-bg.jpg);
        background-repeat: repeat;
        background-size: auto;
    }

    #vocations-right {
        padding: 0px 30px !important;
        margin-top: 30px !important;
    }

    #vocations-left {
        background: url(../images/content-left-side-bg.png) top right repeat-y;
        padding: 0px 30px;
    }
    /* Vocations End*/

    /* Our-5-priorites Start */

    #our-5-prior {
        padding: 20px 40px;
        background-image: url(../images/body-bg.jpg);
        background-repeat: repeat;
        background-size: auto;
    }

    /* Our-5-priorites End */
    

    /* Events Start */
    #events {
        padding: 20px 20px;
        background-image: url(../images/body-bg.jpg);
        background-repeat: repeat;
        background-size: auto;
    }

    #events-right {
        padding: 0px 15px !important;
        margin-top: 30px !important;
    }
    /* Events End */

    /* List Of donors start */
    #list-donors {
        padding: 20px 20px;
        background-image: url(../images/body-bg.jpg);
        background-repeat: repeat;
        background-size: auto;
        overflow: hidden;
    }

    /* List of donors end */

    /* Gallery Start */
    #gallery {
        overflow: hidden;
        padding: 20px 20px;
        background-image: url(../images/body-bg.jpg);
        background-repeat: repeat;
        background-size: auto;
    }
    /* Gallery End */

    /* Our-community Start */
    #our-community {
        padding: 20px 20px;
        background-image: url(../images/content-back.jpg);
        background-repeat: repeat;
        background-size: contain;
    }

    #our-community .btn-sub {
        color: #fff;
        font-size: 0.6em;
        font-family: 'Roboto', sans-serif !important;
        font-weight: 400;
        background-color: #40210e;
        border-color: #40210e;
        border-radius: 4px;
        padding: 4px 12px;
        margin: -70px 0px 0px 95px;
       
    }

    /* Our-community End */

    /* Contactus Start */
    #contact {
        padding: 20px 20px;
        background-image: url(../images/body-bg.jpg);
        background-repeat: repeat;
        background-size: contain;
    }
    /* Contactus End */

}