/* Styles for campaign pages */

.page-campaign #hero-content a.button {
    display: block;
    margin-bottom: 1rem;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

.page-campaign div.thermometer {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 200px;
    margin-left: auto;
    margin-right: auto;
}
.page-campaign span.significant_number {font-size: 1.25rem; font-weight: bold;}

.page-campaign div.thermometer.thermometer--vertical:before {
  position: absolute;
  z-index: -1;
  bottom: 0;
  left: 0;
  width: 100%;
  max-width: 200px;
  max-height: 316px;
  content: "";
  background-color: rgb(145, 120, 172);
}

.page-campaign div.thermometer.thermometer--horizontal:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  height: 99%;
  max-width: 200px;
  content: "";
  background-color: rgb(145, 120, 172);
}

.page-campaign div.thermometer.thermometer--vertical .targets {
    background-color: #fff;
    position: absolute;
    top: 0;
    height: 100%;
    font-weight: bold;
    right: -45px;
    min-height: 186px;
    width: 50%;
}

.page-campaign div.thermometer.thermometer--horizontal .targets {
    position: absolute;
    top: -15px;
    left: 0;
    height: 100%;
    width: 100%;
    font-weight: bold;
}

.page-campaign div.thermometer.thermometer--vertical .targets .figure-0 {
    position: absolute;
    top: 238px;
}

.page-campaign div.thermometer.thermometer--vertical .targets .figure-25 {
    position: absolute;
    top: 183px;
}

.page-campaign div.thermometer.thermometer--vertical .targets .figure-50 {
    position: absolute;
    top: 128px;
}

.page-campaign div.thermometer.thermometer--vertical .targets .figure-75 {
    position: absolute;
    top: 73px;
}

.page-campaign div.thermometer.thermometer--vertical .targets .figure-100 {
    position: absolute;
    top: 18px;
    font-weight: bolder;
}

.page-campaign div.thermometer.thermometer--horizontal .targets .figure-0 {
    position: absolute;
    left: 3%;
}

.page-campaign div.thermometer.thermometer--horizontal .targets .figure-25 {
    position: absolute;
    left: 18%;
}

.page-campaign div.thermometer.thermometer--horizontal .targets .figure-50 {
    position: absolute;
    left: 40.5%;
}

.page-campaign div.thermometer.thermometer--horizontal .targets .figure-75 {
    position: absolute;
    left: 62.5%;
}

.page-campaign div.thermometer.thermometer--horizontal .targets .figure-100 {
    position: absolute;
    left: 85%;
}

.page-campaign div.thermometer.thermometer--horizontal .targets .raised {
    position: absolute;
    top: 41%;
}

.page-campaign #footer-one,
.page-campaign #footer-two,
.page-campaign #footer-three,
.page-campaign #main-menu {
    display: none;
}

.page-campaign aside .button {
    margin-left: 35px;
    margin-top: 30px;
    display: block;
}


.page-campaign .campaign-logo {
    max-width: 204px;
    margin: 1rem auto 1rem auto;
    display: inherit;
}

.page-campaign h1 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.page-campaign .tab-bar,
.page-campaign #cta-menu {
    display: none !important;
}

.page-campaign iframe {
    width: 100%;
}

.page-campaign #row-content-campaign article p:first-child {
    font-weight: 600;
}

.campaign-content p {
    font-weight: normal !important;
}

.post-info {
    color: grey;
    margin-top: 0.5rem;
    text-align: center;
}

.group-fundraising a,
.offer-your-skills a {
    margin-top: 0 !important;
}
/* Hide sidebar button on group fundraising page */
.post-fundraising .donate {display: none;}
.post-fundraising .group-fundraising {display: none;}
.post-fundraising .offer-your-skills {display: none;}
.post-fundraising .medium-5.columns a {display: none !important;}

/* Hide sidebar and achievement sections in fundraising thank you page*/
.post-thank-you aside {display: none;}
.post-thank-you #row-achievements {display: none;}

.fundraising-content.row{margin-top: 2rem;}
.fundraise-logo > img {margin-left: 10%; max-width: 80%;}
.fundraise-logo {padding-right: 0;}
.fundraise-message {padding-left: 0;}
/* orientation */
@media only screen and (orientation: landscape) {

} /* Apply styles to screens in landscape orientation */

@media only screen and (orientation: portrait) {

}
/* Apply styles to screens in portrait orientation */

/* custom */
@media only screen and (max-width: 357px) {

} /* ipod */
@media only screen and (min-width: 358px) {

} /* bigger than ipod */
@media only screen and (max-width: 75rem) {
} /* medium-large */

/* Zurb Sizes ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- */
/* Small screens */
@media only screen {
} /* Define mobile styles */
@media only screen and (max-width: 40em) {
    .page-campaign div.thermometer {
        max-width: 100%;
    }

    .page-campaign div.thermometer.thermometer--horizontal:before {
        max-width: 100%;
    }

    .page-campaign div.thermometer.thermometer--horizontal img {
        width: 100%;
    }
	
	.page-campaign div.thermometer.thermometer--horizontal .targets .figure-25 {
		left: 27%;
		margin-left: -2.25rem;
	}
	
	.page-campaign div.thermometer.thermometer--horizontal .targets .figure-50 {
	    left: 50%;
	    margin-left: -2.25rem;
	}
	
	.page-campaign div.thermometer.thermometer--horizontal .targets .figure-75 {
	    left: auto;
        right: 27%;
        margin-right: -1.75rem;
	}
	
	.page-campaign div.thermometer.thermometer--horizontal .targets .figure-100 {
	    left: auto;
	    right: 0;
	    margin-right: -0.75rem;
	}

    .page-campaign aside .button {
        margin-top: 30px;
        margin-left: auto;
        margin-right: auto;
        display: block;
        max-width: 200px;
    }
    
    .fundraise-logo > img {margin-left: 0; max-width: 100%;}

} /* max-width 640px, mobile-only styles, use when QAing mobile issues */

/* ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- */

/* Medium screens */
@media only screen and (min-width: 40.063em) {



} /* min-width 641px, medium screens */
@media only screen and (min-width: 40.063em) and (max-width: 64em) {

    .page-campaign div.thermometer, .page-campaign div.thermometer.thermometer--horizontal:before {
        max-width: 400px;
    }
    
    .page-campaign div.row.campaign_stats {max-width: 400px; padding: 0; margin: 0 auto;}
    
    .page-campaign aside .button {
        margin-top: 30px;
        margin-left: auto;
        margin-right: auto;
        display: block;
        max-width: 400px;
    }

    .group-fundraising {
        padding-left: 0;
        padding-right: 0.25rem;
    }
    .group-fundraising a {
        margin-top: 0 !important;
        height: 70px;
    }

    .offer-your-skills {
        padding-right: 0;
        padding-left: 0.25rem;
    }
    .offer-your-skills a {
        margin-top: 0 !important;
        height: 70px;
    }

} /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
@media only screen and (max-width: 64em) {
} /* max-width 1024px, use when QAing tablet-only issues */

/* ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- */

/* Large screens  */
@media only screen and (min-width: 64.063em) {
} /* min-width 1025px, large screens */
@media only screen and (min-width: 64.063em) and (max-width: 90em) {
} /* min-width 1024px and max-width 1440px, use when QAing large screen-only issues */
@media only screen and (max-width: 90em) {
} /* max-width 1440px, use when QAing large screen-only issues */

/* ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- */

/* XLarge screens  */
@media only screen and (min-width: 90.063em) {
} /* min-width 1441px, xlarge screens */
@media only screen and (min-width: 90.063em) and (max-width: 120em) {
} /* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */
@media only screen and (max-width: 120em) {
} /* max-width 1920px, use when QAing xlarge screen-only issues */

/* ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- */

/* XXLarge screens  */
@media only screen and (min-width: 120.063em) {
} /* min-width 1921px, xlarge screens */

/* ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- */

/* Printing */
@media only print {
}