﻿* {-webkit-font-smoothing: subpixel-antialiased;-webkit-text-size-adjust: none;-webkit-box-sizing:border-box;box-sizing:border-box;}

body {
    font-family: "Open Sans" ,sans-serif;
    background-color: rgba(35,35,35,1);
    margin: 0;
    padding: 0;
}
body > .container {
    
    position:relative;width:1000px;
    margin:0 auto;
    background: radial-gradient(ellipse 50% 20% at 50% 100%, rgba(133,101,75,1) 0, rgba(133,101,75,0) 100%),
 /*linear-gradient(to right, rgba(0,0,0,0.4) 0, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,0.4) 100%),*/ 
 -webkit-gradient(linear, left top, left bottom, from(rgba(37,24,11,0.6)), color-stop(30%, rgba(51,38,27,0.6)), to(rgba(65,51,40,0.6)));
    background: -webkit-radial-gradient(ellipse 50% 20% at 50% 100%, rgba(133,101,75,1) 0, rgba(133,101,75,0) 100%),
 /*linear-gradient(to right, rgba(0,0,0,0.4) 0, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,0.4) 100%),*/ 
 -webkit-linear-gradient(top, rgba(37,24,11,0.6) 0%, rgba(51,38,27,0.6) 30%, rgba(65,51,40,0.6) 100%);
    background: -o-radial-gradient(ellipse 50% 20% at 50% 100%, rgba(133,101,75,1) 0, rgba(133,101,75,0) 100%),
 /*linear-gradient(to right, rgba(0,0,0,0.4) 0, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,0.4) 100%),*/ 
 -o-linear-gradient(top, rgba(37,24,11,0.6) 0%, rgba(51,38,27,0.6) 30%, rgba(65,51,40,0.6) 100%);
    background: radial-gradient(ellipse 50% 20% at 50% 100%, rgba(133,101,75,1) 0, rgba(133,101,75,0) 100%),
 /*linear-gradient(to right, rgba(0,0,0,0.4) 0, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,0.4) 100%),*/ 
 linear-gradient(to bottom, rgba(37,24,11,0.6) 0%, rgba(51,38,27,0.6) 30%, rgba(65,51,40,0.6) 100%);
    -webkit-box-shadow: inset 0 -5px 3px 0 rgba(0,0,0,0.3);
            box-shadow: inset 0 -5px 3px 0 rgba(0,0,0,0.3);
    /*min-height:400px;*/
    padding-bottom:200px;
}
.header {padding:20px;margin-bottom:-40px;position:relative;z-index: 1;}
.logo {
    width:180px;
    height:125px;
    background-image: url(/rea/shared/img/logo/yg-logo.png);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: contain;
    margin:0;
}							 
@media (-webkit-min-device-pixel-ratio:2), (-o-min-device-pixel-ratio:2/1), (min-resolution:2dppx) {
	.logo {
    background-image: url(/rea/shared/img/logo/yg-logo.png);
	}
}
.content {
    position:relative;
    /*z-index:2;*/
    display:inline-block;
    border:solid 2px rgba(244,245,246,1);
    background:rgba(0,0,0,1);
    width:430px;
    padding:20px 30px 30px;
    margin-left:250px;
    border-radius:12px;
    -webkit-box-shadow: 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1);
            box-shadow: 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1);
}
body > .container::before {
    content:"";
    position:absolute;
    width:428px;
    height:375px;
    bottom:-30px;
    left:-20px;
    background-image: url(/rea/shared/img/yg/2/rea-yg-2-5ofakind.fs8.png);
    background-size:428px;
    background-position:center center;
    background-repeat:no-repeat;
    z-index:1;
}
@media (-webkit-min-device-pixel-ratio:2), (-o-min-device-pixel-ratio:2/1), (min-resolution:2dppx) {
    body > .container::before {
        background-image: url(/rea/shared/img/yg/2/rea-yg-2-5ofakind_2x.fs8.png);
    }
}

.content h2 {
    margin:0 auto 15px;
    color:rgba(255,234,72,1);
    text-align:center;
    font-weight: 700;
    font-size: 28px;
    line-height: 36px;
}
.content h2 span {color:rgba(255,255,255,1); font-style:italic;}
.content p {
    color:rgba(255,255,255,1);
    text-align:center;
    font-weight: 700;
    font-size: 20px;
}

.quadbike {
    border:solid 2px rgba(244,245,246,1);
    border-radius:12px;
    -webkit-box-shadow: 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1);
            box-shadow: 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1);
}
.qb-inner {
    display:inline-block;
    width:100%;
    padding: 0 0 0 50%;
    background: url(/rea/shared/img/winner/rea-yg-Immortal-HE_2x.jpg), -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(150,49,18,1)), to(rgba(64,20,11,1)));
    background: url(/rea/shared/img/winner/rea-yg-Immortal-HE_2x.jpg), -webkit-linear-gradient(top, rgba(150,49,18,1) 0, rgba(64,20,11,1) 100%);
    background: url(/rea/shared/img/winner/rea-yg-Immortal-HE_2x.jpg), -o-linear-gradient(top, rgba(150,49,18,1) 0, rgba(64,20,11,1) 100%);
    background: url(/rea/shared/img/winner/rea-yg-Immortal-HE_2x.jpg), linear-gradient(to bottom, rgba(150,49,18,1) 0, rgba(64,20,11,1) 100%);
    background-repeat:no-repeat, no-repeat;
    background-size:50%, cover;
    background-position:left center, center;
    height:201px;
    border-radius: 10px;
}
.qb-inner p {font-size:24px;}
.qb-inner p span {display:block;color:rgba(255,187,57,1);font-size:27px;}
.rightCol {
    display:inline-block;
    width: 260px;
    border-radius: 12px;
    -webkit-box-shadow: 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1);
            box-shadow: 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1), 0 0 5px 0 rgba(107,151,150,1), inset 0 0 5px 0 rgba(105,128,176,1);
    border: solid 2px rgba(244,245,246,1);
    background: rgba(0,0,0,1);
    margin-left: 20px;
    margin-bottom: 50px;
    padding: 55px 20px 40px;
    vertical-align: top;
    text-align: center;
}
input[type="text"],
input[type="email"] {
    display: block;
    margin: 0 auto 22px;
    padding: 0 10px;
    width: 183px;
    height: 34px;
    border: solid 1px rgba(153,153,153,1);
    border-radius: 4px;
    background: rgba(255,255,255,1);
    font-size: 12px;
}

input.formBtn,
button.formBtn {
        display:block;
        margin: 0;
        padding: 0 20px;
        background:rgba(243,109,0,1);
        border: solid 2px rgba(255,255,255,1);
        color:rgba(255,255,255,1);
        margin: 20px auto;
        width: 205px;
        height: 59px;
        border-radius: 8px;
        font-size: 21px;
        font-weight: bold;
        text-transform: uppercase;
        white-space: pre-wrap;
        word-break: keep-all;
        text-shadow:0 0 3px rgba(0,0,0,1);
        cursor:pointer;
        position:relative;
        z-index:1;
        /*outline: solid 1px #f0f;             Remove comment to show button area (development) */
    }

.footer {
    position:relative;
    width:1000px;
    margin:0 auto;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(191,196,200,1)), color-stop(65%, rgba(255,255,255,1)));
    background:-webkit-linear-gradient(top, rgba(191,196,200,1) 0, rgba(255,255,255,1) 65%);
    background:-o-linear-gradient(top, rgba(191,196,200,1) 0, rgba(255,255,255,1) 65%);
    background:linear-gradient(to bottom, rgba(191,196,200,1) 0, rgba(255,255,255,1) 65%);
    border-top:solid 2px rgba(255,255,255,1);
    padding:10px 0;
}
.footer::before {
    content:"";
    position:absolute;
    width:225px;
    height:195px;
    top:-140px;
    right:0;
    background-image: url(/rea/shared/img/yg/2/rea-yg-2-chip.fs8.png);
    background-size:210px;
    background-position:center center;
    background-repeat:no-repeat;
    z-index:1;
}
@media (-webkit-min-device-pixel-ratio:2), (-o-min-device-pixel-ratio:2/1), (min-resolution:2dppx) {
    .footer::before {
        background-image: url(/rea/shared/img/yg/2/rea-yg-2-chip_2x.fs8.png);
    }
}


.copyright {text-align:center;}
.copyright a {color:rgba(0,0,0,1);}
.copyright a:hover {text-decoration:none;}    
.avd{margin:0 auto 10px;padding:10px 10px 5px;background:#fff;max-width:430px;border-radius:5px;-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,0.2);box-shadow:0 0 5px 0 rgba(0,0,0,0.2);position:relative;z-index:2;}
@media screen and (max-width:479px) {
    .avd {max-width:calc(100% - 20px);}
}
.avdtxt{height:auto; padding:0; margin:0 auto; font-family:Arial,verdana, Sans-Serif; font-size:12px; color:#5d5d5d;text-align:center;}
.avdtxt a {color: #069aa3;font-weight: normal;text-decoration: none;}
.avdimg{margin:0 auto;text-align:center;}
.avdimg .norton{background-image:url(/rea/shared/img/trust/norton.jpg); background-repeat:no-repeat; width:104px; height:50px;margin-right:10px;display:inline-block;}
.avdimg .mcaffee{background-image:url(/rea/shared/img/trust/mcafee.jpg); background-repeat:no-repeat; width:106px; height:50px;margin-right:10px;display:inline-block;}
.avdimg .safesecure{background-repeat:no-repeat; width:91px; height:50px;display:inline-block;}
.copy p {font-size:13px;line-height:19px;text-align:center;}
.pinkSlime {border:none !important;text-align:center !important;}
.licence {font-size:12px;margin: 0 20px;text-align:center;}

.footerTracking {
    width:calc(100% - 40px);
    max-width:700px;
    font:normal 11px Arial,Helvetica;
    color:#555;
    text-align:left;
    vertical-align:middle;
    border:1px dotted #ccc;
    padding:3px 4px;
    margin:4px auto;
    clear:both;
}

/* temp */
html::after {position:absolute;top:0;left:0;color:#000;background:#ff0;padding:2px;font-family: "Open Sans",sans-serif;font-weight:bold;font-size:11px;opacity:0.7;
             content:"optimised for 1000px and above";display:none;  /**/z-index:999; }


input:focus {-webkit-box-shadow: 0 0 3px 0 rgba(0,128,255), 0 0 3px 0 rgba(0,128,255), 0 0 3px 0 rgba(0,128,255,1);box-shadow: 0 0 3px 0 rgba(0,128,255), 0 0 3px 0 rgba(0,128,255), 0 0 3px 0 rgba(0,128,255,1);}
input.error {-webkit-box-shadow: 0 0 3px 0 rgba(255,0,0,1), 0 0 3px 0 rgba(255,0,0,1), 0 0 3px 0 rgba(255,0,0,1);box-shadow: 0 0 3px 0 rgba(255,0,0,1), 0 0 3px 0 rgba(255,0,0,1), 0 0 3px 0 rgba(255,0,0,1);}
input.error:focus {-webkit-box-shadow: 0 0 3px 0 rgba(255,128,255), 0 0 3px 0 rgba(255,128,255), 0 0 3px 0 rgba(255,128,255,1);box-shadow: 0 0 3px 0 rgba(255,128,255), 0 0 3px 0 rgba(255,128,255), 0 0 3px 0 rgba(255,128,255,1);}
.checks {color:rgba(255,255,255,1) !important;margin-left:-10px;width:185px !important;}
.checks label {font-size:11px !important;width: 171px !important;}
body[data-gdpr="true"] .rightCol {height:auto;padding:35px 20px 22px;}
body[data-gdpr="true"] input[type="text"], body[data-gdpr="true"] input[type="email"] {margin: 0px auto 10px;}
body[data-gdpr="true"] input.formBtn, body[data-gdpr="true"] button.formBtn {margin:5px auto;}


body.reg-ca input[type="text"], body.reg-ca input[type="email"] {margin: 0px auto 10px;}
body.reg-ca .rightCol {height:auto;padding:35px 20px 13px;}

/*******************************************************************************************/
/********************************** RESPONSIVE STYLES **************************************/
/*******************************************************************************************/

/** optimised for between 720px and 999px **/
@media only screen and (max-width:999px) {
	html::after {content:"optimised for between 720px and 999px";}
	body > .container {width:720px;padding-bottom:145px;}
	body > .container::before {width:306px;height:260px;background-size:306px;bottom:-20px;}
    .qb-inner {height:191px;}
	.header {margin-bottom:-10px;}
	.logo {width:198px;height:118px}
	.content {width:415px;margin-left:15px;}
	.rightCol {margin-left:10px;padding:50px 20px 36px;}
	.footer {width:720px;}

    body.reg-ca .rightCol {height: auto;padding: 27px 20px 10px;}
}
/** optimised for between 640px and 719px **/
@media only screen and (max-width:719px) {
	html::after {content:"optimised for between 640px and 719px";}
	body > .container {width:640px;padding-bottom:155px;}
	.header {padding:5px 10px;}
	.content {width:356px;padding:10px 20px 20px;}
	.content h2 {font-size:24px;line-height:28px;}
	.content p {line-height:28px;}
    .qb-inner {height:171px;}
	.rightCol {width:240px;padding:33px 20px 20px;}
	input[type="text"], input[type="email"] {margin:0px auto 11px;}
    input.formBtn, button.formBtn {width:186px;}
	.footer {width:640px;}
	
}
/** optimised for between 580px and 639px **/
@media only screen and (max-width:639px) {
	html::after {content:"optimised for between 580px and 639px";}
	body > .container {width:580px;}
    .header {margin-bottom:5px;}
	.content {width: 312px;padding:10px;}
	.content h2 {font-size: 22px;}
	.content p {font-size: 20px;}
	.content p span {font-size: 24px;}
    .qb-inner {height:157px;}
	.rightCol {width:220px;margin-left:14px;padding:25px 15px 9px;}
	input[type="text"], input[type="email"] {margin:0px auto 10px;}
	input.formBtn, button.formBtn {margin:19px auto;width:185px;font-size:20px;}

	.footer {width:580px;}
	
}
/** optimised for between 480px and 579px **/
@media only screen and (max-width:579px) {
	html::after {content:"optimised for between 480px and 579px";}
	body > .container {width:480px;padding-bottom:165px;}
	body > .container::before {width:273px;height:232px;background-size:273px;left:-14px;}
	.header {margin-bottom:10px;position:relative;}
	.logo {margin:0 auto;width:198px;height:118px}
	.content {display:block;margin:0 20px 20px;width:auto;padding:10px 30px 25px;}
	.content h2 {font-size:28px;line-height:36px;}
	.content p {font-size:24px;line-height:32px;}
    .qb-inner {height:206px;padding-top: 5px;}
	.rightCol {width:auto;display:block;margin:0 20px;padding:15px 15px 0;}
	
	.footer {width:480px;padding-top:30px;}
    
}
/** optimised for between 360px and 479px **/
@media only screen and (max-width:479px) {
	html::after {content:"optimised for between 320px and 479px";}
	body > .container {width:320px;padding-bottom:100px;}
	body > .container::before {display:none;}
	.content {width:280px;padding:10px;margin: 0 20px 15px;}
	.content h2 {font-size:20px;line-height:28px;margin:0 auto 20px;}
	.content p {font-size:18px;line-height: 24px;}
    .qb-inner {height:140px;padding-top:0;}
	.qb-inner p span {
        display: block;
        color: rgba(255,187,57,1);
        font-size: 22px;
	}
	.rightCol {height:245px;}
	.footer {width:320px;}
	.footer::before {
	    right:auto;
	    left: calc(50% - 78.5px);
        width: 157px;
        height: 147px;
        top: -100px;
        background-size: 157px;
    }
}
/** optimised for between 320px and 359px **/
@media only screen and (max-width:359px) {
	html::after {content:"optimised for between 320px and 359px";}
	
}


/*ontario*/

.ontario-gambling-logo {
    width: 150px;
    height: auto;
    position: absolute;
    top: 49px;
    left: calc(0% + 231px);
}

@media screen and (max-width: 579px) {
    .ontario.logo {
        width: 161px;
        margin: 0 0 10px;
    }

    .ontario-gambling-logo {
        top: 30px;
        width: 116px;
        right: 15px;
        left: unset;
    }
}

.footer-icons .ontario-gambling-logo {
    width: 102px;
    height: auto;
    margin-top: -32px;
    display: inline-block;
    position: relative;
    right: 0;
    top: 0;
    left: unset;
}

.ontario-terms-link {
    font-size: 10px;
    color: white;
    text-decoration: none !important;
    /*text-shadow: 0px 2px 3.16px rgb(0 0 0 / 70%);*/
    display: block;
    margin: 0 auto;
    text-align: center;
}

    .ontario-terms-link:hover {
        color: white;
    }

    .ontario-terms-link:before {
        content: "* ";
    }

.footer .ontario-terms-link {
    text-decoration: underline !important;
    display: inline-block;
}

    .footer .ontario-terms-link:before {
        content: "  ";
    }

.footer p {
    font-size: 10px;
    margin: 20px auto;
    text-align: center;
    max-width: 576px;
}

    .footer p a {
        text-decoration: underline;
        color: black;
    }

        .footer p a:hover {
            color: black;
        }