@font-face{
	
	font-family: Freestyle;
	src: url("FREESCPT.TTF");
}
@font-face{
	font-family: Northumbria;
	src: url("DK Northumbria.otf");
}
body {
	width: 100%;
	overflow: visible;
	background-attachment: fixed;

	background: url(Bilder/Archavosblurred.png) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	
	background-color: black;
	margin: 0px;
	font-family: Northumbria;
	 
}
.leftcover{
	width: 50%;
	height: 100%;
	position: fixed;
	background: url(Bilder/Wood.jpg);
	background-size: 100%;
	z-index: 10;
	box-shadow: 0px 0px 10px black;
}
.rightcover{
	width: 50%;
	height: 100%;
	right: 0px;
	position: fixed;
	background: url(Bilder/Wood.jpg);
	z-index: 10;
	box-shadow: 0px 0px 10px black;
}
h2{

}

::-webkit-scrollbar{
	width: 12px;
	height: 12px;
	background-color: #4d3829;
}
::-webkit-scrollbar-track{
	border: 2px solid #4d3829;
	-webkit-box-shadow: inset 0 0 6px black; 
  	-webkit-border-radius: 10px;
   	border-radius: 10px;
}
::-webkit-scrollbar-track-piece{
	
}  
::-webkit-scrollbar-thumb{
	background-color: #D1C1A4;
	-webkit-border-radius: 10px;
   	border-radius: 10px;
   	border: 2px solid #4d3829;
}
::-webkit-scrollbar-thumb:hover{
	background-color: #917153;
	border: 2px solid #4d3829;
}
::-webkit-scrollbar-corner{
}
::-webkit-resizer{}

.wrapper{
	margin: auto;
	padding-top: 30px;
	margin-bottom: 20px;
	width: 640px;
    	position: relative;
}
.ropes{
	width: 100%; 
	height: 0px;
	background-image: url(Bilder/Ropes.png);
	background-size: 100%;
	position: relative;
	z-index: 0;
}

.wood{
	width: 100%; 
	height: 60px;
	background-image: url(Bilder/Wood.jpg);
	background-size: 100%;
	position: relative;
	z-index: 2;
	box-shadow: 0px 0px 10px black;
	color: white;
	text-align: center;
	border-radius: 3px;
}
.wood h1{
	margin: 0px auto 0px auto;
	padding-top: 15px;
	line-height: 30px;
}
header {
	width: 100%;
	height: 65px;
	margin: auto;
	margin-top: 5px;
	background-image: url(Bilder/Wood.jpg);
	background-size: 100%;
	box-shadow: 0px 0px 10px black;
	position: relative;
	z-index: 2;
	text-align: center;
	border-radius: 3px;
}
header > h1{
	font-size: 2.4em;
	color: white;
	position: relative;
	width: 100px;
	margin: auto;
	padding-top: 15px;
	line-height: 30px;
}

header a{
	position: absolute;
	left: 10px;
	height: 100%;
	width: 65px;
	background-image: url(Bilder/cigiou.png);
	background-size: 100%;
}
header a:hover{
	background-image: url(Bilder/cigiouhover.png);
}
header form{
	float: right;
}
header form p{
	margin: 0px;
	margin-top: -10px;
	padding: 0px;
	float: right;
	margin-right: 10px;
	color: white;
	font-size: 0.7em;
}
header .login{
	position: absolute;
	left: auto;
	right: 10px;
	top: 15%;
	color: white;
	text-decoration: none;
	background:none!important;
	border:none; 
	padding:0px !important;
	font: inherit;
	cursor: pointer;
	width: auto;
	height: auto;
}
header .login:hover{
	text-decoration: underline;
}
.writeWrapper{
	width: 640px;
	top: -1500px;
    	position: fixed;
    	left: 0;
    	right: 0;
    	margin-left: auto;
    	margin-right: auto;
    	z-index: 2;
}
nav{
	width: 100%;
	height: 60px;
	margin: auto;
	padding: 0px;
	text-align: center;
	background-image: url(Bilder/Wood.jpg);
	background-size: 100%;
	box-shadow: 0px 0px 10px black;
	position: relative;
	z-index: 3;
	border-radius: 3px;
}	
nav ul{
	padding-top: 10px;
	padding-bottom: 10px;
}

nav ul li a.highlight
{
	box-shadow: 0px 0px 10px black;
	font-weight: bold;
}
.menuwrap2{
	width: 550px !important;
	margin: auto;
}
.menuwrap2 div{
	float: left !important;
}
.menuwrap{
	width: 440px;
	height: 36px;
	position: relative;
	margin: auto;
}
.menu{
	float: right;
	width:100px;
	position: relative;
	margin: 0px;
	margin-left: 5px;
}
.menu2{
	margin-top: 10px;
	float: left;
	margin-right: 5px;
	margin-left: 5px !important;
}

.menu ul{
	position: relative;
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

.menu ul li{
	float: left;
	position: relative;
}
#listTitle{
	background-color: #4d3829;
}
#listTitle:hover{
	background-color: #917153 !important;
	box-shadow: inset 0px 0px 10px black !important;
}
.menu ul li p, .menu ul li > a{
	text-decoration: none;
	display: block;
	width: 100px;
	margin: 0px;
	padding: 5px 0px 5px 0px;
	text-align: center;
	font-size: 100%;
	transition: background .5s;
	color: white;
	opacity: .8;
	box-shadow: inset 0px 0px 10px black;
	cursor: pointer;
	position: relative;
}
.menu ul li p{
	cursor: default !important;
}
.menu ul li p:hover, .menu ul li a:hover{
	box-shadow: 0px 0px 10px black;
}
	
.menu ul li ul {
	position: absolute;
	width: 100px;
}
.menu ul li ul li{
	max-height: 0px;
	transition: all .4s ease-out;
	-webkit-transition: all .4s ease-out;
	-o-transition: all .4s ease-out;
	-moz-transition: all .4s ease-out;
}	
.menu ul li ul li a{
	background-color: #D1C1A4;
	box-shadow: 0px 0px 10px black;
	font-family: helvetica;
	display: block;
	visibility: hidden;
	word-wrap:break-word;
	height: 0px;
	width: 97px;
	padding-left: 3px;
	transition: all .4s ease-out;
	-webkit-transition: all .4s ease-out;
	-o-transition: all .4s ease-out;
	-moz-transition: all .4s ease-out;
	text-decoration: none;
	color: #4d3829;
	text-align: left;
	white-space: nowrap;
    	overflow:hidden !important;
   	text-overflow: ellipsis;
   	position: relative;
   	z-index: 5;
}
.menu ul li:hover ul li{
	max-height: 30px;
	transition: all .4s ease-out;
	-webkit-transition: all .4s ease-out;
	-o-transition: all .4s ease-out;
	-moz-transition: all .4s ease-out;
}
.menu ul li:hover ul li a{
	visibility: visible;
	height: 20px;
	opacity: 1;
	transition: all .4s ease-out;
	-webkit-transition: all .4s ease-out;
	-o-transition: all .4s ease-out;
	-moz-transition: all .4s ease-out;
}
.menu form {
	margin: 0px;
}
.choice{
	width: 100%;
	opacity: 1;
	border: 0px;
	position: relative;
}
.choice:hover{
	background-color: #FFE4BF !important;
	cursor: pointer;
}
.choice2{
	width: 100px !important;
	text-align: center !important;
	padding-left: 0px !important;
	opacity: 1 !important;
}	
.content {
	width: 90%;
	min-height: 90px;
	padding: 10px 15px 10px 15px;
	margin: auto;
	background-color: #D1C1A4;
	box-shadow: 0px 0px 10px black;
	position: relative;
	display: table;
}
.content > *{
	opacity: 0;
}
.content > h1{
	text-align: center;
	margin-bottom: 3px;
}
.writeContent{
	opacity: 1;
}
.pagenumber{
	text-align: center;
	float: left;
	width: 100%;
	height: auto;
}
.pagenumber a{
	margin: 0px 7px 0px 7px;
	text-decoration: none;
	font-weight: bold;
	color: black;
}
.pagenumber a:hover{
	color: white;
}
footer {
	margin: auto;
	height: 60px;
	width: 100%;
	text-align: center;
	background-image: url(Bilder/Wood.jpg);
	background-size: 100%;
	box-shadow: 0px 0px 10px black;
	position: relative;
	z-index: 1;
	color: white;
	border-radius: 3px;
}
footer p{
	padding: 15px 0px 0px 0px;
	margin: 0px;
}
footer a{
	text-decoration: none;
	color: inherit;
}
footer a:hover{
	text-decoration: underline;
}

div.post
{
	width: 48%;
	margin: 0px 1%;
	height: 83px;
	float: left;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-bottom: 10px;
	position: relative;
	box-shadow: 0px 0px 10px black;
	font-family: Helvetica;
	transition: 0.5s;
	-webkit-transition: .5s;
	-o-transition: .5s;
	-moz-transition: .5s;
}
div.post2{
	height: 215px;
	background-color: #D1C1A4;
	opacity: 1;
	box-shadow: 0px 0px 10px black;
	position: relative;
	width: 310px;
	margin-top: 35px;
	margin-right: 10px;
	margin-left: 10px;
}
div.Duel{
	width: 510px;
}
div.Silence, div.Caldores{
	width: 440px;
}
div.Broken{
	width: 420px;
}
div.Second{
	width: 310px;
}
div.Dawns{
	width: 495px;
}
div.post:hover
{
	background-color: #4d3829;
	box-shadow: inset 0px 0px 10px black;
}

div.post h3
{
	color: #4d3829;
	margin-bottom: 0px;
	margin-top: 5px;
	margin-right: 6px;
	font-family: Northumbria;
	font-size: 1.4em;
	float: right;
	transition: 0.5s;
	-webkit-transition: .5s;
	-o-transition: .5s;
	-moz-transition: .5s;
}
div.post h4{
	color: #4d3829;
	margin-bottom: 0px;
	margin-top: 5px;
	margin-left: 6px;
	font-family: Northumbria;
	font-size: 1.4em;
	transition: 0.5s;
	-webkit-transition: .5s;
	-o-transition: .5s;
	-moz-transition: .5s;
}
div.post:hover h3, div.post:hover p.author, div.post:hover h4
{
	color: white;
	transition: 0.5s;
	-webkit-transition: .5s;
	-o-transition: .5s;
	-moz-transition: .5s;
}
div.post:hover h3{
	transition: 0.5s;
	-webkit-transition: .5s;
	-o-transition: .5s;
	-moz-transition: .5s;
	margin-top: 10px;
}
div.post:hover .characterimage{
	margin-left: 10px;
	transition: 0.5s;
	-webkit-transition: .5s;
	-o-transition: .5s;
	-moz-transition: .5s;
}
p.author
{
	margin-bottom: 0px;
	margin-top: 0px;
	margin-right: 6px;
	float: right;
	clear: right;

}
.type
{
	font-family: helvetica;
	margin-top: 2px;
	margin-left: 6px;
}

.message
{
	border-top: 1px solid #4d3829;
	padding-top: 5px;
	margin-top: 5px;
	word-wrap:break-word;
	font-family: helvetica;
	padding: 6px;
}
.characterimage{
	height: 100%;
	position: absolute;
	float: left;
	z-index: 1;
	top: 0px;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	-moz-transition: 0.5s;
}
span{
	position: absolute;
 	width:100%;
 	height:100%;
 	top:0;
 	float: left;
 	z-index: 2;
}

.selectionbox{
	position: relative;
	width: 100%;
	height: auto;
	margin-bottom: 20px;
}
#searchForm{
	display: inline;
}

#searchButton{
	color: white;
	background-color: #4d3829;
	opacity: .8;
	box-shadow: inset 0px 0px 10px black;
	border: 0px;
	transition: background .5s;
	-webkit-transition: background .5s;
	-o-transition: background .5s;
	-moz-transition: background .5s;
	cursor: pointer;
}
#searchButton:hover{
	background-color: #917153;
}

#searchBar{
	width: 120px;
 	color: white;
	background-color: #4d3829;
	opacity: .8;
	box-shadow: inset 0px 0px 10px black;
}
#searchBar:focus{
	
}

.write{
	text-decoration: none;
	color: white;
	padding-left: 8px;
	float: right;
	width: 150px;
	margin: 0px;;
	padding: 5px 0px 5px 0px;
	font-size: 100%;
	transition: background .5s, font-size .2s;
	background-color: #4d3829;
	opacity: .8;
	box-shadow: inset 0px 0px 10px black;
	position: relative;
	text-align: center;
	transition: background .5s;
	-webkit-transition: background .5s;
	-o-transition: background .5s;
	-moz-transition: background .5s;
	cursor: pointer;
}
.write:hover{
	background-color: #917153;
}
#writePost{
	margin: auto;
	width: 85%;
}
#writePost form{
	text-align: center;
}
#writePost form > input, form > select, #writePost form > div > input, .suggestions form > input, .loginbox form > input{
	margin: 0px 1px 5px 1px;
	border: 0px;
	width: 24%;
	color: white;
	background-color: #4d3829;
	opacity: .8;
	box-shadow: inset 0px 0px 10px black;
	float: left;
}
#writePost form > div > div{
	float: left;
}
#writePost form > div > input{
	width: 90%;
}
#writePost form textarea, .suggestions form textarea{
	color: white;
	background-color: #4d3829;
	opacity: .8;
	box-shadow: inset 0px 0px 10px black;
	margin-bottom: 5px;
	float: left;
	resize: none;
	width: 98.22%;
	height: 90px;
}
.eventLeft .add{
	float: left !important;
}
.eventtext{
	width: 60% !important;
	height: 142px !important;
}
.suggestions{
	width: 66%;
	margin: auto;
}
.loginbox{
	width: 47%;
	margin: auto;
}
.left{
	float: left;
	margin-left: 7px;
}
.right{
	float: right;
	margin-right: 7px;
}
.loginbox form > input{
	width: 261px;
	height: 35px;
	padding-left: 5px;
}
.loginbox form > .add{
	width: 266px;
	padding-left: 0px;
}
.suggestions form > input{
	width: 32.7%;
}
.suggestions form{
	text-align: center;
}
.genderWrapper{
	width: 170px;
	float: left;
}
.characterRaces{
	float: left;
	margin-right: 5px;
}
.add{
	text-decoration: none;
	color: white;
	width: 120px;
	margin: 0px;
	margin-left: 1px;
	padding: 5px 0px 5px 0px;
	font-size: 100%;
	transition: 0.5s;
	background-color: #4d3829;
	box-shadow: inset 0px 0px 10px black;
	position: relative;
	text-align: center;
	border: 0px;
	cursor: pointer;
	float: none !important;
}
.add:hover{
	background-color: #917153 !important;
}
form.delete{
	width: 70%;
	text-align: center;
	padding: 2px;
	box-shadow: 0px 0px 10px black;
	margin-left: auto;
	margin-right: auto;
	left: 0px;
	right: 0px;
	position: absolute;
	color: white;
	background-image: url(Bilder/Wood.jpg);
	visibility: hidden;
}
form.delete input, form.delete button{
	margin-left: 60px;
	margin-right: 60px;
	border: none;
	background: none;
	font: inherit;
	color: inherit;
}
form.delete input:hover{
	color: green;
	cursor: pointer;
}
form.delete button:hover{
	color: red;
	cursor: pointer;
}
p.editdelete{
	text-decoration: none;
	color: white;
	float: right;
	margin: 0px;;
	padding: 5px 5px 5px 5px;
	font-size: 100%;
	transition: background .5s, font-size .2s;
	background-color: #4d3829;
	opacity: .8;
	box-shadow: inset 0px 0px 10px black;
	position: relative;
	text-align: center;
	transition: background .5s;
	-webkit-transition: background .5s;
	-o-transition: background .5s;
	-moz-transition: background .5s;
	cursor: pointer;
}
p.delete{
	margin-left: 5px;
}
p.editdelete:hover{
	background-color: #917153;
}
.singleh2{
	display:inline;
}
.writeWrapperUp, .writeWrapperUp2{
	position: fixed;
	z-index: 1;
	height: 0%;
	width: 0%;
}
.maps{
	text-shadow: 2px 2px black;
}
.planet{
	width: 300px;
	height: 300px;
	margin: auto;
	margin-top: 30px;
	position: relative;
	text-align: center;
	background-size: 302px 302px;
	background-repeat: no-repeat;
	transition: 0.8s;
	-webkit-transition: 0.8s;
	-o-transition: 0.8s;
	-moz-transition: 0.8s;
	border-radius: 300px;
	box-shadow: 0px 0px 10px 2px black;
}
.planet:hover{
	transition: 0.8s;
	-webkit-transition: 0.8s;
	-o-transition: 0.8s;
	-moz-transition: 0.8s;
}
.planet1{
	background-image: url(Bilder/CaldoresGlobe.png);
	background-size: 423px 423px;
	width: 420px;
	height: 420px;
}
.planet1:hover{
	background-image: url(Bilder/ArnasGlobe.png);
	background-size: 423px 423px;
}
.planet2{
	background-image: url(Bilder/TheroraGlobe.png);
	background-size: 271px 271px;
	width: 270px;
	height: 270px;
}
.planet3{
	background-image: url(Bilder/CeifGlobe.png);
	background-size: 301px 301px;
	width: 300px;
	height: 300px;
}
.planet4{
	background-image: url(Bilder/CeisGlobe.png);
	background-size: 161px 161px;
	width: 160px;
	height: 160px;
}
.planet5{
	background-image: url(Bilder/Planes.png);
	background-size: 301px 301px;
	width: 300px;
	height: 300px;
	
}
.planet6{
	background-image: url(Bilder/Planes.png);
	background-size: 301px 301px;
	width: 300px;
	height: 300px;
	margin-bottom: 30px;
	
}
.shadow{
	margin-left: auto;
	margin-right: auto;
	left: 0px;
	right: 0px;
	float: left;
	position: relative;
	width: 300px;
	height: 300px;
	border-radius: 300px;
	text-decoration: none;
	color: #4d3829;
	text-align: center;
	font-size: 2.5em;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	-moz-transition: 0.5s;
	
}
.shadow1{
	width: 420px;
	height: 420px;

}
.shadow2{
	width: 270px;
	height: 270px;

}
.shadow4{
	width: 160px;
	height: 160px;
}
.shadow1 h1{
	margin-top: 120px;
}
.shadow4 h1{
	margin-top: 10px;
	margin-left: 0px;
}
.shadow:hover{
	box-shadow: inset 0px 0px 30px white;
	color: white;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	-moz-transition: 0.5s;
}
.map{
	width: 100%;

}
.ende{
	width: 70%;
}
.backtoplanets{
	float: left;
	position: absolute;
	text-decoration: none;
	color: inherit;
	z-index: 3;
}
.backtoplanets:hover{
	color: white;
}
.mapoverlay{
	width: 95%;
	max-height: 580px;
	height: auto;
	position: absolute;
	z-index: 1;
	padding-top: 50px;
}
.country{
	margin-top: 115px;
	margin-left: 30px;
	width: 160px;
	height: 25px;
	float: left;
}
.country > p{
	font-size: 0.85em;
	margin: 0px;
	font-weight: bold;
}
.country:hover > p{
	color: white;
}
.country:hover{
	cursor: default;
}
.country2{
	margin-top: 87px;
	width: 90px;
	margin-left: 90px;
}
.country3{
	margin-top: 56px;
	margin-left: 0px;
	width: 165px;
	clear: left;
}
.country4{
	margin-top: 44px;
	margin-left: 58px;
	width: 145px;
}
.country5{
	clear: left;
	width: 55px;
	margin-top: 110px;
	margin-left: 78px;
}
.country6{
	margin-top: 50px;
	margin-left: 40px;
	width: 150px;
}
.country7{
	margin-top: 100px;
	margin-left: 80px;
	width: 140px;
}
.country8{
	margin-top: 60px;
	margin-left: 160px;
	width: 50px;
}
.country9{
	margin-top: 85px;
	margin-left: 155px;
	width: 115px;
}
.country10{
	margin-left: 20px;
	margin-top: 20px;
	width: 130px;
}
.country11{
	margin-top: 25px;
	margin-left: 50px;
	width: 130px;
}	
.country12{
	clear: left;
	margin-top: 25px;
	margin-left: 100px;
	width: 125px;
}
.country13{
	margin-top: 25px;
	margin-left: 55px;
	width: 120px;
}
.country14{
	margin-left: 210px;
	margin-top: 40px;
	width: 130px;
}
.country15{
	clear: left;
	margin-top: 35px;
	margin-left: 110px;
	width: 70px;
}
.country16{
	margin-top: 55px;
	margin-left: 35px;
	width: 125px;
}
.country17{
	margin-left: 75px;
	width: 110px;
}
.country18{
	margin-top: 95px;
	margin-left: 85px;
	width: 55px;
}
.country19{
	clear: left;
	margin-top: 55px;
	margin-left: 165px;
	width: 85px;
}
.country20{
	clear: left;
	margin-top: 45px;
	margin-left: 135px;
	width: 125px;
}
.country > div, .default{
	width: 200px;
	height: auto;
	position:absolute;
	right: 0px;
	top: 0px;
	visibility: hidden;
}
#zegzeg{
	left: 0px;
	right: auto;
}
.country div div:not(.wood), .default div:not(.wood){
	box-shadow: 0px 0px 10px black;
	background-color: #D1C1A4;
	padding: 0px 3px 3px 3px;
	width: 90%;
	margin:auto;
	word-wrap: break-word;
}
.country .wood, .default .wood{
	height: 20px;
}
.country .wood2, .default .wood2{
	bottom: 0px;
}
.country div h3, .default h3{
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
}
.country div div p{
	margin: 0px;
	font-family: helvetica;
}
.country:hover div{
	visibility: visible;
}
/*.mapoverlay:not(.country):hover .default{
	visibility: visible;
}*/
.races:hover img{
	margin-top: -65px;
	opacity: 0.8;
	transition: 1s;
	-webkit-transition: 1s;
	-o-transition: 1s;
	-moz-transition: 1s;
}
.races{
	width: 48%;
	height: 80px;
	float: left;
	margin: 1%;
	position: relative;
	box-shadow: 0px 0px 10px black;
	text-align: center;
	text-decoration: none;
	font-size: 1.3em;
	color: #4d3829;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	-moz-transition: 0.5s;
	overflow: hidden;
	float: left;
}
.races img{
	height: 100%;
	width: auto;
	left: 10px;
	position: absolute;
	z-index: 0;
	opacity: 0.5;
	transition: 1s;
	-webkit-transition: 1s;
	-o-transition: 1s;
	-moz-transition: 1s;
}
.races:hover
{
	background-color: #4d3829;
	box-shadow: inset 0px 0px 10px black;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	-moz-transition: 0.5s;
}
.races h1{
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	-moz-transition: 0.5s;
	position: relative;
	z-index: 1;
	margin: 5px 0px 5px 0px;
}
.races:hover h1{
	color: white;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	-moz-transition: 0.5s;
}
.art{
	width: 90%;
	margin: auto;
	text-align: justify;
}
.timelineBG{
	margin: auto;
	background-color: #4d3829;
	box-shadow: inset 0px 0px 10px black;
	width: 95%;
	height: 300px;
	position: relative;
	overflow-x: scroll;
	overflow-y: hidden;
	z-index: 1;
}
.timeline{
	width: 4000%;
	overflow: visible;
	padding-right: 10px;

}
.timelineShadow{
	box-shadow: inset 0px 0px 10px black;
	width: 90.9%;
	height: 288px;
	position: absolute;
	margin-right: auto;
	margin-left: auto;
	left: 0px;
	right: 0px;
	z-index: 2;
}
.addEvent{
	width: 100px;
	text-align: center;
	margin: auto;
	margin-top: 10px;
	color: white;
	background-color: #4d3829;
	opacity: .8;
	box-shadow: inset 0px 0px 10px black;
	border: 0px;
	transition: background .5s;
	-webkit-transition: background .5s;
	-o-transition: background .5s;
	-moz-transition: background .5s;
	cursor: pointer;
}
.addEvent:hover{
	background-color: #917153;
}
.eventLeft{
	float: left;
	width: 33%;
}
.i1, .i2, .i3, .i4, .i5, .i6, .i7, .i8, .i9, .i10, .i11, .i12, .i13, .i14, .i15, .i16, .i17, .i18, .i19, .i20{
	float: left;
	width: auto;
	height: 130px;
	display: inline-block;
	box-shadow: 0px 0px 10px  black;
	z-index: 3;
	
}
.art:after{
	content:""; 
	display: inline-block; 
	width: 100%; 
	height: 0;
}
.users{
	width: 80%;
	margin: auto;
}
.users td{
	border-bottom: 1px solid black;
}
.users td p{
	font-family: helvetica;
	margin: 0px;
}
.deletebtn{
	border: none;
	background: none;
	font: inherit;
	font-family: helvetica;
	color: inherit;
}
.deletebtn:hover{
	color: red;
	cursor: pointer;
}