/***********************************************************************************************************************************
####### ######## ######## ######## ### ######## #### ####### ## ##
## ## ## ## ## ## ## ## ## ## ## ## ## ### ##
## ## ## ## ## ## ## ## ## ## ## ## ## #### ##
## ## ######## ###### ######## ## ## ## ## ## ## ## ## ##
## ## ## ## ## ## ######### ## ## ## ## ## ####
## ## ## ## ## ## ## ## ## ## ## ## ## ###
####### ## ######## ## ## ## ## ## #### ####### ## ##
/***********************************************************************************************************************************/
/***********************************************************************************************************************************/
/* HEADER **************************************************************************************************************************/
/***********************************************************************************************************************************/
.contest__header{
position: relative;
z-index: 10;
height: 63px;
}
.contest__header::after{
content: "";
display: block;
clear: both;
}
/***********************************************************************************************************************************/
/* PAGE ****************************************************************************************************************************/
/***********************************************************************************************************************************/
.contest__main{
position: relative;
z-index: 1;
}
/***********************************************************************************************************************************/
/* NAVIGATION **********************************************************************************************************************/
/***********************************************************************************************************************************/
/** notification ********************************************************************************************************************/
.superellipse__content .menu-notification{
z-index: 1;
top: -7px;
pointer-events: none;
}
.body--ltr .superellipse__content .menu-notification{
left: -5px;
}
.body--rtl .superellipse__content .menu-notification{
right: -5px;
}
/***********************************************************************************************************************************/
/* CONTEST HUD CAROUSEL ************************************************************************************************************/
/***********************************************************************************************************************************/
.constest-hud-carousel{
background: rgba(0,0,0,.5);
border: 2px solid #fff;
border-radius: 7px;
transition: background .1s ease-in-out;
}
.constest-hud-carousel::after{
display: block;
content: "";
clear: both;
}
.constest-hud-carousel:hover{
background: rgba(55, 101, 154, 0.7);
}
.contest-carousel-list,
.contest-carousel-list .grid-cell{
height: 48px;
}
/** carousel-product ****************************************************************************************************************/
.contest-carousel-product a{
display: block;
color: #fff;
text-decoration: none;
}
.contest-carousel-product a:active .first img{
animation: ontap .2s ease-in-out 1;
}
.contest-carousel-product em,
.contest-carousel-product strong{
display: block;
white-space: nowrap;
font-weight: normal;
}
.contest-carousel-product strong{
font-size: 16px;
}
.contest-carousel-product em{
font-size: 11px;
}
.contest-carousel-product .first img{
width: 64px;
height: 64px;
}
.body--ltr .contest-carousel-product .first img{
margin: -8px 0 -8px -17px;
}
.body--rtl .contest-carousel-product .first img{
margin: -8px -17px -8px 0;
}
/** carousel-button *****************************************************************************************************************/
.contest-carousel-button{
background: none;
cursor: pointer;
display: block;
margin: 12px 5px;
border: none;
outline: none;
}
.contest-carousel-button:active{
animation: ontap .1s 1 linear;
}
/***********************************************************************************************************************************
/***********************************************************************************************************************************
#### ## ## ## ## ######## ## ## ######## ####### ######## ## ##
## ### ## ## ## ## ### ## ## ## ## ## ## ## ##
## #### ## ## ## ## #### ## ## ## ## ## ## ####
## ## ## ## ## ## ###### ## ## ## ## ## ## ######## ##
## ## #### ## ## ## ## #### ## ## ## ## ## ##
## ## ### ## ## ## ## ### ## ## ## ## ## ##
#### ## ## ### ######## ## ## ## ####### ## ## ##
***********************************************************************************************************************************
***********************************************************************************************************************************/
/** for gift page ******************************************************************************************************************/
.operation-gifts .js-contest__inventory {
position: absolute;
top: 15px;
}
.body--ltr .operation-gifts .js-contest__inventory {
right: 0;
}
.body--rtl .operation-gifts .js-contest__inventory {
left: 0;
}
/** module *************************************************************************************************************************/
.js-contest__inventory {
position: absolute;
top: 70px;
z-index: 2;
right: 0;
}
.js-contest__inventory__module{
font-size: 15px;
font-weight: bold;
}
.js-contest__inventory__module{
margin-left: 40px;
}
.js-contest__inventory__module .grid-cell{
position: relative;
}
.js-contest__inventory__module .grid-cell.middle{
padding: 0 10px 0 0;
}
.js-contest__inventory__module .grid-cell{
height: 32px;
}
/** image **************************************************************************************************************************/
.js-contest__inventory__module .grid-cell img{
height: 60px;
margin: -14px 0;
width: 60px;
}
.js-contest__inventory__module a:hover img,
.js-contest__inventory__module a:focus img,
.js-contest__inventory__module script + img:hover,
.js-contest__inventory__module script + img:focus,
.js-contest__inventory__module img[id^=agi]:hover,
.js-contest__inventory__module img[id^=agi]:focus{
animation: ontap .1s 1 linear;
}
.js-contest__inventory__module img[id^=agi]:hover,
.js-contest__inventory__module script + img:hover{
cursor: pointer;
}
html .js-contest__inventory__module .grid-cell.first{
left: inherit;
right: 10px;
}
/** text ***************************************************************************************************************************/
.js-contest__inventory-detail{
display: block;
font-weight: normal;
font-size: 13px;
}
/** button *************************************************************************************************************************/
html .js-contest__inventory__module .button{
margin-left: inherit;
margin-right: -10px;
}
/***********************************************************************************************************************************
/***********************************************************************************************************************************
## ## ######## ## ########
## ## ## ## ## ##
## ## ## ## ## ##
######### ###### ## ########
## ## ## ## ##
## ## ## ## ##
## ## ######## ######## ##
***********************************************************************************************************************************
***********************************************************************************************************************************/
.operation-help .carousel-slide::after{
display: block;
clear: both;
content:"";
}
/** title **************************************************************************************************************************/
.operation-help .carousel-title{
margin: 0 0 30px;
color: #fff;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
text-align: center;
}
/** content ************************************************************************************************************************/
.operation-help .carousel__content{
font-size: 16px;
line-height: 1.5;
padding: 0 20px 50px;
}
.operation-help .carousel__content .subtitle{
font-size: 22px;
line-height: initial;
}
.operation-help .carousel__content a{
display: inline-block;
}
.operation-help .carousel__content .listview__item--link .listview__item__content{
text-decoration: underline;
}
.operation-help .carousel__content .listview__item--link .listview__item__content:hover{
text-decoration: none;
}
.operation-help .carousel__content .listview__item--link .listview__item__svg {
display: none;
}
.operation-help .carousel__content .listview--hascontent:not(.listview--hastitle) .listview__item__content{
font-size: 15px;
}
.operation-help .carousel-color-white,
.operation-help .carousel-color-white a:not(.btn),
.operation-help .carousel-color-white p,
.operation-help .carousel-color-white .subtitle,
.operation-help .carousel-color-white .listview__item__content{
color: #fff;
}
.operation-help .listview__item .pix::after {
background: #fff;
}
.operation-help .carousel-color-dark,
.operation-help .carousel-color-dark a:not(.btn),
.operation-help .carousel-color-dark p,
.operation-help .carousel-color-dark .subtitle,
.operation-help .carousel-color-dark .listview__item__content{
color: #3d251b;
}
.operation-help .carousel-color-white a:not(.btn)::after{
background: #fff;
}
.operation-help .carousel-color-dark a:not(.btn)::after{
background: #3d251b;
}
.operation-help .carousel__content a:not(.item-absolute)::after{
position: relative;
bottom: 4px;
content: "";
display: block;
width:100%;
height: 1px;
transform:scaleX(1);
-webkit-transform:scaleX(1);
-moz-transform:scaleX(1);
-ms-transform:scaleX(1);
-o-transform:scaleX(1);
transition:all 0.15s;
-webkit-transition:all 0.15s;
-moz-transition:all 0.15s;
-ms-transition:all 0.15s;
-o-transition:all 0.15s;
}
.operation-help .carousel__content a:hover{
text-decoration: none;
}
.operation-help .carousel__content a:hover::after{
transform:scaleX(0);
-webkit-transform:scaleX(0);
-moz-transform:scaleX(0);
-ms-transform:scaleX(0);
-o-transform:scaleX(0);
}
/** image **************************************************************************************************************************/
.body--ltr .operation-help .carousel-image{
margin-right: 50px;
}
.body--rtl .operation-help .carousel-image{
margin-left: 50px;
}
.operation-help .carousel-image img{
width: 256px;
height: 256px;
}
.operation-help .swiper-container{
padding: 0 0 10px;
}
.operation-help .swiper-pagination {
bottom: -10px;
}
/** video **************************************************************************************************************************/
.operation-help .carousel__video{
border: 4px solid #fff;
width: 640px;
height: 360px;
}
/** listview ***********************************************************************************************************************/
.operation-help .listview__item{
border: none;
}
.operation-help .listview__item,
.operation-help .listview--hascontent:not(.listview--hastitle) .listview__item__content{
height: 50px;
}
.operation-help .listview__item__image{
top: 9px;
}
.operation-help .listview__item__content{
font-style: normal;
}
/** 69196: Bug slider IE 11 *******************************************************************************************************/
.body--ie11 .swiper-slide-prev,
.body--ie11 .swiper-slide-next {
opacity: 0;
}
/***********************************************************************************************************************************
####### ######## ## ######## ###### ######## #### ## ## ######## ######
## ## ## ## ## ## ## ## ## ## ## ## ## ## ##
## ## ## ## ## ## ## ## ## ## ## ## ##
## ## ######## ## ###### ## ## ## ## ## ###### ######
## ## ## ## ## ## ## ## ## ## ## ## ## ##
## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ##
####### ######## ###### ######## ###### ## #### ### ######## ######
/***********************************************************************************************************************************/
/***********************************************************************************************************************************/
/* OPERATION-OBJECTIVE MODULE ******************************************************************************************************/
/***********************************************************************************************************************************/
/** module *************************************************************************************************************************/
.operation-objective{
width: 370px;
border-radius: 8px;
font-size: 16px;
}
.operation-objective[dir=ltr]{
text-align: left;
}
.operation-objective[dir=rtl]{
text-align: right;
}
/** item ***************************************************************************************************************************/
.objective-item .grid-cell.first{
padding-right: 10px;
}
/** header *************************************************************************************************************************/
.objective-header,
.objective-label{
color: #82685B;
}
/** title **************************************************************************************************************************/
.objective-title{
margin: inherit;
display: block;
padding: 10px 20px;
color: #3d251b;
outline: none;
}
.objective-title.yanoneubibold,
.objective-title h3.yanoneubibold{
font-size: 24px;
font-weight: normal;
}
.objective-title::-webkit-details-marker {
display: none;
}
.objective-title h3::selection{
background: none;
}
.objective-title h3::-webkit-selection{
background: none;
}
/** nav ****************************************************************************************************************************/
.objective-details{
display: block;
}
.objective-header + .objective-details{
border-top: 1px solid #af9c8c;
}
/** section ************************************************************************************************************************/
.objective-section{
color: #82685B;
padding: 0 20px 20px;
}
.objective-section .grid-table .button{
max-width: 70px;
}
.objective-section .grid-table .select{
width: 240px;
}
html[dir=ltr] .objective-section .grid-cell.last{
text-align: right;
}
html[dir=rtl] .objective-section .grid-cell.last{
text-align: left;
}
/** section links ******************************************************************************************************************/
.objective-section a{
color: #ad5b50;
text-decoration: underline;
}
.objective-section a:hover{
text-decoration: none;
}
/** summary ************************************************************************************************************************/
.objective-summary{
position: relative;
cursor: pointer;
}
.objective-summary-icon{
position: absolute;
top: 17px;
transition: all .1s ease-in-out;
}
.objective-summary-icon::selection{
background: transparent;
}
.objective-summary-icon::-ms-selection{
background: transparent;
}
html[dir=ltr] .objective-summary-icon{
right: 10px;
}
html[dir=rtl] .objective-summary-icon{
left: 10px;
}
.objective-details .objective-summary-icon{
transform: rotate(0deg);
}
.objective-details[open] .objective-summary-icon{
transform: rotate(90deg);
}
/** footer *************************************************************************************************************************/
.objectif-footer{
border-radius: 0 0 8px 8px;
border-top: 1px solid #af9c8c;
padding: 10px 20px;
color: #3d251b;
}
.objectif-footer.emphasis{
background: #f6ce1d;
color: #3d251b;
}
.objectif-footer-reward{
margin-top: 5px;
color: #82685b;
}
.objectif-footer-button{
text-align: center;
}
.objectif-footer-reward + .objectif-footer-button{
margin-top: 5px;
}
.objectif-footer .pix{
margin-left: 10px;
}
html[dir=ltr] .objectif-footer .grid-cell.last{
text-align: right;
}
/** select *************************************************************************************************************************/
.objective-select{
display: block;
width: 100%;
}
/** button *************************************************************************************************************************/
.objective-button{
width: 100%;
}
/** gauge **************************************************************************************************************************/
.objective-gauge{
width: 280px;
}
/***********************************************************************************************************************************/
/* OBJECTIVES (multiples objectives inside a container) ****************************************************************************/
/***********************************************************************************************************************************/
.objectives{
margin-top: 30px;
}
.objectives .tab-style-11{
position: relative;
bottom: 40px;
margin-bottom: -30px /* not clean, but sadly no other option... */
}
.objectives .module-style-1-content{
padding: 10px;
}
.objective__icon{
fill: #EEC213;
margin-top: 20px;
transition: all .1s ease-in-out;
}
.tab-element:hover .objective__icon{
transform: scale(1.25);
}
.tab-element.selected .objective__icon{
transform: scale(1.5);
}
.objectives--small{
width: 390px;
}
/***********************************************************************************************************************************/
/* OBJECTIVES -- LARGE *************************************************************************************************************/
/***********************************************************************************************************************************/
.objectives--large{
width: 680px;
}
.objectives--large > .module-inner:after{
content:"";
display: block;
clear: both;
}
.objectives--large .module-inner{
display: table;
width: 100%;
}
.objectives--large .module-item{
display: table-row;
}
.objectives--large .module-style-1-title,
.objectives--large .module-style-1-content{
display: table-cell;
vertical-align: top;
}
/** objective tabs *****************************************************************************************************************/
.objectives--large .tab-style-11 .tab-element::before{
background: rgba(0, 0, 0, .52);
}
/** module-title (for tabs) ********************************************************************************************************/
.objectives--large .module-style-1-title{
width: 310px;
}
/** module-content (for modules) ***************************************************************************************************/
.objectives--large .module-style-1-content{
background: rgba(0, 0, 0, .3);
padding: 10px;
position: relative;
border-radius: 0 8px 8px 0;
}
/***********************************************************************************************************************************/
/* OPERATION-OBJECTIVE POPUP *******************************************************************************************************/
/***********************************************************************************************************************************/
.popupview--objective .popupview__content{
padding: inherit;
}
.popupview--objective .objective-title{
font-size: 30px;
}
.popupview--objective .operation-objective{
width: inherit;
text-align: center;
margin-bottom: -20px;
}
.popupview--objective .objective-section .grid-table .select{
width: 380px;
}
.popupview--objective .objective-section{
width: 320px;
margin: 0 auto;
}
.popupview--objective .objective-gauge{
margin: 0 10px 0 0;
}
.popupview--objective .objectif-footer.emphasis{
background: inherit;
}
/***********************************************************************************************************************************
###### ## ## ####### ########
## ## ## ## ## ## ## ##
## ## ## ## ## ## ##
###### ######### ## ## ########
## ## ## ## ## ##
## ## ## ## ## ## ##
###### ## ## ####### ##
/***********************************************************************************************************************************/
/***********************************************************************************************************************************/
/* OPERATION-OBJECTIVE POPUP *******************************************************************************************************/
/***********************************************************************************************************************************/
.operation-icon-info{
display: block;
width: 20px;
height: 20px;
fill: #fff;
}
/***********************************************************************************************************************************
######## ######## ####### ###### ######## ######## ###### ###### #### ####### ## ##
## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ### ##
## ## ## ## ## ## ## ## ## ## ## ## ## ## ## #### ##
######## ######## ## ## ## #### ######## ###### ###### ###### ## ## ## ## ## ##
## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ####
## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ###
## ## ## ####### ###### ## ## ######## ###### ###### #### ####### ## ##
/***********************************************************************************************************************************/
.operation-progression .bg--progression::before{
background: url(/media/equideo/image/concours/all/bg-progression.jpg) no-repeat center -530px;
}
.operation-progression .stickout__content__avatar{
border-radius: 8px;
height: 16px;
width: 16px;
}
.operation-progression .stickout a[class^="usergroup_"]{
color: #AD5B50;
font-size: 13px;
text-decoration: underline;
}
/*******************************************************************************************************************************************
###### ######## ######## ###### #### ### ## ######## ####### ## ## ######## ## ##
## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ### ##
## ## ## ## ## ## ## ## ## ## ## ## ## ## ## #### ##
###### ######## ###### ## ## ## ## ## ## ## ## ##### ###### ## ## ##
## ## ## ## ## ######### ## ## ## ## ## ## ## ## ####
## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ###
###### ## ######## ###### #### ## ## ######## ## ####### ## ## ######## ## ##
*******************************************************************************************************************************************/
.gaugespecialtoken__divine{
margin-top: -24px;
}