@charset "utf-8";

/*
 * ITC Multiplier 2026 Contentful Update
 * CCP v2.0.3
 * 2026.06.02
 *
 * Gaming/Sports
 *
 * Production Code
 */

/*
Version
*/
.CustomContentPodContentWrapper
{
    --version: 2.0.3 (2026.06.02);
}

/*
Colours
*/
.CustomContentPodContentWrapper
{
    --system-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    --preload-outer: hsla(161, 100%, 58%, 0.25);
    --bet365-green: hsl(161, 100%, 58%);
    --main-text-color: #fff;
    --bet365-white: #fff;
    --button-hover: #fff;
    --button-text-colour: #222;
    --legal-colour: #999;
    --back-prog-bar-colour: #444;
    --current-colour: #fff;
    --next-colour: #28ffbb;
    --general-text-colour: #999;
    --prog-fill: #28ffbb;
    --column-count: 1;
    --use-border: 0;
}

/*
Global positioning and sizes
*/
.CustomContentPodContentWrapper
{
    position: relative;
    max-width: 1450px;
    margin: 0 auto 25px;
}

.__CCPContentWrapper img
{
    display: block;
    margin: 0;
}


/*
 ** CCP rules begin **
 */
.__CCPContentWrapper
{
    position: relative;
    overflow: hidden;
    width: 100%;
    margin: auto;
}

/*
 * Preloader; retain at bottom of file
 */
.__CCPContentWrapper.preloading
{
    visibility: hidden;
}

.CCP_PreloadOverlay
{
    display: flex;
    position: absolute;
    width: 100%;
    top: 0;
    z-index: 1;
    justify-content: center;
    align-items: center;
}

.CCP_PreloadOverlay > .bar-outer
{
    position: relative;
    width: 50%;
    max-width: 350px;
    height: 4px;
    margin-top: -2px;
    border-radius: 4px;
    background-color: var(--preload-outer);
}

.CCP_PreloadOverlay .bar-inner
{
    width: 0;
    height: 100%;
    margin: 0;
    border-radius: inherit;
    background-color: var(--bet365-green);
    transition: width 350ms ease-out;
}

.CCP_PreloadOverlay .bar-number
{
    margin-top: 5px;
    text-align: right;
    font: 10px var(--system-font);
    line-height: 1;
    color: var(--bet365-green);
}

/*
Global positioning and sizes
*/
.CustomContentPodContentWrapper {
    position: relative;
    z-index: 3;
}

.__CCPContentWrapper img {
    display: block;
    margin: 0;
}

/*
 ** CCP rules begin **
 */
.__CCPContentWrapper {
    --tick-length: 43.84;
    position: relative;
    max-width: 1024px;
    font-family: FuturaPTWebBook;
}

.CCP_PromoContent {
    overflow:hidden;
    transition: height 750ms ease-out, opacity 350ms ease-out;
    height: auto;
    margin: 0 auto;
    width: auto;
}

.CCP_PromoContent p {
    margin: 0 auto;
    font-family: FuturaPTWebBook;
    font-size: 18px;
    line-height: 1.4;
    color: var(--general-text-colour);
}

.CCP_PromoContent img {
    width: 15px;
    height: 15px;
    margin: auto;
}

/* Progress SVGs */
.CCP_SVGBox {
    display: grid;
    align-items: center;
    justify-content: center;
    grid-row: 2;
    grid-column: 1;
    width: 120px;
    margin: auto;
}

.CCP_SVGBox > * {
    width: 100%;
    grid-column: 1;
    grid-row: 1;
}

.CCP_SVGBox circle,
.CCP_SVGBox polyline {
    fill: none;
    stroke: #fff;
    stroke-width: 4;
}

.CCP_SVGBox circle {
    fill: none;
    stroke-width: 6;
    stroke-dasharray: var(--circumference);
}

.CCP_SVGBox circle.progress-backing {
    stroke: #99ffdf8f;
}

.CCP_SVGBox circle.progress-fill {
    stroke: var(--prog-fill);
    stroke-dashoffset: var(--circumference);
}

.CCP_SVGBox > .progress-text {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: FuturaPTDemi;
    line-height: 1;
    letter-spacing: -.035em;
    color: #eee;
    flex-direction: column;
    gap: 0.25em;
    font-size: 18px;
    word-wrap: break-word;
    width: 60%;
    margin: 0 auto;
}

.CCP_SVGBox > .progress-text > :nth-child(2) {
	padding: 0.35em 0.5em 0;
	border-top: 1px solid #aaa;
}

.CCP_SVGBox polyline.tick-mark {
    stroke-dasharray: var(--tick-length);
}

.CCP_Anim-SVGTickDraw polyline {
    animation: CCP_KF-SVGTickDraw 200ms 850ms ease-out backwards;
}

@keyframes CCP_KF-SVGTickDraw
{
    from {
        stroke-dashoffset: var(--tick-length);
    }

    to {
        stroke-dashoffset: 0;
    }
}

/* Counter Builder Styling */
section.CCP_Panel_Builder {
    position: relative;
    display: grid;
    margin: 0 auto;
}

section.CCP_Constructor_Container {
    position: relative;
    display: grid;
    grid-auto-flow: row;
    min-width: 45%;
    grid-template-columns: repeat(var(--column-count), minmax(200px, 1fr));
    margin: 0 auto 20px;
    gap: 20px;
}

.CCP_Constructor_Container > section {
    position: relative;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    display: grid;
    gap: 20px;
}

.CCP_Panel_Builder .CCP_Instruct {
    margin: 0 auto 20px;
    text-align: center;
    max-width: 70%;
}

.CCP_Panel_Builder * h2 {
    color: var(--current-colour);
    font-size: 20px;
    font-family: 'FuturaPTWebBook';
    letter-spacing: 0.5px;
}

.CCP_Panel_Builder * h2 span,
.CCP_Panel_Builder * p span {
    color: var(--next-colour);
    font-weight: bolder;
}

.CCP_Panel_Builder * h2.CCP_Curr_Pool {
    color: var(--bet365-green);
}

.CCP_Panel_Builder h2.CCP_Multi_Icon {
    position: absolute;
    top: 17.5%;
    right: 20%;
    -webkit-text-stroke-width: 1.5px;
    font-size: 30px;
    letter-spacing: 4px;
    background: radial-gradient(#222, transparent 70%);
    border-radius: 50%;
}

.CCP_Panel_Builder > section > h2:first-of-type {
    grid-row: 1 / 2;
}

.CCP_Panel_Builder * p {
    color: var(--current-colour);
    font-size: 20px;
    font-family: 'FuturaPTWebBook';
    letter-spacing: 0.5px;
}

p.CCP-Prize-Text {
    grid-row: 3;
}

/* StaticText Styling*/
section.CCP_Pre_Promo.CCP_Static_Text {
    padding-bottom: 10px;
}

section.CCP_Static_Text {
    position: relative;
    width: 70%;
    display: grid;
    margin: 0 auto;
    gap: 10px;
    text-align: center;
}

/* Button Styling */
.CCP_Button_Wrapper {
    padding-bottom: 20px;
    width: 90%;
    margin: 0 auto;
    text-align: center;
}

.CCP.Button:hover {
    background-color: var(--button-hover)
}

.CCP_Button_Wrapper.hidden {
    opacity: 0;
}

.CCP_Button {
    min-width: 150px;
    font: 20px FuturaPTDemi;
    text-align: center;
    color: var(--button-text-colour);
    background-color: var(--bet365-green);
    width: 40%;
    max-width: 150px;
    font-size: 18px;
    height: 34px;
    line-height: 32px;
    border-radius: 10em;
    letter-spacing: -.025em;
    border: none;
    outline: none;
    cursor: pointer;
    margin: 0 auto;
}

.CCP_Button_Wrapper p {
    color: var(--bet365-white);
    padding-bottom: 10px;
    font: 16px FuturaPTWebBook;
    margin: 0;
}

/* Text Styling */
.CCP_PromoContent h1 {
    margin: 0 auto 20px;
    font-family: FuturaPTDemi;
    font-weight: normal;
    font-size: 40px;
    line-height: 45px;
    letter-spacing: -1.5px;
    color: #fff;
}

.CCP_PromoContent h2 {
    margin: 0 auto;
    font-family: FuturaPTWebBook;
    font-weight: normal;
    font-size: 20px;
    color: #fff;
    line-height: 1.4;
    display: flex;
    gap: 5px;
}

.CCP_Legal {
    color: var(--legal-colour);
    font: 10px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    line-height: 1;
    text-align: center;
    margin: 10px auto 0;
}

/* Styling for Max prize reached */
.CCP_PromoContent .hidden, .CCP_PromoContent.hidden {
    opacity: 0;
    pointer-events: none;
}

.CCP_Confirm_Group {
    text-align: center;
    padding: 0 0 20px;
    width: 23%;
    margin: 0 auto;
}

.CCP_OptinConfirm {
    position: relative;
    display: grid;
    width: 100%;
    left: 50%;
    margin-left: -50%;
    text-align: center;
    margin-bottom: 10px;
    gap: 6px;
}

.CCP_OptinConfirm > p {white-space: nowrap;max-width: 180px;grid-column: 1;margin: 0 auto;}

.CCP_Confirm_Group svg .tickTick,
.CCP_Confirm_Group svg .tickRing {
    fill: none;
    stroke: var(--bet365-green);
    stroke-width: 4;
}

.CCP_Confirm_Group > p {
    padding: 0;
    margin: 0 auto;
    width: 80%;
}

.tick-mark.CCP_Anim-TickRing.CCP_Anim-TickTick {
    width: 20px;
    height: 20px;
    margin: auto;
    grid-column: 2;
}

.CCP_Anim-TickRing svg .tickRing {
    stroke-dashoffset: 182.21;
}

.CCP_Anim-TickTick svg .tickTick {
    stroke-dashoffset: 43.84;
}

@keyframes CCP_KF-SVGLineDraw {
    to {
        stroke-dashoffset: 0;
    }
}

/* Table styling */
.CCP_Table * td {
    margin: auto;
    padding: 5px;
    box-sizing: border-box;
    align-content: baseline;
    font-size: 12px;
}

.CCP_Table {
    color: var(--current-colour);
    overflow: visible;
    width: 100%;
    height: fit-content;
}

.CCP_Table tr {
    position: relative;
    width: auto;
    border: none;
    display: block;
    overflow: visible;
    border-bottom: 1px solid #444;
}

.CCP_Table > table {
    width: fit-content;
    table-layout: auto;
    margin: 0 auto;
    border-collapse: collapse;
}

.CCP_Table td:nth-of-type(1) {
    text-align: center;
    min-width: 100px;
    border-right: 1px solid var(--back-prog-bar-colour);
}

.CCP_Table td:nth-of-type(2) {
    text-align: center;
    min-width: 80px;
}

.CCP_Table th {
    font-size: 14px;
    font-weight: normal;
    white-space: wrap;
    box-sizing: border-box;
    padding: 0 10px 10px;
    min-width: 100px;
}

.CCP_Table tr.CCP_Current {
    font-weight: bold;
    color: var(--bet365-green);
    transition: color 1s;
}

div.CCP_Current {
    position: absolute;
    mix-blend-mode: color;
    width: 100%;
    height: 30px;
    left: 0;
    top: 30%;
    z-index: 2;
    transition: top 500ms linear;
}

tr.CCP_Tier_Data:has(~ .CCP_Current) {
    color: var(--general-text-colour);
}

/* SVG Animations */
.CCP_Anim-TickRing svg .tickRing {
    stroke-dasharray: 182.21;
    stroke-dashoffset: 182.21;
    animation: CCP_KF-SVGLineDraw 350ms 350ms ease-in-out forwards;
}

.CCP_Anim-TickTick svg .tickTick {
    stroke-dasharray: 43.84;
    stroke-dashoffset: 43.84;
    animation: CCP_KF-SVGLineDraw 350ms 850ms ease-out forwards;
}

.CCP_PromoContent .progress.maxed div.Final_Anim-Ring svg .tickRing {
    stroke-dashoffset: 182.21;
    animation: CCP_KF-SVGLineDraw 350ms 2s ease-in-out forwards;
}

.CCP_PromoContent .progress.maxed div.Final_Anim-Ring svg .tickTick {
    stroke-dashoffset: 43.84;
    animation: CCP_KF-SVGLineDraw 350ms 2.35s ease-out forwards;
}

.CCP_Trans-Opacity {
    opacity: 0;
    pointer-events: none;
}

.CCP_Motion-GenericFade {
    -webkit-transition: opacity 650ms linear;
    transition: opacity 650ms linear;
}

.CCP_Panel_Builder.Results * p.CCP_Combined_CounterPrize {
    margin-bottom: 10px;
}

@keyframes CCP_KF-SVGLineDraw {
    to {
        stroke-dashoffset: 0;
    }
}

/* Media Queries */

@media screen and (max-width: 955px) {
    section.CCP_Constructor_Container {
        grid-template-columns: repeat(var(--column-count), minmax(200px, 1fr));
        gap: 20px;
    }

    p.CCP_Combined_CounterPrize {
        font-size: 20px;
    }

    .CCP_Panel_Builder .CCP_Instruct {
        max-width: 90%;
    }

    .CCP_Confirm_Group {
        width: 29%
    }
}

@media screen and (max-width: 649px) {
    section.CCP_Constructor_Container {
        width: 70%;
    }

    .CCP_Constructor_Container > section:nth-of-type(3), .CCP_Constructor_Container > section:nth-of-type(4) {
        padding-top: 10px;
    }

    .CCP_Confirm_Group {
        width: 40%
    }
}

@media screen and (max-width: 599px) {
    section.CCP_Constructor_Container {
        width: 80%;
    }

    section.CCP_Constructor_Container {
        grid-template-columns: repeat(var(--column-count), minmax(150px, 1fr));
    }

    .CCP_PromoContent h2 {
        font-size: 18px;
    }

    .CCP_PromoContent p {
        font-size: 14px;
    }

    p.CCP_Combined_CounterPrize {
        font-size: 24px
    }

    .CCP_Constructor_Container > section:nth-of-type(1), .CCP_Constructor_Container > section:nth-of-type(2) {
        padding-bottom: 10px;
    }
    
    .CCP_Table * {
        width: 70%;
    }

    .CCP_Table th {
        min-width: 40px;
        max-width: 90px;
        padding: 10px 0;
    }

    .CCP_Table td:nth-of-type(1) {
        min-width: 90px;
    }

    .CCP_Table td {
        font-size: 10px;
    }

    .CCP_Table td:nth-of-type(2) {
        min-width: 60px;
    }

    p.CCP-Prize-Text, .CCP_SVGBox > .progress-text {
        font-size: 20px;
    }

    .CCP.Button {
        font-size: 16px;
    }
}

@media screen and (max-width: 480px) {
    section.CCP_Constructor_Container {
        grid-template-columns: repeat(var(--column-count), minmax(80px, 1fr));
        gap: 20px;
        width: 90%;
    }

    .CCP_Confirm_Group {
        width: 45%
    }

    .CCP_Constructor_Container > section:nth-of-type(1), .CCP_Constructor_Container > section:nth-of-type(2), .CCP_Constructor_Container > section:nth-of-type(3)  {
        padding-bottom: 20px;
        border-bottom: 1px solid var(--use-border);
    }
}

@media screen and (max-width: 399px) {
    section.CCP_Constructor_Container {
        grid-template-columns: repeat(1, minmax(150px, 1fr));
        gap: 10px;
    }

    .CCP_Table th {
        min-width: 60px;
        max-width: 100px;
    }

    .CCP_Table td:nth-of-type(1) {
        min-width: 120px;
    }

    .CCP_Table td {
        font-size: 12px;
    }

    .CCP_Table td:nth-of-type(2) {
        min-width: 100px;
    }

    p.CCP-Prize-Text, .CCP_SVGBox > .progress-text {
        font-size: 24px;
    }

    .CCP_Confirm_Group {
        width: 50%
    }
}

@media screen and (max-width: 320px) {
    .CCP_Confirm_Group {
        width: 60%;
    }
}