.top-banner {
    background-color: rgba(255, 255, 255, 0);
}
.top-banner > .clearfix {
    background: rgb(34,114,195);
    background: linear-gradient(139deg, rgba(34, 114, 195, 0.92) 0%, rgba(253, 45, 142, 0.81) 100%);
}
.banner-top {
    height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.banner-top img {
    width: 100%;
}
.top-head {
    display: none;
}

.banner-top:before {
    content: " ";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgba(0, 21, 53, 0.66) 80%);
}
.header-section {
    position: relative;
    margin-bottom: 25px;
}
.header-section h1, .header-section h2 {
    margin: 0;
    color: #fff;
}
.header-section h1 {
    font-family: 'Oswald', sans-serif;
    font-size: 2.5rem;
    text-transform: uppercase;
    margin-bottom: -6px;
}
.header-section h2 {
    font-family: 'Open Sans', sans-serif;
    font-size: 1.5rem;
    line-height: 2rem;
}

.header-section .project{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 10px;
}
span.proj-d-t {
    font-size: 0.9rem;
    font-weight: 600;
}
.proj-d {
    background: #fff;
    text-align: left;
}
.sum {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 100;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #ccc;
}
.dis {
    padding: 0 20px;
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-bottom: 1px solid #ccc;
    font-size: 1rem;
    line-height: 1.6rem;
}
.emb {
    background: #1b1b1b;
    padding: 30px;
    margin-bottom: 30px;
}
.emb iframe {
    margin: 0 auto;
    display: block;
    width: 100%;
}
.initiative-nav{
    text-align: center;
    padding: 20px 0;
}
.initiative-nav a{
    color: #fff;
    border: 1px solid;
    padding: 4px 10px;
    width: 90px;
    display: inline-block;
    border-radius: 40px;
}
section {
    background: #f5f5f5;
    margin-bottom: 50px;
    padding: 20px;
}

.proj-d > div > div {
    margin: 0 0 10px 0;
    padding: 0 0 10px 0;
    border-bottom: 1px solid #e8e8e8;
}
.proj-d > div > div:nth-child(2) {
    border: 0;
    margin: 0 0 0px 0;
}

.social-links {
    text-align: left;
    border-bottom: 1px solid rgb(239, 239, 239);
    border-top: 1px solid rgb(239, 239, 239);
}
.social-links span a {
    font-size: 0;
    text-decoration: none;
    border-bottom: 0;
    padding: 17px 4px 4px 4px;
    display: inline-block;
    margin: 0 2px;
}
.social-links span a:before{
    font-family: 'Socicon' !important;
    font-size: 1.2rem;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-decoration: none;
    border-bottom: 0;
}



span.web a:before{
    content: "\e957";
}
span.fb a:before {
    content: "\e028";
}
span.twitter a:before {
    content: "\e08d";
}
span.linkdin a:before {
    content: "\e04c";
}
span.insta a:before {
    content: "\e044";
}
span.yt a:before {
    content: "\e0a5";
}

.edit {
    padding: 20px 0 0 0;
}

.sdgs span.sdg {
    display: inline-block;
    width: 30px;
    height: 30px;
    overflow: hidden;
    font-size: 1px;
    line-height: 0;
    background-color: #ccc;
    background-size: cover;
    border: 0px;
    margin: 1px 2px 0 0;
    padding: 0;
}
span.ot i {
    font-style: normal;
    display: block;
    line-height: 1;
    font-weight: 600;
}
span.ot {
    display: block;
    font-size: 0.9rem;
    padding: 0 10px 10px 10px;
    overflow: hidden;
    word-wrap: break-word;
}

.fancybox-inner h5.alert.alert-info {
    background: rgba(255, 255, 255, 0);
    border: 0;
    color: #252525;
    padding: 40px;
    text-align: center;
    font-size: 1.5rem;
    font-weight: 300;
    line-height: 1.8rem;
    margin: 0;
}
a.fancybox-item.fancybox-close {
    background: none;
    top: 0;
    right: 0;
    border-bottom: 0;
    color: #797575;
}
a.fancybox-item.fancybox-close:before {
    content: "×";
    text-align: center;
    display: block;
    font-size: 2rem;
    padding: 8px;
}

span.proj-d-c {
    margin: 0 10px;
    color: #ffffff;
    font-size: 0.9rem;
    font-weight: 400;
    border-radius: 30px;
    padding: 3px 10px;
}
span.proj-d-c.Mobilizer{background: rgba(252,196,21,1);    color: #000000;}
span.proj-d-c.Storyteller{background: rgba(235,64,46,1);}
span.proj-d-c.Campaigner{background: rgba(98,180,70,1);}
span.proj-d-c.Visualizer{background: rgba(6,73,115,1);}
span.proj-d-c.Connector{background: rgba(34,188,238,1);}
span.proj-d-c.Includer{background: rgba(163,28,68,1);}
span.proj-d-c.Creative{background: rgba(231,19,104,1);}

span.sdg.sdg-1 {
    background-image: url("../images/sdg-1.png");
}

span.sdg.sdg-7 {
    background-image: url("../images/sdg-7.png");
}
span.sdg.sdg-3 {
    background-image: url("../images/sdg-3.png");
}
span.sdg.sdg-2 {
    background-image: url("../images/sdg-2.png");
}
span.sdg.sdg-4 {
    background-image: url("../images/sdg-4.png");
}
span.sdg.sdg-5 {
    background-image: url("../images/sdg-5.png");
}
span.sdg.sdg-6 {
    background-image: url("../images/sdg-6.png");
}
span.sdg.sdg-8 {
    background-image: url("../images/sdg-8.png");
}

span.sdg.sdg-10 {
    background-image: url("../images/sdg-10.png");
}
span.sdg.sdg-11 {
    background-image: url("../images/sdg-11.png");
}
span.sdg.sdg-12 {
    background-image: url("../images/sdg-12.png");
}
span.sdg.sdg-13 {
    background-image: url("../images/sdg-13.png");
}
span.sdg.sdg-14 {
    background-image: url("../images/sdg-14.png");
}
span.sdg.sdg-15 {
    background-image: url("../images/sdg-15.png");
}
span.sdg.sdg-16 {
    background-image: url("../images/sdg-16.png");
}
span.sdg.sdg-17 {
    background-image: url("../images/sdg-17.png");
}
span.sdg.sdg-9 {
    background-image: url("../images/sdg-9.png");
}
span.sdg.sdg-ALL {
    background-image: url("../images/sdg-all.png");
}

.fancybox-inner section {
    background: rgba(255, 255, 255, 0);
}
.fancybox-inner section h3 {
    padding: 0;
    margin: 0;
    color: #000;
    font-family: 'Open Sans', sans-serif;
    font-size: 1.2rem!important;
    text-transform: unset;
    font-weight: 400;
}

.social-links span a:empty,
.social-links span a[href=""],
.social-links span.ot[title=""],
.emb:empty{
    display: none;
}

@media only screen and (min-device-width: 668px){
    .lg-hide{
        display: none;
    }
}
@media only screen and (max-device-width: 667px) {
    .sticky.logo {
        padding: 0px;
    }
    .map .row {
        display: block;
    }
    div#map {
        width: 100%!important;
    }
    section.map {
        margin: 0 -15px;
        padding: 15px;
    }
    .header-section {
        margin: -3px -20px 17px -20px;
    }
    .banner-top:before{
        background: rgba(0, 0, 0, 0.48);
    }
    .dis {
        padding: 0 5px;
        padding-bottom: 30px;
        margin-bottom: 30px;
        border-bottom: 1px solid #ccc;
        font-size: 1.2rem;
        line-height: 2rem;
        text-align: center;
    }
    .logo img {
        width: 40%;
        margin: 0 auto;
        display: block;
    }
    .brand span.logo-w {
        padding: 20px 40px;
        display: block;
        margin: 0 -30px;
    }

    .sm-hide{
        display: none;
    }
    .initiative-nav {
        padding: 5px 0 20px 0;
    }

}