﻿/* 2019-09-09 16:45:15 */
.video-player {position: relative;padding-bottom: 56.25%;padding-top: 30px;height: 0;overflow: hidden;}
.video-player iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.graypurpleText {color: #b1bbff;}

@media only screen and (min-width: 300px) {
    .bx-wrapper .bx-pager.bx-default-pager a {
        background: #666;
        text-indent: -9999px;
        display: block;
        width: 10px;
        height: 10px;
        margin: 0 5px;
        outline: 0;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;box-shadow: none;border: none;}
        .bx-wrapper .bx-pager.bx-default-pager a.active {box-shadow: none; background: #7029ec;}
        .bx-wrapper .bx-pager {
        text-align: center;
        font-size: .85em;
        font-family: Arial;
        font-weight: bold;
        color: #666;
        margin-top: -23px;
        position: relative;
    }
    .bx-controls-direction {display: none;}
    .bx-wrapper .bx-next.disabled, .bx-wrapper .bx-prev.disabled {display: none;}
    .bx-wrapper .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item {
        display: inline-block;
        vertical-align: bottom;
    }
	.hero {display: flex;align-items: center;height: 450px;padding: 0;background-color: #DBE3EA;background-size: cover;background-position-x: -345px;}
	.hero-text {display: flex;flex-direction: column;align-items: left;width: 200px;}
	.hero-text h1 {margin-bottom: 30px;line-height: 38px;}
	.hero-slide1 h1, .hero-slide2 h1, .hero-slide2 h2, .hero-slide4 h1 {color: #7029EC;}
    .hero-slide2 .hero-text {width: 575px;margin-left: 0%;}
    .hero-slide3 .hero-text {width: 330px;margin-left: 0%;}
    .hero-slide3 {background-position-x: -523px;}
    .hero-slide4 .hero-text {width: 100%;margin-left: 0%;}
	.hero-text p {color: #FFF;}
    .hero-text .button {width: 152px;}
	.video-overlay {display: none;flex-direction: column;align-items: center;justify-content: center;position: fixed;top: 0;left: 0;height: 100vh;width: 100vw;padding: 20px;background-color: rgba(15, 25, 52, 0.9);z-index: 5;}
    .video-container {animation: zoomIn 0.5s ease-out 0s 1 normal forwards;}
    .video-container iframe {width: 100%;}
    .video-container .content {display: flex;flex-direction: column;align-items: center;padding: 20px;background-color: #FFF;}
    .video-container p {max-width: 100%;}
    .close {position: relative;width: 30px;height: 30px;overflow: hidden;background-color: #7029ec;}
    .close::before {transform: rotate(45deg);}
    .close::after {transform: rotate(-45deg);}
    .close::before, .close::after {content: '';position: absolute;height: 2px;width: 68%;top: 50%;left: 5px;margin-top: -1px;background: #FFF;}
    .close.black::before, .close.black::after {height: 4px;margin-top: -2px;}
    .MSIE .hero {background-position-x: center;}

	.why-fight {padding: 50px 0;background: linear-gradient(to bottom, #7029ec 75%,#5b3db2 100%);}
    .why-fight--heading {text-align: center;}
    .why-fight--events {margin-bottom: 60px;}
    .why-fight--events > div {margin: 45px 0;text-align: center;}
    .why-fight--events p {text-align: center;}
    .why-fight--events > div:first-child {margin-top: 25px;}
    .why-fight--events > div:last-child {margin-bottom: 0;}
    .why-fight--events > div:last-child p {margin-bottom: 0;}
    .why-fight--events > div > img {width: 60px;height: 60px;margin-bottom: 25px;}
    .why-fight p {color: #FFF;}
	.learn-more {display: flex;justify-content: center;}
    .MSIE .why-fight--events > div > img {margin: 0 auto 25px;}
    .MSIE .why-fight, .MSIE .build-future, .MSIE .report-card {display: block;}	
    
    .WINDOWS .why-fight--events > div > img {margin: 0 auto 25px;}
    .WINDOWS .why-fight, .WINDOWS .build-future, .WINDOWS .report-card {display: block;}	
    
    .build-future {
        display: flex;
        flex-direction: column;
        padding: 50px 0;
        text-align: center;
        overflow-x: hidden;
    }

    .build-future-content.container {
        padding: 0;
        width: 100%;
    }

    .build-future--wrapper {
        display: flex;
        width: 300vw;
        transition: .5s all;
    }

    .build-future--card {
        display: flex;
        flex-direction: column;
        width: 100%;
        margin: 0 20px;
        box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);
        text-align: left;
        background-color: #FFF;
        touch-action: manipulation;
        z-index:3;
    }

    .build-future--card .card--image {
        flex-grow: 0;
        height: 250px;
        background-size: cover;
    }

    .build-future--card .card--content {
        display: flex;
        flex-grow: 1;
        flex-direction: column;
        justify-content: space-between;
        align-items: left;
        padding: 40px 15px;
    }
    .build-future--card .card--image.card-widget-right {background-position: left top;}
    .build-future--card .card--image.card-widget-center {background-position: center;}
    .build-future--card .card--image.card-widget-left {background-position: left bottom;}
    
    .card--content p {
        margin-top: 0;
    }

    .card--content .button {
        margin-top: 15px;
    }
    
    .mobile-dots {
        display: flex;
        justify-content: center;
        margin-bottom: 35px;
        transition: .5s all;
    }

    .dot {
        width: 10px;
        height: 10px;
        margin: 0 5px;
        border-radius: 50%;
        background-color: #BEC3C5;
        transition: .5s all;
    }

    .dot.active {
        background-color: #6079FF;
    }
    
    .report-card {
        display: flex;
        flex-direction: row;
        justify-content: center;
        padding: 50px 0;
        background-color: #7029EC;
        background-image: url('/glue/images/mobile-two-color-shape-background.gif');
        background-repeat: no-repeat;
        background-size: cover;
    }
    
    .report-card-content {
        display: flex;
        flex-direction: column;
    }

    .report-card-content > div {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: left;
        width: 100%;
    }

    .report-card-map {
        margin-bottom: 60px;
    }

    .report-card-map img {
        width: 100%;
    }

    .report-card-info p {
        margin-top: 0;
    }
    
    .report-card-info a {width: 120px;}

    .community {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .community > div {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 50px 20px;
        width: 100%;
        background-size: cover;
        text-align: left;
    }

    .community .find-event {
        background-color: #EBF3F8;
    }

    .search-bar {
        display: flex;
        align-items: center;
        width: 100%;
        max-width: 500px;
        padding: 0 20px;
        background-color: #FFF;
        border-radius: 20px;
    }

    .search-bar input {
        height: 40px;
        width: 100%;
        font-size: 1.6rem;
        color: #0F1934;
        border: none;
        outline: none;
    }

    .share {
        padding: 0 20px;
    }

    .share--card {
        width: 100%;
        box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);
        text-align: left;
    }

    .share--card .card--content {
        display: flex;
        flex-direction: column;
        align-items: left;
        padding: 40px 20px;
    }
    .share--card .card--content .button {width: 120px;}
    .card--content .button.our-cause {width: 130px;}
    .card--content .button.buttonDonate {width: 164px;}
    .card--content .button.get-involved {width: 160px;}
    .share--card .card--image {
        height: 250px;
    
    }

    .stay-updated {
        display: flex;
        justify-content: center;
        height: 250px;
        padding: 50px 0;
       /* background-image: url('../img/stay-updated-bg.jpg');*/
        background-size: cover;
    }

    .stay-updated .arrow {
        border-color: #FF51BA;
    }

    .stay-updated-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
    }
}

@media only screen and (min-width: 800px) {
    h1 {
        font-size: 8.5rem;
        line-height: .85;
        margin-bottom: 15px;
    }
    
    h2 {
        font-size: 3.6rem;
        margin-bottom: 30px;
    }
    
    h3 {
        font-size: 2.6rem;
        margin-bottom: 15px;
    }
    
    h4 {
        font-size: 2.0rem;
    }
    
	.hero {justify-content: center;height: 600px;padding: 0;background-size: cover;}
    .hero-text {width: 385px;}
    .hero-text h1 {line-height: 0.90;font-size:7.5rem;}
    .hero-text .sub-heading {font-size: 2rem;}
	.video-container {max-width: 900px;}
    .close {touch-action: auto;transition: .25s all;}
    .close:hover {background-color: #BC4B91;cursor: pointer;}
    
	.mysterious-shape-left {
        position: absolute;
        width: 0;
        height: 0;
        left: 0;
        border-style: solid;
        border-width: 0 0 620px 165px;
        border-color: transparent transparent #5B3DB2 transparent;
        transform: rotate(180deg);
        z-index: 0;
    }

    .mysterious-shape-right {
        position: absolute;
        width: 0;
        height: 0;
        right: 0;
        border-style: solid;
        border-width: 0 0 550px 145px;
        border-color: transparent transparent #FF5C70 transparent;
        transform: rotate(0deg);
        z-index: 1;
    }    
    
    
	.why-fight {display: flex;justify-content: center;padding: 80px 0;}
    .why-fight--heading {margin-bottom: 50px;}
    .why-fight--events {display: flex;}
    .why-fight--events > div {width: 33.33%;margin: 0 20px;}
    .why-fight--events > div:first-child {margin-top: 0;}

    .build-future {
        display: flex;
        flex-direction: row;
        justify-content: center;
        padding: 80px 0;
        background-size: 10%;
    }

    .build-future-content.container {
        padding-left: 40px;
        padding-right: 40px;
    }

    .mobile-dots {
        display: none;
    }

    .build-future--wrapper {
        width: 100%;
    }

    .build-future--card {
        width: 33.33%;
        margin: 0 10px;
    }

    p.sub-heading {
        max-width: 840px;
        margin: 0 auto 50px;
        font-size: 1.8rem;
    }

    .build-future--card .card--content {
        padding: 40px 35px;
    }

    .report-card {
        background-image: none;
    }

    .report-card-content {
        flex-direction: row;
    }

    .report-card-map {
        margin-bottom: 0;
    }

    .report-card-info h2, .report-card-info p {
        width: 360px;
    }

    .report-card-content > div {
        padding: 0 40px;
    }

    .community {
        flex-direction: row;
    }

    .community h1 {
        font-size: 4.5rem;
    }

    .community > div {
        width: 50%;
    }

    .community > div:nth-child(1) {
        padding: 50px 80px 50px 20px;
    }

    .community > div:nth-child(2) {
        padding: 50px 20px 50px 80px;
    }

    .community .find-event {
        align-items: flex-end;
    }

    .community .find-event-content {
        max-width: 600px;
    }

    .community .share {
        align-items: flex-start;
    }

    .search-bar {
        border-radius: 25px;
    }

    .search-bar input {
        height: 50px;
    }

    .share--card {
        max-width: 530px;
    }

    .stay-updated {
        height: 300px;
    }
}
@media only screen and (min-width: 991px) {
    .bx-controls-direction {display:block;}
    .hero-slide2 .hero-text {width: 575px;margin-left: -24%;}
    .hero-slide3 .hero-text {width: 675px;margin-left: -30%;}
    .hero-slide3 {background-position-x: -345px;}
    .hero-slide4 .hero-text {width: 748px;margin-left: 0%;}
}
@media only screen and (min-width: 495px) {
    .hero-slide3 {background-position-x: -345px;}
}
@media only screen and (min-width: 800px) {
    .mysterious-shape-left {top: 1677px;}
    .mysterious-shape-right {top: 1759px;}
}
@media only screen and (min-width: 807px) {
    .mysterious-shape-left {top: 1658px;}
    .mysterious-shape-right {top: 1740px;}
}
@media only screen and (min-width: 821px) {
    .mysterious-shape-right {top: 1737px;}
}
@media only screen and (min-width: 830px) {
    .mysterious-shape-right {top: 1718px;}
}
@media only screen and (min-width: 904px) {
    .mysterious-shape-left {top: 1639px;}
    .mysterious-shape-right {top: 1722px;}
}
@media only screen and (min-width: 992px) {
    .mysterious-shape-left {top: 1649px;}
    .mysterious-shape-right {top: 1740px;}
}
@media only screen and (min-width: 1024px) {
    .mysterious-shape-right {top: 1770px;}
}
@media only screen and (min-width: 1081px) {
    .mysterious-shape-right {top: 1789px;}
}
@media only screen and (min-width: 1232px) {
    .mysterious-shape-right {top: 1767px;}
    .hero-slide4 .hero-text {margin-left: -20%;}
}

@media only screen and (min-width: 1262px) {
    .mysterious-shape-left {top: 1631px;}
    .mysterious-shape-right {top: 1748px;}
}

@media only screen and (min-width: 1200px) {
    .community h1 {font-size: 6.5rem;}
}

@media only screen and (min-width: 1300px) {
    .community h1 {font-size: 7.5rem;}
    .hero-slide2 .hero-text {width: 575px;margin-left: -53%;}
}
@media only screen and (min-width: 470px) {
    .build-future--card .card--image {height: 300px;}
}
@media only screen and (min-width: 600px) {
    .build-future--card .card--image {height: 400px;}
}
@media only screen and (min-width: 800px) {
    .build-future--card .card--image {height: 250px;}
}
@media only screen and (min-width: 700px) {
    .hero {background-position-x: -205px;}
}
@media only screen and (min-width: 800px) {
    .hero {background-position-x: -305px;}
    .WINDOWS .hero {background-position-x: 0px;}
}
@media only screen and (min-width: 1047px) {
    .hero {background-position-x: initial;}
    .hero.hero-slide2 {background-position-y: 50%;}
    .hero.hero-slide4 {background-position-y: 50%;}
}
/***** Start Hero Text Adjustment ************/
@media only screen and (min-width: 300px) {
    .MSIE .hero-text {margin-left: -260%;}
}
@media only screen and (min-width: 800px) {
    .hero-text {margin-left: 0px;}
}
@media only screen and (min-width: 992px) {
    .hero-text {margin-left: -76%;}
}
@media only screen and (min-width: 899px) and (max-width: 1099px) {
    .MSIE .hero-text {margin-left: -150%;}
    /*.WINDOWS .hero-slide2 .hero-text {margin-left: -70%;}
    .WINDOWS .hero-slide4 .hero-text {margin-left: -30%;}
    .WINDOWS .hero-slide1 .hero-text {margin-left: -154%;}*/
    .MSIE .hero-slide2 .hero-text {margin-left: -70%;}
    .MSIE .hero-slide4 .hero-text {margin-left: -30%;}
    .MSIE .hero-slide1 .hero-text {margin-left: -154%;}
}
@media only screen and (min-width: 1100px) and (max-width: 1300px) {
    .MSIE .hero-text {margin-left: -180%;}
    /*.WINDOWS .hero-slide2 .hero-text {margin-left: -103%;}
    .WINDOWS .hero-slide4 .hero-text {margin-left: -56%;}
    .WINDOWS .hero-slide1 .hero-text {margin-left: -204%;}*/
    .MSIE .hero-slide2 .hero-text {margin-left: -103%;}
    .MSIE .hero-slide4 .hero-text {margin-left: -56%;}
    .MSIE .hero-slide1 .hero-text {margin-left: -204%;}
}
@media only screen and (min-width: 1300px) and (max-width: 1500px) {
    .MSIE .hero-text {margin-left: -200%;}
    /*.WINDOWS .hero-slide2 .hero-text {margin-left: -125%;}
    .WINDOWS .hero-slide4 .hero-text {margin-left: -73%;}
    .WINDOWS .hero-slide1 .hero-text {margin-left: -237%;}*/
    .MSIE .hero-slide2 .hero-text {margin-left: -125%;}
    .MSIE .hero-slide4 .hero-text {margin-left: -73%;}
    .MSIE .hero-slide1 .hero-text {margin-left: -237%;}
}
@media only screen and (min-width: 1500px) and (max-width: 1700px) {
    .MSIE .hero-text {margin-left: -220%;}
    /*.WINDOWS .hero-slide2 .hero-text {margin-left: -142%;}
    .WINDOWS .hero-slide4 .hero-text {margin-left: -87%;}
    .WINDOWS .hero-slide1 .hero-text {margin-left: -263%;}*/
    .MSIE .hero-slide2 .hero-text {margin-left: -142%;}
    .MSIE .hero-slide4 .hero-text {margin-left: -87%;}
    .MSIE .hero-slide1 .hero-text {margin-left: -263%;}
}
@media only screen and (min-width: 1700px) and (max-width: 1900px) {
    .MSIE .hero-text {margin-left: -240%;}
    /*.WINDOWS .hero-slide2 .hero-text {margin-left: -158%;}
    .WINDOWS .hero-slide4 .hero-text {margin-left: -100%;}
    .WINDOWS .hero-slide1 .hero-text {margin-left: -287%;}*/
    .MSIE .hero-slide2 .hero-text {margin-left: -158%;}
    .MSIE .hero-slide4 .hero-text {margin-left: -100%;}
    .MSIE .hero-slide1 .hero-text {margin-left: -287%;}
}
@media only screen and (min-width: 1900px) and (max-width: 2100px) {
    .MSIE .hero-text {margin-left: -260%;}
    /*.WINDOWS .hero-slide2 .hero-text {margin-left: -168%;}
    .WINDOWS .hero-slide4 .hero-text {margin-left: -107%;}
    .WINDOWS .hero-slide1 .hero-text {margin-left: -300%;}*/
    .MSIE .hero-slide2 .hero-text {margin-left: -168%;}
    .MSIE .hero-slide4 .hero-text {margin-left: -107%;}
    .MSIE .hero-slide1 .hero-text {margin-left: -300%;}
}
@media only screen and (min-width: 2100px) and (max-width: 2300px) {
    .MSIE .hero-text {margin-left: -280%;}
    /*.WINDOWS .hero-slide2 .hero-text {margin-left: -182%;}
    .WINDOWS .hero-slide4 .hero-text {margin-left: -118%;}
    .WINDOWS .hero-slide1 .hero-text {margin-left: -321%;}*/
    .MSIE .hero-slide2 .hero-text {margin-left: -182%;}
    .MSIE .hero-slide4 .hero-text {margin-left: -118%;}
    .MSIE .hero-slide1 .hero-text {margin-left: -321%;}
}
@media only screen and (min-width: 2300px) and (max-width: 2500px) {
    .MSIE .hero-text {margin-left: -300%;}
    /*.WINDOWS .hero-slide2 .hero-text {margin-left: -198%;}
    .WINDOWS .hero-slide4 .hero-text {margin-left: -130%;}
    .WINDOWS .hero-slide1 .hero-text {margin-left: -344%;}*/
    .MSIE .hero-slide2 .hero-text {margin-left: -198%;}
    .MSIE .hero-slide4 .hero-text {margin-left: -130%;}
    .MSIE .hero-slide1 .hero-text {margin-left: -344%;}
}
@media only screen and (min-width: 2500px) {
    .MSIE .hero-text {margin-left: -300%;}
    /*.WINDOWS .hero-slide2 .hero-text {margin-left: -198%;}
    .WINDOWS .hero-slide4 .hero-text {margin-left: -130%;}
    .WINDOWS .hero-slide1 .hero-text {margin-left: -344%;}*/
    .MSIE .hero-slide2 .hero-text {margin-left: -198%;}
    .MSIE .hero-slide4 .hero-text {margin-left: -130%;}
    .MSIE .hero-slide1 .hero-text {margin-left: -344%;}
}
/***** End Hero Text Adjustment ************/

@keyframes zoomIn {
    0% {
        transform: scale(0);
    }
    70% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}
