/******************** Structure ******************/

@font-face {
    font-family: 'Inter';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: 
        url('../fonts/Inter-Italic-VariableFont_opsz-wght.ttf') format('truetype-variations');
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: 
        url('../fonts/Inter-VariableFont_opsz-wght.ttf') format('truetype-variations');
}
@font-face {
    font-family: 'burbank_big_condensedblack';
    src: url('../fonts/burbank_big_condensed_black-webfont.woff2') format('woff2'),
         url('../fonts/burbank_big_condensed_black-webfont.woff') format('woff');
    font-weight: normal !important;
    font-style: normal;
}

/* Global
------------------------------- */
:root, ::after, ::before  {


    /* 
    Base
    */
    --site-width: 768px;

    --container-lg: 668px;
    --container-md: 428px;

    --padding-container: 1.25em;

    --header-top:0px;

    --height-header:4.125em;
    --height-header-sticky:calc(var(--height-header));

    --height-footer:3.75em;

    --size-drawer:24em;


    --scrollbarBG: rgba(255,255,255,.1);
    --thumbBG: rgba(255,255,255,.5);

    /* 
    Couleurs 
    */

    /* Violet 1  */
    --violet-1: #6D1E91; 
    --violet-1-rgb: 109, 30, 145;

    /* Rose 1  */
    --rose-1: #F41880;  
    --rose-1-rgb: 244, 24, 128;

    /* Violet 2  */
    --violet-light: #D673FA; 
    --violet-light-rgb: 214, 115, 250;

    /* Background Page  */
    --violet-dark: #2A0146;  
    --violet-dark-rgb: 42, 1, 70;

    /* Background Drawer  */
    --violet-darker: #1b002d; 
    --violet-darker-rgb: 27, 0, 45;

    /* Background Site  */
    --violet-darkest: #11001D; 
    --violet-darkest-rgb: 17, 0, 29;

    /* Gold VIP  */
    --gold: #FFD400;
    --gold-rgb: 255, 212, 0;


    /* Alert Succcess / Error  */
    --success: #00AF3A;
    --success-rgb: 0, 175, 58;

    --error: #E32D2D;
    --error-rgb: 227, 45, 45;


    --blanc: #FFFFFF;
    --blanc-rgb: 255, 255, 255;

    --noir: #000000;
    --noir-rgb: 0, 0, 0;

    /* Polices  */
    --font-globale: 'Inter', Arial, sans-serif;
    --font-speciale: 'burbank_big_condensedblack', Arial, sans-serif;



    /* Gouttières */
    --gutter-site-akn: 2.666em;
    --gutter-grid-akn: 2.666em;

    /* Shadow */
    --box-shadow-akn: 0px 15px 30px rgba(0, 42, 222, 0.1);
    
    /* Border Radius */ 
    --border-radius-akn-smaller: 0.313em;
    --border-radius-akn-small: 0.5em;
    --border-radius-akn-medium: 1.25em;
    --border-radius-akn-big: 2em;


    /* Padding */ 
    --padding-akn-big : 2.6666em; 
    --padding-akn-bigger : 3.6666em; 
    --padding-akn-huge : 4.6666em; 


    /* Liens */
    --link-color-akn: var(--violet-1);
    --link-hover-color-akn: var(--violet-1);

    --link-alt-color-akn: var(--quaternaire-akn);
    --link-alt-hover-color-akn: var(--quaternaire-akn);
}



*, ::after, ::before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
}

html {
    scroll-behavior: smooth;
    height: 100%;
}

body {

    --body-font-family-akn: var(--font-globale);
    --body-font-size-akn: 16px;
    --body-font-weight-akn: 400;
    --body-line-height-akn: 1.25;

    --body-color-akn: var(--blanc);

    margin: 0;
    padding: 0;

    width: 100%;
    min-height: 100%;

    position: relative;
    display: flex;
    flex-direction: column;

    font-family: var(--body-font-family-akn);
    font-size: var(--body-font-size-akn);
    font-weight: var(--body-font-weight-akn);
    line-height: var(--body-line-height-akn);
    color: var(--body-color-akn);
    background-color: var(--violet-darkest);

}

.scrollcustom {
    scrollbar-width: thin;
    scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}
.scrollcustom::-webkit-scrollbar {
    width: 5px;
}
.scrollcustom::-webkit-scrollbar-track {
    background: var(--scrollbarBG);
}
.scrollcustom::-webkit-scrollbar-thumb {
    background-color: var(--thumbBG) ;
    border-radius: 6px;
    border: 3px solid var(--scrollbarBG);
}
 


/* 
    Blocs Généraux
------------------------- */

#page{
    flex-grow: 1;
    position:relative;

    background: var(--violet-darker);

    width:100%;
    max-width:var(--site-width);
    margin:0 auto;

    padding-top: calc( var(--height-header) + var(--header-top));
    padding-bottom: var(--height-footer);

    display: flex;
    flex-direction: column;
}

body.no-header #page {
    padding-top: 0;
}
body.no-footer #page {
    padding-bottom: 0;
}

.container{
    --max-width:var(--site-width);
    position: relative;

    width:100%;
    max-width:var(--max-width);
    margin:0 auto;

    padding-left:var(--padding-container);
    padding-right:var(--padding-container);
}

/* Containers */
.container-md{
    --max-width:var(--container-md);
}
.container-lg{
    --max-width:var(--container-lg);
}


/* Logo Size */
.logo-site{
    display: inline-block;
    width: 5.625em;
    transition: width .1s ease-in-out;
}
.logo-sm{
    width: 3.625em;
}
.logo-md{
    width: 4.125em;
}
.logo-lg{
    width: 6.75em;
}
.logo-xl{
    width: 9.063em;
}

.icon-h35{
    width: auto;
    height: 2.188rem;
}

/* 
    Typo global
------------------------------- */

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    line-height: 1.25;
    margin: 0 0 1em;
    font-weight: 700;
    color: var(--body-color-akn);
    font-family: var(--font-globale), sans-serif;
}

h1, .h1{
    font-size:1.563em;
}
h2, .h2{
    font-size:1.25em;
}
h3, .h3{
    font-size:1.063em;
}
h4, .h4{
    font-size:1em;
}
h5, .h5{
    font-size:1em;
}
h6, .h6{
    font-size:0.875em;
}

p{
    margin-top:0;
    margin-bottom:1em
}


a, a:visited{
    text-decoration: none;
    color: var(--body-color-akn);
}
p a, p a:visited {
    text-decoration: underline;
}
a:hover, a:active, a:focus {
    text-decoration: none;
     outline:  none;
    outline-color: transparent;
    -webkit-tap-highlight-color: transparent;
    transition: color .3s ease-in-out, background .3s ease-in-out;
    -webkit-transition: .3s color ease-in-out, background .3s ease-in-out;
    -o-transition: .3s color ease-in-out, background .3s ease-in-out;
    color: inherit;
}

b, strong {
    font-weight: 700;
}
.invert{
    color: #AD83FF;
}
.invert a{
    color: #FFFFFF;
}
img, video{    
    border-style: none;
    height: auto;
    max-width: 100%;
}

/* 
    Utils Texts
------------------------- */

small ,
.small {
    font-size: 0.75em;
}
.smallest {
    font-size: 0.563em;
    font-weight: 300;
}
.small-notice{
    font-size: 0.75em;
}
.text-seo p{
    font-size: 0.875em;
}

/*Aligns*/
.left{
    text-align: left;
}
.center{
    text-align: center;
}
.justify{
    text-align: justify;
}
.right{
    text-align: right;
}
.white-space-no-wrap {
    white-space: nowrap;
}

/*Fonts utils*/
.ff-globale{
    font-family: var(--font-globale);
}
.ff-speciale{
    font-family: var(--font-speciale);
}
.fc-muted{
    color: #616161;
}
.fw-n{
    font-weight: normal;
}
.fw-m{
    font-weight: 500;
}
.fw-b{
    font-weight: 700;
}
.fw-bk{
    font-weight: 900;
}

.tt-u{
    text-transform: uppercase;
}

/* Font size */
.fsz-12{
    font-size: 0.75em; /* 12px */
}
.fsz-14{
    font-size: 0.875em; /* 14px */
}
.fsz-1{
    font-size: 1em; /* 16px */
}
.fsz-18{
    font-size: 1.125em; /* 18px */
}
.fsz-20{
    font-size: 1.25em; /* 20px */
}
.fsz-25{
    font-size: 1.563em; /* 25px */
}
.fsz-40{
    font-size: 2.5em; /* 40px */
}



/* 
    Utils Colors
------------------------- */
/*Colors*/
.inherit, a.inherit, a.inherit:visited{
    color: inherit;
}
.highlight-rose, a.highlight-rose, a.highlight-rose:visited{
    color: var(--rose-1);
}
.highlight-gold, a.highlight-gold, a.highlight-gold:visited{
    color: var(--gold);
}
.highlight-violet, a.highlight-violet, a.highlight-violet:visited{
    color: var(--violet-1);
}
.highlight-violet-clair, a.highlight-violet-clair, a.highlight-violet-clair:visited{
    color: var(--violet-light);
}

.highlight-error{
    color: var(--error);
}

.bd-b{
    border-bottom: 1px solid;
}

/* 
    Utils Display
------------------------- */
.flex-display {
    --gap-display:1em;
    display: flex;
    gap: var(--gap-display);
    position: relative;
}
.flex-display > *{
    flex-shrink: 0;
}
.fld-c{
    flex-direction: column;
}
.flex-wrap{
    flex-wrap: wrap;
}
.jc-space-between{
    justify-content: space-between ;    
}
.jc-center{
    justify-content: center;
}
.jc-start{
    justify-content: flex-start;
}
.ai-center {
    align-items: center;
}

.ov-h{
    overflow: hidden;
}

.grid-display {
    --gap-display:1em;
    --row-gap:var(--gap-display);
    --columns-display:1;
    display: grid;
    column-gap: var(--gap-display);
    row-gap: var(--row-gap);

    grid-template-columns: repeat(var(--columns-display), 1fr);
    position: relative;
}
.grid-1-col{  --columns-display:1;}
.grid-2-col{  --columns-display:2;}
.grid-3-col{  --columns-display:3;}
.grid-4-col{  --columns-display:4;}
.grid-5-col{  --columns-display:5;}

.gap-0{ --gap-display:0;}
.gap-xs{--gap-display:0.375em;}
.gap-sm{--gap-display:0.5em;}
.gap-1{ --gap-display:1em;}
.gap-2{ --gap-display:2em;}
.gap-3{ --gap-display:3em;}
.gap-4{ --gap-display:4em;}

.row-gap-2{ --row-gap:2em;}

/*Margins */

/* Base : 16px */
.no-mag{    margin: 0;}
.mt-md{     margin-top: 1rem; /* ~16px */}
.mt-xs{     margin-top: 0.375rem; /* ~6px */}
.mt-sm{     margin-top: 0.5rem; /* ~8px */}
.mt-lg{     margin-top: 1.25rem; /* ~20px */}
.mt-xl{     margin-top: 2rem; /* ~32px */}
.mt-xxl{    margin-top: 2.5rem; /* ~40px */}
.mt-xxxl{    margin-top: 3.5rem; /* ~56px */}

.mb-0{      margin-bottom: 0; /* 0 */}
.mb-xs{     margin-bottom: 0.375rem; /* ~6px */}
.mb-sm{     margin-bottom: 0.5rem; /* ~8px */}
.mb-md{     margin-bottom: 1rem; /* ~16px */}
.mb-lg{     margin-bottom: 1.25rem; /* ~20px */}
.mb-xl{     margin-bottom: 2rem; /* ~32px */}
.mb-xxl{    margin-bottom: 2.5rem; /* ~40px */}
.mb-xxxl{    margin-bottom: 3.5rem; /* ~56px */}

/*Paddings */

/* Base : 16px */
.no-pad{    padding: 0;}

.pt-sm{     padding-top: 0.5em; /* ~8px */}
.pt-md{     padding-top: 1em; /* ~16px */}
.pt-lg{     padding-top: 1.25em; /* ~20px */}
.pt-xl{     padding-top: 2em; /* ~32px */}
.pt-xxl{    padding-top: 2.5em; /* ~40px */}
.pt-xxxl{    padding-top: 3.5em; /* ~56px */}
.pt-10{  padding-top: 10em; /* ~160px */}

.pb-0{      padding-bottom: 0; /* 0 */}
.pb-xs{     padding-bottom: 0.375em; /* ~6px */}
.pb-sm{     padding-bottom: 0.5em; /* ~8px */}
.pb-md{     padding-bottom: 1em; /* ~16px */}
.pb-lg{     padding-bottom: 1.25em; /* ~20px */}
.pb-xl{     padding-bottom: 2em; /* ~25px */}
.pb-xxl{     padding-bottom: 2.5em; /* ~40px */}
.pb-xxxl{     padding-bottom: 3.5em; /* ~56px */}




/* Formulaires
------------------------------- */
/* couleur placeholder */
::-webkit-input-placeholder {   color: var(--violet-light);}
:-moz-placeholder {             color: var(--violet-light);   opacity: 1;}
::-moz-placeholder {            color: var(--violet-light);   opacity: 1;}
:-ms-input-placeholder {        color: var(--violet-light);}

/* couleur placeholder focus */
:focus::-webkit-input-placeholder {   color: rgba(var(--violet-light-rgb), .4);}
:focus:-moz-placeholder {             color: var(--violet-light);   opacity: .4;}
:focus::-moz-placeholder {            color: var(--violet-light);   opacity: .4;}
:focus:-ms-input-placeholder {        color: rgba(var(--violet-light-rgb), .4);}

label {
    display: block;
    margin-bottom: 5px;
}

.choix {
    margin-bottom: 1.2rem;
}

input[type=text], input[type=email], input[type=url], input[type=password], input[type=search], input[type=tel], input[type=number], input[type=date], textarea, select, .field-akn, input.field-akn {
    --field-akn-height: 2.813em;
    --field-akn-font-size:1em;
    --field-akn-padding:0.5em 1.2em;
    --field-akn-bg:var(--violet-1);
    --field-akn-color:var(--body-color-akn);
    --field-akn-border:2px solid transparent;
    --field-akn-border-radius: var(--border-radius-akn-small);

    margin: 0;

    display: block;
    width: 100%;
    padding: var(--field-akn-padding);
    font-family: var(--font-globale);
    font-size: var(--field-akn-font-size);
    font-weight: 400;
    line-height: 1.25;
    color: var(--field-akn-color);
    background-color: var(--field-akn-bg);
    border: var(--field-akn-border);
    border-radius: var(--field-akn-border-radius);
    transition: border-color 0.15s ease-in-out;
    min-height: var(--field-akn-height);
    
    outline: none;
    outline-color: transparent;

    -webkit-transition: border .3s, background .3s, color .3s;
    -o-transition: border .3s, background .3s, color .3s;
    transition: border .3s, background .3s, color .3s;
}

textarea {
    height: 8rem;
}
input[type=text]:focus, input[type=email]:focus, input[type=url]:focus, input[type=password]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=number]:focus, input[type=date]:focus, input:focus, textarea:focus, select:focus, .field-akn:focus, input.field-akn:focus {
    color: var(--field-akn-color);
    background-color: var(--field-akn-bg);
    border-color: var(--violet-light);

    outline: 0;
    box-shadow: 0;
}

input[type=button], button[type=submit], input[type=submit] {
    cursor: pointer;
}

/*Pseudo Hacks*/
input:-webkit-autofill, input:autofill{
    -webkit-background-clip: text;
    -webkit-text-fill-color: var(--field-akn-color);
    transition: background-color 5000s ease-in-out 0s;
    box-shadow: inset 0 0 20px 20px var(--field-akn-bg);
}
input::-webkit-datetime-edit-fields-wrapper{
    padding: 0;
}
input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
}



.line-form{
    position: relative;
}
.line-form .small-notice{
    margin-left: 1em;
    margin-top: 4px;
}
.line-form .error-notice{
    display: none;
    color: var(--error);
}
.line-form-error .field-akn{
    --field-akn-border:2px solid var(--error);
}
.line-form-error .error-notice{
    display: block;
}


.line-input {
    position: relative;
}
.line-input .bt-overlay{
    position: absolute;
    right: 0.7em;
    top: 50%;
    transform:  translateY(-50%);
    z-index: 2;
    color: #EEBBFF;
    cursor: pointer;
}
.line-input .bt-overlay.active{
    color: var(--rose-1);
}

.line-input:before{
    content: '';
    position: absolute;
    top: 50%;
    left: 0.8em;
    transform: translateY(-50%);
    z-index: 2;
    cursor: pointer;
    width: 1.25em;
    height: 1.25em;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.line-input.line-email .field-akn{
    --field-akn-padding:0.5em 1.2em 0.5em 2.85em;
}
.line-input.line-email:before{
    background-image: url(../img/icons/icon-email-form.svg) ;
}
.line-input.line-pwd .field-akn{
    --field-akn-padding:0.5em 2.85em;
}
.line-input.line-pwd:before{
    background-image: url(../img/icons/icon-password-form.svg);
}
.line-input.line-date .field-akn{
    --field-akn-padding:0.5em 1.2em 0.5em 2.85em;
}
.line-input.line-date:before{
    background-image: url(../img/icons/icon-calendar-form.svg);
}


.btn, .btn:visited, input[type=button], button[type=submit], input[type=submit] {
    --btn-akn-height: 2.813em;
    --btn-akn-font-size: 1em;
    --btn-akn-padding: 0.5em 1.2em;
    --btn-akn-color: var(--body-color-akn);
    --btn-akn-bg: rgba(var(--rose-1-rgb), 1);
    --btn-akn-border: none;
    --btn-akn-border-radius: var(--border-radius-akn-big);
    
    --btn-akn-hover-color: var(--body-color-akn);
    --btn-akn-hover-bg:  rgba(var(--rose-1-rgb), .8);
    --btn-akn-hover-border: none;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap:0.6em;

    padding: var(--btn-akn-padding);
    font-family: var(--font-globale);
    font-size:  var(--btn-akn-font-size);
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    background: var(--btn-akn-bg);
    border: var(--btn-akn-border);
    border-radius: var(--btn-akn-border-radius);
    color: var(--btn-akn-color);

    min-height: var(--btn-akn-height);

    -webkit-transition: border .5s, background .5s, color .5s;
    -o-transition: border .5s, background .5s, color .5s;
    transition: border .5s, background .5s, color .5s;
}
.btn.btn-small, .btn.btn-small:visited  {
    --btn-akn-font-size: 0.875em;
    --btn-akn-height: 2.143em;
    --btn-akn-padding: 0.5em 0.9em;
}
.btn.btn-big, .btn.btn-big:visited {
    --btn-akn-font-size: 1.2em;
}
.btn.btn-large, .btn.btn-large:visited {
    --btn-akn-padding: 0.5em 3em;
}
.btn.btn-wide, .btn.btn-wide:visited {
    display: flex;
    width: 100%;
}


.btn img, .btn:visited img {
   max-width: 3em;
   max-height: 3em;
}

/* btn-akn Clair*/
.btn.btn-white, .btn.btn-white:visited  {
    --btn-akn-color: #390757;
    --btn-akn-bg: var(--blanc);
    --btn-akn-hover-color: #390757;
    --btn-akn-hover-bg:  var(--blanc);
}
/* btn-akn Gold*/
.btn.btn-gold, .btn.btn-gold:visited {
    --btn-akn-border:2px solid var(--gold);
    --btn-akn-bg: linear-gradient(270deg, #1D012C 0%, #FB9D01 100%);
    --btn-akn-hover-border:2px solid var(--gold);
    box-shadow:  0px 0px 1.8em var(--gold);
    height: var(--btn-akn-height);
}
/* btn-akn Outline*/
.btn.btn-outline, .btn.btn-outline:visited {
    --btn-akn-border: 2px solid  var(--violet-1);
    --btn-akn-bg: var(--violet-dark);
    --btn-akn-hover-border: 2px solid  var(--violet-1);
    --btn-akn-hover-bg:  var(--violet-dark);
}
/* btn-akn Violet clair*/
.btn.btn-violet-clair, .btn.btn-violet-clair:visited {
    --btn-akn-bg: var(--violet-light);
    --btn-akn-hover-bg: var(--violet-light);
}
/* btn-akn Vert*/
.btn.btn-vert, .btn.btn-vert:visited {
    --btn-akn-bg: #00AF3A;
    --btn-akn-hover-bg: #00AF3A;
}

/* btn-akn Transparent*/
.btn.btn-transparent, .btn.btn-transparent:visited {
    --btn-akn-color: var(--blanc);
    --btn-akn-bg: transparent;
    --btn-akn-hover-color: var(--blanc);
    --btn-akn-hover-bg:  transparent;
}

.btn:hover, .btn:active, .btn:focus, input[type=button]:hover, button[type=submit]:hover, input[type=submit]:hover {
    color: var(--btn-akn-hover-color);
    background-color: var(--btn-akn-hover-bg);
    border: var(--btn-akn-hover-border);
}



input[type=button]:disabled , input[type=submit]:disabled {
    cursor: default;
    background-color: #CCC;
    color: #FFFFFF;
}



a.btn.load-more, .btn.load-more{  
    background: linear-gradient(to right, #E07DFF 0%, #8E2DED 100%);
    font-size: 0.9em;
    padding: 0.7em 1.2em;
    border: 0;
    margin: 0 auto 1em;
}



/* 
    Custom Dropdown
------------------------------- */
.dropdown-akn{
    position: relative;
    display: inline-block;
}
.dropdown-akn .dropdown-content{

    --dropdown-akn-height: 3.125em;
    --dropdown-akn-font-size: 1.06em;
    --dropdown-akn-padding: 0.5em 1em;
    --dropdown-akn-bg: var(--clair-akn);
    --dropdown-akn-color: inherit;
    --dropdown-akn-border: none;
    --dropdown-akn-border-radius: var(--border-radius-akn-small);

    padding: var(--dropdown-akn-padding);
    color: var(--dropdown-akn-color);
    background-color: var(--dropdown-akn-bg);
    border: var(--dropdown-akn-border);
    border-radius: var(--dropdown-akn-border-radius);
    font-size: var(--dropdown-akn-font-size);
    line-height: 1.25;
    min-height: var(--dropdown-akn-height);

    display: none;
    position: absolute;
    z-index: 1;
    min-width: 220px;
    top: calc(100% + 5px);
}

.dropdown-akn.active button img{
    transform: rotate(180deg);
}


/* 
    Message alert-akn
------------------------------- */

.alert-akn {
    --alert-akn-height: 1.875em;
    --alert-akn-font-size: 0.75em;
    --alert-akn-padding: 0.5em 1em;
    --alert-akn-bg: var(--violet-1);
    --alert-akn-color: var(--body-color-akn);
    --alert-akn-border: none;
    --alert-akn-border-radius: var(--border-radius-akn-small);
    padding: var(--alert-akn-padding);
    color: var(--alert-akn-color)
;    background-color: var(--alert-akn-bg);
    border: var(--alert-akn-border);
    border-radius: var(--alert-akn-border-radius);
    font-size: var(--alert-akn-font-size);
    font-family: var(--font-globale);
    line-height: 1.5;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap:1em;
    min-height: var(--alert-akn-height);
}
.alert-akn-large {
    --alert-akn-font-size: 1.2em;
}

.alert-akn-success {
    --alert-akn-bg: var(--success);
}
.alert-akn-error {
    --alert-akn-bg: var(--error);
}
.alert-akn-gold {
    --alert-akn-padding: 0.2em 0.7em;
    --alert-akn-border-radius: var(--border-radius-akn-medium);
    --alert-akn-color: var(--violet-dark);
    --alert-akn-bg: var(--gold);
}


/* 
    Box-akn
------------------------------- */

.bg-box-opacity{
    background: rgba(21, 0, 62, 0.5);
    border: 1px solid #AD83FF;
    border-radius: 5px;
    padding: 1em;
    text-align: center;
}
.bg-box-opacity.orange{
    background: rgba(255, 155, 46, 0.16);
    border: 1px solid #FF9B2E;
}

/*Text Shadow*/
.shadowtxt {
    --text-shadow-color:#60086A;  
    --text-shadow-size:0.1em; 
    --text-shadow-sizeneg:-0.1em;   

    text-shadow: 
       var(--text-shadow-size) var(--text-shadow-size) 0 var(--text-shadow-color), 
       var(--text-shadow-size) var(--text-shadow-sizeneg) 0 var(--text-shadow-color), 
       var(--text-shadow-sizeneg) var(--text-shadow-size) 0 var(--text-shadow-color), 
       var(--text-shadow-sizeneg) var(--text-shadow-sizeneg) 0 var(--text-shadow-color), 
       var(--text-shadow-size) 0px 0 var(--text-shadow-color), 
       0px var(--text-shadow-size) 0 var(--text-shadow-color), 
       var(--text-shadow-sizeneg) 0px 0 var(--text-shadow-color), 
       0px var(--text-shadow-sizeneg) 0 var(--text-shadow-color);

    -webkit-font-smoothing: antialiased;
}



/* 
Header 
-------------- */

.site-header{
    padding:  0;
    position: fixed;
    left: 0 ;
    right: 0;
    top: var(--header-top);
    z-index: 1100;
    display: flex; 
    flex-direction: column;
    justify-content: center;
    transition: all .3s ease-in-out;
    -webkit-transition: .3s all ease-in-out;
    -o-transition: .3s all ease-in-out;
}
.scrolling .site-header{
    height: var(--height-header-sticky);
}
.site-header .container-header{
    --gradient-color:var(--violet-1);
    position: relative;
    display: grid;
    grid-template-columns: 24% 1fr 24%;
    align-items: center;
    height: var(--height-header);

    background-color: transparent;
    background-image: radial-gradient(ellipse at center top, var(--gradient-color) 0%, var(--violet-darker) 68%);
}
.gonewildday .site-header .container-header{
    --gradient-color:#AE165E;
}
.poppornday .site-header .container-header{
    --gradient-color:#A1681E;
}

.day-header .container-header{
    background: transparent;
}
.day-header .container-header:before{
    transition: all .3s ease-in-out;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 200%;
    background: linear-gradient(to bottom, rgba(var(--violet-darker-rgb), 1) 0%, rgba(var(--violet-darker-rgb), 0) 100%);
}
.scrolling .day-header .container-header:before{
    background: var(--violet-darker);
    height: 100%;
}

.site-header .center-header{    
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    z-index: 3;
}
.site-branding{
    position: relative;
}

/*Caret Switch*/
.switch-site{
   position: absolute;
   top: 50%;
   right: -2em;
   transform: translateY(-50%);
   display: block;
   cursor: pointer;
}

.site-header .left-header,
.site-header .right-header{
    display: flex;
    align-items: center;
    flex-shrink: 0;
}
.site-header .left-header{
    justify-content: flex-start;
    gap: 1em;
}
.site-header .right-header{
    justify-content: flex-end;
    gap: 2em;
}



/*User Avatar */
.user-avatar{
    --avatar-width:1.75em;
    aspect-ratio: 1 / 1;
    height: var(--avatar-width);
    border-radius: 50%;
    object-fit: cover;
    object-position: center;
    flex-shrink: 0;
}
@supports not (aspect-ratio: 1 / 1) {
  .user-avatar{
    width: 1.75em;
    height: 1.75em;
  }
}
.user-avatar.user-vip{
    width: calc(var(--avatar-width) + 4px);
    border:2px solid  var(--gold);
    box-shadow: 0px 0px 15px var(--gold);
}
.user-avatar-sm {
    --avatar-width: 2.188em;
}
.user-avatar-md {
    --avatar-width: 3.125em;
}
.user-avatar-xl {
    --avatar-width: 6.25em;
}

.site-header .bt-menu-header {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    background: transparent;
    flex-shrink: 0;
}

.site-header .bt-menu img, 
.site-header .bt-search img {
    width: 1.563em;
}

.site-header .bt-back {
    width: 2.35em;
    height: 2.35em;
}


/*Menu Left Fixed*/
.menu-left {
    position: absolute;
    left: 1em;
    top: 1em ;
    text-align: center;
    width: 5em;
    z-index: 1000;
}
body:not(.home) .menu-left {
    display: none;
}



/*Subheader Home */
.container-subheader{
    position: fixed;
    top: calc(var(--height-header) + var(--header-top));
    left: 50%;
    transform: translateX(-50%);
}
.scrolling .container-subheader{
    top: calc(var(--height-header-sticky) + var(--header-top));
}

/*h1 title-home*/
.title-home{
    position: absolute;
    top: 1.8em;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.75em;
    margin: 0;
    width: 20em;
    text-align: center;
    z-index: 1;
    opacity: 1;
    transition: opacity .2s ease-in-out;
}
.scrolling .title-home{
    opacity: 0;
}


/*Choose month*/
.choose-month{
    opacity: 0;
    position: absolute;
    top: 4em;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.875em;
    font-weight: 400;
    text-align: center;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 0.5em;
    margin: 0;
    cursor: pointer;
    z-index: 2;
    transition: all .2s ease-in-out;

    background-color: rgba(96, 8, 106, 0.25);
    border-radius: 1em;
    padding: 0.4em 1em;
}
.scrolling .choose-month{
    opacity: 1;
    top:  1em;
}


/*btn-calendar */
.btn-calendar{
    position: absolute;
    top:  1.5em;
    right: 1em;
    z-index: 1000;
}
.btn-calendar img{
    width: 1.4em;
}



/* 
Drawer */

.drawer{ 
    position: fixed;
    width: var(--size-drawer);
    z-index: 2000;
    background: linear-gradient(180deg, var(--violet-darker) 47%, var(--violet-1) 100%);

    transition-duration: 0.2s;
    transition-timing-function: ease-out;
}

#menu-drawer{ 
    top: 0;
    bottom: 0;
    left: calc( 0px - var(--size-drawer));
}
#menu-drawer.open{ 
    left: 0;
    transition-property: left;
}
#compte-drawer{ 
    top: 0;
    bottom: 0;
    right: calc( 0px - var(--size-drawer));
}
#compte-drawer.open{ 
    right: 0;
    transition-property: right;
}

.menu-switch .link-switch,
.menu-switch .link-switch:visited{
    padding: 0.53em;
    border: 3px solid transparent;
    border-radius: 1.25em;
    transition: all .2s ease-in-out;
}
.menu-switch .link-switch:hover,
.menu-switch .link-switch:active{
    border-color: var(--blanc);
}
.menu-switch .link-switch img{
    display: block;
}

.menu-switch .link-switch.current-site{
    padding: 0.53em;
    border: 3px solid #fff;
    border-radius: 1.25em;
}

header#day-header.easy-switch-active .container.container-header:before {
    background: linear-gradient(to bottom, #FB9D01 0%, #FB9D0100 100%);
    height: 130%;
}

header#day-header.easy-switch-active .logo-site{
    filter: drop-shadow(0 0 1.5em #FFD400);
}

.drawer .section{    
    padding: 1.5em;
    height: 100%;
    display:flex;
    flex-direction: column;
    justify-content: flex-start;
    overflow-y: auto;
    position: relative;
}


.drawer .close-drawer{
    position: absolute;
    top: 1.5em;
    right: 1.5em;
    cursor: pointer;
    z-index: 2;
}
#compte-drawer .close-drawer{ 
    left: 1.5em;
    right: auto;
}


/* Menus */

/* Top Nav Links */
.drawer .nav_header{  
    margin-top: 2em;
    margin-right: 2em;
    margin-bottom: 1.5em;
    position: relative;
    z-index: 2;
}
#compte-drawer .nav_header{ 
    margin-right: 0;
    margin-bottom: 0;

}

.drawer .nav_header ul{  
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
}
.drawer .nav_header ul li{   
    margin: 0;
    padding: 1.2em 0;
    border-bottom: 1px solid var(--violet-1);
    position: relative;
}
.drawer .nav_header ul li a:not(.btn){   
    font-size: 1em;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap:1em;
    padding: 0 0.8em;
}
.drawer .nav_header ul li img{
    width: 1.07em;
}

.btn.btn-scrolling{
    --btn-akn-height: none;
    --btn-akn-padding: 0.5em 1.2em 0.5em 0;
    height: 2.25em;
}

.btn.btn-scrolling img{
    width: 2.8em !important;
    max-height: none;
    margin-bottom: -.8em;
    align-self: flex-end;
}

/* Drawer Gauche */

/* Middle Nav Ext Links */
.middle-nav{
    margin-top: auto;
    margin-right: 1em;
    margin-bottom: 1em;
}
.middle-nav .h4  {
    font-weight: 400;
}

/* Bootom Nav Links */
.bottom-nav .links-bottom{
    margin-bottom: 0;
    font-size: 0.75em;
}
.bottom-nav .links-bottom a{
    text-decoration: none;
}
#compte-drawer .bottom-nav{ 
    margin-top: auto;
    margin-bottom: 2em;
}


/* Drawer Droite */

.bg-drawer {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    height: 14.6em;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.bg-drawer:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 14.6em;
    background: linear-gradient(to bottom, rgba(var(--violet-darker-rgb), 0) 0%, rgba(var(--violet-darker-rgb), 1) 100%);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

.log-box{
    position: relative;
    z-index: 2;
    display: flex;
    gap:1em;
    margin-top: 3.5em;
}
.log-box .user-avatar{
    --avatar-width:6.25em;
}

.log-box .user-infos{
    display: flex;
    flex-direction: column;
    gap: 1em;
    align-items: flex-start;
    justify-content: center;
}


/* Hide body */
.hide-body {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1900;
    display: none;
    background: rgba(var(--violet-darker-rgb), .6) ;


}

/* 
Footer 
-------------- */
.container-copyright{
    margin-top: auto;
    background-color: rgba(var(--violet-light-rgb),0.15);
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

.site-footer{
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1100;
}
.container-footer{
    background-color: transparent;
    background-image: radial-gradient(ellipse farthest-side at left bottom, var(--violet-1) 0%, var(--violet-darker) 68%);
    height: var(--height-footer);
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, 3.75em) 1fr;
}
.container-footer .link-footer{
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid var(--violet-1);
}
.container-footer .link-footer.link-tok img{
    margin-bottom: 0.625em;
}
.container-footer .link-footer.link-search img{
    max-height: 1.563em;
}


/* Popup
------------------------------- */
[data-popup-id]{
    cursor: pointer;
}
.popup-akn{
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 13000;
    background-color:rgba(27, 0, 45, 0.7);
    overflow-y: auto;

    display:none;
    opacity:0;

    flex-direction: column;
    align-items: center ;
    /*justify-content:center  ;*/
    gap: 3em;

    padding: 4em .5em;
    max-height: 100vh;

    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}
.popup-akn-ouverte, .popup-akn-ouverte body {
    /*overflow: hidden;*/
    height: 100vh;
}
.popup-akn .close-btn{
    z-index: 11;
    display: block;
    position: absolute;
    right: 1.5em;
    top: 1.5em;
}
.popup-akn .close-btn svg{
    width: 1.4em;
    height: 1.4em;
    fill: #FFF;
}

.popup-akn .inner-popup{
    background: linear-gradient(230deg, var(--violet-darkest) 0%, var(--violet-1) 100%);
    border: 2px solid var(--violet-1);
    position: relative;
    margin: 0 0 ;
    border-radius: var(--border-radius-akn-medium);
    /*
    flex-grow: 1;
    */

    width: 100%;
    max-width: var(--container-md);
}

.content-popup{
    padding: 2em;
    position: relative;
    z-index: 1;
}

.footer-popup:before{
    content: '';
    position: absolute;
    width: 100%;
    left: 0;
    height: 2px;
    background-color: var(--violet-1);
}

@media screen and (max-width: 600px) {
    .popup-akn-classic {
        padding: 0;
        flex-direction: column;
        justify-content:stretch  ;
        align-items: stretch;

    }
    .popup-akn-classic .inner-popup{
        padding: 35px 0;
        box-shadow: none;
        border-radius: 0;
        margin: 0;
        flex-grow: 1 !important;
    }
    .popup-akn-classic .close-btn {
        right: 10px;
        top: 10px;
    }
    .popup-akn-classic .close-btn svg {
        width: 20px;
        height: 20px;
    }
    .popup-akn-classic .content-popup{
        width: 100% !important
    }
}


/* *************
Popup VIP 
************* */
.popup-akn-vip .inner-popup{
    border: 2px solid var(--gold);
}

/***************** 
 * 
 * Home 
 * 
 * *****************/
.container-gameboard{
    background-position:top center;
    background-repeat:no-repeat;
    background-size:cover;
}
@media screen and (max-width: 428px) {
    .container-gameboard{
        background-size:179.5%;
    }
}
@media screen and (max-width: 360px) {
    .container-gameboard{
        margin-top:50vh;
    }
}
.cropper-gameboard::after {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    right: 0;
    height: 7em;
    display: block;
    background:linear-gradient(to bottom,rgba(27, 0, 45, 1) 0%, rgba(27, 0, 45, 0) 100%);
    z-index: 10;
    pointer-events: none;
}

.spot.dmca .preview {
    background-image: url('/assets/img/default-models.jpg') !important;
}

/***************** 
 * Game * 
 * *****************/

#gameboard{
    max-width:var(--container-md);
    height: 100%;
    overflow:hidden;
    z-index: 3;
    aspect-ratio: 428/2568;
}
@supports not (aspect-ratio: 1 / 1) {
    #gameboard::before {
        content: "";
        display: block;
        padding-top: calc(2568 / 428 * 100%);
    }
}
#gameboard .fil{
    z-index: 1;
    position:absolute;
    left: 50%;
    top: 3%;
    width: 100%;
    height: 100%;

    transform: translateX(-50%);
    background-image: url(../img/fil.svg);
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

#gameboard .spot{
    --spot-width: 3.125em;
    font-family: var(--font-speciale), sans-serif;
    position:absolute;
    left:50%;
    display:flex;
    justify-content: center;
    z-index:10;
    font-weight:500;

    width: var(--spot-width);
    aspect-ratio: 73 / 71.5;
    padding: 0.45% 0 2.5%;

    transform: translate(-50%, -50%);
}
@supports not (aspect-ratio: 1 / 1) {
  #gameboard .spot{
    position: absolute;
  }
  #gameboard .spot::before{
    content:"";
    display:block;
    padding-top: calc(71.5 / 73 * 100%);
  }
  #gameboard .spot > *{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
  }
}

#gameboard .spot .number{
    display:flex;
    align-items: center;
    justify-content: center;
    text-align:center;
    z-index: 5;

    font-size:1.688em;
}

#gameboard .spot .button {
    position: absolute;        
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 4;
    background-size:contain;
    background-position:center center;
    background-repeat:no-repeat;
    background-image: url(../img/icons/day-button-map-purple.svg);
}


#gameboard .spot.loading:before{
    content: '';
    position:absolute;
    left: 50%;
    transform: translateX(-50%);

    width: 83%;
    height: 78.5%;
    z-index: 15;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url(../img/icons/ld2.gif);
}


#gameboard .spot .preview{
    display:none;
    background-position:center center;
    background-size:cover;

    position:absolute;
    left: 50%;
    transform: translateX(-50%);

    width: 90%;
    height: 78.5%;
    border-radius: 50%;
    z-index: 10;
}
/*Past*/
#gameboard .spot.past .button{
    background-image: url(../img/icons/day-button-map-green.svg);
}
/*Today*/
#gameboard .spot.today {
    --spot-width: 5em;
}
#gameboard .spot.today .button{
    background-image: url(../img/icons/day-button-map-pink.svg);
}

#gameboard .spot.vip:after{
    content: '';
    position:absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 70%;

    width: 90%;
    aspect-ratio: 54 / 20 ;
    z-index: 15;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url(../img/icons/badge-vip.svg);
}
@supports not (aspect-ratio: 1 / 1) {
  #gameboard .spot.vip::after{
    height: 0;
    padding-top: calc(20 / 54 * 100%);
  }
}

#gameboard .spot.dejavu .preview{
    display:block;
}

#gameboard .spot.dejavu .number{
    position:absolute;
    display: block;

    top: 70%;
    left: 95%;
    font-size: 1.286em;

    --text-shadow-color:#60086A;  
    --text-shadow-size:0.1em; 
    --text-shadow-sizeneg:-0.1em;   

    text-shadow: 
       var(--text-shadow-size) var(--text-shadow-size) 0 var(--text-shadow-color), 
       var(--text-shadow-size) var(--text-shadow-sizeneg) 0 var(--text-shadow-color), 
       var(--text-shadow-sizeneg) var(--text-shadow-size) 0 var(--text-shadow-color), 
       var(--text-shadow-sizeneg) var(--text-shadow-sizeneg) 0 var(--text-shadow-color), 
       var(--text-shadow-size) 0px 0 var(--text-shadow-color), 
       0px var(--text-shadow-size) 0 var(--text-shadow-color), 
       var(--text-shadow-sizeneg) 0px 0 var(--text-shadow-color), 
       0px var(--text-shadow-sizeneg) 0 var(--text-shadow-color);

    -webkit-font-smoothing: antialiased;
}
#gameboard .spot .crown {
    position: absolute;        
    left: 37%;
    transform: translateX(-50%);
    bottom: 78%;
    z-index: -1;
    pointer-events: none;


    width: 2.5em;
    aspect-ratio: 90/69;
    transform: rotate(25deg);
}
@supports not (aspect-ratio: 1 / 1) {
  #gameboard .spot .crown {
    height: 0;
    padding-top: calc(69 / 90 * 100%);
  }
}

.toosoon {
  animation-duration: 1s;
  animation-fill-mode: both;
  animation-name: toosoon;
}

@keyframes toosoon {
    from, to {
        left:50%;
    }
    10%, 30%, 50%, 70%, 90% {
        left:49%;
    }
    20%, 40%, 60%, 80% {
        left:51%;
    }
}



#gameboard #spot-31{top:6.5%;margin-left:-25%;}
#gameboard #spot-30{top:9.5%;margin-left:0%;}
#gameboard #spot-29{top:12.5%;margin-left:25%;}
#gameboard #spot-28{top:15.5%;margin-left:0%;}

#gameboard #spot-27{top:18.5%;margin-left:-25%;}
#gameboard #spot-26{top:21.5%;margin-left:0%;}
#gameboard #spot-25{top:24.5%;margin-left:25%;}
#gameboard #spot-24{top:27.5%;margin-left:0%;}

#gameboard #spot-23{top:30.5%;margin-left:-25%;}
#gameboard #spot-22{top:33.5%;margin-left:0%;}
#gameboard #spot-21{top:36.5%;margin-left:25%;}
#gameboard #spot-20{top:39.5%;margin-left:0%;}

#gameboard #spot-19{top:42.5%;margin-left:-25%;}
#gameboard #spot-18{top:45.5%;margin-left:0%;}
#gameboard #spot-17{top:48.5%;margin-left:25%;}
#gameboard #spot-16{top:51.5%;margin-left:0%;}

#gameboard #spot-15{top:54.5%;margin-left:-25%;}
#gameboard #spot-14{top:57.5%;margin-left:0%;}
#gameboard #spot-13{top:60.5%;margin-left:25%;}
#gameboard #spot-12{top:63.5%;margin-left:0%;}

#gameboard #spot-11{top:66.5%;margin-left:-25%;}
#gameboard #spot-10{top:69.5%;margin-left:0%;}
#gameboard #spot-9{top:72.5%;margin-left:25%;}
#gameboard #spot-8{top:75.5%;margin-left:0%;}

#gameboard #spot-7{top:78.5%;margin-left:-25%;}
#gameboard #spot-6{top:81.5%;margin-left:0%;}
#gameboard #spot-5{top:84.5%;margin-left:25%;}
#gameboard #spot-4{top:87.5%;margin-left:0%;}

#gameboard #spot-3{top:90.5%;margin-left:-25%;}
#gameboard #spot-2{top:93.5%;margin-left:0%;}
#gameboard #spot-1{top:96.5%;margin-left:25%;}


/*************
    Tags
*************/

/*Notification*/
#notification-drawer{ 
    bottom: calc( 0px - var(--size-drawer));
    left: 50%;
    right: 0;

    width: calc(100% - 2em);
    max-width: calc( var(--site-width) - 2em);
    transform: translateX(-50%);

    border-radius: var(--border-radius-akn-small);
    background: linear-gradient(0deg, var(--violet-darker) 0%, #6D1E91 100%);
}
#notification-drawer.open{ 
    bottom: calc(var(--height-footer) + 1em);
    transition-property: bottom;
}
#notification-drawer .section{ 
    padding: 1.2em;
    padding-right: 2.2em;
}
#notification-drawer.drawer .close-drawer{ 
    top: 0.5em;
    right: 0.5em;
}

#notification-drawer .section .illus {     
    width: 5em;
    height: 5.5em;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}
#notification-drawer .section .illus img {
    max-height: 100%;
}
#notification-drawer .section .msg { 
   flex-shrink: unset;
}

/*************
    Tags
*************/
.wrapper-tag, .wrapper-tag:visited {
    --tag-font-size: 0.75em;
    --tag-font-weight:400;
    --tag-text-transform: lowercase;

    --tag-padding: 0.45em 0.667em;

    --tag-bg: rgba(var(--violet-light-rgb), 0.15);
    --tag-color:var(--violet-light);

    --tag-bg-hover: rgba(var(--violet-light-rgb), 0.3);
    --tag-color-hover:var(--body-color-akn);


    position: relative;
    border: 1px solid transparent;
    padding: var(--tag-padding);
    color: var(--tag-color);
    background-color: var(--tag-bg);
    font-size: var(--tag-font-size);
    text-transform: var(--tag-text-transform);
    border-radius: 2em;
    font-weight: var(--tag-font-weight);
    margin: 0.3em;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
}
/*Spe social network*/
.wrapper-tag.wrapper-tag-social, 
.wrapper-tag.wrapper-tag-social:visited {
    --tag-font-size: 0.875em;
    --tag-font-weight:700;
    --tag-text-transform: normal;

    --tag-padding: 0.45em 1em;

    --tag-bg: rgba(var(--blanc-rgb), 1);
    --tag-color:var(--violet-darker);

    --tag-bg-hover: rgba(var(--blanc-rgb), 0.9);
    --tag-color-hover:var(--violet-darker);
}
/*Spe ranking*/
.wrapper-tag.wrapper-tag-ranking, 
.wrapper-tag.wrapper-tag-ranking:visited {
    --tag-font-size: 0.875em;
    --tag-color:var(--blanc);
    --tag-text-transform: none;
    --tag-padding: 0.3em 2em;
    margin: 0;
}
a.wrapper-tag:hover, a.wrapper-tag:active, a.wrapper-tag:focus{
    background-color: var(--tag-bg-hover);
    color: var(--tag-color-hover);
}


.btn-close-page{
    z-index: 11;
    display: block;
    position: absolute;
    right: 1.5em;
    top: 1.5em;
}


/*********************************
 * 
 *  Box Top Image Background
 * 
 * ***********************************/

.box-bg-img-top{
    --height-img : 14.6em;
    --blur-img : blur(4px);
    --gradient-end-img : 100%;
    --gradient-color-img : var(--violet-darker-rgb);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: var(--height-img);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    overflow: hidden;
}
.box-bg-img-top.tall-img{
    --height-img : 30em;
    --blur-img : none;
    --gradient-end-img : 63%;
}
.box-bg-img-top:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
    linear-gradient(
        to bottom, 
        rgba(var(--gradient-color-img), 0.3) 0%, 
        rgba(var(--gradient-color-img), 1) var(--gradient-end-img)
    );
    -webkit-backdrop-filter: var(--blur-img);
    backdrop-filter: var(--blur-img);
}

/*********************************
 * 
 *  Box Model Top Image Background
 * 
 * ***********************************/
.box-model {
    position: relative;
    overflow: hidden;
    padding: 2.2em;
    border-radius: var(--border-radius-akn-medium);
    background-color: var(--violet-1);

    background-image: 
        linear-gradient(
            to bottom, 
            rgba(var(--violet-darker-rgb), 1) 50%, 
            rgba(var(--violet-1-rgb), 1) 100%
        );
}
.box-bg-img-top.model-img{
    --height-img : 50%;
}


/*********************
 * 
 *  Card
 * 
 * ***********************/
.swiper-cards{
    overflow: visible;
}
.wrapper-card, .wrapper-card:visited{
    display: block;
    border-radius: var(--border-radius-akn-smaller);
    width: 7.813em;
    aspect-ratio: 125/200;
    overflow: hidden;
    position: relative;
 }
 @supports not (aspect-ratio: 1 / 1) {
  .wrapper-card, .wrapper-card:visited{
    height: 0;
    padding-top: calc(200 / 125 * 100%);
  }
}
.grid-display .wrapper-card{
    width: auto;
 }
.wrapper-card-tag:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;   
    z-index: 10; 
    background:linear-gradient(180deg, rgba(var(--violet-darker-rgb), 0) 0%, rgba(var(--violet-darker-rgb), 0.3) 100%) ;
 }
.wrapper-card .card-thumb{
    width: 100%;
    aspect-ratio: 125/200;
    position: relative;
    z-index: 1;
    display: block;
    overflow: hidden;
    background-color: var(--violet-dark);
}
@supports not (aspect-ratio: 1 / 1) {
  .wrapper-card .card-thumb{
    height: 0;
    padding-top: calc(200 / 125 * 100%);
  }
}
.placeholder .card-thumb{
    background-image: linear-gradient(90deg, var(--violet-dark) 10%, var(--violet-1) 50%, var(--violet-dark) 90%);
    background-size: 200% auto;
    animation: shine 1s linear infinite;
}
@keyframes shine {
    from {  background-position: 200% center }      
    to { background-position: 0% center }
}

.wrapper-card .card-thumb img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.wrapper-card .card-type {
    z-index: 100;
    position: absolute;
    left: .5em;
    bottom: .5em;
    display: block ;
    height: 1.125em;
    width: auto;
}

.wrapper-card .card-type.dot {
  border-radius: 50%;
  background-color: #28FF00;

  width: 1.125em;
  height: 1.125em;

  transition: none;
  animation-duration: 1.2s;
  animation-name: blinkdot;
  animation-iteration-count: infinite;
  animation-timing-function: step-end;
}

@keyframes blinkdot { 
  0% { opacity:0; }
  50% { opacity:1; } 
  100% { opacity:0; }
}

.wrapper-card .card-play {
    position: absolute;
    z-index: 100;
    display: block ;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 2em;
    height: 2em;
}
.wrapper-card .card-date {
    z-index: 100;
    position: absolute;
    left: .5em;
    top: .5em;
    display: block ;
    font-size: 0.75em;
    font-weight: 500;
}


/*Tags*/
.wrapper-card.wrapper-card-tag .card-title{
    z-index: 100;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex ;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0.7em;
}

/*Girls*/
.wrapper-card.wrapper-card-girl {
    border-radius: 0;
    aspect-ratio: unset;
}
@supports not (aspect-ratio: 1 / 1) {
  .wrapper-card.wrapper-card-girl {
    height: auto;
    padding-top: 0;
  }
}
.wrapper-card.wrapper-card-girl .card-thumb {
    border-radius: 50%;
    aspect-ratio: 1/1;
}
@supports not (aspect-ratio: 1 / 1) {
  .wrapper-card.wrapper-card-girl .card-thumb {
    height: 0;
    padding-top: 100%;
  }
}
.wrapper-card.wrapper-card-girl .card-thumb img {
}

/*See more*/
.wrapper-card.wrapper-card-see-more .card-thumb{
    display: flex ;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--violet-1);
 }
.wrapper-card.wrapper-card-see-more .card-thumb img{
    width: 2.2em;
    height: auto;
    opacity: 0.5;
    margin-bottom: 0.5em;
 }
.wrapper-card.wrapper-card-see-more .card-title {
    z-index: 100;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex ;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0.7em;
}
/*************************
 * 
 *  Tabs
 * 
 * ***********************/
.tabs-menu {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.tabs-menu .navigation-tab {
    --tab-akn-link-bg: var(--violet-1);
    --tab-akn-link-color: var(--blanc);

    --tab-akn-link-bg-hover: rgba(var(--blanc-rgb),0.1);

    --tab-akn-link-bg-active: var(--blanc);
    --tab-akn-link-color-active: var(--violet-1);

    --tab-akn-link-radius: var(--border-radius-akn-big);
    --tab-akn-link-padding: 0.4em;

    display: flex;
    margin: 0 auto;
    align-items: center;
    justify-content: center;
    column-gap: 0.188em;
    padding: 0.188em;

    background-color: var(--violet-1);
    border-radius: var(--tab-akn-link-radius);
}
.tabs-menu .navigation-tab .link-tab {    
    background-color: var(--tab-akn-link-bg);
    border-radius: var(--tab-akn-link-radius);
    padding: var(--tab-akn-link-padding);
    border:0;
    color: var(--tab-akn-link-color);

    text-align: center;
    width: 7.75em;

}

.tabs-menu .navigation-tab .link-tab.active{
    background-color: var(--tab-akn-link-bg-active);
    color: var(--tab-akn-link-color-active);
}

.tabs-menu .navigation-tab .link-tab:not(.active):hover{
    background-color: var(--tab-akn-link-bg-hover);
}

.tabs-menu .container-tab {
    margin-top: 2em;
    position: relative;
    width: 100%;
}


.tabs-switch .container-tab .content-tab {
    display: none;
}
.tabs-switch .container-tab .content-tab:first-child {
    display: block;
}


.tabs-anchor  {
    --height-tabs-anchor:2.5em;
    height: var(--height-tabs-anchor) ;
    margin-bottom: 2em;
}
.tabs-anchor.scrolling .navigation-tab {
    z-index: 100;
    position: fixed;
    top: calc(var(--height-header-sticky) + 1em);
}


/*************************
 * 
 *  Library
 * 
 * ***********************/

.container-library .box-bg-img-top , .container-contact .box-bg-img-top{
    background-image: url(../img/background-librairy.jpg);
}

/*Search*/

.form-search .btn-submit{
    --btn-akn-padding:0.7em;
    right: 0;
}

.form-search.active .line-form input[type=text]{
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.form-search .line-form .resultat-recherche{
    display: none;
    position: absolute;
    top: calc(100% - 2px);
    left: 0;
    right: 0;
    width: 100%;
    height: 15em;
    background-color: var(--violet-1);
    border-color: var(--violet-1);
    border-top: 0;
    border-radius: 0 0 var(--border-radius-akn-small) var(--border-radius-akn-small) ;
    z-index: 10;
    overflow-y: auto;
}

.form-search .line-form .resultat-recherche a{
    display: block;
    padding: 0.5em 1.2em;
    background-color: transparent;
}
.form-search .line-form .resultat-recherche a:hover{
    background-color: rgba(var(--blanc-rgb), .1);
} 




/*********************
 * 
 *  Restricted access overlay
 * 
 * ***********************/
.access-overlay{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        linear-gradient(
            180deg, 
            rgba(var(--violet-darker-rgb), 0) 0%, 
            rgba(var(--violet-darker-rgb), 0.7) 34%, 
            rgba(var(--violet-darker-rgb), 1) 100%
        );
    padding: calc(2 * var(--padding-container));
    z-index: 200;
}

.access-overlay.access-overlay-free{
    top: 67%;
}



/*********************
 * 
 *  Page Single jour
 * 
 * ***********************/
/*Switch Site*/
#switch-drawer{ 
    top: calc( 0px - var(--size-drawer));
    left: 50%;
    right: 0;

    width: 100%;
    max-width: var(--site-width);
    transform: translateX(-50%);

    border-radius: 0 0 var(--border-radius-akn-medium) var(--border-radius-akn-medium);
    background: linear-gradient(242deg, var(--violet-darker) 0%, #FB9D01 100%);

    box-shadow: 0px 0px 1.5em rgba(var(--gold-rgb), 0.5);
    border: 3px solid var(--gold);
    border-top: 0;

}
#switch-drawer.open{ 
    top: 0;
    transition-property: top;
}


/*More*/
#more-drawer{ 
    bottom: calc( 0px - var(--size-drawer));
    left: 50%;
    right: 0;

    width: 100%;
    max-width: var(--site-width);
    transform: translateX(-50%);

    border-radius: var(--border-radius-akn-medium) var(--border-radius-akn-medium)  0 0;
    background: var(--blanc);
    color: var(--violet-darker);
}
#more-drawer.open{ 
    bottom: 0;
    transition-property: bottom;
}
#more-drawer .section{ 
    padding: 0.5em 1.5em;
}

#more-drawer a{ 
    color: var(--violet-darker);
}

/*Player*/

.wrapper-player{    

    --plyr-color-main: var(--rose-1);
    --plyr-range-thumb-height:0px;

    --height-player-info : 5.625em;

    position: relative;
}

.wrapper-player:not(:fullscreen) .player-video{   
    aspect-ratio: 428/644; 
    object-fit: cover;
}

.wrapper-player .player-video{
    aspect-ratio: 428/644;
    object-fit: cover;
}
@supports not (aspect-ratio: 1 / 1) {
  .wrapper-player:not(:fullscreen) .player-video,
  .wrapper-player .player-video{
    height: 0;
    padding-top: calc(644 / 428 * 100%);
  }
}

/*Full screen*/
.wrapper-player:fullscreen .player-video {
    height: 100vh;
    width: 100vw;
    object-fit: contain;
    object-position: center;
}

.wrapper-player .plyr--video .plyr__controls{
    padding: 0;
}

body.single-day .wrapper-player .plyr__control--overlaid svg{
    display: block!important;
}


.wrapper-player .plyr--video input[type=range]::-webkit-slider-runnable-track{
    border-radius: 0;
}
.wrapper-player .plyr__progress{
    /*pointer-events: none;*/
}

/*Player Infos*/
.player-infos{    
    position: absolute;
    left: 0;
    right: 0;
    bottom: 5px;
    padding: 1em 0.65em 1em 1em;

    height: var(--height-player-info);

    z-index: 3;

    background: linear-gradient(180deg, rgba(var(--violet-darker-rgb), 0) 0%, rgba(var(--violet-darker-rgb), 0.3) 100%);

 }
.player-infos .user-avatar{   
    box-shadow: 0px 0px 5px var(--noir); 
}

/*Player Scroll Help*/
.player-scrollhelp{       
    position: absolute;
    left: 50%;
    bottom: 2em;
    transform: translateX(-50%);
}

.upanddown{
    animation-duration: 1.2s;
    animation-name: upanddown;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes upanddown { 
  0%, 100% { transform:translateY(-2em); }
  50% { transform:translateY(-0.5em); } 
}


/*Player Actions*/
.player-actions{    
    position: absolute;
    right: 0;
    bottom: var(--height-player-info);
    padding: 1em;

    z-index: 3;
}
.player-btn,
.player-btn:visited{
   cursor:pointer;
   display: flex;
   flex-direction: column;

   align-items: center;
   justify-content: flex-start;
   gap:0;
}
.player-btn img{

    width:2.25em;
    height: auto;
    object-fit: contain;

    display: block;
    cursor:pointer;

    transition:  all .15s ease-in-out;
}
.player-btn .icon-active,
.player-btn.active .icon-not-active{
    display: none;
}
.player-btn.active .icon-active{
    display: block;
}

 /*Like */
.player-btn.player-like img{
    width:2.45em;
}

.player-like .nb-like{
    margin-top: -0.5em;
    display: block;
}

 /* Player overlay */
.player-overlay{
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--violet-1);
    z-index: 10;
}

.ad-playing .player-overlay{
    display: block;
}
.ad-playing .day-header{
    display: none;
}

/* Single day : DMCA */
.player-overlay.dmca-overlay{
    position: relative;
    aspect-ratio: 428/644; 
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 2em;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(../img/dmca-background.jpg);
    padding: 2em;
    text-align: center;
}
@supports not (aspect-ratio: 1 / 1) {
  .player-overlay.dmca-overlay{
    height: 0;
    padding-top: calc(644 / 428 * 100%);
  }
}
/* Single day : pub après video */

.overlay-header{    
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: var(--height-header);
    z-index: 10;
}
.overlay-header:before{
    transition: all .3s ease-in-out;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 200%;
    background: linear-gradient(to bottom, rgba(var(--violet-darker-rgb), 1) 0%, rgba(var(--violet-darker-rgb), 0) 100%);
}

.btn-replay{
    position: absolute;
    top: 1.3em;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}
/**/



/*********************************
 * 
 *  Scrolling Videos
 * 
 * ***********************************/
.container-scrolling-videos{
    flex-grow: 1;
    position: relative;
	height: 100vh;
	height: 100svh;
	height: 100dvh;
}

.swiper-scrolling{
    width: 100%;
    height: 100%;
}
.swiper-scrolling .swiper-slide{
    display: flex;
    align-items: center;
    justify-content: center;
}
body.single-day .swiper-scrolling .wrapper-scrolling {
    --height-player-info: 4em;
    width: auto;
    max-width: 100%;
    height: auto;
	max-height: 100vh;
	max-height: 100svh;
	max-height: 100dvh;
    aspect-ratio: 720 / 1280;
}
@supports not (aspect-ratio: 1 / 1) {
  body.single-day .swiper-scrolling .wrapper-scrolling {
    width: 100%;
    height: 0;
    padding-top: calc(1280 / 720 * 100%);
    position: relative;
    overflow: hidden;
  }
}
body.scrolling-videos .swiper-scrolling .wrapper-scrolling {
    --height-player-info: 4em;
    width: auto;
    max-width: 100%;
    height: 100%;
	max-height: 100vh;
	max-height: 100svh;
	max-height: 100dvh;
    aspect-ratio: 720 / 1280;
}
@supports not (aspect-ratio: 1 / 1) {
  body.scrolling-videos .swiper-scrolling .wrapper-scrolling {
    width: 100%;     /* base de calcul */
    height: 0;       /* on neutralise le 100% */
    padding-top: calc(1280 / 720 * 100%); /* hauteur / largeur */
    position: relative;
    overflow: hidden;
  }
}
.swiper-scrolling .wrapper-scrolling .plyr--video {
    height: 100%;
	max-height: 100vh;
	max-height: 100svh;
	max-height: 100dvh;
}

.plyr__video-wrapper .plyr__poster{
    background-color : transparent!important;
}

body.scrolling-videos .plyr__video-wrapper .plyr__poster {
    opacity: 1 ;
    transition: opacity 0.3s ease;
}

body.single-day .plyr__video-wrapper .plyr__poster {
    background-size: cover;
}

/* Classe ajoutée par le JS quand la première frame est affichée */
body.scrolling-videos .plyr__video-wrapper.poster-hidden .plyr__poster {
    opacity: 0 !important;
}

.swiper-scrolling .wrapper-scrolling .player-video {
    width: auto;
    max-width: 100%;
    height: 100%;
	max-height: 100vh;
	max-height: 100svh;
	max-height: 100dvh;
    aspect-ratio: 720 / 1280;
}
@supports not (aspect-ratio: 1 / 1) {
  .swiper-scrolling .wrapper-scrolling .player-video {
    width: 100%;
    height: 0;
    padding-top: calc(1280 / 720 * 100%);
    position: relative;
    overflow: hidden;
  }
}
.swiper-scrolling .wrapper-scrolling .player-infos{
    bottom: auto;
    top: 0;
    padding: 1em 1.25em;
    background: linear-gradient(180deg, rgba(var(--violet-darker-rgb), 1) 0%, rgba(var(--violet-darker-rgb), 0) 100%);
}
.swiper-scrolling .wrapper-scrolling .btn-close-scroll{
    position: absolute;
    right: 1em;
    top: 1em;
    padding: 0.3em;
}

.swiper-scrolling .wrapper-scrolling .player-actions{
    bottom: 6px;
}

/*BTN boobycam pub*/
.swiper-scrolling .wrapper-scrolling .wrapper-pub-btn{
    top: auto;
    bottom:2em;
}


/*Last Slide*/
.swiper-scrolling .last-slide  {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.swiper-scrolling .wrapper-scrolling.last-slide .player-infos {
    position: relative;
    height: 100%;
    width: 100%;
    padding: 1em 14%;
    overflow: hidden;
    z-index: 1;
}

/* Background flouté */
.swiper-scrolling .wrapper-scrolling.last-slide .player-infos.has-blur-bg::before {
    content: "";
    position: absolute;
    inset: -20px; /* évite les bords flous visibles */
    background-image: var(--bg-url);
    background-size: cover;
    background-position: center;
    filter: blur(0.4em);
    transform: scale(1.1); /* évite les artefacts */
    z-index: -1;
}

/* Overlay violet au-dessus du blur */
.swiper-scrolling .wrapper-scrolling.last-slide .player-infos.has-blur-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(var(--violet-darker-rgb), 0.3);
    z-index: -1;
}

.swiper-scrolling .wrapper-scrolling.last-slide .player-infos .user-avatar {
    box-shadow: 0px 0px 2em var(--noir);
}

/*********************************
 * 
 *  Single Gift
 * 
 * ***********************************/
.container-single-gift{
    flex-grow: 1;
    position: relative;
	height: 100vh;
	height: 100svh;
	height: 100dvh;
}
.swiper-scrolling .gift-slide {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.swiper-scrolling .gift-slide .plyr--img {
    height: auto;
    max-height: 100vh;
	max-height: 100svh;
	max-height: 100dvh;
}


/*********************************
 * 
 *  User Account
 * 
 * ***********************************/
.user-account-avatar{
    position: relative;
}
.user-account-avatar .picto{
    position: absolute;
    z-index: 1;
    left: 0;
    bottom: 0;
    padding: 0.3em;
    border-radius: 50%;
    width: 2em;
    height: 2em;
    background-color:#3F0A5E;
    display: flex;
    align-items: center;
    justify-content: center;
}
.change-avatar a:hover{
    opacity: 0.8;
}

.wrapper-stats{
    grid-template-columns: 3.75em 11em 3.75em;
}

/*Jauge */

.jauge{
    margin: 0;
    position: relative;

    background-color: #EEBBFF;
    width: 100%;
    height: 0.9em;
    border-radius: 1em;

}
.jauge div{
    position: relative;
    width: 0%;
    height: 100%;
    border-radius: 1em;
    background: var(--rose-1);
    box-shadow: 0px 0px 6px var(--rose-1);

    transition: width .3s ease-in-out;
}
.jauge div:before{
    content: attr(data-percent);
    position: absolute;
    right: -1em;
    top: 116%;
    display: block;
    font-size: 0.625em;
}

/*********************************
 * 
 *  Box Generic
 * 
 * ***********************************/
.box-generic {
    padding: 1.3em 2em;
    background: linear-gradient(230deg, var(--violet-darkest) -2%, var(--violet-1) 102%);
    position: relative;
    border-radius: var(--border-radius-akn-medium);
    width: 100%;
    max-width: var(--container-md);
}
.box-generic.box-vip-choice {
    padding: 0.8em 1.1em;
    background: linear-gradient(270deg, #1D012C -2%, #FB9D01 102%);
    border-radius: var(--border-radius-akn-small);
    cursor: pointer;
}
.box-generic.box-vip,
.box-generic.box-vip-choice:hover,
.box-generic.box-vip-choice:active,
.box-generic.box-vip-choice.active  {
    box-shadow:  inset 0 0 0 2px var(--gold);
}


/*********************************
 * 
 *  Become VIP
 * 
 * ***********************************/

.promo-banner{
    padding-top: 1em;
    padding-bottom: 1em;
    background:  linear-gradient(90deg, var(--rose-1) 0%, var(--violet-dark) 100%);
}


/*********************************
 * 
 *  Payment VIP
 * 
 * ***********************************/
.payment #page{
    justify-content: center;
}

/*********************************
 * 
 *  Ranking
 * 
 * ***********************************/

.wrapper-ranking .ranking-avatar {
    position: relative;
}
.wrapper-ranking .ranking-avatar img {
    position: relative;
    z-index: 1;
}
.wrapper-ranking .ranking-avatar .picto {
    position: absolute;
    z-index: 5;
    left: 0;
    bottom: 0;
    border-radius: 50%;
    background-color: #C371D7;
    display: flex;
    align-items: center;
    justify-content: center;

    width: 1.7em;
    height: 1.7em;
    font-size:1.25em ;
    font-weight: 900;
    border: 3px solid var(--violet-darker);
}
.wrapper-ranking .ranking-avatar .crown-rank {
    position: absolute;
    width: 2.5em;
    aspect-ratio: 90/69;
    bottom: 86%;
    right:0;
    background-size: contain;
    display: none;
    z-index: 1;
    transform: rotate(25deg);
    background-position: center bottom;
    background-repeat: no-repeat;
}
@supports not (aspect-ratio: 1 / 1) {
  .wrapper-ranking .ranking-avatar .crown-rank {
    height: 0;
    padding-top: calc(69 / 90 * 100%);
  }
}
.wrapper-ranking:nth-child(1) .ranking-avatar .crown-rank {
    display: block;
    background-image: url(../img/icons/crown-gold.svg);
}
.wrapper-ranking:nth-child(1) .ranking-avatar .picto {
    background-color: #FFD400;
}
.wrapper-ranking:nth-child(2) .ranking-avatar .crown-rank {
    display: block;
    background-image: url(../img/icons/crown-silver.svg);
}
.wrapper-ranking:nth-child(2) .ranking-avatar .picto {
    background-color: #B3B3B3;
}
.wrapper-ranking:nth-child(3) .ranking-avatar .crown-rank {
    display: block;
    background-image: url(../img/icons/crown-copper.svg);
}
.wrapper-ranking:nth-child(3) .ranking-avatar .picto {
    background-color: #DF865A;
}



/* ***********

PUBS

************ */

.wrapper-pub-landscape{
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 24.25em;
}
.wrapper-pub-btn{
    position: absolute;
    left: 1em;
    top: 1em;
}

.library-tags,.single-model {
    .model-pub img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
    .boobycam-listing-badge{
        position: absolute;
        bottom: 10px;
        left: 50%;
        transform: translateX(-50%);
    }
    .boobycam-listing-live{
        color: #00F908;
    }
}



/* ***********

RECAPTCHA

************ */
.grecaptcha-badge {
  visibility: hidden !important;
}