@charset "utf-8";

/* CSS Document */

hr.hrhome {
	background-color: #585858;
	color: #585858;
	border-color: #585858;
}

/* New Fundraising Bar Using HTML 5 and CSS 3 */

.fundraising_bounds {
	width: 500px;
	margin-left: auto;
	margin-right: auto;
}

.bounds-left {
	float: left;
	margin-top: -2px;
	padding-left: 2px;
	z-index: 99;
}

.bounds-right {
	float: right;
	margin-top: -2px;
	padding-right: 2px;
	z-index: 99;
}



.fundraising-info {
	width: 100%;
	text-align: center;
	color: #000;
	font-size: 11px;
	margin-top: 10px;
}

.fundraising-info a {
	font-size: 11px;
}

.fundraising-info a:visited, .fundraising-info a:active {
	font-size: 11px;
}

.fundraising-info a:hover{
	color: #72c7ff;
	font-size: 11px;
}

progress {
	width: 500px;
	height: 15px;
	margin: 10px auto;
	display: block;
	/* Important Thing */
	-webkit-appearance: none;
	-moz-appearance: none;
	border: none;
	background:
		linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		linear-gradient(left, #8fde13, #92ce34);	
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #ba7448, #c4672d);
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #8fde13, #92ce34);
	border-radius: 50px;
	box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);	
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;	
	-moz-animation: move 5s linear 0 infinite;
	background-color: #000000;
}

progress.percent0 {
	background:
		linear-gradient(left, #f31600, #f42e1a);	
		-webkit-linear-gradient(left, #f31600, #f42e1a);
		-moz-linear-gradient(left, #f31600, #f42e1a);
}

progress.percent10 {
	background:
		linear-gradient(left, #f33c00, #f4501a);	
		-webkit-linear-gradient(left, #f33c00, #f4501a);
		-moz-linear-gradient(left, #f33c00, #f4501a);
}

progress.percent20 {
	background:
		linear-gradient(left, #f36a00, #f4791a);	
		-webkit-linear-gradient(left, #f36a00, #f4791a);
		-moz-linear-gradient(left, #f36a00, #f4791a);
}

progress.percent30 {
	background:
		linear-gradient(left, #f39100, #f49c1a);	
		-webkit-linear-gradient(left, #f39100, #f49c1a);
		-moz-linear-gradient(left, #f39100, #f49c1a);
}

progress.percent40 {
	background:
		linear-gradient(left, #f3b200, #f4ba1a);	
		-webkit-linear-gradient(left, #f3b200, #f4ba1a);
		-moz-linear-gradient(left, #f3b200, #f4ba1a);
}

progress.percent50 {
	background:
		linear-gradient(left, #f3c800, #f4ce1a);	
		-webkit-linear-gradient(left, #f3c800, #f4ce1a);
		-moz-linear-gradient(left, #f3c800, #f4ce1a);
}

progress.percent60 {
	background:
		linear-gradient(left, #f3d600, #f4da1a);	
		-webkit-linear-gradient(left, #f3d600, #f4da1a);
		-moz-linear-gradient(left, #f3d600, #f4da1a);
}

progress.percent70 {
	background:
		linear-gradient(left, #c5dc09, #cbe022);	
		-webkit-linear-gradient(left, #c5dc09, #cbe022);
		-moz-linear-gradient(left, #c5dc09, #cbe022);
}

progress.percent80 {
	background:
		linear-gradient(left, #8fde13, #9ae12b);	
		-webkit-linear-gradient(left, #8fde13, #9ae12b);
		-moz-linear-gradient(left, #8fde13, #9ae12b);
}

progress.percent90 {
	background:
		linear-gradient(left, #6cde13, #7be12b);	
		-webkit-linear-gradient(left, #6cde13, #7be12b);
		-moz-linear-gradient(left, #6cde13, #7be12b);
}

progress.percent100 {
	background:
		linear-gradient(left, #56de13, #67e12b);	
		-webkit-linear-gradient(left, #56de13, #67e12b);
		-moz-linear-gradient(left, #56de13, #67e12b);
}


/* All good til now. Now we'll style the background */
progress::-webkit-progress-bar {
	background: black;
	border-radius: 50px;
	padding: 2px;
	box-shadow: 0 1px 0px 0 rgba(255, 255, 255, 0.2);
}

progress::-moz-progress-bar {
	padding: 2px;
	border-radius: 50px;
	border: 2px solid #000;
	box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
	background:
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #8fde13, #92ce34);
	
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;
}

/* Now the value part */

progress::-webkit-progress-value {
	border-radius: 50px;
	box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
	background:
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #8fde13, #92ce34);

	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;
	background-attachment:fixed;
}

progress.percent0::-moz-progress-bar, progress.percent10::-moz-progress-bar, progress.percent20::-moz-progress-bar, progress.percent30::-moz-progress-bar, progress.percent40::-moz-progress-bar, progress.percent50::-moz-progress-bar, progress.percent60::-moz-progress-bar, progress.percent70::-moz-progress-bar, progress.percent80::-moz-progress-bar, progress.percent90::-moz-progress-bar, progress.percent100::-moz-progress-bar {
	padding: 2px;
	border-radius: 50px;
	border: 2px solid #000;
	box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;
}
progress.percent0::-moz-progress-bar {
	background:
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #f31600, #f42e1a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;		
}
progress.percent10::-moz-progress-bar {
	background:
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #f33c00, #f4501a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;		
}
progress.percent20::-moz-progress-bar {
	background:
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #f36a00, #f4791a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;		
}
progress.percent30::-moz-progress-bar {
	background:
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #f39100, #f49c1a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;		
}
progress.percent40::-moz-progress-bar {
	background:
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #f3b200, #f4ba1a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;		
}
progress.percent50::-moz-progress-bar {
	background:
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #f3c800, #f4ce1a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;		
}
progress.percent60::-moz-progress-bar {
	background:
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #f3d600, #f4da1a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;		
}
progress.percent70::-moz-progress-bar {
	background:
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #c5dc09, #cbe022);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;		
}
progress.percent80::-moz-progress-bar {
	background:
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #8fde13, #9ae12b);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;		
}
progress.percent90::-moz-progress-bar {
	background:
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #6cde13, #7be12b);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;		
}
progress.percent100::-moz-progress-bar {
	background:
		-moz-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-moz-linear-gradient(left, #56de13, #67e12b);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-moz-animation: move 5s linear 0 infinite;		
}

progress.percent0::-webkit-progress-value, progress.percent10::-webkit-progress-value, progress.percent20::-webkit-progress-value, progress.percent30::-webkit-progress-value, progress.percent40::-webkit-progress-value, progress.percent50::-webkit-progress-value, progress.percent60::-webkit-progress-value, progress.percent70::-webkit-progress-value, progress.percent80::-webkit-progress-value, progress.percent90::-webkit-progress-value, progress.percent100::-webkit-progress-value {
	border-radius: 50px;
	box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;		
}
progress.percent0::-webkit-progress-value {
	background:
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #f31600, #f42e1a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;		
}
progress.percent10::-webkit-progress-value {
	background:
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #f33c00, #f4501a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;		
}
progress.percent20::-webkit-progress-value {
	background:
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #f36a00, #f4791a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;		
}
progress.percent30::-webkit-progress-value {
	background:
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #f39100, #f49c1a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;		
}
progress.percent40::-webkit-progress-value {
	background:
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #f3b200, #f4ba1a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;		
}
progress.percent50::-webkit-progress-value {
	background:
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #f3c800, #f4ce1a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;		
}
progress.percent60::-webkit-progress-value {
	background:
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #f3d600, #f4da1a);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;		
}
progress.percent70::-webkit-progress-value {
	background:
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #c5dc09, #cbe022);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;		
}
progress.percent80::-webkit-progress-value {
	background:
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #8fde13, #9ae12b);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;		
}
progress.percent90::-webkit-progress-value {
	background:
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #6cde13, #7be12b);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;		
}
progress.percent100::-webkit-progress-value {
	background:
		-webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),
		-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),
		-webkit-linear-gradient(left, #56de13, #67e12b);
	/* Looks great, now animating it */
	background-size: 25px 14px, 100% 100%, 100% 100%;
	-webkit-animation: move 5s linear 0 infinite;		
}

/* That's it! Now let's try creating a new stripe pattern and animate it using animation and keyframes properties  */

@-webkit-keyframes move {
	0% {background-position: 0px 0px, 0 0, 0 0}
	100% {background-position: -100px 0px, 0 0, 0 0}
}

@-moz-keyframes move {
	0% {background-position: 0px 0px, 0 0, 0 0}
	100% {background-position: -100px 0px, 0 0, 0 0}
}

@keyframes move {
	0% {background-position: 0px 0px, 0 0, 0 0}
	100% {background-position: -100px 0px, 0 0, 0 0}
}

div.progress-bar-new {
	width: 500px;
	margin: auto;
	position: relative;
}

.progress-bar-new .tooltip {
  display: inline-block;
  font-size: 10px;
  color: #fff;
  padding: 1px 0px 1px 4px;
  width: 30px;
  -webkit-border-radius: 3px;
  -webkit-border-bottom-left-radius: 0;
  -moz-border-radius: 3px;
  -moz-border-radius-bottomleft: 0;
  border-radius: 3px;
  border-bottom-left-radius: 0;
  border: 1px solid #000;
  box-shadow: 1px 0px 2px rgba(0,0,0,0.28), inset 1px 1px 1px rgba(255,255,255,0.05);
  position: absolute;
  top: -24px;
  left: 0%;
  margin-left: -10px;
  text-shadow: 1px 1px 0px rgba(0,0,0,0.9);
}

.progress-bar-new .tooltip {
  background: -webkit-linear-gradient(top, rgba(255,255,255,0.1) 0%, rgba(0,0,0,0.2) 100%), #393d2d;
  background: -moz-linear-gradient(top, rgba(255,255,255,0.1) 0%, rgba(0,0,0,0.2) 100%), #393d2d;
  left: 100%;
}

.progress-bar-new .tooltip::before {
  content: '';
  display: block;
  position: absolute;
  top: 15px;
  left: -1px;
  width: 0;
  height: 0;
  border-right: 4px solid transparent;
  border-top: 4px solid #000;
  border-left: 4px solid #000;
  border-bottom: 4px solid transparent;
}

.progress-bar-new .tooltip::after {
  content: '';
  display: block;
  position: absolute;
  top: 14px;
  left: 0px;
  width: 0;
  height: 0;
  border-right: 3px solid transparent;
  border-top: 3px solid #303426;
  border-left: 3px solid #303426;
  border-bottom: 3px solid transparent;
}

.progress-label {
	position: relative;
	margin: auto;
	text-align: center;
	font-size: 10px;
	top: -24px;
	text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.5);
	color: #000;
}

@-moz-document url-prefix() {
.progress-label
	{top: -25px;}
}

.network {
	position: absolute;
	top: 2px;
	left: 4px;
	z-index: 1;
	margin: 0;
	border: none;
	font-size: 0.8em;
	color: #000;
}

.network a {
	color: #0099FF;
	text-decoration: none;
}

.network a:hover {
	color: #0099FF;
	text-decoration: underline;
}