#gimmick {
    display:block;
    pointer-events:none;
    position: absolute;
    top:0;
    left:0;
}
.graphLoader{
	width: 400px;
	height: 400px;
	background: url('../img/spinner.png') center center no-repeat;
}
.boule{
	display: inline-block;
	text-align: center;
	border-radius: 50%;
	height: auto;
}
.boule-numero{
	display: inline-block;
	text-align: center;
	border-radius: 50%;
	vertical-align: middle;
	height: auto;
}
.joker_sep{
	width:1px;
	display: inline-block;
}
.navbar-picture{
	background-image: url('../img/coins.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	height: 100%;
	width: auto;
}
/*Responsive*/
/* Extra small devices (less than 425px) */
.navbar-brand {
	font-size: 1.75rem;
	background-color:#007bff70;
}
h2 {font-size: 1.25rem}
.boule{
	width: 2.4rem;
	line-height: 2.4rem;
}
.boule-numero{
	font-size: 1rem;
	width: 1.5rem;
	line-height: 1.5rem;
}
.joker_sep{
	height: 1.8rem;
}
/* Smaller devices (425px and up) */
@media (min-width: 425px) {
	h2 {font-size: 1.5rem}
	.navbar-brand {font-size: 2rem}
	.boule{
		width: 2.8rem;
		line-height: 2.8rem;
	}
	.boule-numero{
		font-size: 1.2rem;
		width: 1.8rem;
		line-height: 1.8rem;
	}
	.joker_sep{
		height: 2rem;
	}
}
/* Small devices (544px and up) */
@media (min-width: 544px) {
	h2 {font-size: 2rem}
	.navbar-brand {font-size: 2.5rem}
}

.fa-bell{
	animation: ringAnimation 4s ease-in-out infinite both;
}

@keyframes ringAnimation{
	0% {
	    transform: rotate(0);
	    transform-origin: top;
	}

	5% {
	    transform: rotate(30deg);
	    transform-origin: top;
	}

	15% {
	    transform: rotate(-30deg);
	    transform-origin: top;
	}

	20%, 100%{
	    transform: rotate(0);
	}
}