html {
	height: 100%;
}

body {
	margin: 0;
	height: 100%;
	background: linear-gradient(0deg, #5f008b, #ae00ff 37%, #ffae00);/**/
}

.clouds-top {
	position: absolute;
	top: 5%;
	height: 300px;
	width: 100%;
	animation-name: moving;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

.clouds-top.left {
	background: url('cloud-top-l.png') repeat-x;
	animation-duration: 40s;
	animation-direction: reverse;
}

.clouds-top.right {
	background: url('cloud-top-r.png') repeat-x;
	animation-duration: 50s;
	animation-delay: -25s;
}


.clouds-bottom {
	background: url('cloud.png') repeat-x;
	background-position: -700px 0;
	position: absolute;
	bottom: 0px;
	height: 400px;
	width: 100%;
}

.wrapper {
	width: 960px;
	max-width: 100%;
	position: relative;
	height: 100%;
	margin: 0 auto;
	min-height: 460px;
}

.lnx {
	width: 50%;
	position: absolute;
	bottom: 100px;
	left: 25%;
}

.thought {
	position: absolute;
	display: block;
	width: 30%;
}

.thought img {
	width: 100%;
	transition: transform .2s ease;
}

.thought:hover img {
	transform: translate(0, -20px);
}

.thought.commission {
	right: 5%;
	bottom: 45%;
}

.thought.zzz {
	right: 35%;
	bottom: 55%;
}

.thought.gallery {
	right: 65%;
	bottom: 45%;
}

@keyframes moving {
	0%   { background-position: -60px 0; }
	 50% { background-position: +60px 0; }
	100% { background-position: -60px 0; }/**/
}