/**
 * 
 * Page Specific Styles For fundraising
 * This page should be named according to the page slug.
 *
 **/


/*/////////////////////////////////////////////////////////////////////////////////////
// Fundraising Page Styles
/////////////////////////////////////////////////////////////////////////////////////*/
	
	/* featured content */
		#featured-content .span12 {
			position: relative;
			overflow: hidden;
			max-height: 300px;
		}

	/* main content */

		.in-hand-info {
			background: #eee;
			border-radius: 4px;
			padding: .5em;
		}

		#content .product-specs li {
			list-style-position: outside;
			margin-left: 1em;
		}

		.tablepress th, .tablepress td{
			text-align: center;
		}
		.tablepress thead th {
			color: #FFF;
			text-shadow: 1px 1px 0 #000;
		}
		.original .tablepress thead th,
		.frozen .tablepress. thead th,
		.inside-out .tablepress thead th {
			background-color: #00aeef;
		}
		.sports .tablepress thead th {
			background-color: #323132;
		}

		.princess .tablepress thead th {
			background-color: #db4993;
		}

		#guarantee .span9 {
			padding-top: 3em;
		}

		#content h3.main-title {
			font-size: 1.25em;
			font-weight: bold;
			text-transform: uppercase;
			height: 42px;
			background-image: url(../../images/h4-title-bg-arrow.png);
			background-repeat: no-repeat;
			border-top-right-radius:5px;
			border-bottom-right-radius:5px;
			background-color: #f7931e;
			padding-left:70px;
			color: #ffffff;
			text-shadow: 1px 1px 0 #c54c1d;
			border: 1px solid #ee5d24;
			border-left: none;
			border-top: none;
			line-height: 40px;
			box-sizing:border-box;
			-moz-box-sizing:border-box; /* Firefox */
			margin-top: 0;
		}

		#content h3.main-title + img {
			margin-bottom: 1em;
		}

		#ten-reasons {
			text-align:  center;
			background-color: #eee;
			padding: 1em 0;
			-moz-border-radius: 10px;
			-webkit-border-radius: 10px;
			border-radius: 10px;
			text-shadow: 1px 1px 0 #FFF;
		}
		#ten-reasons h3 {
			font-size: 1.25em;
			line-height: 1em;
			text-transform: uppercase;
			font-family: "eurostile_boldregular",Helvetica,Arial,sans-serif;


		}
		#ten-reasons li {
			margin-bottom: 0.5em;
		}

		#ways-to-fundraise .span6 img {
			display: block;
			margin: 0 auto;
		}

		#ways-to-fundraise .span6 h3 {
			text-align: center;
			border-bottom: dashed #ccc 1px;
		}
		#ways-to-fundraise .span6 label {
			font-weight: bold;
			cursor: auto;
		}
	
	#mr-bee {
		position: absolute;
		z-index: 150;
		background: url(../../images/fundraising/bee-960-display.png) no-repeat;
		width: 25px;
		height: 32px;
		left: 5%;
		top: 40px;
		animation-name: buzz;
		animation-duration: 2.5s;
		animation-timing-function: ease-in-out;
		animation-delay: 1s;
		animation-iteration-count: 4;
		animation-direction: alternate;
		animation-play-state: running;
		animation-fill-mode:forwards;
		/* Safari and Chrome: */
		-webkit-animation-name: buzz;
		-webkit-animation-duration: 2.5s;
		-webkit-animation-timing-function: ease-in-out;
		-webkit-animation-delay: 1s;
		-webkit-animation-iteration-count: 4;
		-webkit-animation-direction: alternate;
		-webkit-animation-play-state: running;
		-webkit-animation-fill-mode:forwards;
	}

	@keyframes buzz {
		0%{left:5%;top:40px}
		25%{top:25px}
		50%{top:40px}
		75%{top:25px}
		100%{left:25%}
	}

	@-webkit-keyframes buzz /* Safari and Chrome */{
		0%{left:5%;top:40px}
		25%{top:25px}
		50%{top:40px}
		75%{top:25px}
		100%{left:25%}
	}

	#bus {
		position: absolute;
		z-index: 150;
		background: url(../../images/fundraising/bus-960-display.png) no-repeat;
		width: 200px;
		height: 136px;
		right: -10%;
		top: 220px;
		animation-name: bus;
		animation-duration: 3s;
		animation-timing-function: ease-in-out;
		animation-delay: 1s;
		animation-iteration-count: 1;
		animation-direction: alternate;
		animation-play-state: running;
		animation-fill-mode:forwards;
		/* Safari and Chrome: */
		-webkit-animation-name: bus;
		-webkit-animation-duration: 3s;
		-webkit-animation-timing-function: ease-out;
		-webkit-animation-delay: 1s;
		-webkit-animation-iteration-count: 1;
		-webkit-animation-direction: alternate;
		-webkit-animation-play-state: running;
		-webkit-animation-fill-mode:forwards;
	}

	@keyframes bus {
		0%{right:-10%;top:220px}
		100%{right:10%; top: 110px;}
	}

	@-webkit-keyframes bus /* Safari and Chrome */{
		0%{right:-10%;top:220px}
		100%{right:10%; top:110px;}
	}

	#playground-kid {
		position: absolute;
		z-index: 150;
		background: url(../../images/fundraising/playground-kid-960-display.png) no-repeat;
		width: 33px;
		height: 52px;
		left: 8.25%;
		top: 121px;
		animation-name: playground-kid;
		animation-duration: 1.5s;
		animation-timing-function: ease-in-out;
		animation-delay: 3s;
		animation-iteration-count: 3;
		animation-direction: alternate;
		animation-play-state: running;
		animation-fill-mode:forwards;
		/* Safari and Chrome: */
		-webkit-animation-name: playground-kid;
		-webkit-animation-duration: 1.5s;
		-webkit-animation-timing-function: ease-out;
		-webkit-animation-delay: 3s;
		-webkit-animation-iteration-count: 3;
		-webkit-animation-direction: alternate;
		-webkit-animation-play-state: running;
		-webkit-animation-fill-mode:forwards;
	}

	@keyframes playground-kid {
		0%{left:8.25%;top:121px}
		50%{transform:rotate(-15deg)}
		100%{left:10%; top: 121px;}
	}

	@-webkit-keyframes playground-kid /* Safari and Chrome */{
		0%{left:8.25%;top:121px}
		50%{-webkit-transform:rotate(-15deg)}
		100%{left:10%; top:121px;}
	}

	#kite {
		position: absolute;
		z-index: 150;
		background: url(../../images/fundraising/kite-960-display.png) no-repeat;
		width: 56px;
		height: 113px;
		right: 3%;
		top: 349px;
		animation-name: kite;
		animation-duration: 6s;
		animation-timing-function: ease-in-out;
		animation-delay: 7s;
		animation-iteration-count: 1;
		animation-direction: normal;
		animation-play-state: running;
		animation-fill-mode:forwards;
		/* Safari and Chrome: */
		-webkit-animation-name: kite;
		-webkit-animation-duration: 6s;
		-webkit-animation-timing-function: ease-out;
		-webkit-animation-delay: 7s;
		-webkit-animation-iteration-count: 1;
		-webkit-animation-direction: normal;
		-webkit-animation-play-state: running;
		-webkit-animation-fill-mode:forwards;
	}

	@keyframes kite {
		0%{right:3%;top:349px; transform:rotate(-15deg)}
		25%{transform:rotate(15deg);}
		50%{transform:rotate(-15deg)}
		75%{transform:rotate(15deg);}
		100%{right:5%; top:-433px; transform:rotate(-15deg)}
	}

	@-webkit-keyframes kite /* Safari and Chrome */{
		0%{right:3%;top:349px; -webkit-transform:rotate(-15deg)}
		25%{-webkit-transform:rotate(15deg);}
		50%{-webkit-transform:rotate(-15deg)}
		75%{-webkit-transform:rotate(15deg);}
		100%{right:5%; top:-433px; -webkit-transform:rotate(-15deg)}
	}

	ul.product-specs {
		margin-bottom: 10px;
		width: 48%;
		float: left;
	}

	.ui-tabs-panel .buckets, .ui-tabs-panel .bagsets {
		width: 48%;
		float: left;
	}

	.ui-tabs-panel .buckets {
		margin-right: 4%;
	}

	.buckets > div, .bagsets > div {
		width: 48%;
		margin-right: 4%;
		float: left;
		margin-bottom: 1em;
	}

	.ui-tabs-panel .bagsets .tablepress thead th  {
		background-color: #DDD;
		text-shadow: 1px 1px 0 #FFF;
	}
	.ui-tabs-panel.original .bagsets .tablepress thead th {
		color: #117dd8;
	}
	.ui-tabs-panel.smens .bagsets .tablepress thead th {
		color: #018e2f;
	}
	.ui-tabs-panel.smarkers .bagsets .tablepress thead th {
		color: #77bc1f;
	}
	.ui-tabs-panel.colored .bagsets .tablepress thead th {
		color: #8cc63e;
	}

	#ways-to-fundraise #accordion > h3 {
		padding-left: 72px;
		position: relative;
	}

	#ways-to-fundraise #accordion > h3:before {
		content: '';
		display: block;
		height: 32px;
		width: 31px;
		position: absolute;
		top: 50%;
		left: 32px;
		margin-top: -15px;
	}

	#ways-to-fundraise #accordion > h3:before {
		background-position: 0 -32px;
	}
	#ways-to-fundraise #accordion > h3.ui-state-active:before, 
	#ways-to-fundraise #accordion > h3:hover:before, 
	#ways-to-fundraise #accordion > h3:focus:before {
		background-position: 0 0;
	}
	#ways-to-fundraise #accordion > h3.accordion1:before {
		background-image: url(../../images/fundraising-numbers-1.png);
	}
	#ways-to-fundraise #accordion > h3.accordion2:before {
		background-image: url(../../images/fundraising-numbers-2.png);
	}
	#ways-to-fundraise #accordion > h3.accordion3:before {
		background-image: url(../../images/fundraising-numbers-3.png);
	}
	.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
		left: 8px;
	}
	#threewaystoorder .span4 {
		text-align: center;
		margin-top: 20px;
	}
	#threewaystoorder ul.download-list li {
		text-align: center;
	}
	.ch-grid {
	    margin: 20px 0 0 0;
	    padding: 0;
	    list-style: none;
	    display: block;
	    text-align: center;
	    width: 100%;
	}
	.ch-grid:after,
	.ch-item:before {
	    content: '';
	    display: table;
	}
	.ch-grid:after {
	    clear: both;
	}
	.ch-grid li {
	    width: 220px;
	    height: 220px;
	    display: inline-block;
	    margin: 20px;
	}
	.ch-item {
	    width: 250px;
	    height: 250px;
	    border-radius: 50%;
	    overflow: hidden;
	    position: relative;
	    cursor: default;
	    box-shadow:
	        inset 0 0 0 13px rgba(255,255,255,0.6),
	        0 1px 2px rgba(0,0,0,0.1);
	    transition: all 0.4s ease-in-out;
	    background-position: center;
	    margin: 0 auto 1em;
	}
	.ch-img-1 {
	    background-image: url(../../images/fundraising/1.jpg);
	}
	.ch-img-2 {
	    background-image: url(../../images/fundraising/2.jpg);
	}
	.ch-img-3 {
	    background-image: url(../../images/fundraising/3.jpg);
	}
	.ch-info {
	    width: inherit;
	    height: inherit;
	    border-radius: 50%;
	    overflow: hidden;
	    opacity: 0;
	    transition: all 0.4s ease-in-out;
	    transform: scale(0);
	    text-align: center;
	}
	.ch-info.blue {
	    background: rgba(85,202,245, 0.8);
	}
	.ch-info.red {
	    background: rgba(239,84,96, 0.8);
	}
	.ch-info.orange {
	    background: rgba(248,153,59, 0.8);
	}
	.ch-info h3 {
	    color: #fff;
	    text-transform: uppercase;
	    letter-spacing: 2px;
	    font-size: 24px;
	    margin: 0 30px;
	    padding: 45px 0 0 0;
	    height: 50px;
	    font-family: 'Proxima Nova Regular', Calibri, 'Droid Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	    text-shadow:
	        0 0 1px #fff,
	        0 1px 2px rgba(0,0,0,0.3);
	    font-weight: bold;
	}
	.ch-info p {
	    color: #fff;
	    padding: 10px 5px;
	    font-style: italic;
	    margin: 0 30px;
	    font-size: 16px;
	    border-top: 1px solid rgba(255,255,255,0.5);
	    opacity: 0;
	    transition: all 0.5s ease-in-out 0.4s;
	}
	.ch-info p a {
	    display: block;
	    color: rgba(255,255,255,0.7);
	    font-style: normal;
	    font-weight: 700;
	    text-transform: uppercase;
	    font-size: 9px;
	    letter-spacing: 1px;
	    padding-top: 4px;
	    font-family: 'Open Sans', Arial, sans-serif;
	}
	.ch-info p a:hover {
	    color: rgba(255,242,34, 0.8);
	}
	.ch-item:hover {
	    box-shadow:
	        inset 0 0 0 1px rgba(255,255,255,0.1),
	        0 1px 2px rgba(0,0,0,0.1);
	}
	.ch-item:hover .ch-info {
	    transform: scale(1);
	    opacity: 1;
	}
	.ch-item:hover .ch-info p {
	    opacity: 1;
	}
	#ways-to-fundraise {
		margin-top: 20px;
	}
	#threewaystoorder .span4 {
		border-right: 1px dashed #ddd;
		box-sizing:border-box;
		-moz-box-sizing:border-box; /* Firefox */
		padding-right: 20px;
	}
	#ways-to-fundraise .span4 img {
		display: block;
		margin: 0 auto;
		text-align: center;
	}
	#ways-to-fundraise .span4 h3 {
		text-transform: uppercase;
		text-align: center;
	}
	#guarantee .span3, #guarantee .span9 {
		margin-top: 20px;	
	}

/*/////////////////////////////////////////////////////////////////////////////////////
// Fundraising Media Queries
/////////////////////////////////////////////////////////////////////////////////////*/

	/* Large desktop display */
	@media (min-width: 1200px) {
	#mr-bee {
		background: url(../../images/fundraising/bee-large-display.png) no-repeat;
		width: 30px;
		height: 38px;
	}
	#bus {
		background: url(../../images/fundraising/bus-large-display.png) no-repeat;
		width: 231px;
		height: 157px;
	}
	@keyframes bus {
		0%{right:0%;top:220px}
		100%{right:13%; top: 135px;}
	}

	@-webkit-keyframes bus /* Safari and Chrome */{
		0%{right:0%;top:220px}
		100%{right:13%; top:135px;}
	}
	#playground-kid {
		background: url(../../images/fundraising/playground-kid-large-display.png) no-repeat;
		width: 33px;
		height: 52px;
		top:149px;
	}
	@keyframes playground-kid {
		0%{left:8.25%;top:149px}
		50%{transform:rotate(-15deg)}
		100%{left:10%; top: 149px;}
	}

	@-webkit-keyframes playground-kid /* Safari and Chrome */{
		0%{left:8.25%;top:149px}
		50%{-webkit-transform:rotate(-15deg)}
		100%{left:10%; top:149px;}
	}
	#kite {
		background: url(../../images/fundraising/kite-large-display.png) no-repeat;
		width: 66px;
		height: 133px;
	}

	}

	/* Landscape Tablets */
	@media (min-width: 768px) and (max-width: 979px) {
		#playground-kid {display: none;}
		#bus {display: none;}
		#mr-bee {display: none;}
	}

	/* Landscape Phones and Portrait Tablets */
	@media (max-width: 767px) {
		#playground-kid {display: none;}
		#bus {display: none;}
		#mr-bee {display: none;}
		
	}

	/* All Phones only */
	@media (max-width: 480px) {
		#playground-kid {display: none;}
		#bus {display: none;}
		#mr-bee {display: none;}
		.ui-tabs-panel .buckets, .ui-tabs-panel .bagsets {
			margin: 1em 0;
			width: 100%;
		}
		.buckets > div, .bagsets > div {
			margin: 0 0 1em;
			width: 100%;
		}
		ul.product-specs {
			width: 100%;
		}
		#guarantee .span3 {
			text-align: center;
		}
		#threewaystoorder {
			margin-top: 20px;
		}
		#content h3.main-title {
			font-size: 1em;
		}
	}

	/* All Tablets and Phones only */
	@media (max-width: 979px) {
		#playground-kid {display: none;}
		#bus {display: none;}
		#mr-bee {display: none;}
		#ways-to-fundraise .span4 {min-height: 600px;}
		#ways-to-fundraise .span4 {border-right: none;}
	}

	/* All Desktops only */
	@media (min-width: 980px) {
	
	}