﻿@charset "utf-8";
/* CSS Document */

/* ------------------------------------------------------------------------- */
/* Gallery-Wide (static - exclude hover state): */
/* ------------------------------------------------------------------------- */

.item {
	background-color: rgba(255, 255, 255, 0.25);
	background-blend-mode: lighten;
	cursor:default;
}

.item .text {
	color:White;
	background-color:Black;
	display:block;
	width:100%;
	padding:50px;
	opacity:0.7;
}

/* ------- */
/* Tables: */
/* ------- */

#content table tr td:nth-child(1) {
	width:50%;
}
#content table tr td:nth-child(2) {
	width:50%;
}
#content table tr td img {
	max-width:100%;
	
	/* hacks */
	/* http://davidwalsh.name/css-rounded-corners */
}

.tbl-price {
	#font-size:xxx-large;
	#font-weight:bold;
	font-size:large;
}

.tbl-price tr td {
	width:25%;
}

	.money {
		#width:100px;
	}
	.money img {
		width:128px;
		#box-shadow:0 0 5px Black;
		cursor:pointer;
		filter:/*contrast(150%)*/ hue-rotate(90deg);
		
		/* hacks */
		/* http://davidwalsh.name/css-rounded-corners */
		
		/*
		border-radius:15px;
		-moz-border-radius:15px;
		-webkit-border-radius:15px;
		-o-border-radius:15px;
		*/
	}
	
	.money img:hover {
		opacity:0.7;
	}


/* -------- */
/* Classes: */
/* -------- */

blockquote {
	font-size:small;
	#text-align:left;
	margin:5px;
}

sup {color:red;}

.rounded {
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-o-border-radius:5px;
}

/* ----------- */
/* Animations: */
/* ----------- */

.rotate {
	animation:rotate 5s infinite linear;
	
	width:300px;
	#background-size:300px 300px;
	margin:auto;
	#border:1px solid Black; /* debug */
	z-index:-999;
	font-weight:Bold;
	
	/* Make extra room to make the image fit, rather than having to resize bg-img itself etc.: */
	padding-top:10px;
	padding-bottom:10px;
}

@keyframes rotate {
	from { transform: rotate(0deg); }
	to { transform:rotate(360deg); }
}

/* Fixes: */
@keyframes rotate-rev {
	from { transform: rotate(0deg); }
	to { transform:rotate(-360deg); }
}
.rotate .text {
	#transform: rotate(0deg);
	animation:rotate-rev 5s infinite linear;
	background-color:transparent;
	color:Black;
}
.rotate:hover .text {
	#background-color:transparent;
	#color:Black;
}

/* Disco: */

.disco {
	animation:disco 7.5s infinite linear;
}

@keyframes disco {
	from { filter:hue-rotate(0deg); }
	to { filter:hue-rotate(360deg); }
}