@CHARSET "UTF-8";
/*TODO: 	relative dummy slide instead of relative first slide
			fix the prev/next buttons
			add slide cat animation with delay after each panel rotation
			find a way to make the control buttons pop up only when highlighting the actual slider
			read more button
			give all buttons theme colors
			fix index label animation timings
			fade in animations for slide info
			show/hide controls switch for smaller screens
			make the whole slide info box into a link?
			title and excerpt formatting
			author and date fields
			*/
.slider
{ 
	display:inline-block; 
	overflow:hidden; /*overlay;*/ min-height:273px; /*max-height:547px;*/ width:100%; min-width:480px; max-width:960px; 
	position:relative; 
}
	.slider input { display:none; }
	.slide-container 
	{ 
		display:inline-block;
		white-space:nowrap;
		max-height:inherit; width:100%;
		overflow:hidden;
	}
		.resume-auto /*resume button*/
		{
			background-color:#d13038; 
				border-radius:5px; 
				color:#ffffff; 
				font-weight:bold; 
			cursor:pointer;
			display:inline-block;
			opacity:0; visibility:hidden; 
			padding-left:5px; padding-right:5px; 
			position:absolute; top:2em; right:0.5em; 
			transition:.2s; 
			z-index:12;
		}
			.resume-auto:before { content:"Resume"; line-height:1.8; }
		.slide 
		{ 
			display:inline; 
			width:100%; 
		}
			.slider > input[type="radio"]:not(:checked) + .slide-container > .slide /*all slides during manual selection*/
			{
				position:absolute;
			}
			.slider > input[type="radio"]:not(:checked) + .slide-container > .slide-first /*only the first slide during manual selection*/
			{
				/*height:inherit;*/
				position:relative;
			}
			.slider > input[type="radio"]:checked + .slide-container > .slide-first > .slide-label /*the first slide's index label during autoplay*/
			{
				/*top:unassigned; /*default;*/
				/*display:none; can't figure this out for now*/
				opacity:0; visibility:hidden;
			}
			.slider > input[type="radio"]:not(:checked) + .slide-container > input[type="radio"]:checked + :not(.slide-first)  /*every selected slide except the first*/
			{
				margin-left:-100%;
			}
			.slider > input[type="radio"]:checked + .slide-container > .slide > .slide-specific, /*all slide-specific content during autoplay*/
			.slider > input[type="radio"]:checked + .slide-container > .slide > .slide-img > img,
			.slider > input[type="radio"]:checked + .slide-container > .slide > .slide-label, /*all index labels during autoplay*/
			.slider > imput[type="radio"]:checked + .slide-container > .fake-labels > #fake-1
			{ 
				animation-play-state:running; 
			}
			.slider > input[type="radio"]:not(:checked) + .slide-container > /*.resume-auto:not(:hover) ~*/ .slide > .slide-info, /*all slide info during manual selection*/
			.slider > input[type="radio"]:not(:checked) + .slide-container > /*.resume-auto:not(:hover) ~*/ .slide > .slide-img, /*all slide images during manual selection*/
			.slider > input[type="radio"]:not(:checked) + .slide-container > /*.resume-auto:not(:hover) ~*/ .slide > .slide-img > img /*all slide images during manual selection*/
			{ 
				animation-play-state:paused;
				-ms-transform:translate(0%) !important; -webkit-transform:translate(0%) !important; transform:translate(0%) !important;
			}
			.slider > input[type="radio"]:not(:checked) + .slide-container > .slide > .slide-label,  /*all index labels during manual selection*/
			.slider > input[type="radio"]:not(:checked) + .slide-container > .fake-labels > .fake-label, 
			.slider > imput[type="radio"]:not(:checked) + .slide-container > .fake-labels > #fake-1
			{ 
				animation-play-state:paused !important; 
			}
				.slider > input[type="radio"]:not(:checked) + .slide-container > input[type="radio"]:not(:checked) + .slide > .slide-specific /*slide-specific content of unselected slides during manual selection*/
				{
					opacity:0; /*!important;*/ visibility:hidden; /*!important;*/
				} 
				.slider > input[type="radio"]:not(:checked) + .slide-container > input[type="radio"]:checked + .slide > .slide-img, /*selected slide image*/
				.slider /*:hover*/ > input[type="radio"]:not(:checked) + .slide-container > input[type="radio"]:checked + .slide:hover > .slide-info, /*selected slide info on mouseover*/
				.slider:hover /*:hover*/ > .slide-container > .slide /*:hover*/ > .slide-info, /*all slide info on mouseover*/
				.slider > input[type="radio"]:not(:checked) + .slide-container > input[type="radio"]:checked + .slide:hover > .slide-info > .slide-nav, /*selected slide info on mouseover*/
				/* .slider:hover > .slide-container > .slide > .slide-label, /*index labels on mouseover during autoplay*/
				.slider:hover > input[type="radio"]:not(:checked) + .slide-container > .resume-auto, /*resume button on mouseover during manual selection*/
				.slider > input[type="radio"]:not(:checked) + .slide-container > .fake-labels:hover ~ input[type="radio"]:checked + .slide > .slide-info
				{ 
					opacity:1; /*!important;*/ visibility:visible; /*!important;*/
				}
			.slide-label  /*all slide index labels*/
			{ 
				/*animation:cycle-label 60s infinite; -webkit-animation:cycle-label 60s infinite; -moz-animation:cycle-label 60s infinite;*/
				/*animation-dely:inherit; animation-play-state:inherit;*/ /*you cannot inherit animation states/delays*/
				z-index:12;
			}
			.slide:not(.slide-first) > .slide-label, 
			.slider > .slide-container > .fake-labels > #fake-1  /*all slide index labels*/
			{ 
				animation:cycle-label 60s infinite; -webkit-animation:cycle-label 60s infinite; -moz-animation:cycle-label 60s infinite;
			}
			.slide-label, .fake-label
			{
				background-color:#ebebeb;
				border-radius:100%;
				cursor:pointer;
				display:inline-block;
    			height:1em; width:1em; 
    			position:absolute; /*top:.5em;*/
    			opacity:0; visibility:hidden;
			    transition:.2s;
			}
				.slider > input[type="radio"]:checked + .slide-container:hover > .slide:not(.slide-first) > .slide-label, 
				.slider > input[type="radio"]:checked + .slide-container > .fake-labels:hover ~ .slide > .slide-info
				{
					opacity:1; visibility:visible;
				}
				.slider > input[type="radio"]:checked + .slide-container > .slide:not(.slide-first) > .slide-label
				{
					top:.5em;
				}
				/*.slider > input[type="radio"]:not(:checked) + .slide-container > input[type="radio"]:not(:checked) + .slide > .slide-label, */
				.slider > input[type="radio"]:not(:checked) + .slide-container > .slide:not(.slide-first) > .slide-label
				{
					-ms-transform:translate(0.25em, 0.25em) !important; -webkit-transform:translate(0.25em, 0.25em) !important; transform:translate(0.25em, 0.25em) !important;
				}
				.slider > input[type="radio"]:not(:checked) + .slide-container > input[type="radio"]:checked + .slide-first > .slide-label
				{
					-ms-transform:translate(0.25em, 0.25em) !important; -webkit-transform:translate(0.25em, 0.25em) !important; transform:translate(0.25em, 0.25em) !important;
				}
				.fake-label { opacity:0; visibility:hidden; top:.5em; z-index:11; }
				.slider:hover > /*input[type="radio"]:not(:checked) +*/ .slide-container > .resume-auto:not(:hover) + .fake-labels > .fake-label { opacity:1; visibility:visible; } /*fake labels during manual selection*/
				.slider > input[type="radio"]:not(:checked) + .slide-container > input[type="radio"]:not(:checked) + .slide > .slide-label /*index labels of non-selected slides during manual selection*/
				{ 
					background-color:#ebebeb !important; /*opacity:0; /*visibility:hidden;*/ /*#00cc00;*/
				}
				.slider > input[type="radio"]:not(:checked) + .slide-container > input[type="radio"]:checked + .slide > .slide-label /*the selected slide's index label*/
				{ 
					background-color:#616161 !important; height:1.5em !important; width:1.5em !important;
				}
					.slider > input[type="radio"]:not(:checked) + .slide-container > input[type="radio"]:checked + .slide:hover > .slide-label, /*the selected slide's index label on mouseover*/
					.slider > input[type="radio"]:not(:checked) + .slide-container > .fake-labels:hover ~ input[type="radio"]:checked + .slide > .slide-label
					{ 
						opacity:1; visibility:visible;
					}
					@keyframes cycle-label
					{
			  			0%, 100% { background-color:#ebebeb; height:1em; width:1em; -ms-transform:translate(0em, 0em); -webkit-transform:translate(0em, 0em); transform:translate(0em, 0em); }
			  			0.3% { background-color:#616161; height:1.5em; width:1.5em; -ms-transform:translate(0.25em, -0.25em); -webkit-transform:translate(0.25em, -0.25em); transform:translate(0.25em, -0.25em); }
			  			16.2% { background-color:#616161; height:1.5em; width:1.5em; -ms-transform:translate(0.25em, -0.25em); -webkit-transform:translate(0.25em, -0.25em); transform:translate(0.25em, -0.25em); }
			 			16.5% { background-color:#ebebeb; height:1em; width:1em; -ms-transform:translate(0em, 0em); -webkit-transform:translate(0em, 0em); transform:translate(0em, 0em); }
					}
					@-webkit-keyframes cycle-label
					{
			  			0%, 100% { background-color:#ebebeb; height:1em; width:1em; -ms-transform:translate(0em, 0em); -webkit-transform:translate(0em, 0em); transform:translate(0em, 0em); }
			  			0.3% { background-color:#616161; height:1.5em; width:1.5em; -ms-transform:translate(0.25em, -0.25em); -webkit-transform:translate(0.25em, -0.25em); transform:translate(0.25em, -0.25em); }
			  			16.2% { background-color:#616161; height:1.5em; width:1.5em; -ms-transform:translate(0.25em, -0.25em); -webkit-transform:translate(0.25em, -0.25em); transform:translate(0.25em, -0.25em); }
			 			16.5% { background-color:#ebebeb; height:1em; width:1em; -ms-transform:translate(0em, 0em); -webkit-transform:translate(0em, 0em); transform:translate(0em, 0em); }
					}
					@-moz-keyframes cycle-label
					{
			  			0%, 100% { background-color:#ebebeb; height:1em; width:1em; -ms-transform:translate(0em, 0em); -webkit-transform:translate(0em, 0em); transform:translate(0em, 0em); }
			  			0.3% { background-color:#616161; height:1.5em; width:1.5em; -ms-transform:translate(0.25em, -0.25em); -webkit-transform:translate(0.25em, -0.25em); transform:translate(0.25em, -0.25em); }
			  			16.2% { background-color:#616161; height:1.5em; width:1.5em; -ms-transform:translate(0.25em, -0.25em); -webkit-transform:translate(0.25em, -0.25em); transform:translate(0.25em, -0.25em); }
			 			16.5% { background-color:#ebebeb; height:1em; width:1em; -ms-transform:translate(0em, 0em); -webkit-transform:translate(0em, 0em); transform:translate(0em, 0em); }
					}
			/*individual index label positions*/
				/*#slide-6 > .slide-label { right:.5em; }
				#slide-5 > .slide-label { right:2em; }
				#slide-4 > .slide-label { right:3.5em; }
				#slide-3 > .slide-label { right:5em; }
				#slide-2 > .slide-label { right:6.5em; }
				#slide-1 > .slide-label { right:8em; }*/
			.slide-nav /*all previous/next buttons*/
			{	display:none;
				background-color:#d13038; color:#ffffff;
				border-radius:6px;
				cursor:pointer;
				font-weight:bold; 
				opacity:0; visibility:hidden;
				padding-left:5px; padding-right:5px;
				/*position:absolute; /*bottom:0em;*/
				transition:.2s;
				z-index:12;
			}
				.slide-nav:hover, .slide-categ span:hover, .resume-auto:hover { background-color:#ffffff; color:#000000; }
				.slider:hover > input[type="radio"]:not(:checked) + .slide-container > input[type="radio"]:checked + .slide > .slide-info > .slide-nav { opacity:1; visibility:visible; } /*show previous/next buttons on mouseover*/
					.slide-prev { float:left; margin-left:10px; left:0em; }
					.slide-prev:before { content:"Previous"; }
				.slide-next { float:right; margin-right:10px; right:0em; }
					.slide-next:before { content:"Next"; }
			.slide-info /*unique slide contents*/
			{ 
				animation:rotate-slides 60s 0s infinite; -webkit-animation:rotate-slides 60s 0s infinite; -moz-animation:rotate-slides 60s 0s infinite;
				background-color:rgba(0,0,0,0.5); 
				/*opacity:0; visibility:hidden;*/
				display:inline-block;
				line-height:1.0;
				margin-right:-100%;
				padding-top:5px; /*padding-bottom:12px;*/
				position:relative; /*fixes an OSX chrome z-index bug*/
				transition:.2s;
				width:100%;
				z-index:11;
			}
				
			/*.slider > input[type="radio"]:not(:checked) + .slide-container > .slide > .slide-info
			{
				-ms-transform:translate(0px, -60px) !important; -webkit-transform:translate(0px, -60px) !important; transform:translate(0px, -60px) !important;
			}*/
			.slide-categ, .slide-title, .slide-excerpt { color:#ffffff; display:block; /*padding-bottom:15px;*/ padding-left:15px; /*position:absolute;*/ z-index:11; }
			.slide-categ span
			{ 
				background-color:#d13038; 
				border-radius:5px; 
				color:#ffffff; 
				font-weight:bold; 
				line-height:1.8;
				/*margin-top:-25px;*/ 
				padding-left:5px; padding-right:5px;
				position:absolute;
				transition:0.2s; 
				-ms-transform:translate(0px, -18px) !important; -webkit-transform:translate(0px, -18px) !important; transform:translate(0px, -18px) !important;
			}
			.slide-title 
			{ 
				color:#ffffff; font-size:16px; font-weight:bold; overflow:hidden; padding-top:5px; padding-bottom:5px; text-decoration:none; 
			}
			.slide-excerpt 
			{ 
				padding-bottom:10px; overflow:hidden;
			}
				.slide-img
				{ 
					animation:rotate-slides 60s infinite; -webkit-animation:rotate-slides 60s infinite; -moz-animation:rotate-slides 60s infinite; 
					min-height:273px; /*max-width:100%;*/ min-width:480px; 
					position:relative;
					transition:.2s; 
					width:100%;
					z-index:10;
				}
				.slide-img2 { animation:rotate-slides 60s infinite; -webkit-animation:rotate-slides 60s infinite; -moz-animation:rotate-slides 60s infinite; }
					.slide-container input:checked + .slide > .slide-img
					{
						opacity:1; visibility:visible;
					}
				@keyframes display-panel
				{
		  			0%, 100% { opacity:0; visibility:hidden; }
		  			0.3% { opacity:1; visibility:visible; }
		  			16.7% { opacity:1; visibility:visible; }
		 			17% { opacity:0; visibility:hidden; }
				}
				@-webkit-keyframes display-panel
				{
		  			0%, 100% { opacity:0; visibility:hidden; }
		  			0.3% { opacity:1; visibility:visible; }
		  			16.7% { opacity:1; visibility:visible; }
		 			17% { opacity:0; visibility:hidden; }
				}
				@-moz-keyframes display-panel
				{
		  			0%, 100% { opacity:0; visibility:hidden; }
		  			0.3% { opacity:1; visibility:visible; }
		  			16.7% { opacity:1; visibility:visible; }
		 			17% { opacity:0; visibility:hidden; }
				}
				@keyframes scroll-text
				{
		  			0%, 100% { -ms-transform:translate(0%); -webkit-transform:translate(0%); transform:translate(0%); opacity:1; }
		  			98% { -ms-transform:translate(-100%); -webkit-transform:translate(-100%); transform:translate(-100%); opacity:1; }
		  			99% { opacity:0; }
				}
				@-webkit-keyframes scroll-text
				{
		  			0%, 100% { -ms-transform:translate(0%); -webkit-transform:translate(0%); transform:translate(0%); opacity:1; }
		  			98% { -ms-transform:translate(-100%); -webkit-transform:translate(-100%); transform:translate(-100%); opacity:1; }
		  			99% { opacity:0; }
				}
				@-moz-keyframes scroll-text
				{
		  			0%, 100% { -ms-transform:translate(0%); -webkit-transform:translate(0%); transform:translate(0%); opacity:1; }
		  			98% { -ms-transform:translate(-100%); -webkit-transform:translate(-100%); transform:translate(-100%); opacity:1; }
		  			99% { opacity:0; }
				}
				@keyframes rotate-slides
				{
					0%, 100% { -ms-transform:translate(0%); -webkit-transform:translate(0%); transform:translate(0%); }
					16.17% { -ms-transform:translate(0%); -webkit-transform:translate(0%); transform:translate(0%); }
					16.67% { -ms-transform:translate(-100%); -webkit-transform:translate(-100%); transform:translate(-100%); }
					32.84% { -ms-transform:translate(-100%); -webkit-transform:translate(-100%); transform:translate(-100%); }
					33.34% { -ms-transform:translate(-200%); -webkit-transform:translate(-200%); transform:translate(-200%); }
					49.51% { -ms-transform:translate(-200%); -webkit-transform:translate(-200%); transform:translate(-200%); }
					50.01% { -ms-transform:translate(-300%); -webkit-transform:translate(-300%); transform:translate(-300%); }
					66.18% { -ms-transform:translate(-300%); -webkit-transform:translate(-300%); transform:translate(-300%); }
					66.68% { -ms-transform:translate(-400%); -webkit-transform:translate(-400%); transform:translate(-400%); }
					82.85% { -ms-transform:translate(-400%); -webkit-transform:translate(-400%); transform:translate(-400%); }
					83.35% { -ms-transform:translate(-500%); -webkit-transform:translate(-500%); transform:translate(-500%); }
					97% { -ms-transform:translate(-500%); -webkit-transform:translate(-500%); transform:translate(-500%); }
					/*100% { -ms-transform:translate(0%); -webkit-transform:translate(500%); transform:translate(500%); }*/
				}
				@-webkit-keyframes rotate-slides
				{
					0%, 100% { -ms-transform:translate(0%); -webkit-transform:translate(0%); transform:translate(0%); }
					16.17% { -ms-transform:translate(0%); -webkit-transform:translate(0%); transform:translate(0%); }
					16.67% { -ms-transform:translate(-100%); -webkit-transform:translate(-100%); transform:translate(-100%); }
					32.84% { -ms-transform:translate(-100%); -webkit-transform:translate(-100%); transform:translate(-100%); }
					33.34% { -ms-transform:translate(-200%); -webkit-transform:translate(-200%); transform:translate(-200%); }
					49.51% { -ms-transform:translate(-200%); -webkit-transform:translate(-200%); transform:translate(-200%); }
					50.01% { -ms-transform:translate(-300%); -webkit-transform:translate(-300%); transform:translate(-300%); }
					66.18% { -ms-transform:translate(-300%); -webkit-transform:translate(-300%); transform:translate(-300%); }
					66.68% { -ms-transform:translate(-400%); -webkit-transform:translate(-400%); transform:translate(-400%); }
					82.85% { -ms-transform:translate(-400%); -webkit-transform:translate(-400%); transform:translate(-400%); }
					83.35% { -ms-transform:translate(-500%); -webkit-transform:translate(-500%); transform:translate(-500%); }
					97% { -ms-transform:translate(-500%); -webkit-transform:translate(-500%); transform:translate(-500%); }
					/*100% { -ms-transform:translate(0%); -webkit-transform:translate(500%); transform:translate(500%); }*/
				}
				@-moz-keyframes rotate-slides
				{
					0%, 100% { -ms-transform:translate(0%); -webkit-transform:translate(0%); transform:translate(0%); }
					16.17% { -ms-transform:translate(0%); -webkit-transform:translate(0%); transform:translate(0%); }
					16.67% { -ms-transform:translate(-100%); -webkit-transform:translate(-100%); transform:translate(-100%); }
					32.84% { -ms-transform:translate(-100%); -webkit-transform:translate(-100%); transform:translate(-100%); }
					33.34% { -ms-transform:translate(-200%); -webkit-transform:translate(-200%); transform:translate(-200%); }
					49.51% { -ms-transform:translate(-200%); -webkit-transform:translate(-200%); transform:translate(-200%); }
					50.01% { -ms-transform:translate(-300%); -webkit-transform:translate(-300%); transform:translate(-300%); }
					66.18% { -ms-transform:translate(-300%); -webkit-transform:translate(-300%); transform:translate(-300%); }
					66.68% { -ms-transform:translate(-400%); -webkit-transform:translate(-400%); transform:translate(-400%); }
					82.85% { -ms-transform:translate(-400%); -webkit-transform:translate(-400%); transform:translate(-400%); }
					83.35% { -ms-transform:translate(-500%); -webkit-transform:translate(-500%); transform:translate(-500%); }
					97% { -ms-transform:translate(-500%); -webkit-transform:translate(-500%); transform:translate(-500%); }
					/*100% { -ms-transform:translate(0%); -webkit-transform:translate(500%); transform:translate(500%); }*/
				}
				/*individual slide element animation delays*/
					#fake-1 /*slide-1 > .slide-label /*, #slide-1 > .slide-info*/ { animation-delay:0s; -webkit-animation-delay:0s; -moz-animation-delay:0s; }
					#slide-2 > .slide-label /*, #slide-2 > .slide-info*/ { animation-delay:10.2s; -webkit-animation-delay:10.2s; -moz-animation-delay:10s; }
					#slide-3 > .slide-label /*, #slide-3 > .slide-info*/ { animation-delay:20.2s; -webkit-animation-delay:20.2s; -moz-animation-delay:20s; }
					#slide-4 > .slide-label /*, #slide-4 > .slide-info*/ { animation-delay:30.2s; -webkit-animation-delay:30.2s; -moz-animation-delay:30s; }
					#slide-5 > .slide-label /*, #slide-5 > .slide-info*/ { animation-delay:40.2s; -webkit-animation-delay:40.2s; -moz-animation-delay:40s; }
					#slide-6 > .slide-label /*, #slide-6 > .slide-info*/ { animation-delay:50.2s; -webkit-animation-delay:50.2s; -moz-animation-delay:50s; }
				/*slide backgrounds*/
					/*#slide-1 > .img-fake { background-color:#ff0000; }
					#slide-2 > .img-fake { background-color:#ff6600; }
					#slide-3 > .img-fake { background-color:#ffff00; }
					#slide-4 > .img-fake { background-color:#00ff00; }
					#slide-5 > .img-fake { background-color:#0000ff; }
					#slide-6 > .img-fake { background-color:#aa00ff; }*/
