


.grid-list-wrapper {
	width:708px;
	font-size:0;
}

.grid-list-wrapper .grid-link-element {
	display:inline-block;
	font-size:1rem;
	margin:4px 0 4px 8px;
	box-sizing:border-box;
	overflow:visible;
	position:relative;
	border:1px solid #606060;
}

 
.grid-list-wrapper .background-wrapper {
	position:absolute;
	width:100%;
	height:100%;
	left:0;
	top:0;
	overflow:hidden;
	z-index: 0;
}


.grid-list-wrapper .background-wrapper:after {
	content:'';
	position:absolute;
	display: block;
	background-size:100% 100%;
	transition: all 0.2s ease-in-out;
	z-index: 0;
}

.grid-list-wrapper .background-wrapper:before {
	content:'';
	position:absolute;
	width:100%;
	height:100%;
	left:0;
	top:0;	
	box-shadow: 0 0 5px 0 transparent inset;
	transition: all 0.2s ease-in-out;
	z-index: 1;

}

.grid-list-wrapper .grid-link-element:hover .background-wrapper:after {
	width:100% !important;
	height:100% !important;
	left:0 !important;
	top:0 !important;	
}
.grid-list-wrapper .grid-link-element:hover .background-wrapper:before {
	box-shadow: 0 0 5px 0 #000 inset;
	height:calc(100% - 40px);
}

.grid-list-wrapper.size-pattern-1 .grid-link-element:not(:nth-child(n+2)) {
	width:700px;
	height:180px;
}

.grid-list-wrapper.size-pattern-1 .grid-link-element:nth-child(n+2), 
.grid-list-wrapper.size-pattern-0 .grid-link-element {
	width:346px;
	height:151px;
}


.grid-list-wrapper .grid-link-element .progress-area {
	background:white;
	overflow: visible;
	width:100%;
	height:20px;
	box-sizing: border-box;
	border-top:1px solid #606060;
	position: absolute;
	bottom: 0;
	left:0;
	z-index: 1;
	font-size:0;
	padding:5px;
	transition: all 0.2s ease-in-out;
}

.grid-list-wrapper .grid-link-element:hover .progress-area {
	height:40px;
}

.grid-list-wrapper .grid-link-element .progress-area > div {
	display: inline-block;
	font-size: 1rem;
	vertical-align: middle;
	/*height:30px;*/
	/*margin-top:7.5%;*/
}

.grid-list-wrapper .grid-link-element .progress-area .progress-wrapper {
	width:100%;
	height:100%;
	/*top:5px;*/
	position: relative;
	overflow: hidden;
	border:1px solid #606060;
	box-sizing: border-box;
	transition: all 0.2s ease-in-out;
}

.grid-list-wrapper .grid-link-element:hover .progress-area .progress-wrapper {
	width:70%;
}


.grid-list-wrapper .grid-link-element .progress-area .progress-wrapper .progress-bar {
	position: absolute;
	top:0;
	left:0;
	height:100%;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#5eae2b+0,edf93d+100 */
background: rgb(94,174,43); /* Old browsers */
background: -moz-linear-gradient(left, rgba(94,174,43,1) 0%, rgba(237,249,61,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(94,174,43,1) 0%,rgba(237,249,61,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(94,174,43,1) 0%,rgba(237,249,61,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5eae2b', endColorstr='#edf93d',GradientType=1 ); /* IE6-9 */
}	

.grid-list-wrapper .grid-link-element .progress-area .fraction-wrapper {
	padding-left:10px;
	font-family: grobold;
	color:#606060;
	text-decoration: none;
	font-size:0;
	transition: all 0.2s ease-in-out;
}

.grid-list-wrapper .grid-link-element:hover .progress-area .fraction-wrapper {
	font-size:1rem;
}


.grid-list-wrapper .grid-link-element .progress-area .decor {
	position: absolute;
	left:-5px;
	bottom:100%;
	width:150px;
	height:130px;
	background-size:100% 100%;
	transform-origin:center bottom;
	transition: transform 0.2s ease-in-out;
	font-family: Grobold;
	color:black;
	font-size:2.5rem;
	box-sizing: border-box;
	padding-top:20px;
	text-align: center;
	text-shadow: 
		1px 1px 0px #FFF, 
		-1px 1px 0px #FFF, 
		-1px -1px 0px #FFF, 
		1px -1px 0px #FFF,


		2px 1px 0px #FFF, 
		2px -1px 0px #FFF,
		-2px 1px 0px #FFF, 
		-2px -1px 0px #FFF, 
		 1px 2px 0px #FFF, 
		-1px 2px 0px #FFF, 
		 1px -2px 0px #FFF,
		-1px -2px 0px #FFF, 



		 3px  1px 0px #000, 
		-3px  1px 0px #000, 
		-3px -1px 0px #000, 
		 3px -1px 0px #000,

		 3px  2px 0px #000, 
		-3px  2px 0px #000, 
		-3px -2px 0px #000, 
		 3px -2px 0px #000,

		 1px  3px 0px #000, 
		-1px  3px 0px #000, 
		-1px -3px 0px #000, 
		 1px -3px 0px #000,

		 2px  3px 0px #000, 
		-2px  3px 0px #000, 
		-2px -3px 0px #000, 
		 2px -3px 0px #000
		;
}



.grid-list-wrapper .grid-link-element:hover .progress-area .decor {
	transform: scale(1.1);
}

.grid-list-wrapper .grid-link-element.grid-link-element_default .progress-area .decor {
		background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/home/default/cheque.png');
}

.grid-list-wrapper .grid-link-element.grid-link-element_jackpot_bronze .progress-area .decor {
		background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/home/jackpot/bronze/coupe.png');
}

.grid-list-wrapper .grid-link-element.grid-link-element_jackpot_argent .progress-area .decor {
		background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/home/jackpot/argent/coupe.png');
}

.grid-list-wrapper .grid-link-element.grid-link-element_jackpot_or .progress-area .decor {
		background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/home/jackpot/or/coupe.png');
}


.grid-list-wrapper .grid-link-element .progress-area .gain-clic-wrapper {
	position:absolute;
	bottom:100%;
	right:0;
	padding: 0 1rem 1rem 0;
	font-size:10px;
}

.grid-list-wrapper .grid-link-element .progress-area .gain-clic-wrapper > div {
	display: inline-block;
}
.grid-list-wrapper .grid-link-element .progress-area .gain-clic-wrapper .gain-description {
	background:#FFF;
	color:#000;
	font-family: Grobold;
	border-style: solid;
	border-width: 2px;
	font-size:3em;
	border-radius: 50px;
	padding:0 1rem;
	vertical-align: middle;
    text-align: center;
}

.grid-list-wrapper .grid-link-element.grid-link-element_default .progress-area .gain-clic-wrapper > div {
	display: block;
	margin-top:10px;
}

.grid-list-wrapper .grid-link-element .progress-area .gain-clic-wrapper .gain-description i {
	font-style: normal;
	font-size:1.5em;
	line-height:calc(1em / 1.5);
}

.grid-list-wrapper .grid-link-element.grid-link-element_default .progress-area .gain-clic-wrapper .gain-description {
	border-color:#083715;
}
.grid-list-wrapper .grid-link-element.grid-link-element_jackpot_bronze .progress-area .gain-clic-wrapper .gain-description {
	border-color:#380D06;
}
.grid-list-wrapper .grid-link-element.grid-link-element_jackpot_argent .progress-area .gain-clic-wrapper .gain-description {
	border-color:#2B2E35;
}
.grid-list-wrapper .grid-link-element.grid-link-element_jackpot_or .progress-area .gain-clic-wrapper .gain-description {
	border-color:#91490F;
}

.grid-list-wrapper .grid-link-element .progress-area .gain-clic-wrapper .clic-todo {
	vertical-align: middle;
	color:#000;
	font-size: 1.5em;
}
.grid-list-wrapper .grid-link-element .progress-area .gain-clic-wrapper .clic-todo b {
	vertical-align: middle;
	display: inline-block;
	/*width:3.5em;
	height:4.2em;*/
	min-width:1.55555555555556em;
	height:1.86666666666667em;
	/*height:2.1em;*/
	background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/clic.png');
	font-family: Grobold;
    font-size: 1.5em;
    text-align: center;
    vertical-align: baseline;
    background-size:auto 100%;
    background-repeat: no-repeat;
    background-position: center center;
    white-space: nowrap;
}



/** Taille Large **/
.grid-list-wrapper.size-pattern-1 .grid-link-element:not(:nth-child(n+2)) .background-wrapper:after {
	width:calc(100% + 20px);
	/* height = 25.71428571428571%;*/
	height:calc(100% + 6px);
	left:-10px;
	top:-3px;

}




.grid-list-wrapper.size-pattern-1 .grid-link-element.grid-link-element_default:not(:nth-child(n+2)) .background-wrapper:after {
	background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/home/default/pave1.jpg');
}
.grid-list-wrapper.size-pattern-1 .grid-link-element.grid-link-element_jackpot_bronze:not(:nth-child(n+2)) .background-wrapper:after {
	background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/home/jackpot/bronze/pave1.jpg');
}
.grid-list-wrapper.size-pattern-1 .grid-link-element.grid-link-element_jackpot_argent:not(:nth-child(n+2)) .background-wrapper:after {
	background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/home/jackpot/argent/pave1.jpg');
}
.grid-list-wrapper.size-pattern-1 .grid-link-element.grid-link-element_jackpot_or:not(:nth-child(n+2)) .background-wrapper:after {
	background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/home/jackpot/or/pave1.jpg');
}

.grid-list-wrapper.size-pattern-1 .grid-link-element:not(:nth-child(n+2)):hover .progress-area .progress-wrapper {
	width:80%;
}

/** Taille Small **/


.grid-list-wrapper.size-pattern-1 .grid-link-element:nth-child(n+2) .background-wrapper:after, 
.grid-list-wrapper.size-pattern-0 .grid-link-element .background-wrapper:after {
	width:calc(100% + 10px);
	/* height = 43.64161849710983%;*/
	height:calc(100% + 4px);
	left:-5px;
	top:-2px;

}



.grid-list-wrapper.size-pattern-1 .grid-link-element.grid-link-element_default:nth-child(n+2) .background-wrapper:after, 
.grid-list-wrapper.size-pattern-0 .grid-link-element.grid-link-element_default .background-wrapper:after {
		background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/home/default/pave2.jpg');
}
.grid-list-wrapper.size-pattern-1 .grid-link-element.grid-link-element_jackpot_bronze:nth-child(n+2) .background-wrapper:after, 
.grid-list-wrapper.size-pattern-0 .grid-link-element.grid-link-element_jackpot_bronze .background-wrapper:after {
		background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/home/jackpot/bronze/pave2.jpg');
}
.grid-list-wrapper.size-pattern-1 .grid-link-element.grid-link-element_jackpot_argent:nth-child(n+2) .background-wrapper:after, 
.grid-list-wrapper.size-pattern-0 .grid-link-element.grid-link-element_jackpot_argent .background-wrapper:after {
		background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/home/jackpot/argent/pave2.jpg');
}
.grid-list-wrapper.size-pattern-1 .grid-link-element.grid-link-element_jackpot_or:nth-child(n+2) .background-wrapper:after, 
.grid-list-wrapper.size-pattern-0 .grid-link-element.grid-link-element_jackpot_or .background-wrapper:after {
		background-image: url('//static.madwin.com/madwin/playbox/img/defis/grid/home/jackpot/or/pave2.jpg');
}

.grid-list-wrapper.size-pattern-1 .grid-link-element:nth-child(n+2) .progress-area .decor, 
.grid-list-wrapper.size-pattern-0 .grid-link-element .progress-area .decor {
	/*width:133px;*/
	width:115px;
	height:100px;
	}



.grid-list-wrapper.size-pattern-1 .grid-link-element:nth-child(n+2) .progress-area .gain-clic-wrapper, 
.grid-list-wrapper.size-pattern-0 .grid-link-element .progress-area .gain-clic-wrapper {
	font-size:8px;
}

.grid-list-wrapper.size-pattern-1 .grid-link-element:nth-child(n+2) .progress-area .gain-clic-wrapper .clic-todo b,
.grid-list-wrapper.size-pattern-0 .grid-link-element .progress-area .clic-todo b {
	min-width:1.94444444444444em;
	height:2.33333333333333em;
	line-height:2.33333333333333em; 
}


/**
___RESPONSIVE
**/


@media screen and (max-width: 992px) {


    .grid-list-wrapper {
        width:100%;
    }

    .grid-list-wrapper.size-pattern-1 .grid-link-element:not(:nth-child(n+2)) {
        width:98%;
        height:25vw;
    }

    .grid-list-wrapper.size-pattern-1 .grid-link-element:nth-child(n+2), .grid-list-wrapper.size-pattern-0 .grid-link-element {
        width:48.2%;
        height:22vw;
    }

    .grid-list-wrapper.size-pattern-1 .grid-link-element:nth-child(n+2) .progress-area .gain-clic-wrapper, .grid-list-wrapper.size-pattern-0 .grid-link-element .progress-area .gain-clic-wrapper {
    font-size: 2vw;
    }

    .grid-list-wrapper .grid-link-element {
        font-size: 2vw;
        margin: 0.5vw 0 0.5vw 1vw;
    }

    .grid-list-wrapper.size-pattern-1 .grid-link-element:not(:nth-child(n+2)) .background-wrapper:after {
        width: calc(100% + 2vw);
        height: calc(100% + 1vw);
        left: -1vw;
        top: -1vw;
    }

    .grid-list-wrapper.size-pattern-1 .grid-link-element:nth-child(n+2) .background-wrapper:after, .grid-list-wrapper.size-pattern-0 .grid-link-element .background-wrapper:after {
        width: calc(100% + 2vw);
        height: calc(100% + 1vw);
        left: -1vw;
        top: -1vw;
    }

    .grid-list-wrapper .grid-link-element .progress-area .decor {
        left: unset;
        width: 20vw;
        height: 20vw;
        font-size: 3vw;
        padding-top: 3vw;
        }


    .grid-list-wrapper.size-pattern-1 .grid-link-element:not(:nth-child(n+2)) {
        width: 98%;
        height: 25vw;
    }

    .grid-list-wrapper .grid-link-element .progress-area > div {
        font-size: 1vw;
    }

    .grid-list-wrapper .grid-link-element .progress-area .fraction-wrapper {
        padding-left: 2vw;
    }

    .grid-list-wrapper .grid-link-element .progress-area .gain-clic-wrapper {
        padding: 0 1vw 1vw 0;
        font-size: 3vw;
    }

    .grid-list-wrapper .grid-link-element .progress-area .gain-clic-wrapper .gain-description {
        padding: 0 1vw;
        font-size: 5vw;
    }

    .grid-list-wrapper .grid-link-element .progress-area {
        height: 5vw;
        padding: 0.5vw;
    }

    .grid-list-wrapper.size-pattern-1 .grid-link-element:nth-child(n+2) .progress-area .decor, .grid-list-wrapper.size-pattern-0 .grid-link-element .progress-area .decor {
        width: 13vw;
        height: 13vw;
    }

    .grid-list-wrapper .grid-link-element .progress-area .gain-clic-wrapper .clic-todo {
        font-size: 3vw;
    }

    #corps_defis #contenu_defis {
        top: -2vw;
    }

    .zone-detail-jeu {
        height: 48vw;
        margin-left: unset;
        margin-bottom: unset;
    }

    .zone-detail-jeu > .zone-dotations .zone-dotation-other {
        bottom: 1.5vw;
        right: -3vw;
    }

}



/**
___FIN RESPONSIVE
**/
