.webp .background{
	background-image: url(../img/10years/bg.webp);
}
.no-webp .background{
	background-image: url(../img/10years/bg.jpg);
}


.plattform {
	background-repeat:no-repeat;
	background-size: 108% 100%;
	width: 110%;
	height: 450px;
	height: 53vh;
	min-height: 42vh;
}

.webp .plattform {
	background-image: url(../img/10years/plattform.webp);	
}
.no-webp .plattform {
	background-image: url(../img/10years/plattform.png);	
}

.foreground {
	background: url(../img/10years/foreground.png) no-repeat center bottom;
	background-size: contain;
	width: 137vw;
	height: 35vw;
	position: absolute;
	left: 40%;
	bottom: 0%;
	-webkit-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}

#footer a:hover {
	color: #ffc21a;
}

#footer a, #footer a:active, #footer a:focus, #footer a:visited {
	color: #fff;
}

#footer li.divider {
	color: #fff;
}

.webp .logo {
	background-image: url("../img/10years/logo.webp");
}
.no-webp .logo {
	background-image: url("../img/10years/logo.png");
}


.mage .icon{
	background-image: url(../img/10years/icon_mage_inactive.png);
}
.hunter .icon{
	background-image: url(../img/10years/icon_hunter_inactive.png);
	left:51%;
}
.warlock .icon{
	background-image: url(../img/10years/icon_warlock_inactive.png);
}
.assassine .icon{
	background-image: url(../img/10years/icon_assassin_inactive.png);
}
.warrior .icon{
	background-image: url(../img/10years/icon_warrior_inactive.png);
}
.berserk .icon{
	background-image: url(../img/10years/icon_berserk_inactive.png);
}




.webp .mage .image{
	background-image: url(../img/10years/mage_inactive.webp);
}
.no-webp .mage .image{
	background-image: url(../img/10years/mage_inactive.png);
}

.webp .hunter .image {
	background-image: url(../img/10years/hunter_inactive.webp);	
}
.no-webp .hunter .image {
	background-image: url(../img/10years/hunter_inactive.png);	
}

.webp .warlock .image{
	background-image: url(../img/10years/warlock_inactive.webp);
}
.no-webp .warlock .image{
	background-image: url(../img/10years/warlock_inactive.png);
}

.webp .assassine .image {
	background-image: url(../img/10years/assassine_inactive.webp);
}
.no-webp .assassine .image {
	background-image: url(../img/10years/assassine_inactive.png);
}

.webp .warrior .image{
	background-image: url(../img/10years/warrior_inactive.webp);
}
.no-webp .warrior .image{
	background-image: url(../img/10years/warrior_inactive.png);
}

.webp .berserk .image{
	background-image: url(../img/10years/berserk_inactive.webp);
}
.no-webp .berserk .image{
	background-image: url(../img/10years/berserk_inactive.png);
}

.chooseclass {
	text-shadow: 0 3px #664922, 0 0 15px #664922, 0 0 30px #664922;
}

.attributes-header{
    text-shadow: 0 3px #664922, 0 0 15px #664922, 0 0 30px #664922;
}

.char .image::before {
	content: " ";
	position: absolute;
	width: 70%;
	height: 20%;
	background: url(../img/10years/blob.png) no-repeat;
	background-size: 100% 100%;
	bottom: -6%;
	left: 20%;
}

.assassine .image::before {
	bottom: -6%;
	left: 15%;
}

.hunter .image::before {
	bottom: -6%;
	left: -4%;
}
.warlock .image::before {
	bottom: -1%;
	left: 20%;
}

.mage .image::before {
	bottom: -3%;
	left: 20%;
}
.berserk .image::before {
	bottom: -5%;
	left: 15%;
}

#footer{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#6a4b21+0,6a4b21+100&0.04+0,0.82+52,1+98 */
background: -moz-linear-gradient(top, rgba(106,75,33,0.04) 0%, rgba(106,75,33,0.82) 52%, rgba(106,75,33,1) 98%, rgba(106,75,33,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(106,75,33,0.04) 0%,rgba(106,75,33,0.82) 52%,rgba(106,75,33,1) 98%,rgba(106,75,33,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(106,75,33,0.04) 0%,rgba(106,75,33,0.82) 52%,rgba(106,75,33,1) 98%,rgba(106,75,33,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0a6a4b21', endColorstr='#6a4b21',GradientType=0 ); /* IE6-9 */
}