@font-face {font-family: 'Gotham-Bold'; src: url('/fonts/Gotham-Bold.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap;}
@font-face {font-family: 'Gotham-Book'; src: url('/fonts/Gotham-Book.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap;}
@font-face {font-family: 'ShireType'; src: url('/fonts/ShireTypesNutshire-Plain.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap;}


body {margin: 0; font-size: 16px; background: #f85200; color: #fff; font-family: 'Gotham-Bold', serif; font-weight: 400; font-style: normal; overflow-x: hidden;}
input[type=text], select, textarea, button {font-family: 'Roboto Slab', serif; }
a {color: inherit; text-decoration: underline;}
select::-ms-expand {
    display: none;
}
.tableContainer {overflow: auto;}

*, *::before, *::after {box-sizing: border-box;}
.container {position: relative; width: 100%; max-width: 1366px; margin: 0 auto; box-sizing: border-box;}
.inner {width: 100%; max-width: 1366px; margin: 0 auto; position: relative;}
.pad {padding: 0 60px; }
.padb{padding-bottom: 60px !important;}
.pb::before {content: ""; display:block; padding-top: 1px; margin-bottom: 30px; }
.pa::after {content: ""; display:block; padding-bottom: 1px; margin-top: 30px; }
.main {padding-bottom: 35px; }
@media screen and (max-width: 750px) {
	.pad {padding: 0 20px; }

}

.titleFont {font-family: 'ShireType', sans-serif; font-weight: 300;}
.alignL {text-align: left;}
.alignC {text-align: center;}
.alignR {text-align: right;}
.clear {display:block; clear: both;}
.title_S {font-size: 30px;}
.title_M {font-size: 36px;}
.title_L {font-size: 50px;}
.title_XL {font-size: 90px;}
.title_XXL {font-size: 110px;}
@media screen and (max-width: 550px) {
	.title_S {font-size: 23px;}
	.title_M {font-size: 30px;}
	.title_L {font-size: 42px;}
	.title_XL {font-size: 60px;}
	.title_XXL {font-size: 75px;}
}
.rotate {transform: rotate(-3deg);}
.yellow {color: #FFE800;}
.smallText {font-size: 0.9em; }
.dib {display: inline-block;}

.flex{display: flex;}
@media screen and (max-width: 750px) {
	.flex{display: flex; flex-direction: column-reverse;}
}
.fc {align-items: center;}

.inner .left, .inner .right{width: 50%;}
@media screen and (max-width: 750px) {
	.inner .left, .inner .right{width: 100%; margin: 15px auto;}
}

.right .santa{width: 100%; height: 100%; background: url(../img/santa.jpg) no-repeat center; background-size: cover; background-position: 100% 26%; padding-bottom: 70%; position: relative;}
.right .santa.big {padding-bottom: 90%;}
.santa .lineTop {position: absolute; width: 100%; height: 10px; top: 0; left: 0; background: url(/img/lineTop.svg) repeat-x left;}
.santa .lineBottom {position: absolute; width: 100%; height: 10px; bottom: 0; left: 0; background: url(/img/lineBottom.svg) repeat-x right;}
.santa .lineLeft {position: absolute; width: 10px; height: 100%; top: 0; left: 0; background: url(/img/lineLeft.svg) repeat-y top left;}
.santa .lineRight {position: absolute; width: 10px; height: 100%; top: 0; right: 0; background: url(/img/lineRight.svg) repeat-y left; display: none;}
@media screen and (min-width: 1366px) {
	.santa .lineRight {display: initial;}
}
@media screen and (max-width: 750px) {
	.santa .lineLeft {display: none;}
}

.right .santa2{width: 100%; height: 100%; background: url(../img/santa2.jpg) no-repeat center; background-size: cover; background-position: 100% 26%; padding-bottom: 70%; position: relative;}
.right .santa2.big {padding-bottom: 90%;}
.santa2 .lineTop {position: absolute; width: 100%; height: 10px; top: 0; left: 0; background: url(/img/lineTop.svg) repeat-x left;}
.santa2 .lineBottom {position: absolute; width: 100%; height: 10px; bottom: 0; left: 0; background: url(/img/lineBottom.svg) repeat-x right;}
.santa2 .lineLeft {position: absolute; width: 10px; height: 100%; top: 0; left: 0; background: url(/img/lineLeft.svg) repeat-y top left;}
.santa2 .lineRight {position: absolute; width: 10px; height: 100%; top: 0; right: 0; background: url(/img/lineRight.svg) repeat-y left; display: none;}
@media screen and (min-width: 1366px) {
	.santa2 .lineRight {display: initial;}
}
@media screen and (max-width: 750px) {
	.santa2 .lineLeft {display: none;}
}

.santa2 .flare1 {animation: opac 3s infinite alternate , scale 2s infinite alternate, oscx 1.5s infinite alternate; position: absolute; left: 7%; top: 9%; background: red; background: rgb(255,255,255); background: radial-gradient(circle, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 55%, rgba(255,255,255,0.25) 61%, rgba(255,255,255,0) 70%)}
.santa2 .flare2 {animation: opac 2.4s infinite alternate, scale 1s infinite alternate, oscx 1.9s infinite alternate; position: absolute; left: 30%; top: 5%; background: red; background: rgb(255,255,255); background: radial-gradient(circle, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 55%, rgba(255,255,255,0.25) 61%, rgba(255,255,255,0) 70%)}
.santa2 .flare3 {animation: opac 1.8s infinite alternate, scale 2.3s infinite alternate, oscx 2.5s infinite alternate; position: absolute; left: 83%; top: 10%; background: red; background: rgb(255,255,255); background: radial-gradient(circle, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 55%, rgba(255,255,255,0.25) 61%, rgba(255,255,255,0) 70%)}
.santa2 .flare1 {width: 12%; height: 17%; }
.santa2 .flare2 {width: 10%; height: 15%; top: 1%;}
.santa2 .flare3 {width: 9%; height: 14%; }
.santa2.big .flare1 {width: 12%; height: 12%;}
.santa2.big .flare2 {width: 10%; height: 10%; }
.santa2.big .flare3 {width: 9%; height: 9%; }


@keyframes opac {
	0%   {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes scale {
	0%   {transform: scale(0.88);}
	100% {transform: scale(1);}
}
@keyframes osc {
	0%   {transform: translate(2px, 1px);}
	100% {transform: translate(-2px, -1px);}

}



header {position: relative; background: #F85200; }
header > div {position: relative; display: block; margin: auto; margin: 0 auto; height: 85px; width: 100%; max-width: 1200px}
header .logo {width: 160px; height: 100%; background: url(../img/logo.svg) no-repeat center; background-size: contain; margin: 0 auto; display: block; color: transparent; }

a.navButton {position: absolute; top: 50%; right: 30px; width: 63px; height: 63px; margin-top: -31px; z-index: 12; background: url("/img/menuButton.png") left no-repeat #F85200; border-radius: 12px; box-shadow: 1px 6px 15px rgba(0,0,0,0.2); }
a.navButton b {position: relative; display: block; top: 22px; left: 16px; width: 30px; height: 18px; }
a.navButton b i {position: absolute; left: 0; width: 100%; height: 2px; border-radius: 2px; transition: all 0.3s; background: #FFE800; }
a.navButton b i:nth-child(1) {top: 0; }
a.navButton b i:nth-child(2) {top: 8px; }
a.navButton b i:nth-child(3) {top: 8px; }
a.navButton b i:nth-child(4) {bottom: 0; }
a.navButton.open {background-position: right; }
a.navButton.open span { background: black; outline: none; }
a.navButton.open b i {}
a.navButton.open b i:nth-child(1) { top: 50%; width: 0; left: 50%; }
a.navButton.open b i:nth-child(2) { -webkit-transform: rotate(45deg); transform: rotate(45deg); }
a.navButton.open b i:nth-child(3) { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
a.navButton.open b i:nth-child(4) { bottom: 50%; width: 0; left: 50%; }

.nav {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; pointer-events: none; }
.nav > div {position: absolute; left: 0; top: 85px; width: 100%; height: 5px;  }
.nav > div:after{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 7px; background: rgba(0,0,0,0.2); background: linear-gradient(180deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0) 100%); }
.nav > div > div.opener {position: relative; display: block; width: 100%; height: 0; max-width: 1200px; margin: 0 auto; overflow: hidden; }
.nav > div > div.opener > div {position: absolute; right: 0; bottom: 0; width: 450px; padding: 0 30px 30px 30px; }
.nav > div > div.opener > div > div {position: relative; padding: 30px; background: #F85200; box-sizing: border-box; border-bottom-right-radius: 35px; border-bottom-left-radius: 35px; text-align: center; box-shadow: 1px 6px 15px rgba(0,0,0,0.2); }
.nav > div > div.opener > div > div ul {padding: 0; margin: 0; width: 100%; list-style: none; }
.nav > div > div.opener > div > div ul li {position: relative; padding: 0; margin: 0; }
.nav > div > div.opener > div > div ul li:after {content: ""; display:block; position: relative; height: 10px; background: url("/img/rule.svg") repeat-x; image-size: 100% auto;}
.nav > div > div.opener > div > div ul li a {position: relative; display: block; padding: 15px 20px; color: #fff; font-size: 30px; text-decoration: none; transition: all 0.3s; box-sizing: border-box; }
.nav > div > div.opener > div > div .socials {margin-top: 20px;  }
.nav.open {pointer-events: all; cursor: pointer; }
.nav.open > div > div.opener {height: auto; display: flex; justify-content: right; }
.nav.open > div > div > div {position: relative; }
@media screen and (max-width: 600px) {
	a.navButton {right: 20px; }
	.nav > div > div.opener > div {padding: 0 20px 20px 20px; }
	.nav > div > div.opener > div > div {padding: 20px; }
}
@media screen and (max-width: 500px) {
	.nav > div > div.opener > div {width: 100%; padding: 0 0 20px 0; }
}


.clue .left .timer {position: relative; width: 100%; max-width: 500px; margin: 30px auto;  text-align:center;}
.clue .left .timer .timerTop {position: relative; display:flex; justify-content: center; background: #fff; border: 5px solid #f85200; border-radius: 15px; font-size: 60px; color: #541200; padding: 15px 0;}
.clue .left .timer .timerTop > div {width: 110px;  }
.clue .left .timer .timerTop > div > span {display:block; font-size: 13px; color: #f85200; }
.clue .left .timer .timerBottom {position: relative; margin: 0 30px; background: #f85200; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px;  padding: 85px 30px 110px 30px; color: #FFE800;}
.clue .left .timer .timerBottom .progressContainer {position: relative; display: block; border: 3px solid #FFE800; background: #fff; margin-top: 10px; border-radius: 20px; padding: 0 16px; box-shadow: inset 0px 4px 5px 0px rgba(0,0,0,0.3);}
.clue .left .timer .timerBottom .progressContainer:before {content: ""; position: absolute; left: 0; top: 0; width: 32px; height: 32px; border-radius: 50%; background: #541200;}
.clue .left .timer .timerBottom .progressContainer .progress {position: relative; display: block; height: 32px;}	
.clue .left .timer .timerBottom .progress b {position: absolute; display: block; top: 0; left: 0; height: 100%; width: 0; background: #541200; transition: all 1s linear; }
.clue .left .timer .timerBottom .progress b:after {content: ""; position: absolute; top: -8px; height: 50px; width: 50px; right: 0; margin-right: -25px; background: url("../img/buttercup.png")center no-repeat; }
.clue {position: relative; display: flex; flex-direction: row-reverse; align-items: center; max-width: 900px; margin: 0 auto; padding: 0 40px; }
.clue .left {position: relative; width: 50%; padding-left: 10px; }
.clue .left .video {position: relative; width: 100%; max-width: 350px; margin: 30px auto; }
.clue .left .video > div {position: relative; padding-bottom: 172%; border: 6px solid #f85200; border-radius: 20px; background: #f85200; overflow: hidden; }
.clue .left .video > div video {position: absolute; left: 0; top: 0; width: 100%; height: 100%;  }		
.clue .left .video > div a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; }		
.clue .left .video > div a i {position: absolute; top: 50%; left: 50%; width: 100px; height: 100px; margin-left: -50px; margin-top: -50px; background: #fff; background: rgba(255,255,255,0.6);; border-radius: 50%; animation: pulse 1s infinite; }		
.clue .left .video > div a i:before {content: ""; position: absolute; top: 50%; left: 50%; width: 100px; height: 100px; margin-left: -50px; margin-top: -50px; background: #fff; ; border-radius: 50%; animation: pulse2 1s infinite; }		
.clue .left .video > div a i:after {content: ""; position: absolute; top: 50%; left: 50%; margin-top: -12px; margin-left: -6px; width: 0; height: 0; border-style: solid; border-width: 12.5px 0 12.5px 20px; border-color: transparent transparent transparent #f85200;  animation: pulse 1s infinite;}
.clue .left .video > div a.playing i {display: none;}
.clue .right {width: 50%; padding-right: 10px; color: #431213;}
.clue .right .titleFont {color: #f85200; }
@media screen and (max-width: 900px) {
	.clue .left .timer .timerTop {font-size: 45px;}
}
@media screen and (max-width: 600px) {
	.clue .left .timer .timerTop {font-size: 60px; }
	.clue {display: flex; flex-direction: column-reverse; padding: 0 20px;} 
	.clue .left {width: 100%; padding-left: 0}
	.clue .right {width: 100%; text-align:center; padding-right: 0;;}
}	
@media screen and (max-width: 450px) {
	.clue .left .timer .timerTop {font-size: 45px;}
}	
@keyframes pulse {
	0% {transform:scale(1);}
	15% {transform:scale(1.05);}
	30% {transform:scale(1);}
}
@keyframes pulse2 {
	0% {transform:scale(1);	opacity: 0.5;}
	100% {transform:scale(2);opacity: 0;}
}	

.formContainer {max-width: 600px}
.formContainer .focused {z-index: 5; position: relative;}
.formContainer input[type="text"], .formContainer select, .formContainer .floatingLabel label {font-family: 'Gotham-Book', sans-serif; color: #333; border-radius: 500px; padding: 10px 15px; z-index: 6;}
.formContainer .floatingLabel input[type=text], .formContainer .floatingLabel textarea, .formContainer .floatingLabel select {padding-bottom: 9px;}
.formContainer .field.field_firstName { width: calc(50% - 10px ); float: left; margin-bottom: 0;}
.formContainer .field.field_lastName { width: calc(50% - 10px ); float: right; margin-bottom: 0}
.formContainer .field.field_dob { width: calc(50% - 10px ); float: left; clear: both; }
.formContainer .field.field_phoneNumber { width: calc(50% - 10px ); float: right; }
.formContainer .field.field_email { clear: both; }
.formContainer .inputContainer > .label, .formContainer .inputContainer > label {font-family: 'ShireType', sans-serif; font-weight: 300; color: #FFE800; font-size: 1.3em;}
.formContainer .field.field_valid .validationChecks i, .formContainer .field.field_invalid .validationChecks b {display: none;}
.formContainer .checkboxContainer {font-size: .8em;}
.formContainer .checkboxContainer > a {background: transparent; border: 2px solid #ffe800; border-radius: 5px;}
.formContainer .checkboxContainer label > a {text-decoration: none; color: #FFE800;}
.formContainer .checkboxContainer.checked > a i{font-size: 18px;}
.formContainer .checkboxContainer.checked > a i {color: #ffe800;}
.formContainer .dateContainer {margin: 0;}
.formContainer .dateContainer > div {padding: 0;}
.formContainer .dateContainer label[for=dob_D]{left: 2px;}
.formContainer .dateContainer label[for=dob_M]{left: 2px;}
.formContainer .dateContainer select[name='dob_D']{border-top-right-radius: 0; border-bottom-right-radius: 0; padding-left: 16px;}
.formContainer .dateContainer select[name='dob_M']{border-radius: 0; border-left: 1px solid #F85200; border-right: 1px solid #F85200}
.formContainer .dateContainer select[name='dob_Y']{border-top-left-radius: 0; border-bottom-left-radius: 0;}
.formContainer .dateContainer > div .selectContainer .arrow {right: 10px; z-index: 6;}
.formContainer .selectContainer i.arrow {display: flex; justify-content: flex-end; align-items: center; padding-top: 0;}
.formContainer .error{color: #520000; margin-left: 5px;}
.buttonContainer {position: relative; margin: 20px 0;}
.buttonContainer a, .buttonContainer button {display: inline-block; position: relative;  font-size: 18px; padding: 16px 20px 13px 20px; min-width: 160px; background: #FFE800; color: #333; text-align:center; border: none; outline: none; text-decoration: none; font-weight: 300; cursor: pointer; font-family: 'ShireType', sans-serif; border-radius: 15px; }
.formContainer.waiting .buttonContainer button:after { border: 4px solid rgba(0,0,0,0.5); border-top: 4px solid #000;  }

@media screen and (max-width: 750px) {
	.formContainer .field.field_firstName { width:100%; float: none;}
	.formContainer .field.field_lastName { width:100%; float: none;}
	.formContainer .field.field_dob {width:100%; float: none; clear: none; }
	.formContainer .field.field_phoneNumber { width:100%; float: none; }
}

.faqs {text-align: left; margin: 20px auto; max-width: 800px; border-top: 1px solid rgba(0,0,0,0.2); }
.faqs .faq {margin: 10px 0; border-bottom: 1px solid rgba(0,0,0,0.2); padding-bottom: 10px;  }
.faqs .faq > a {display:block; position: relative; text-decoration: none; font-weight: 400; font-size: 20px;  padding: 10px 70px 10px 0; }
.faqs .faq > a i { position: absolute; right: 0; top: 50%; width: 63px; height: 63px; margin-top: -31px; background: url("../img/menuButton.png") left no-repeat;}
.faqs .faq > a i:after {content: ""; position: absolute; left: 50%; top: 50%; width: 11px ; height: 11px ; border-right: 2px solid #FFE800; border-top: 2px solid #FFE800; margin-left: -5px ; margin-top: -3px ; transform: rotate( -45deg ); box-sizing: border-box;}
.faqs .faq > div {position: relative; height: 0; overflow: hidden;}
.faqs .faq > div > div {position: absolute; font-family: 'Signika', sans-serif; bottom: 0; box-sizing: border-box; }
.faqs .faq > div > div:before {content: ""; display:block; padding-top: 1px; margin-bottom: 20px; }
.faqs .faq > div > div:after {content: ""; display:block; padding-bottom: 1px; margin-top: 30px; }
.faqs .faq.open > div {height: auto; }
.faqs .faq.open > div > div {position: relative;}
.faqs .faq.open > a i {background-position: right; }
.faqs .faq.open > a i:after {transform: rotate(135deg); margin-top: -10px;}


.yellowArea {background: #FFE800; padding-bottom: 80px;}
.yellowArea hr {background-image: url(/img/rule_orange.svg);}

footer {position: relative; background: #F85200; color: #FFE800; }
footer .footerNote {display: inline-block; padding: 20px ; padding-bottom: 0; position: absolute; top: -35px; background: #f85200; font-size: 1.3em ;width: 340px; left: calc(50% - 170px); border-top-left-radius: 35px ; border-top-right-radius: 35px ; text-align: center;}
@media screen and (max-width: 500px) {
	footer .footerNote {width: 306px; left: calc(50% - 153px); font-size: 19px;}
}
footer .footerNote2 {display: inline-block; padding: 20px ; padding-bottom: 0; position: absolute; top: -85px; background: #f85200; font-size: 1.3em ;width: 340px; left: calc(50% - 170px); border-top-left-radius: 35px ; border-top-right-radius: 35px ; text-align: center;}
footer .footerNote2 .partnership {font-size: 15px; color: white;}
footer .footerNote2 span > a{display: block; width: 77px ; margin: 0 auto; height: 52px ; background: url(../img/ladbible.svg) no-repeat center;}
@media screen and (max-width: 500px) {
	footer .footerNote2 {width: 306px; left: calc(50% - 153px); font-size: 19px;}
}

.socials {display: flex; justify-content: center;}
.socials .spacer {height: 25px; width: 4px; background: url(/img/socialsSpacer.svg) no-repeat center; background-size: contain; margin: 0 15px;}
.socials a {width: 25px; height: 25px; display: inline-block; margin: 0 5px; transition: all .2s ease;}
.socials a:hover {transform: translateY(-2px) scale(1.1);}
.socials a.fb {background: url(/img/fb.svg) no-repeat center; background-size: contain;}
.socials a.ig {background: url(/img/ig.svg) no-repeat center; background-size: contain;}
.socials a.ttok {background: url(/img/ttok.svg) no-repeat center; background-size: contain;}

footer .footerNav {margin: 15px auto;}
footer .footerNav a {text-decoration: none; margin: 15px;}


@media screen and (max-width: 850px) {
	footer .footerNav a {display: block;}
}

hr {border: none; outline: none; height: 8px; width: 100%; background: url(/img/rule.svg) repeat-x left;}

.clock {position: relative; margin: 30px auto; width: 100%; max-width: 400px; overflow: hidden; }
.clock > div {padding-bottom: 100%; background:  url("/img/clock.svg") center no-repeat; background-size: contain;   }
.clock > div > b {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url("/img/clockHand.svg") center no-repeat; background-size: contain; animation: spin 6s linear infinite;}
.clock > div > i {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url("/img/clockHand2.svg") center no-repeat; background-size: contain; animation: spin 60s linear infinite;}

.title_XS {font-size: 24px;}
.innerContainer {max-width: 750px; padding: 0 30px; margin: 0 auto;}
@media screen and (max-width: 500px) {
	.innerContainer {padding: 0 20px;}
}
.cashPrizes{width: 100%; padding-bottom: 80%; background: url(/img/cash_prizes2.png) no-repeat center, radial-gradient(circle, rgba(255,232,0,1) 0%, transparent 50%); background-size: contain; background-position: center,center;}

#modal .inner #content {color: #333; border-radius: 30px ; border: 5px solid #FFE800;}
#modal .inner .closeButton{top: 10px; right: 10px; width: 34px; height: 34px; background: #F85200}
#modal .inner .closeButton:before, #modal .inner .closeButton:after {background: #ffe800; }
.legal {font-family: sans-serif, serif; }
.legal a{ word-wrap:break-word;}
.legalStyle {font-family: 'Gotham-Book', serif;}
.legalStyle a { word-wrap:break-word;}

.tableWrapper {overflow: auto;}
table {border: 1px solid rgba(255,255,255,.1); border-collapse: collapse; margin: 20px 0;}
table td, table th {padding: 5px 10px; border: 1px solid rgba(255,255,255,.4);}
table th {font-weight: 700;}



.cookies2 {position: fixed; display:none; top: 0; left: 0; width: 100%; height: 100%; padding: 30px; background: rgba(0,105,57,0.3); font-family: 'CarlsbergLight', sans-serif; z-index: 100; opacity: 0; color: #333;}
.cookies2.open {display:flex; align-items: center; justify-content: center; opacity: 1; }
.cookies2 > div {position: relative; max-width: 850px; padding: 0 40px; max-height: 90vh; max-height: calc(100vh - 60px); overflow: auto; background: #fff; box-sizing: border-box; font-size: 16px; text-align: left;  -webkit-box-shadow: 0px 2px 8px 5px rgba(0,0,0,0.32); box-shadow: 0px 2px 8px 5px rgba(0,0,0,0.32);}
.cookies2 > div:before {content: ""; display: block; padding-top:1px; margin-bottom: 39px; }
.cookies2 > div:after {content: ""; display: block; padding-bottom:1px; margin-top: 39px; }
.cookies2 > div .title {font-size: 2em; font-family: 'CarlsbergBold', sans-serif;}
.cookies2 > div .concertina {margin: 20px 0;}
.cookies2 > div .concertina .top {display: flex; }
.cookies2 > div .concertina .top .switch {width: 34px; flex-grow: 0;}
.cookies2 > div .concertina .top .switch i {display: block; position: relative;  }
.cookies2 > div .concertina .top .switch i:after {content: ""; position: absolute; top: 1px; left: 15px; background: #fff; width: 14px; height: 14px; border-radius: 7px; transition: all 0.2s;} 
.cookies2 > div .concertina .top .switch a {display: block; position: relative;  }
.cookies2 > div .concertina .top .switch a:after {content: ""; } 
.cookies2 > div .concertina .top .switch a.off:after {left: 15px;}
.cookies2 > div .concertina .top .text {flex-grow: 1; font-family: 'CarlsbergBold', sans-serif; padding: 0 10px;}
.cookies2 > div .concertina .top .link a {position: relative; display: block; white-space: nowrap; padding-right: 15px; flex-grow: 0; }
.cookies2 > div .concertina .top .link a:after {content: ""; position: absolute; top: 50%; margin-top: -5px; right: 0; width: 10px; height: 10px; box-sizing: border-box; border-right: 1px solid #1c2025; border-bottom: 1px solid #1c2025; transform:rotate(45deg); }
.cookies2 > div .concertina .opener {position: relative; display:block; height: 0; overflow: hidden;}
.cookies2 > div .concertina .opener > div {position: absolute; bottom: 0; left: 0; width: 100%;}
.cookies2 > div .concertina.open .opener {height: auto;}
.cookies2 > div .concertina.open .opener > div {position: relative;}
.cookies2 > div .concertina.open .top a.link:after {transform:rotate(-135deg); margin-top: -1px; }

@media screen and (max-width: 750px) {
	.cookies2 {padding: 20px; }
	.cookies2 > div {padding: 0 20px; max-height: calc(100vh - 40px); }
	.cookies2 > div .buttons > a {min-width: calc(50% - 5px); }	
}

#modal.cookies .inner {max-width: 900px;}
#modal.cookies .inner .formContainer{max-width: 100%;}
#modal.cookies .inner .formContainer label{font-size: 16px; margin-left: 10px; margin-top: -2px; padding-right: 15px;}


.formContainer .field.switch .checkboxContainer > a {width: 34px; height: 20px; border-radius: 10px; transition: all 0.2s; background: #f85200; border: none; outline: none; box-shadow: none; }
.formContainer .field.switch .checkboxContainer > a i {position: absolute; top: 3px; left: 3px; background: #fff;width: 16px; height: 14px; border-radius: 7px; transition: all 0.2s;}
.formContainer .field.switch .checkboxContainer.checked > a {background: #7cab29 }
.formContainer .field.switch .checkboxContainer.checked > a i {left: 16px; }

.formContainer .field.switch .checkboxContainer > a i:before {display: none;}
.formContainer .field.switch .checkboxContainer > a i:after {display: none;}

.formContainer .field.field_cookiesEssential.switch .checkboxContainer {pointer-events: none;}
.formContainer .field.field_cookiesEssential.switch .checkboxContainer > a {border-color:  #c2c3c5; background: #c2c3c5; pointer-events: none;}
.formContainer .field.field_cookiesEssential.switch .checkboxContainer > a i {background: #fff;}

#modal.cookies .inner .formContainer label .concertina > div {display: flex; justify-content: space-between;}
#modal.cookies .inner .formContainer label .concertina > div > div{padding-right: 15px;}
#modal.cookies .inner .formContainer label .concertina a {pointer-events: all; white-space: nowrap; flex-grow: 0;}
#modal.cookies .inner .formContainer label .concertina .opener {position: relative; display:block; height: 0; overflow: hidden; }
#modal.cookies .inner .formContainer label .concertina .opener > div {position: absolute; bottom: 0; left: 0; width: 100%;}
#modal.cookies .inner .formContainer label .concertina.open .opener {height: auto;}
#modal.cookies .inner .formContainer label .concertina.open .opener > div {position: relative;}
@media screen and (max-width: 550px) {
	#modal.cookies .inner .formContainer label .concertina > div {flex-direction: column;}
	
}

.cookies .buttons {display:flex; justify-content: space-between; margin: 40px 0;}
.cookies .buttons > button {display:block; padding: 20px 5px; min-width: 48%; min-width: calc(50% - 15px); color: #333; border: 1px solid #1c2025; text-decoration: none; text-align:center; font-weight: 700; background: white; font-family: inherit; font-size: 18px; cursor: pointer;}
.cookies .buttons > button:last-child {background: #1c2025; color: #fff;}
@media screen and (max-width: 750px) {
	.cookies .buttons {display:block; }
	.cookies .buttons > button {width: 100%; min-width: 0; margin: 5px 0; padding: 10px 5px;  }
	
}

#modal.cookies .inner {max-width: 900px;}
#modal.cookies .inner .formContainer{max-width: 100%;}

.PWIB {padding-bottom: 20px; }
.PWIB span {position: relative; display: inline;  }
.PWIB span:after {content: ""; position: absolute; bottom: -15px; left: 0; right: 0; height: 8px; background: url("/img/rule.svg") left repeat-x;}

.titleLockup {max-width: 540px; margin: 0 auto;}
.titleLockup i {padding-bottom: 40%; display: block; background: url(../img/lockup.svg) no-repeat center; background-size: contain;}

.termsHeaderImg { width: 100%; margin: 10px auto; }
.termsCampaignName { font-size: 22px; display: block; }
.termsDates { font-size: 18px; }
.termsIntro { font-family: 'Gotham-Book', serif; font-weight: 400; font-size: 18px; }
.faqs.terms .faq > a { text-align: center; padding: 10px 70px 10px 70px; }

@media screen and (max-width: 550px) {
	.faqs.terms .faq > a { padding: 10px 50px 10px 0px; }
	.faqs.terms .termsImage .termsCampaignName { margin-right: -50px; display: block; }
	.faqs.terms .termsImage .termsDates { margin-right: -50px; display: inline-block; }
	.faqs.terms .termsImage .termsIntro { margin-right: -50px; display: inline-block; }
	.faqs.terms .termsImage .buttonContainer { margin-right: -50px; display: inline-block; }
	.faqs .faq > a i { transform: scale(0.8); right: -10px; }
	.faqs.terms .faq > a i:after { margin-left: -6px; }
}

/*

.faqs {text-align: left; margin: 20px auto; max-width: 800px; border-top: 1px solid rgba(0,0,0,0.2); }
.faqs .faq {margin: 10px 0; border-bottom: 1px solid rgba(0,0,0,0.2); padding-bottom: 10px;  }
.faqs .faq > a {display:block; position: relative; text-decoration: none; font-weight: 400; font-size: 20px;  padding: 10px 70px 10px 0; }
.faqs .faq > a i { position: absolute; right: 0; top: 50%; width: 63px; height: 63px; margin-top: -31px; background: url("../img/menuButton.png") left no-repeat;}
.faqs .faq > a i:after {content: ""; position: absolute; left: 50%; top: 50%; width: 11px ; height: 11px ; border-right: 2px solid #FFE800; border-top: 2px solid #FFE800; margin-left: -5px ; margin-top: -3px ; transform: rotate( -45deg ); box-sizing: border-box;}
.faqs .faq > div {position: relative; height: 0; overflow: hidden;}
.faqs .faq > div > div {position: absolute; font-family: 'Signika', sans-serif; bottom: 0; box-sizing: border-box; }
.faqs .faq > div > div:before {content: ""; display:block; padding-top: 1px; margin-bottom: 20px; }
.faqs .faq > div > div:after {content: ""; display:block; padding-bottom: 1px; margin-top: 30px; }
.faqs .faq.open > div {height: auto; }
.faqs .faq.open > div > div {position: relative;}
.faqs .faq.open > a i {background-position: right; }
.faqs .faq.open > a i:after {transform: rotate(135deg); margin-top: -10px;}
*/