@media screen and ( max-width: 767px ) {

    /* Billet Display */

    .billet {
        flex-direction: column;
    }

    .billet-item .billet-center {
        row-gap: 1rem;
    }  

    .billet-item .billet-title {
        flex-wrap: wrap;
        row-gap: 1rem;
    }

    .billet-list-part.legal-column:not( .billet-list-part.legal-column:not( .legal-default ) + .billet-list-part.legal-default.legal-column ) {
        flex-direction: column;
        flex-basis: 100%;
    }

    .billet-list-part.legal-column:not( .legal-default ) + .billet-list-part.legal-default.legal-column {
        column-gap: 1.5rem;
        order: 0;
    }

    .billet-list-part.legal-column:not( .billet-list-part.legal-column:not( .legal-default ) + .billet-list-part.legal-default.legal-column ) {
        order: 1;
    }

    /* Billet Position */

    .billet-center {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }

    .billet-item .billet .billet-main,
    .billet-item .billet .billet-bonus {
        padding: var( --Spacing-07 ) 1.25rem;
    }

    .billet-right .bonus-title ~ .bonus-button {
        margin-top: var( --Spacing-09 );
    }

    .billet-right .bonus-button:not( .bonus-title ~ .bonus-button ) {
        margin-top: 0rem;
    }

    /* Billet Width and Height */
   
    .billet-center {
        min-height: calc( var( --Spacing-12 ) + ( var( --Spacing-07 ) * 2 ) );
    }

    .billet-item .legal-logo {  
        width: var( --Spacing-12 );
        height: var( --Spacing-12 );
    }

    .billet .title-data {
        width: calc( 100% - var( --Spacing-12 ) - 0.75rem );
    } 

    .billet .bonus-mobile-item::before {
        width: 1.5rem;
        height: 1.5rem;
    }

    /* Billet Background */

    .billet-left {
        border-radius: 1.25rem 1.25rem 0rem 0rem;
    }

    .billet-right {
        border-radius: 0rem 0rem 1.5rem 1.5rem;
    }

    .billet-item .billet .billet-main {
        border-bottom: var( --base-border-billet ); 
    }

    /* Billet Typography */

    .billet-list-part .billet-list-part-item {
        font-size: 0.875rem;
        line-height: 1.25rem;
    }

    .billet-item .billet-description-full ul li {
        font-size: 0.875rem;
        line-height: 1.25rem;
    }

}

@media screen and ( min-width: 768px ) {

     /* Billet Display */

    .billet-item .billet-center {
        row-gap: var( --Spacing-06 );
    }    

    .billet-list-part.legal-column {
        flex-direction: column;
    }

    /* Billet Width and Height */
    .home .billet-item {
        width: 100%;
    }

    .billet-left,
    .billet-center,
    .billet-right {
        min-height: calc( 4.375rem + 1.125rem + 5.5rem + ( 1.75rem * 2 ) );
    }

    .billet-left {
        width: calc( 22% - 1.25rem );
    }

    .billet-item .billet-bonus
    {
        width: calc( 100% / 3 );
    }

    .billet-item .billet-main
    {
        width: calc( 100% / 3 * 2 );
    }

    .billet-item .legal-logo {  
        width: 4.375rem;
        height: 4.375rem;
    }

    .billet .bonus-mobile-item::before {
        width: 1.75rem;
        height: 1.75rem;
    }

    .billet .billet-list-part:not( .legal-default )
    {
        flex-basis: calc( 100% / 3 * 2 - 0.875rem );
        flex-grow: 1;
    }

    .billet-list-part:not( .legal-default ) + .billet-list-part.legal-default.legal-column
    { 
        flex-basis: calc( 100% / 3 - 0.875rem );
    }

    .billet-list-part.legal-default.legal-column:nth-child( 2 ),
    .billet-list-part.legal-default.legal-column + .billet-list-part.legal-default.legal-column {
        flex-basis: calc( 50% - ( 1.75rem / 2 ) );
    }

    /* Position */

    .billet-item .billet .billet-main {
        padding: 1.75rem;
    }

    .billet-title .legal-review,
    .billet-title .billet-title-rating {
        margin-top: 0.25rem;
    }

    .billet .bonus-mobile {
        margin-left: auto;
    }

    .billet-item .billet .billet-bonus {
        padding: 1.75rem 1.5rem;
    }

    .billet-right .bonus-button {
        margin-top: auto;
    }

    /* Billet Background */

    .billet-left {
        border-radius: 1.25rem 0rem 0rem 1.25rem;
    }

    .billet-right {
        border-radius: 0rem 1.5rem 1.5rem 0rem;
    }

    .billet-item .billet .billet-main {
        border-right: var( --base-border-billet ); 
    }

    /* Billet Typography */

    .billet-list-part .billet-list-part-item {
        font-size: 1rem;
        line-height: 1.375rem;
    }

    .billet-item .billet-description-full ul li {
        font-size: 1rem;
        line-height: 1.375rem;
    }

}

/* Body */
body {
    background-color: #EDEFF4;
}

/* Display */

.billet {
    display: flex;
    flex-wrap: wrap;
}

.billet-left {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
}

.billet-left a {
    display: block;
    width: fit-content;
}

.billet-left .legal-review {
    display: block;
}

.billet-center {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    column-gap: 28px;
}

.billet-item .billet-title {
    display: flex;
    column-gap: 0.75rem;
}

.billet-item .legal-logo {
    display: flex;
    justify-content: center;
    align-items: center;
}

.billet .title-data {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    align-content: flex-start;
    column-gap: 0.875rem;
}

.billet .title-data-group {
    display: flex;
    column-gap: 0.5rem;
}

.billet-title .billet-title-rating {
    display: flex;
    column-gap: 0.25rem;
    align-items: center;
}

.billet-list-part {
    display: flex;
    row-gap: 0.5rem;
}

.billet-list-part.legal-row {
    flex-direction: column;
}

.billet-list-part:not( .legal-default.legal-row ) .billet-list-part-item {
    display: flex;
    column-gap: 0.5rem;
}

.billet-right {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

.billet-right .legal-play {
    display: flex;
    align-items: center;
    justify-content: center;
}

.billet-spoiler:not( .legal-active ) {
    display: none;
}

.billet-right .bonus-spoiler {
    cursor: pointer;
}

.billet-right .bonus-spoiler.legal-active .spoiler-open,
.billet-right .bonus-spoiler:not( .legal-active ) .spoiler-close {
    display: none;
}

.billet .legal-disabled {
    pointer-events: none;
}

.billet div.check-oops:not( .legal-disabled ) {
    cursor: pointer;
}

.billet .bonus-mobile {
    display: flex;
    column-gap: 8px;
}

.billet .bonus-mobile-item::before {
    display: flex;
    justify-content: center;
    align-items: center;
}

.billet-item .billet-footer {
    display: flex;
}

.billet-item .billet-footer.legal-active {
    flex-wrap: wrap;
}

/* Background */

.billet-item .billet
{
    border-radius: 1.5rem;
    border: var( --base-border-billet );
    background-color: var( --Base-base-01 );
}

.billet-item .billet-bonus
{
    background-color: var( --Primitives-purple-20 );
}

.billet-item .legal-logo {
    border: 1px solid var( --Base-base-09 );
    border-radius: 12.8px;
    overflow: hidden;
    background-color: var( --Logo-background );
}

.billet-title .billet-title-achivement {
    background-position: left 8px center;
    background-repeat: no-repeat;
    background-size: auto;
    border-radius: 50px;
    background-color: var( --Base-base-01 );
    border: 1px solid var( --Base-base-09 ); 
}

.billet-list-part .billet-list-part-item {
    background-repeat: no-repeat;
}

.billet-list-part.legal-close .billet-list-part-item {
    background-image: url('/wp-content/themes/thrive-theme-child/assets/img/billet/list/billet-list-close.svg');
}

.billet-list-part.legal-triangle .billet-list-part-item {
    background-image: url('/wp-content/themes/thrive-theme-child/assets/img/billet/list/billet-list-triangle.svg');
}

.billet-right .legal-play {
    background-color: var( --Base-purple_button );
    border-radius: 60px;
}

.billet-right .legal-play:hover {
    background-color: var( --Base-purple_button_hover );
}

.billet-right .bonus-spoiler {
    background-position: right center;
    background-repeat: no-repeat;
    background-size: auto;
}

.billet-right .bonus-spoiler:not( .legal-active ) {
    background-image: url( '/wp-content/themes/thrive-theme-child/assets/img/billet/billet-spoiler-open.svg' );
}

.billet-right .bonus-spoiler.legal-active {
    background-image: url( '/wp-content/themes/thrive-theme-child/assets/img/billet/billet-spoiler-close.svg' );
}

.billet-left .legal-review {
    border-bottom: 1px solid transparent;
}

.billet-left .legal-review:hover {
    border-bottom: 1px solid #FFFFFF;
}

.billet-left .billet-order {
    clip-path: polygon(100% 0%, 100% 100%, 50% 90%, 0% 100%, 0% 0%);
    background-color: rgb(89, 151, 227);
}

.billet .bonus-mobile-item::before {
    border-radius: 50%;
    border: 1px solid var(--Base-base-09); 
}

.billet .legal-iphone::before {
    content: '\F112';
}

.billet .legal-android::before {
    content: '\F111';
}

.billet .legal-site::before {
    content: '\F113';
}

.billet .billet-license {
    background-image: url( '../../img/billet/billet-license-no.svg' );
    background-position: top center;
    background-repeat: no-repeat;
    background-size: auto;
}

.billet-item {
    --base-border-billet: 1px solid var(--Base-base-09, #0A0A0A);
    border-radius: 1.5rem;
}

.billet-item .billet .billet-main,
.billet-item .billet .billet-bonus,
.billet-item .billet-footer
{
    box-sizing: border-box;
}

/* Width and Height */

.billet-item .legal-logo {
    box-sizing: border-box;
    flex-shrink: 0;
}

.billet-item .legal-logo img {  
    width: 100%;
    height: auto; 
}

.billet-right .bonus-button {
    width: 100%;
}

.billet-right .legal-play {
    min-height: calc( 50px - (10px * 2) );
}

.billet-right .bonus-title,
.billet-right .bonus-description {
    width: 100%;
}

.billet-spoiler {
    width: 100%;
}

.billet-title {
    width: 100%;
}

.billet .title-data-group,
.billet .billet-title-warning {
    width: 100%;
}

.billet .bonus-mobile-item {
    height: fit-content;
}

/* Position */

.billet-item {
    margin-bottom: 1.5rem;
}

.billet-center,
.billet-right {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
}

.billet-item .billet-footer
{
    margin-top: -1.5rem;
}

.billet-item .billet-footer {
    padding-top: var( --Spacing-09 );
    padding-bottom: var( --Spacing-04 );
    
}

.billet-title h3 {
    margin: 0rem;
}

.billet-title .billet-title-achivement {
    padding-top: 5px;
    padding-right: 0.875rem;
    padding-bottom: 5px;
    padding-left: calc(8px + 1.125rem + 4px);
    position: absolute;
    top: calc(0px - (30px / 2));
}

.billet-left .billet-order {
    position: absolute;
    top: 0rem;
    left: 1.25rem;
    padding: 8px 5px;
}

.billet-left {
    position: relative;
}

.billet-right .bonus-description {
    margin-top: var( --Spacing-05 );
    margin-bottom: 0.5rem;
}

.billet-right .legal-play {
    padding: 0.625rem 1.125rem;
}

.billet-right .bonus-spoiler {
    padding-right: 1.375rem;
}

.billet .billet-license {
    padding-top: 2.8125rem;
}

.billet-item .billet
{
    position: relative;
}

.billet-item .billet-description-full ul {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    padding-left: 0rem;
    margin-top: 0rem;
    margin-bottom: 0rem;
}

.billet-item .billet-description-full ul li {
    position: relative;
    padding-left: calc( 1.5rem + 0.75rem );
}

.billet-item .billet-description-full ul li:not( :last-child ) {
    padding-bottom: 1.5rem;
}

.billet-item .billet-description-full ul li::before {
    position: absolute;
    left: 0rem;
}

.billet-item .billet-footer p {
    margin-top: 0rem;
    margin-bottom: 0rem;
}

/* Billet Typography */

.billet-left .legal-review.legal-black {
    color: var(--Base-base-09);
}

.billet-left .legal-review:not( .legal-black ) {
    color: #FFFFFF;
}

.billet-item {
    font-family: var( --legal-font-primary );
    font-style: normal;
}

.billet-left .legal-review {
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
    text-transform: uppercase;
    text-decoration: none;
}

.billet-center .legal-title,
.billet-center .billet-order,
.billet-title .billet-title-rating,
.billet-title .billet-title-achivement,
.billet-list-part:not( .legal-minus ) .billet-list-part-item {
    color: var(--Base-base-09);
    font-style: normal;
}

.billet-center .legal-title,
.billet-center .billet-order {
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.5rem;
    text-decoration: none;
}

.billet-title .billet-title-rating {
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 1.25rem;
}

.billet-title .billet-title-rating::before,
.billet-list-part:not( .legal-default ) .billet-list-part-item::before {
    font-family: var(--legal-font-icons);
    line-height: 1.5rem;
    font-size: 1.5rem;
}

.billet-title .billet-title-rating::before {
    content: '\F110';
}

.billet-list-part.legal-check .billet-list-part-item::before {
    content: '\F107';
}

.billet-list-part.legal-plus .billet-list-part-item::before {
    content: '\F107';
}

.billet-list-part.legal-minus .billet-list-part-item::before {
    content: '\F10E';
    color: var(--Base-base-05);
}

.billet-list-part.legal-check-round .billet-list-part-item::before {
    content: '\F107';
}

.billet-title .billet-title-achivement {
    font-style: normal;
    font-weight: 600;
}

.billet .bonus-mobile-item {
    text-decoration: none;
}

.billet .bonus-mobile-item::before {
    font-family: var( --legal-font-icons );
    font-size: 1.125rem;
    line-height: 1.125rem;
    color: var(--Base-base-09);
}

/* .billet .bonus-mobile-item:hover.bonus-mobile-item::before {
    color: var(--Base-base-07);
    font-weight: 600;
} */

.billet-title .legal-review {
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    color: var( --Base-link );
}

.billet-title .legal-review:hover {
    color: var( --Base-link-hover );
}

.billet .billet-title-warning {
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.125rem;
    color: var( --Base-base-05 ); 
}

.billet .billet-title-warning::after {
    content: attr( data-warning );
}

.billet-title .billet-title-achivement {
    font-size: 0.75rem;
    line-height: 1.125rem;
}

.billet-list-part:not( .legal-default ) .billet-list-part-item {
    font-weight: 400;
}

.billet-list-part.legal-default .billet-list-part-item {
    font-weight: 400;
}

.billet-right .bonus-title {
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1.625rem;
}

.billet-right .legal-bonus,
.billet-right .legal-bonus:hover,
.billet-right .legal-bonus:active,
.billet-right .legal-bonus:visited {
    color: var( --Base-base-09 );
    text-decoration: none;
}

.billet-right .bonus-description {
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: 24.5px;
}

.billet-right .legal-play {
    font-style: normal;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.375rem;
    text-decoration: none;
    text-align: center;
    color: var(--Base-base-01);
}

.billet-item .billet-description-full ul {
    list-style: none;
}

.billet-item .billet-description-full ul li::before {
    content: '\F107';
    font-family: var(--legal-font-icons);
    font-size: 1.5rem;
    line-height: 1.5rem;
}

.billet-item .billet-footer-control:not( .legal-active ) {
    white-space: nowrap;
    cursor: pointer;
    color: var(--Base-base-08); 
}

.billet-item .billet-footer-control:not( .legal-active ):hover {
    text-shadow: 0 0 0.35px var(--Base-base-09);
}

.billet-item .billet-footer:not( .legal-short-tnc ):not( .legal-active ) .billet-footer-control:before {
    content: attr( data-default );
}

.billet-right .bonus-spoiler {
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 600;
    line-height: 28px;
}

.billet-left .billet-order {
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    color: rgb(255, 255, 255);
}

.billet .profit-label,
.billet .profit-value {
    font-size: 1rem;
    font-style: normal;
    line-height: 28px;
    color: rgb(59, 59, 59);
}

.billet .profit-label {
    font-weight: 400;
}

.billet .profit-value {
    font-weight: 600;
}

.billet-item .billet-footer {
    color: var( --Base-base-05 );
    font-style: normal;
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.125rem;
}

.billet-item .billet-footer:not(.legal-active) p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.billet .billet-license .billet-license-label {
    color: rgb(59, 59, 59);
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: normal;
    line-height: 22.5px;
}

.billet-item .footer-tnc-info::after {
	content: attr( data-text );
}

.billet-item .footer-tnc-link {
    color: var( --Base-base-05 );
}

.billet-item .footer-tnc-link[href=""] {
    pointer-events: none;
}