@font-face {
     font-family: Gilroy-ExtraBold;
     src: url("Gilroy-ExtraBold.ttf");
}
@font-face {
     font-family: Gilroy-Medium;
     src: url("Gilroy-Medium.otf");
}
@font-face {
     font-family: Gilroy-Regular;
     src: url("Gilroy-Regular.otf");
}

#imageOnlyContent {
    position:absolute;
    top:0px;
    left:0px;
    width:728px;
    height:90px;    
}
/* CSS Attrib */
#legalContent.macFirefox{margin-top: -1px;}
#legalContent.winFirefox{margin-top: -1px;}

/* Main background */
#bgContent{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:#944d53;
}


/* Panel Container */
#panelContainer{
    position:absolute;
    top: 9px;
    left: 220px;
    width: 300px;
    height: 89px;
}
#panelContent{
    position:absolute;
    top: 25px;
    left: 9px;
    width: 268px;
    height: 25px;
}

/* Show Container */
#showContainer{
    position:absolute;
    top:0;
    left:0;
    width:425px;
    height:90px;
}
#showListContent{
    position:absolute;
    top:0;
    left:0;
    width:425px;
    height:90px;
    overflow:hidden;
}
#show2Content, #show3Content, #show4Content,
#show5Content, #show6Content{
    position:absolute;
    top:0;
    left:0;
    width:425px;
    height:90px;
}
#show {
    width:425px;
    height:90px;
}
#lineContent{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:url(separator.png) 0 0 no-repeat;
}

/* Logo */
#logoContainer{
    position:absolute;
    top:0;
    left:0px;
    /* left:55px; */
    width:124px;
    height:21px;
}
#logoContent{
    position:relative;
    width:124px;
    height:21px;
}

/* CTA */
#ctaContainer{
    position: absolute;
    top: px;
    left: 158px;
    /* left: 72px; */
    width: 90px;
    height: 21px;
    overflow:hidden;
    border-radius:11px;
}
#ctaContent{
    position:absolute;
    top: 0;
    left:0;
    /* left:-95px; */
    width: 90px;
    height: 21px;
    background:#ffffff;
    border:1px solid transparent;
    border-radius:11px;
}
#cta{
    position:relative;
    line-height:1.1em;
    width: auto;
    height: auto;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color:#4217AB;
    letter-spacing: 0.04em;
    padding: 0 3px;
}

#hboContainer{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
#hboContent{
    position:absolute;
    top: 75px;
    left: 398px;
    width: 20px;
    height: 8px;
}
#hboContent2{
    position:absolute;
    top: 75px;
    left: 398px;
    width: 20px;
    height: 8px;
}

/* Sublogo */
#subLogo1Container, #subLogo2Container{
    position:relative;
    width:100%;
    height:43px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}
#subLogo1Container{ top: -5px; }
#subLogo2Container{ top: -15px; }
#subLogo1Content, #subLogo2Content{
    position:relative;
    width:150px;
    height:43px;
}

/* Headline 1 */
#headline1Container{
    position: absolute;
    width: 100%;
    height: 24px;
    top:0;
    left:0;
}
#headline1Content{
    position:relative;
    width: 290px;
    height: 24px;
    left:-1px;
    top:-1px;
    border:1px solid transparent;
}
#headline1{
    position:relative;
    width: 100%;
    height: auto;
    display: flex;
    text-align: center;
    color: #ffffff;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 100%;
    letter-spacing: -0.01em;
    line-height: 1em;
}

/* Headline 2 */
#headline2Container{
    position: absolute;
    width: 100%;
    height: 24px;
    top:51px;
    left:0;
}
#headline2Content{
    position:relative;
    width: 290px;
    height: 24px;
    left:-1px;
    top:-1px;
    border:1px solid transparent;
}
#headline2{
    position:relative;
    width: 100%;
    height: auto;
    display: flex;
    text-align: center;
    color: #ffffff;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 100%;
    letter-spacing: -0.01em;
    line-height: 1em;
    font-size: 16px;
}

/* Images */
#image2Container, #image3Container,
#image4Container, #image5Container{
    position: relative;
    width: 117px;
    height: 117px;
}

/* Legal */
#legalContainer{
    position:absolute;
    top:-1px;
    left:0;
    width:100%;
    height:100%;
}
#legalContent{
    position:absolute;
    top: 81px;
    left: 235px;
    width: 255px;
    height: 9px;
    border:1px solid transparent;
}
#legal{
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    height:auto;
    text-align:center;
    color:#ffffff;
    line-height: 1em;
    font-size: 8px;
    letter-spacing: 0.017em;
    width: 100%;
}


/* Other  */
.separator{
    width:10px;
    height:100%;
}

/* IMAGE REPOSITION */
.fit-center{
     position:absolute;
     width: 100%;
     height: 100%;
     object-fit: contain;
     transform: translate(-50%, -50%);
     top: 50%;
     left: 50%;
 }

/* COUNTDOWN */

.absolute{
     position: absolute;
}

#logoImageTimer{
	width: 122.66px;
	height: 21px;
	left: 303px;
	top: 37px;
}

#h1CountdownContainer{
     width: 230px;
     height: 39px;
     left: 244px;
     top: -30px;
     opacity: 0;
}
#headline1ContainerTimer{
     width: 230px;
     height: 15px;
     left: 5px;
     top: 3px;
     line-height: 1.1em;
/*    border: thin ridge;*/
}
#headline1Timer{
     font-family: Gilroy-Medium;
     font-size: 12px;
     text-transform: uppercase;
     text-align: center;
     color: white;
    letter-spacing: -0.00em;;
}

#hideCtaTimer{
     width: 123px;
     height: 21px;
     left: 385px;
     top: 43px;
     overflow: hidden;
}
#ctaContainerTimer{
     display: flex;
     justify-content: center;
     align-items: center;

     width: 91px;
     height: 21px;
     left: -101px;
     background-color: #ffffff;
     border-radius: 12px;
}
#ctaTimer{
     text-align: center;

     font-family: Gilroy-ExtraBold;
    letter-spacing: 0.03em;
     font-size: 9px;
     color: #5816BD;

     margin-top: 1px;
     margin-left: 0px;
}

#showContainerTimer{
     width: 423px;
     height: 90px;

     left: -422px;

     overflow: hidden;
}
#showContentTimer{
     top: 0;
}
#attribution{
     width: 728px;
     height: 90px;
     left: 0px;
     top: 0px;
}

#f2subheadlineContainer{
     width: 300px;
     bottom: -18px;
     visibility:hidden;

     display: flex;
     align-items: center;
     justify-content: center;
}
#subheadline{
     font-family: Gilroy-Medium;
     font-size: 16px;
     color: #9D81C5;
     width: 206px;
     height: 19px;
     text-transform: uppercase;
     letter-spacing: .016em;
}

#legalContainerTimer{
    width: 252px;
    height: 9px;
    left: 235px;
    bottom: 2px;
    opacity: 0;
}
#legalTextTimer{
    font-size: 8px;
    font-family: Gilroy-Medium;
    color: #ffffff;
    letter-spacing: 0.016em;
    line-height: 7px;
    text-align: center;
    position: absolute;
    bottom: 1px;
    width: 100%;
}

#gradientBar{
     width: 728px;
     height: 90px;
     left: -423px;
     opacity:0;
}

/* TIMER */
/* TIMER */
#tracer{
    opacity: 1;
}
#timerIndicator1{
    position: absolute;
    font-family: Gilroy-Medium;
    left: 39px;
    top: -1px;
}
.macFirefox #timerIndicator1{
    top: 0px;
}
.ipadSafari #timerIndicator1{
    top: 0px;
}
.iphoneSafari #timerIndicator1{
    top: 0px;
}
.androidTabletChrome #timerIndicator1{
    top: 0px;
}
.androidPhoneChrome #timerIndicator1{
    top: 0px;
}
.ipadChrome #timerIndicator1{
    top: 0px;
}
#timerIndicator2{
    position: absolute;
    font-family: Gilroy-Medium;
    left: 26px;
    top: -1px;
}
.macFirefox #timerIndicator2{
    top: 0px;
}
.ipadSafari #timerIndicator2{
    top: 0px;
}
.iphoneSafari #timerIndicator2{
    top: 0px;
}
.androidTabletChrome #timerIndicator2{
    top: 0px;
}
.androidPhoneChrome #timerIndicator2{
    top: 0px;
}
.ipadChrome #timerIndicator2{
    top: 0px;
}
#timerIndicator3{
    position: absolute;
    font-family: Gilroy-Medium;
    left: 26px;
    top: -1px;
}
.macFirefox #timerIndicator3{
    top: 0px;
}
.ipadSafari #timerIndicator3{
    top: 0px;
}
.iphoneSafari #timerIndicator3{
    top: 0px;
}
.androidTabletChrome #timerIndicator3{
    top: 0px;
}
.androidPhoneChrome #timerIndicator3{
    top: 0px;
}
.ipadChrome #timerIndicator3{
    top: 0px;
}
#timerIndicator4{
    position: absolute;
    font-family: Gilroy-Medium;
    left: 26px;
    top: -1px;
}
.macFirefox #timerIndicator4{
    top: 0px;
}
.ipadSafari #timerIndicator4{
    top: 0px;
}
.iphoneSafari #timerIndicator4{
    top: 0px;
}
.androidTabletChrome #timerIndicator4{
    top: 0px;
}
.androidPhoneChrome #timerIndicator4{
    top: 0px;
}
.ipadChrome #timerIndicator4{
    top: 0px;
}
#daysID{
    position: absolute;
    text-align: right;
    left: 27px;
    letter-spacing: -0.01em;
    width: 35px !important;
}
#hoursID{
    position: absolute;
    left: 82px;
    letter-spacing: -0.01em;
}
#minsID{
    position: absolute;
    left: 123px;
    letter-spacing: -0.01em;
}
#secsID{
    position: absolute;
    left: 167px;
    letter-spacing: -0.01em;
}
#timer{
     display: none;
}
#timerContainer{
    position: absolute;
    font-family: Gilroy-ExtraBold;
    font-size: 14px;
    color: #ffffff;
    top: 0px;
    width: 240px;
}
.macFirefox #timerContainer{
    top:-1px;
}
.ipadSafari #timerContainer{
    top:-1px;
}
.iphoneSafari #timerContainer{
    top:-1px;
}
.androidTabletChrome #timerContainer{
    top:-1px;
}
.androidPhoneChrome #timerContainer{
    top:-1px;
}
.ipadChrome #timerContainer{
    top:-3px;
}
.timePosition{
    position: absolute;
    text-align: center;
    top: 24px;
    width: 25px;
}

#colons{
    position: absolute;
    font-family: Gilroy-ExtraBold;
    font-size: 14px;
    color: #ffffff;
    letter-spacing: 2.5em;
    top: 24px;
    left: 79px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.macFirefox #colons{
    top: 23px;
}
.ipadSafari #colons{
    top: 23px;
}
.iphoneSafari #colons{
    top: 23px;
}
.ipadChrome #colons{
    top: 23px;
}
.androidTabletChrome #colons{
    top: 23px;
}
.androidPhoneChrome #colons{
    top: 23px;
}
#colon2{
    position: relative;
    margin-left: 1px;
}
#colon3{
    position: relative;
    margin-left: 5px;
}
#headline1Timer > sup {
    position:relative;
    top:-4px;
}