/* For the dev of Community/Charity sections - to be merged into styles when complete */

.addthis_inline_share_toolbox {
	height: 0;
	overflow: hidden;
	transition: height .5s linear;
}

.addthis_inline_share_toolbox.active {
	height: 50px;
  /* overflow: visible; */
}

.mobile-only {
	display: none;
}

@media screen and (max-width: 425px){
	.mobile-only {
		display: initial;
	}
}

.map {
		width: 120px;
    height: 120px;
    float: left;
}

.dial {
	width: 190px;
	height: 190px;
	float: left;
		
	margin-top: -48px;
	background: url('../../images/dial.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;

	position: relative;
	/* max-width: 130px; */
}

.dial .needle {
	background: url('../../images/needle2.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;

	position: absolute;
	bottom: -25%;
	transform: rotate(15deg);
	transition: transform 4s linear;

  height: 80%;
  width: 80%;
  bottom: -15%;
  left: 10%;
}

.dial.max.active .needle {
	transform: rotate(135deg);
}

.dial.active .needle {
	transform: rotate(45deg);
}

.map {
	background: url('../../images/SAMap.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}

.map .dots {
	/* background: url('../../images/dots.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain; */

	width: 100%;
  height: 100%;
}

.map .dots svg {
	height: 100%;
    width: auto;
}

.map .dots svg circle {
	opacity: 0;
	transition: opacity 2s linear;
}

.map .dots .dot_x002D_1 {
	transition-delay: 0s;
}
.map .dots .dot_x002D_2 {
	transition-delay: .2s;
}
.map .dots .dot_x002D_3 {
	transition-delay: .4s;
}
.map .dots .dot_x002D_4 {
	transition-delay: .6s;
}
.map .dots .dot_x002D_5 {
	transition-delay: .8s;
}
.map .dots .dot_x002D_6 {
	transition-delay: 1s;
}
.map .dots .dot_x002D_7 {
	transition-delay: 1.2s;
}
.map .dots .dot_x002D_8 {
	transition-delay: 1.4s;
}

.map.active .dots svg circle {
	opacity: 1;
}

.people-container {
	width: 260px;
	height: 75px;
	margin-top: 15px;
	float: left;
}

.people {
	width: calc(90% / 6);
  height: 100%;
	display: inline-block;

	background: url('../../images/person_icon.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;

	opacity: 0;
  transition: opacity 2s linear;
}

.people:nth-child(1){
	transition-delay: 0s;
}
.people:nth-child(2){
	transition-delay: .4s;
}
.people:nth-child(3){
	transition-delay: .8s;
}
.people:nth-child(4){
	transition-delay: 1.2s;
}
.people:nth-child(5){
	transition-delay: 1.6s;
}
.people:nth-child(6){
	transition-delay: 2s;
}

.active .people {
    opacity: 1;
}

.counter-container {
	float: left;
  text-align: center;
  margin: 0 30px;
}

.counter {
	font-size: 4.5rem;
	font-weight: bold;
}

.counter > div {
	display: inline-block;
}

.counter-desc {
	font-size: .9rem;
  font-weight: bold;
  text-transform: uppercase;
  max-width: 180px;
  margin: 10px auto 0 auto;
}

.counter-desc span {
	color: #d81e09;
}

.data-section {
	text-align: center;
}

.data-container {
	/* display: inline-block; */
	margin: 40px 0;
	display: inline-flex;
	flex-direction: row;
}

.data-alt {
	flex-direction: row-reverse;
}

.data-container:after {
	content: '';
	display: block;
	height: 1px;
	clear: both;
}

.green-border{
  border-top: 4px solid #e0df00;
  @media screen and (max-width:1200px){
    border-top:1px solid #e0df00;
  }
  @media screen and (max-width:650px){

  }
}
.grid {
  max-width: 1200px;
  margin: 0 auto;
}

/* reveal grid after images loaded */
.grid.are-images-unloaded {
  opacity: 0;
}

.grid__item,
.grid__col-sizer {
  width: 32%;
}

.grid__gutter-sizer { width: 2%; }

/* hide by default */
.grid.are-images-unloaded .image-grid__item {
  opacity: 0;
}

.grid__item {
  margin-bottom: 20px;
  float: left;
}

.grid__item a {
  height: 100%;
  display: block;
  text-decoration: none;
}

.grid__item h2 {
  font-size: 21px;
  color: black;
  text-decoration: none !important;
  text-decoration-line: none;
  border: none;
  line-height: 30px;
  vertical-align: bottom;
  height: 35%;
  display: block;
  padding-top: 12px;
  text-align: center;
}

.grid__item--height1 { height: 140px; }
/* .grid__item--height2 { height: 220px; } */
.grid__item--height2 { min-height: 240px; }
.grid__item--height3 { height: 300px; }

.grid__item--width2 { width: 66%; }

.grid__item img {
    display: block;
    max-width: 90%;
    position: absolute;
    top: 50%;
    max-height: 90%;

    left: 50%;
    transform: translateY(-50%) translateX(-50%);
  }

/* clear fix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}

.grid__item {
  position: relative;
  float: left;
  /* width: 100px; */
  /* height: 100px; */
  margin: 5px;
  padding: 10px;
  color: #262524;
}

.grid__item > * {
  margin: 0;
  padding: 0;
}

.page-load-status {
  display: none; /* hidden by default */
  padding-top: 20px;
  border-top: 1px solid #DDD;
  text-align: center;
  color: #777;
}



.loader-ellips {
font-size: 20px; /* change size here */
position: relative;
width: 4em;
height: 1em;
margin: 10px auto;
}

.loader-ellips__dot {
display: block;
width: 1em;
height: 1em;
border-radius: 0.5em;
position: absolute;
animation-duration: 0.5s;
animation-timing-function: ease;
animation-iteration-count: infinite;
}

.loader-ellips__dot:nth-child(1),
.loader-ellips__dot:nth-child(2) {
left: 0;
}
.loader-ellips__dot:nth-child(3) { left: 1.5em; }
.loader-ellips__dot:nth-child(4) { left: 3em; }

@keyframes reveal {
from { transform: scale(0.001); }
to { transform: scale(1); }
}

@keyframes slide {
to { transform: translateX(1.5em) }
}

.loader-ellips__dot:nth-child(1) {
animation-name: reveal;
}

.loader-ellips__dot:nth-child(2),
.loader-ellips__dot:nth-child(3) {
animation-name: slide;
}

.loader-ellips__dot:nth-child(4) {
animation-name: reveal;
animation-direction: reverse;
}




.select2-container--default .select2-selection--single {
background: #BF0300;
padding-top: 10px;
height: 50px;
color: white;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
color: white;
font-weight: bold;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
height: 50px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
border-color: white transparent transparent transparent;
}

.select2-container {
min-width: 165px;
}

.filter-container {
margin: 40px auto;
text-align: center;
display: none;
}

.filter-container h2 {
color: #BF0300;
display: inline-block;
font-weight: bold;
font-size: 1.3rem;
margin-right: 26px;
}

.charity-slide img {
	max-width: 120px;
    max-height: 120px;
    margin: 0 auto;
}

.charity-title-container {
  /* position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9; */
	background: black;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e63c26+0,bd465a+10,9d4e81+20,8a5299+28,8354a2+33,241c31+66 */
	background: #e63c26; /* Old browsers */
	background: -moz-linear-gradient(left, #e63c26 0%, #bd465a 10.92%, #9d4e81 20.71%, #8a5299 28.49%, #8354a2 33.28%, #241c31 66.2%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #e63c26 0%,#bd465a 10.92%,#9d4e81 20.71%,#8a5299 28.49%,#8354a2 33.28%,#241c31 66.2%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #e63c26 0%,#bd465a 10.92%,#9d4e81 20.71%,#8a5299 28.49%,#8354a2 33.28%,#241c31 66.2%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e63c26', endColorstr='#241c31',GradientType=1 ); /* IE6-9 */

	position: relative;
	margin-top: -4px;
}

.charity-footer {
	background: black;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e63c26+0,bd465a+10,9d4e81+20,8a5299+28,8354a2+33,241c31+66 */
	background: #e63c26; /* Old browsers */
	background: -moz-linear-gradient(left, #e63c26 0%, #bd465a 10.92%, #9d4e81 20.71%, #8a5299 28.49%, #8354a2 33.28%, #241c31 66.2%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #e63c26 0%,#bd465a 10.92%,#9d4e81 20.71%,#8a5299 28.49%,#8354a2 33.28%,#241c31 66.2%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #e63c26 0%,#bd465a 10.92%,#9d4e81 20.71%,#8a5299 28.49%,#8354a2 33.28%,#241c31 66.2%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e63c26', endColorstr='#241c31',GradientType=1 ); /* IE6-9 */

	text-align: right;
}

.charity-footer img {
	max-width: 27%;
    padding: 40px;
    padding-right: 60px;
}

.charity-title {
  /* position: absolute;
  top: 50%;
  transform: translateY(-50%); */
  width: 100%;
  text-align: center;
  color: white;
  padding: 24px 0px;
}

.charity-title h1 {
	font-size: 1.9rem;
	font-weight: 100;
	line-height: 40px;
	margin: 10px 0;
	display: inline-block;
	width: 100%;
    max-width: calc(100% - ( 260px * 2));
}

.charity-title h2 {
  font-size: 3rem;
  font-weight: 100;
}

.charity-supported {
	position: absolute;
    right: 20px;
    width: 240px;
    top: 0;
	bottom: 0;
	
	text-align: center;
    padding: 20px;
}

.charity-supported span {
	color: white;
	margin-bottom: 8px;
    display: block;
}

.charity-supported img {
	height: auto;
	width: 100%;
	/* max-width: 160px; */
	max-width: 120px;
}

.charity-short-description h2 {
    font-size: 2.1rem;
    text-align: center;
    max-width: 98%;
    margin: 0 auto;
	font-weight: 100;
}

.charity-description {
	margin-bottom: 30px;
	margin-top: 20px;
	text-align: left;
	line-height: 26px;
}

.lunch.c1of7 {
  width: calc(100% / 7);
}

.lunch.c2of7 {
  width: calc(100% / 7 * 2);
}

.data-section h3 {
  text-align: center;
    font-size: 2rem;
		font-weight: bold;
margin-bottom: 40px;
}

/** CHARITY BANNER **/
/** BG Gradient exported from illustrator **/
/* .charity-banner
{
  background : -moz-linear-gradient(50% 100.39% 90deg,rgba(230, 60, 38, 1) 0%,rgba(189, 70, 90, 1) 16.41%,rgba(157, 78, 129, 1) 31.12%,rgba(138, 82, 153, 1) 42.8%,rgba(131, 84, 162, 1) 50%,rgba(36, 28, 49, 1) 98.66%);
  background : -webkit-linear-gradient(90deg, rgba(230, 60, 38, 1) 0%, rgba(189, 70, 90, 1) 16.41%, rgba(157, 78, 129, 1) 31.12%, rgba(138, 82, 153, 1) 42.8%, rgba(131, 84, 162, 1) 50%, rgba(36, 28, 49, 1) 98.66%);
  background : -webkit-gradient(linear,50% 100.39% ,50% 37.04% ,color-stop(0,rgba(230, 60, 38, 1) ),color-stop(0.1641,rgba(189, 70, 90, 1) ),color-stop(0.3112,rgba(157, 78, 129, 1) ),color-stop(0.428,rgba(138, 82, 153, 1) ),color-stop(0.5,rgba(131, 84, 162, 1) ),color-stop(0.9866,rgba(36, 28, 49, 1) ));
  background : -o-linear-gradient(90deg, rgba(230, 60, 38, 1) 0%, rgba(189, 70, 90, 1) 16.41%, rgba(157, 78, 129, 1) 31.12%, rgba(138, 82, 153, 1) 42.8%, rgba(131, 84, 162, 1) 50%, rgba(36, 28, 49, 1) 98.66%);
  background : -ms-linear-gradient(90deg, rgba(230, 60, 38, 1) 0%, rgba(189, 70, 90, 1) 16.41%, rgba(157, 78, 129, 1) 31.12%, rgba(138, 82, 153, 1) 42.8%, rgba(131, 84, 162, 1) 50%, rgba(36, 28, 49, 1) 98.66%);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#E63C26', endColorstr='#241C31' ,GradientType=0)";
  background : linear-gradient(0deg, rgba(230, 60, 38, 1) 0%, rgba(189, 70, 90, 1) 16.41%, rgba(157, 78, 129, 1) 31.12%, rgba(138, 82, 153, 1) 42.8%, rgba(131, 84, 162, 1) 50%, rgba(36, 28, 49, 1) 98.66%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#241C31',endColorstr='#E63C26' , GradientType=0);
} */

.bg-black {
	background: black;
	position: relative;
  }

.charity-page-bottom .nav-footer-holder {
	margin-top:0;
}

h2.purple {
	color: #ac4973;
    text-align: center;
    font-weight: bold;
    font-size: 2.5rem;
    margin-bottom: 30px;
    /* margin-top: 20px; */
	line-height: 2.5rem;
	margin-top: 6%;
}

.charity-banner
{
  background : -moz-linear-gradient(50% 100.39% 90deg,rgba(230, 60, 38, 1) 0%,rgba(189, 70, 90, 1) 10.92%,rgba(157, 78, 129, 1) 20.71%,rgba(138, 82, 153, 1) 28.49%,rgba(131, 84, 162, 1) 33.28%,rgba(36, 28, 49, 1) 66.2%);
  background : -webkit-linear-gradient(90deg, rgba(230, 60, 38, 1) 0%, rgba(189, 70, 90, 1) 10.92%, rgba(157, 78, 129, 1) 20.71%, rgba(138, 82, 153, 1) 28.49%, rgba(131, 84, 162, 1) 33.28%, rgba(36, 28, 49, 1) 66.2%);
  background : -webkit-gradient(linear,50% 100.39% ,50% 37.04% ,color-stop(0,rgba(230, 60, 38, 1) ),color-stop(0.1092,rgba(189, 70, 90, 1) ),color-stop(0.2071,rgba(157, 78, 129, 1) ),color-stop(0.2849,rgba(138, 82, 153, 1) ),color-stop(0.3328,rgba(131, 84, 162, 1) ),color-stop(0.662,rgba(36, 28, 49, 1) ));
  background : -o-linear-gradient(90deg, rgba(230, 60, 38, 1) 0%, rgba(189, 70, 90, 1) 10.92%, rgba(157, 78, 129, 1) 20.71%, rgba(138, 82, 153, 1) 28.49%, rgba(131, 84, 162, 1) 33.28%, rgba(36, 28, 49, 1) 66.2%);
  background : -ms-linear-gradient(90deg, rgba(230, 60, 38, 1) 0%, rgba(189, 70, 90, 1) 10.92%, rgba(157, 78, 129, 1) 20.71%, rgba(138, 82, 153, 1) 28.49%, rgba(131, 84, 162, 1) 33.28%, rgba(36, 28, 49, 1) 66.2%);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#E63C26', endColorstr='#241C31' ,GradientType=0)";
  background : linear-gradient(0deg, rgba(230, 60, 38, 1) 0%, rgba(189, 70, 90, 1) 10.92%, rgba(157, 78, 129, 1) 20.71%, rgba(138, 82, 153, 1) 28.49%, rgba(131, 84, 162, 1) 33.28%, rgba(36, 28, 49, 1) 66.2%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#241C31',endColorstr='#E63C26' , GradientType=0);
}

.charity-banner {
	position: relative;
	/* border-bottom: 4px solid #BF0300; */
	padding-top: 70px;

	height: 675px;
}

.charity-container {
	/* width: 90%; */
	/* max-width: 980px; */
	margin: 0 auto;
	text-align: center;

	/* Offset space left under image */
	margin-bottom: -2px;
}

.charity-banner h2 {
	font-size: 2.5rem;
	line-height: 40px;
	margin: 10px 0;
	color: white;
	font-weight: 500;
	display: inline-block;
	margin-top: 30px;
	margin-bottom: 35px;
}

.charity-banner p {
	color: white;
	font-weight: 100;
	display: inline-block;
	line-height: 1.5rem;
}

.charity-banner .give-logo {
	/* max-width: 90%; */
	/* width: 320px; */
	max-width: 500px;
}

.charity-banner .iphone {
	max-width: 90%;
	width: 320px;
	margin-top: 50px;
}


/** SINGLE CHARITY **/
.sc-content-container {
	width: 50%;
	max-width: 700px;
	margin: 0 auto;
	text-align: center;
	padding-bottom: 50px;
}

.sc-content-container img {
	/* width: 90%; */
	/* display: inline-block; */
	/* max-width: 360px; */
	max-width: 100%;
	display: inline-block;
	max-height: 240px;
}

.sc-content-container h1 {
	font-size: 3rem;
	font-weight: 100;
	margin: 24px;
}

.sc-content {
	/* width: 70%; */
	margin: 0 auto;
	/* min-width: 300px; */
}

@media screen and (max-width: 1000px){
    .sc-content-container {
        width: 100%;
    }
}

@media screen and (max-width: 874px){
    .sc-content-container {
        width: 90%;
	}
}

.sc-content .charity-short-description h2 {
	font-size: 2.1rem;
	text-align: center;
	max-width: 98%;
	margin: 0 auto;
	font-weight: 100;
	margin-top: 50px;
	margin-bottom: 40px;
}

.sc-content .charity-links {
	margin-top: 50px;
}


.charity-banner .charity-links .btn-result,
.single-charity .charity-links .btn-result {
    min-width: 170px;
	cursor: pointer;
	margin-bottom: 10px;
	padding: 24px 15px;
	font-weight: bold;
}

.charity-banner .charity-links .btn-result:first-child,
.single-charity .charity-links .btn-result:first-child {
	margin-right: 10px;
}

.single-charity .charity-links {
	text-align: center;
}

.filterable-container {
	padding-left: 64px;
	padding-right: 64px;
}

#offer-slider .rsSlide div.rsDiv {
	background-position-y: 50%;
}

.mobile-join-now {
	display: none;
}

@media screen and (max-width: 1074px){
	.charity-banner .charity-links {
	    margin-top: 80px;
	}
}

@media screen and (max-width: 892px){
	.grid__item,
	.grid__col-sizer {
	  width: 31%;
	}
}

@media screen and (max-width: 810px){
	.charity-banner .charity-links {
	    margin-top: 70px;
	}

	.charity-banner .banner-image img {
	    max-height: 530px;
	}

	.charity-banner .banner-content {
		border: none;
	}
}

@media screen and (max-width: 710px){
	.charity-banner .charity-links .btn-result {
	    min-width: initial;
	}

	.charity-links a {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.charity-supported {
		/* display: none; */
		position: relative;
		margin: 0 auto;
		left: 0;

		padding-top: 0;
	}
	.charity-title {
		padding: 10px 0px;
	}
	.charity-title h1 {
		max-width: 96%;
	}
}

@media only screen and (max-width: 750px){
	.lunch.at750c1of1 {
			border: none;
	}
	.single-charity .logo-container img {
		/* width: 90%;
	    max-width: 400px;
	    margin: 0 auto; */
	}

	.charity-footer img {
		width: 100%;
    	max-width: 240px;
	}
}

@media screen and (max-width: 650px){
	.charity-title h1 {
    font-size: 1.3rem;
		margin-bottom: 5px;
	}
	.charity-title h2 {
		font-size: 1.5rem;
	}
	#offer-slider .rsSlide div.rsDiv {
		background-size: cover;
	}


	.data-container,
	.data-alt {
		flex-direction: column-reverse;
		margin: 0;
	}

	/* offset the text against the height of the dial and needle */
	.dial {
		margin-bottom: -45px !important;
	}

	.people-container,
	.dial,
	.map {
		float: none;
		width: 100%;
		margin-top: 0;
		margin: 0 auto;
		width: 200px;
	}

	.people-container {
		margin: 50px auto auto auto;
    min-width: 230px;
	}

	.counter-container {
		margin-bottom: 5px;
		float: none;
		width: 100%;
		    margin: 0 auto;
	}

	.counter-container {
    margin-top: 15px;
	}

	.grid__item,
	.grid__col-sizer {
		width: 50%;
		margin: 0;
	}

	.filterable-container {
		padding-left: 0px;
		padding-right: 0px;
	}

	.mobile-join-now {
		display: block;
	}

	.mobile-join-now-container {
		margin-top: 40px !important;
	}

}

.faq-contact {
		position: absolute;
    right: 0;
    top: 0;
    z-index: 9;
    padding-top: 10px;
    padding-bottom: 15px;
    font-size: 14px;
    line-height: 1.8;
}

.faq-contact a {
	margin-right: 20px;
    color: white;
    font-weight: bold;
		text-decoration: none;
}

.store-links {
	display: none;
}

@media only screen and (max-width: 600px){
	.faq-contact {
		/* display: none; */
		position: relative;
    	text-align: right;
	}

	.store-links {
		display: block;
	}
}

@media only screen and (max-width: 355px){
	.single-charity .charity-links .btn-result:first-child {
		margin-right: 0;
	}
}