h1 {
	text-align: center;
	font-family: 'Roboto', sans-serif;
}
h3{
	font-family: 'Roboto', sans-serif;
}
li{
	font-size: 15px;
}
.texteLib{
 margin:50px;
 margin-right: 10px;
 float: left;
 display:inline-block;
}
.button {
	width: 100px;
	height: 100px;
	display: inline-block;
	border: solid black 3px;
	border-radius: 20px;
	margin:5px;
}
.img-responsive{
	margin: 0 auto;
}
.wrapper {
	text-align: center;
	-webkit-user-select: none;  /* Chrome all / Safari all */
	-moz-user-select: none;     /* Firefox all */
	-ms-user-select: none;      /* IE 10+ */
	user-select: none;
	border:1px solid black;
	margin-left:20%;
	margin-right:20%;
	margin-bottom: 2%;
	margin-top: 2%;
	padding:20px;
}
.wrapper p {
    opacity: 0.3;
}
#blue {
	background-color: #66ccff;
}
#red {
	background-color: #ff8080;
}
#yellow {
	background-color: #ffff99;
}
#green {
	background-color: #66ff66;
}
#pink{
	background-color: #ffddfc;
}
#brown{
	background-color: #a88b21;
}
#cyan{
	background-color: #b4f0f7;
}
#purple{
	background-color: #d494f7;
}
#cases{
	width:50%;
	margin:auto;
}
#result {
	color: red;
}
#benzaie2{
	display:table-cell;
}
#image .inner{
	  float: left;
}
footer{
 left: 0;
 bottom: 0;
 height: 100px;
 width: 100%;
 overflow:hidden;
}