doushio/www/css/yakui.css

body {
	background: url(./img/background001.jpg) fixed bottom no-repeat;
	background-size: cover;
	color: #51384a;
}

h1 {
	clear: both;
	text-align: center;
	text-shadow: -1.5px 0 black, 0 1.5px black, 1.5px 0 black, 0 -1.5px black;
	font-size: 2em;
	color: #e5cbf5;
	width: 100%;
	font-weight: 600;
}

article,
#options-panel {
	background: rgba(229, 203, 245, 0.7) url('./img/weeee.gif') no-repeat scroll bottom right;
	background-size: 70px;
}

section {
	background: rgba(72, 34, 102, 0.5);
	padding: 10px;
	transform: rotate(5deg) skew(5deg);
	transition: ease-in 0.5s;
}

section > figure,
section > header,
section > blockquote,
section > .omit {
	color: #fff;
}

a,
.embed,
.embed:hover {
	color: #ff69b4;
}

.pagination,
.act {
	background-color: #e5cbf5;
	color: #51384a;
}

#sync, 
#feedback, 
#options, 
#bottom > a {
	color: #ff69b4;
	background-color: #e5cbf5;
	padding: 2px
}

#lock {
	color: #ff96b4
}

section > header > b {
	color: #FF6600;
	animation: hue 3s infinite;
}

header > .act,
#bottom {
	background: none;
}

header > nav a,
preview > nav a {
	color: #51384a;
}

section > header > nav a {
	color: #fff;
}

h3 {
	color: yellow;
}

.editing {
	animation: hue 5s alternate infinite;
}

.preview {
	background-color: rgba(229, 203, 245, 0.9);
}

article a,
preview a {
	color: #330066;
}

@keyframes hue {
	0%  { filter: hue-rotate(0deg) saturate(100%); }
	25% { filter: hue-rotate(45deg) saturate(500%); }
	50% { filter: hue-rotate(90deg) saturate(100%); }
	75% { filter: hue-rotate(135deg) saturate(500%); }
	100%{ filter: hue-rotate(180deg) saturate(100%); }
}