﻿

body.Game #Content {
    display:block;
    position:absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
}

body.Game.leftbar #Content {
    left: 301px;
}

body.Game.rightbar #Content {
    right: 120px;
}

body.Game.topbar #Content {
    top: 90px;
}

body.Game.bottombar #Content {
    bottom: 101px;
}

@media screen and (max-width:800px) {
    body.Game.leftbar #Content {
        left: 0;
    }
    body.Game.leftbar .leftbanner {
        display: none;
    }
}


#Content iframe {
    position:absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    width:100%;
    height:100%;
    padding:0;
    margin:0;
    border:none;
}

body.Game #Content .Sidebar {
    display: block;
    position: absolute;
    left: 0;
    right:auto;
    width: 120px;
    top: 0;
    bottom: 0;
}

body.Game #Content .Sidebar img {
    display: block;
    position: absolute;
    left: 0;
    right: auto;
    width: 120px;
    top: 0;
    bottom: 0;
}

.Thumbnail {
    display:block;
    width:100%;
    height:auto;
    font-size:1vw;
    margin-top:-5em;
}

div.GameLogo {
    display:block;
    width:100%;
    height:0;
    padding-top:34.8%;
    background-repeat:no-repeat;
    background-position:50% 50%;
    background-size:cover;
    font-size:1vw;
}

img.GameLogo {
    display:block;
    width:100%;
    height:auto;
}


.Area {
    background-color:transparent;
    position:relative;
}

.Area.Entry p, .Area.Qualifying p {
    margin:1em;
}

.Area.Instructions p {
    padding-left:1em;
    padding-right:0;
}


.FancyList {
    display: block;
    position: relative;
    color: rgba(255,255,255,.7);
    font-size: 1.5vw;
    padding-top: .5em;
    padding-left: 8%;
    padding-right: 8%;
    padding-bottom: 1.5em;
    margin: 0;
    /*background-color: #707070;*/
    border-radius: 0;
    text-align: left;
    overflow-x: hidden;
    overflow-y: visible;
}

.FancyList.Reversed {
    color:rgba(0,0,0,.6);
    /*background-color:white;*/
}


.FancyList .List {
    max-height:15em;
    overflow-x:hidden;
    overflow-y:auto;
}

.FancyList .List::-webkit-scrollbar {width: 3px; background-color: #707070; }
.FancyList .List::-webkit-scrollbar-track {-webkit-box-shadow: none; background-color: #707070; }
.FancyList .List::-webkit-scrollbar-thumb { background-color: white; }

.FancyList.Reversed .List::-webkit-scrollbar {width: 3px; background-color: #f0f0f0; }
.FancyList.Reversed .List::-webkit-scrollbar-track {-webkit-box-shadow: none; background-color: #f0f0f0; }
.FancyList.Reversed .List::-webkit-scrollbar-thumb { background-color: #707070; }



#InstructionsList.FancyList {
    display:none;
}

#InstructionsList.FancyList .List {
    padding-right:.5em;
    max-height:none;
    overflow-x:hidden;
    overflow-y:visible;
}

.FancyList .Item {
    display:block;
    margin-top:.2em;
    white-space: nowrap;
    background-color:rgba(255,255,255,.1);
}

.FancyList.Reversed .Item {
    background-color:transparent;
}

.FancyList .Empty {
    color:rgba(255,255,255,.15);
    padding-left:0;
    line-height:2.3;
    height:2.3em;
    background-color:transparent;
}

.FancyList.Reversed .Empty {
    /*color:rgba(0,0,0,.15);*/
}

.FancyList .Item.Enabled {
    color:rgba(255,255,255,1);
    display:block;
    margin-top:.15em;
}

.FancyList.Reversed .Item.Enabled {
    color:rgba(0,0,0,1);
}

.FancyList .Qualifiers .Item.Enabled {
    border: 1px solid #ffffff21;
    border-radius: .5em;
}



.FancyList div.Title {
    display: block;
    color: white;
    font-size: 36px;
    font-family: 'bignoodletitling';
    font-weight: 100;
    line-height: 1.3;
    padding-left: 0;
    font-weight: 200;
    padding-top: 0;
    text-align: left;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
}

.Qualifiers div.Title {
    display:none;
}

.FancyList div.Title.center {
    text-align: center;
}

.FancyList.Reversed div.Title {
    margin-top:.5em;
    margin-bottom:.5em;
    /*color:#2D0433;*/
}

.FancyList div.Subtitle {
    display: block;
    color: rgba(255,255,255,.5);
    font-size: 0.9em;
    font-weight: 100;
    line-height: 1.3;
    padding-left: 0;
    font-weight: 200;
    padding-top: 0;
    text-align: left;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
    margin-bottom:.5em;
}

.FancyList.Reversed div.Subtitle {
}


.FancyList div.Html {
    display:block;
    color:white;
    background-color:transparent;
    padding:.5em;
}

.FancyList.Reversed div.Html {
    color:#421E48;
    background-color:transparent;
}

.FancyList div.Html a {
    color:white;
    text-decoration:underline;
}

.FancyList.Reversed div.Html a {
    color:#2D0433;
}


.FancyList div.Break {
    display:block;
    color:white;
    font-weight:bold;
    font-size:1em;
    padding-left:.2em;
    margin-top:.5em;
}

.FancyList.Reversed div.Break {
    color:#202020;
}


.FancyList div.Footer {
    display:block;
    color:rgba(255,255,255,.6);
    font-size:.8em;
    line-height:1.3;
    padding-top:.2em;
    padding-left:.5em;
}

.FancyList.Reversed div.Footer {
    color:rgba(255,255,255,.2);
}

.FancyList div.Note {
    display:block;
    color:rgba(255,255,255,.6);
    font-size:18px;
    line-height:1.3;
    padding-top:.2em;
    padding-left:.5em;
    margin-bottom:0;
}

.FancyList div.Note.strong-note {
    font-weight: bold;
}

.FancyList div.Note.center {
    text-align: center;
}

.FancyList.Reversed div.Note {
    color:rgba(0,0,0,.2);
}

.FancyList.Reversed div.Note a {
    color: rgba(255, 178, 0, 1);
    text-decoration:none;
}

.FancyList.Reversed div.Note a:hover {
    color:rgba(0,0,0,.6);
    text-decoration:underline;
}

.FancyList.Reversed .Qualifiers div.Note {
    padding-top: 0;
    padding-left: 0;
    margin-bottom: 1em;
    color: rgba(197, 197, 197, 1);
}

.FancyList.Reversed .Tournaments div.Note {
    padding-top: 0;
    padding-left: 0;
    margin-bottom: 1em;
    color: rgba(255,255,255,.6);
}

.FancyList.Reversed .Tournaments div.Note a {
    color: rgba(255, 178, 0, 1);
    text-decoration: none;
}

.FancyList.Reversed .Tournaments div.Note a:hover {
    text-decoration: underline;
}



.FancyList aside {
    display:none;
    background-color: rgba(255,255,255,.1);
    color: white;
    position:relative;
    margin-left:.1em;
    margin-right:3%;
    padding:.3em;
    padding-left:2.7em;
    border-bottom: 1px solid rgba(255,255,255,.4);
    margin-bottom:.4em;
    font-size: 16px;
}

.FancyList.Reversed aside {
    /*color: #505050;*/
    background-color: transparent;
    /*border-bottom: 1px solid #FFC844;*/
    font-size: 16px;
}


.FancyList .Item span {
    display:inline-block;
    position:relative;
    width:29%;
    line-height:2.3;
    height:2.3em;
    background-color:transparent;
    margin-left:.1em;
    margin-right:.1em;
    padding-left:.5em;
    padding-right:.5em;
    white-space:nowrap;
    overflow:hidden;
    text-overflow: ellipsis;
    vertical-align: bottom;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
}

.FancyList.Reversed .Item span {
    background-color:rgba(66, 30, 72, .05);
    background-color:#FFC844;
}


.FancyList .Item span s {
    color:inherit;
    text-decoration:none;
}

.FancyList .Item span:nth-child(1) { 
    width: 2.3em; 
    padding:0;
    cursor:pointer;
}

.FancyList .Item span:nth-child(1) img { 
    display:block;
    position:absolute;
    left:0;
    right:0;
    width:100%;
    height:100%;
}

.FancyList .Item.Header span { 
    background-image:none;
    background-color:transparent;
    border:none;
    color:rgba(0,0,0,0.3) !important;
    font-weight:normal !important;
}


.FancyList .Item.Open span:nth-child(1):after { 
    content:"";
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background: url("data:image/svg+xml;utf8,<svg fill='rgba(255,255,255,.8)' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z'/></svg>") no-repeat;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    transition: .2s transform;
}

.FancyList.Reversed .Item.Open span:nth-child(1):after { 
    background: url("data:image/svg+xml;utf8,<svg fill='rgba(0,0,0,.8)' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z'/></svg>") no-repeat;
}


.FancyList .Item.Closed span:nth-child(1):after { 
    content:"";
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background: url("data:image/svg+xml;utf8,<svg fill='rgba(255,255,255,.8)' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z'/></svg>") no-repeat;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    transition: .2s transform;
}

.FancyList.Reversed .Item.Closed span:nth-child(1):after { 
    background: url("data:image/svg+xml;utf8,<svg fill='rgba(0,0,0,.8)' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z'/></svg>") no-repeat;
}


.FancyList .Item span:last-child {
    color:rgba(255,255,255,.6);
    margin-right:0;
}

.FancyList.Reversed .Item span:last-child {
    color:rgba(0,0,0,.4);
}

.FancyList .Item.Enabled span:last-child {
    color:white;
}

.FancyList.Reversed .Item.Enabled span:last-child {
    color: black;
}

.FancyList .Item.Link span:last-child {
    cursor:pointer;
    color:white;
    background-color:#FFC844;
    background-image:none;
    transition:width .2s;
}

.FancyList.Reversed .Item.Link span:last-child {
    background-color:#76236C;
    color:white;
}

.FancyList.Reversed .Item.Link.Mine span:last-child {
    color:#FFC844;
}


.FancyList .Item.Link:after {
    content:"";
    display:inline-block;
    position:relative;
    left:0;
    vertical-align: bottom;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 1.15em 0 1.15em .7em;
    border-color: transparent transparent transparent #FFC844;
    cursor:pointer;
}

.FancyList.Reversed .Item.Link:after {
    border-color: transparent transparent transparent #76236C;
}

.FancyList .Item.Link:hover span:last-child {
    background-color:#FFC844;
    color:white;
    width:12.5%;
}

.FancyList.Reversed .Item.Link:hover span:last-child {
    background-color:#76236C;
}


.FancyList .Item.Link:hover:after {
    border-color: transparent transparent transparent #FFC844;
}

.FancyList.Reversed .Item.Link:hover:after {
    border-color: transparent transparent transparent #76236C;
}


.FancyList .Item.Link:active span:last-child {
    color: white;
    background-color:#FFC844;
    width:12.5%;
}

.FancyList.Reversed .Item.Link:active span:last-child {
    background-color:#76236C;
}


.FancyList .Item.Link:active:after {
    border-color: transparent transparent transparent #FFC844;
}

.FancyList.Reversed .Item.Link:active:after {
    border-color: transparent transparent transparent #76236C;
}


.FancyList.Reversed .Rule {
    height:2px;
    margin-top:1em;
    margin-bottom:1.5em;
    border-bottom: 2px solid rgba(255,255,255,0.2);
}



@media screen {
    .FancyList { font-size:2vw; /*padding-left:1%; padding-right:1%;*/ }
    /*.FancyList .Section { padding-left:1%; padding-right:1%; }*/
    .FancyList s { display:none; }
    .FancyList .Item.Empty { width: 94%; }
    .FancyList .Item span { line-height:2.8; height:2.8em; }
    .FancyList .Item.Header span { line-height:1.4; height:1.4em; }
    .FancyList .Item.Link:after { border-width: 1.4em 0 1.4em 1em; }
    .FancyList.Item.Footer{ font-size:1.2em; }
    .FancyList.Item.Note{ font-size:1.2em; }
}

@media screen  and (min-width:640px) {
    .FancyList { font-size:1.7vw;  /*padding-left:2%; padding-right:2%;*/ }
    /*.FancyList .Section { padding-left:2%; padding-right:2%; }*/
    .FancyList s { display:none; }
    .FancyList .Item.Empty { width: 95%; }
    .FancyList .Item span { line-height:2.5; height:2.5em; }
    .FancyList .Item.Header span { line-height:1.25; height:1.25em; }
    .FancyList .Item.Link:after { border-width: 1.25em 0 1.25em 1em; }
    .FancyList .Item.Footer{ font-size:.1em; }
    .FancyList .Item.Note{ font-size:.1em; }
}

@media screen  and (min-width:900px) {
    .FancyList { font-size:1.5vw; /*padding-left:20px; padding-right:20px;*/ }
    /*.FancyList .Section { padding-left:4%; padding-right:4%; }*/
    .FancyList s { display:inline; }
    .FancyList .Item.Empty { width: 97%; }
    .FancyList .Item span { line-height:2.3; height:2.3em;}
    .FancyList .Item.Header span { line-height:1.15; height:1.15em; }
    .FancyList .Item.Link:after { border-width: 1.15em 0 1.15em .7em; }
    .FancyList .Item.Footer{ font-size:.8em; }
    .FancyList .Item.Note{ font-size:.8em; }
}


#LobbyList {
    font-size:1.87vw;
    /*padding-left:10vw;
    padding-right:10vw;*/
    padding-top:1em;
}


#LobbyList .Qualifiers {
    background-color:transparent;
    padding-bottom:1em;
}

#LobbyList .Qualifiers .Item:hover {
    background-color: rgba(0,0,0,.05);
    border-color:#ffffff60;
}

#LobbyList .Title {
    margin-bottom:.5em;
}

#LobbyList .Tournaments .Title {
    color:white;
}

#LobbyList .Tournaments {
    /*background-color: #707070;*/
    /*padding-top: 1em;
    padding-bottom: 1em;*/
    background: linear-gradient(0deg, #1B241F, #1B241F), linear-gradient(142.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.08) 101.88%);
    border: 1px solid;
    /* border-image-source: linear-gradient(142.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.08) 101.88%); */
    border-color: rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    padding: 20px;
    margin-top: 50px;
}

#LobbyList .Global {
    /*background-color: #707070;*/
    /*padding-top: 1em;
    padding-bottom: 1em;*/
}

#LobbyList .Section.Global {
}

#LobbyList .Section.Global .Title {
    color: rgba(255,255,255,.7);
}

#LobbyList .Section.Global .Item span:nth-child(2) {
    color: rgba(255,255,255,.8);
}


#LobbyList a.Instructions {
    cursor: pointer;
    margin-left: .4em;
}

#LobbyList a.Instructions svg {
    position:relative;
    top:.2em;
    width: 1.2em;
    height: 1.2em;
    fill: #1859B5;
}

#LobbyList .Qualifiers a.Instructions svg {
    top: .2em;
    width: 1.2em;
    height: 1.2em;
    fill: #1859B5;
}

#LobbyList .Tournaments a.Instructions svg {
    top: .3em;
    width: 1.4em;
    height: 1.4em;
    fill: white;
}

#LobbyList .Global a.Instructions svg {
    top: .3em;
    width: 1.4em;
    height: 1.4em;
    fill: rgba(255,255,255,.7);
    fill: rgba(255,255,255,.7);
}

#LobbyList .Item {
    display:inline-block;
    position:relative;
    width:50%;
    /*background-color:transparent;*/
    margin-right:1%;
    margin-bottom:1em;
    overflow:hidden;
    background: linear-gradient(0deg, #1B241F, #1B241F), linear-gradient(142.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.08) 101.88%);
}

#LobbyList .Tournaments .Item {
    margin-right: 1%;
    width: 47%;
}

#LobbyList .Item:after {
    display:none;
}

#LobbyList .Item span {
    display:block;
    width:100% !important;
    margin:0;
    box-sizing:border-box;
    background-color:transparent;
    padding-left:20px;
    padding-right:0;
    color:#999999;
    height:auto;
}

    #LobbyList .Qualifiers .Item span:first-child {
        /*background-color: black;
        background-image: url(/Static/Images/Games/btn_bg.png);
        background-size: 100% 100%;*/
        font-family: BigNoodleTitling;
        font-size: 36px;
        font-weight: 400;
        line-height: 44px;
        letter-spacing: 0em;
        text-align: left;
        color: white;
    }

#LobbyList .Item span:last-child {
    display:block;
    text-align:center;
    background-color:transparent;
    /*border:1px solid rgba(128,128,128,.5);*/
    color:rgba(160,160,160,.5);
    font-size:.9em;
    width:60% !important;    
    cursor:default;
    padding:0;
    margin-top:1em;
    margin-bottom:1em;
    margin-left:auto;
    margin-right:auto;
}

#LobbyList .Item.Link span:last-child {
    cursor:pointer;
}

#LobbyList .Item.Enabled span:last-child {
    /*border:1px solid rgba(0,0,0,.7);
    border-radius:.5em;
    color:black;*/
}

#LobbyList .Item.Link span:last-child {
    /*background-color: #ffdb7c;
    color: black;*/    
}

#LobbyList .Item span:nth-child(1) { 
    display:block; 
    line-height:1.5;
}

#LobbyList .Item span:nth-child(1):after { 
    display:none; 
}

#LobbyList .Item span:nth-child(1) img { 
    display:inline-block; 
    position:relative;
    padding-top:.1em;
    height:2em;
    width:auto;
    margin-right:.3em;
}

#LobbyList .Item span:nth-child(2) {
    font-size: 16px;
    font-weight: 500;
    color: rgba(197, 197, 197, 1);
    line-height: 30px;
}

#LobbyList .Item span:nth-child(4) {
    font-size: 16px;
    font-weight: 500;
    color: rgba(197, 197, 197, 1);
    line-height: 30px;
    width: 100% !important;
}

#LobbyList .Item span:nth-child(3) {
    background-image: linear-gradient(to right, #B88916, #F6C451, #B88916, #F6C451, #AA771C);
    padding: 15px 45px;
    text-align: center;
    transition: 0.5s;
    background-size: 200% auto;
    color: #0d160d;
    border-radius: 10px;
    display: block;
    /*max-width: 300px;*/
    border: none;
    font-size: 16px;
    font-weight: normal;
    line-height: 30px;
    margin: 20px;
}

    #LobbyList .Item span:nth-child(3):hover {
        background-position: right center;
        text-decoration: none;
    }

    #LobbyList .Tournaments .Item span:nth-child(2) {
        color: white;
    }

#LobbyList .Tournaments .Item span:nth-child(3) { margin-bottom:1em; }
#LobbyList .Tournaments .Item.Enabled span:last-child { border-color: rgba(0,0,0,.3); }
#LobbyList .Tournaments .Item.Link span:last-child { background-color: #FFC844; }

#LobbyList .Tournaments .Item  #right-image {
    display: none !important;
}


@media screen {
    #LobbyList { font-size:4vw; }
        #LobbyList .Item {
        width:100%;
        margin-right:0;
    }
    #LobbyList .Tournaments .Item {
        width: 100%;
        margin-right: 0;
    }
}

@media screen  and (min-width:700px) {
    #LobbyList { font-size:2.5vw; }
    #LobbyList .Item {
        width:46%;
        margin-right:2%;
    }
    #LobbyList .Tournaments .Item {
        width: 70%;
        margin-right: 1%;
    }

    #LobbyList .Tournaments .item-full-width {
        width: 100% !important;
    }
}

@media screen and (min-width:1010px) {
    #LobbyList { font-size:1.8vw; }
    #LobbyList .Item {
        width:46%;
        margin-right:2%;
    }
    #LobbyList .Tournaments .Item {
        width: 47%;
        margin-right: 1%;
    }
    #LobbyList .Tournaments .item-full-width {
        width: 100% !important;
    }
}


@media screen {
    #ObserveList .Item span:nth-child(2) { width: 26% }
    #ObserveList .Item span:nth-child(3) { width: 41% }
    #ObserveList .Item span:nth-child(4) { width: 13%; }
    #ObserveList .Item:hover span:nth-child(4){ width:13.5%; }
}

@media screen  and (min-width:640px) {
    #ObserveList .Item span:nth-child(2) { width: 26% }
    #ObserveList .Item span:nth-child(3) { width: 45% }
    #ObserveList .Item span:nth-child(4) { width: 11.5%; }
    #ObserveList .Item:hover span:nth-child(4){ width:12%; }
}

@media screen and (min-width:900px) {
    #ObserveList .Item span:nth-child(2) { width: 25% }
    #ObserveList .Item span:nth-child(3) { width: 49.5% }
    #ObserveList .Item span:nth-child(4) { width: 12% }
    #ObserveList .Item:hover span:nth-child(4){ width:12.5%; }
}

#ScoresList .Item {
    background-color:transparent;
    border-bottom: 1px solid #502D54;
}

#ScoresList.Reversed .Item {
    background-color:transparent;
    border-bottom: 1px solid #e0e0e0;
}

#ScoresList.Reversed .Item span {
    background-color:transparent;
    color: #808080;
}


@media screen {
    #ScoresList .Item span:nth-child(2) { width: 25%; }
    #ScoresList .Item span:nth-child(3) { width: 35%; }
    #ScoresList .Item span:nth-child(4) { width: 15%;  text-align:right; }
    #ScoresList .Item span:nth-child(5) { width: 6%; font-weight:normal; text-align:center;}
}

@media screen  and (min-width:640px) {
    #ScoresList .Item span:nth-child(2) { width: 25%; }
    #ScoresList .Item span:nth-child(3) { width: 37%; }
    #ScoresList .Item span:nth-child(4) { width: 15%; }
    #ScoresList .Item span:nth-child(5) { width: 6%; }
}

@media screen and (min-width:900px) {
    #ScoresList .Item span:nth-child(2) { width: 27%; }
    #ScoresList .Item span:nth-child(3) { width: 37%; }
    #ScoresList .Item span:nth-child(4) { width: 15%; }
    #ScoresList .Item span:nth-child(5) { width: 6%; }
}


@media screen {
    #LeaderboardList .Leaderboard .Item span:nth-child(2) { width: 14%; }
    #LeaderboardList .Leaderboard .Item span:nth-child(3) { width: 20%; text-align:right; }
    #LeaderboardList .Leaderboard .Item span:nth-child(4) { width: 27%; }
    #LeaderboardList .Leaderboard .Item span:nth-child(5) { width: 20%; font-weight:normal; }
    #LeaderboardList .Freeroll .Item span:nth-child(2) { width: 56%; }
    #LeaderboardList .Freeroll .Item span:nth-child(3) { width: 30%; text-align:right;}
    #LeaderboardList .Freeroll .Item span:nth-child(4) { display:none;  }
    #LeaderboardList .Freeroll .Item span:nth-child(5) { display:none; }
}

@media screen  and (min-width:640px) {
    #LeaderboardList .Leaderboard .Item span:nth-child(2) { width: 14%; }
    #LeaderboardList .Leaderboard .Item span:nth-child(3) { width: 21%; }
    #LeaderboardList .Leaderboard .Item span:nth-child(4) { width: 27%; }
    #LeaderboardList .Leaderboard .Item span:nth-child(5) { width: 21%; }
    #LeaderboardList .Freeroll .Item span:nth-child(2) { width: 57%; }
    #LeaderboardList .Freeroll .Item span:nth-child(3) { width: 30%; }
}

@media screen and (min-width:900px) {
    #LeaderboardList .Leaderboard .Item span:nth-child(2) { width: 14%; }
    #LeaderboardList .Leaderboard .Item span:nth-child(3) { width: 21%; }
    #LeaderboardList .Leaderboard .Item span:nth-child(4) { width: 27%; }
    #LeaderboardList .Leaderboard .Item span:nth-child(5) { width: 21%; }
    #LeaderboardList .Freeroll .Item span:nth-child(2) { width: 59%; }
    #LeaderboardList .Freeroll .Item span:nth-child(3) { width: 30%; }
}



.Score.Area {
    color:white;
    font-size:1.5vw;
    margin-right:2%;
    margin-left:2%;
    margin-top:1.5em;
    padding-top:.5em;
    padding-left:.5em;
    padding-bottom:.3em;
    margin-bottom:1.5em;
    background-color:#d0f0FF;
    border-radius:.5em;
    text-align:left;
}
.Score h2 {
    text-align:left;
    margin:0;
    font-weight:normal;
    display:block;
    color:#007BC3;
    font-size:1.4em;
    padding-left:.1em;
}

.Score .scoreHeader {
    display:block;
    padding-bottom:0;
    font-size:1em;
}

.Score .scoreHeader span {
    display:inline-block;
    width:25%;
    color:#0178C6;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left:.5em;
    padding-right:.5em;
    font-size:1em;
    border-bottom:2px solid #0178C6;
}

.Score ul.scores {
    margin:0;
    padding:0;
    list-style-type:none;   
    max-height:15em;
    overflow-x:hidden;
    overflow-y:auto;
}

.Score ul.scores li {
    margin:0;
    padding:0;
    list-style-type:none;   
}

.Score ul.scores li span {
    display:inline-block;
    width:25%;
    color:#0178C6;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left:.5em;
    padding-right:.5em;
    line-height:1.5em;
    font-size:1em;
    background-color:rgba(0,0,0,.03);
}

.Score ul.scores li:nth-child(odd) span {
    background-color:rgba(255,255,255,.15);
}


.Score ul.scores li span.date, .Score .scoreHeader span.date { width:18%; text-align:left; }
.Score ul.scores li span.level, .Score .scoreHeader span.level { width:39%; text-align:left; }
.Score ul.scores li span.score, .Score .scoreHeader span.score { width:18%; text-align:center; }
.Score ul.scores li span.rank, .Score .scoreHeader span.rank { width:20%; text-align:center; }


.Score ul.scores li span a.Rank {
    color:#0178C6;
    text-decoration:underline;
    display:inline-block;
    padding-left:.2em;
    padding-right:.2em;
    width:3em;
}


@media screen {
    .Score.Area { font-size:2vw; margin-right:1%; margin-left:1%; }
    .Score .scoreHeader span { font-size:2vw;  }
    .Score ul.scores li span { line-height:2.8; height:2.8em; }
}

@media screen  and (min-width:640px) {
    .Score.Area { font-size:1.7vw; margin-right:2%; margin-left:2%; }
    .Score .scoreHeader span { font-size:1.7vw;  }
    .Score ul.scores li span { line-height:2.5; height:2.5em; }
}

@media screen  and (min-width:900px) {
    .Score.Area { font-size:1.5vw; margin-right:2%; margin-left:2%; }
    .Score .scoreHeader span { font-size:1.5vw; }
    .Score ul.scores li span { line-height:2.3; height:2.3em;}
}




.Leaderboard h3 {
    margin-bottom:0;
}

.Leaderboard .leaderboardHeader {
    display:block;
    padding-bottom:0;
    font-size:1em;
}

.Leaderboard .leaderboardHeader span {
    display:inline-block;
    width:25%;
    color:rgba(0,0,0,.9);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left:.5em;
    padding-right:.5em;
    font-size:2.5em;
    border-bottom:2px solid rgba(0,0,0,.2);
}

.Leaderboard ul.leaderboardEntries {
    margin:0;
    padding:0;
    list-style-type:none;   
}

.Leaderboard ul.leaderboardEntries li {
    margin:0;
    padding:0;
    list-style-type:none;
}

.Leaderboard ul.leaderboardEntries li span {
    display:inline-block;
    width:25%;
    color:rgba(0,0,0,.6);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-right:.5em;  
    padding-left:.5em;  
    line-height:1.5em;
    font-size:2.5em;
    background-color:rgba(0,0,0,.03);
}

.Leaderboard ul.leaderboardEntries li:nth-child(odd) span {
    background-color:rgba(255,255,255,.15);
}


.Leaderboard ul.leaderboardEntries li span.position, .Leaderboard .leaderboardHeader span.position { width:10%; }
.Leaderboard ul.leaderboardEntries li span.name, .Leaderboard .leaderboardHeader span.name { width:39%; }
.Leaderboard ul.leaderboardEntries li span.score, .Leaderboard .leaderboardHeader span.score { width:18%; }
.Leaderboard ul.leaderboardEntries li span.date, .Leaderboard .leaderboardHeader span.date { width:18%; }


.PopupBg.GameSummary {
    background-color:rgba(0,0,0,.7);
}

.Dialog.GameSummary {
    top:4em;
}

.Dialog.RankDetails .Content {
    font-size:1em;
}

.Dialog.RankDetails .Content .Button {
    font-size:2em;
    margin-top:1em;
}


.Dialog.RankDetails h3 {
    font-size:1.4em;
    margin:0;
}
.Dialog.RankDetails h4 {
    font-size:1.2em;
    margin:0;
}

.Dialog.RankDetails span.rank {
    display:inline-block;
    width:10%;
    font-size:1em;
    text-align:center;
}

.Dialog.RankDetails span.user {
    display:inline-block;
    width:48%;
    font-size:1em;
}

.Dialog.RankDetails span.score {
    display:inline-block;
    width:40%;
    font-size:1em;
    text-align:right;
}

#WaitingList {
    color:#404040;
}

#CountdownPanel {
    display:none;
}

#CountdownPanel #CountdownClock {
    display: block;
    position: relative;
    font-size: 1vw;
    width: 60%;
    left: 20.8%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen  and (max-width:800px) {
     #CountdownPanel #CountdownClock {
        width:90%;
        font-size:1.5vw;
        left:5%;
        right:5%;
     }
}

#CountdownPanel #CountdownClock div {
    display:inline-block;
    position:relative;
    width:22%;
    margin-right:2%;
    left:1%;
    background-color:#FFC844;
    color:white;
    vertical-align:bottom;
    text-align:center;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;  
}

#CountdownPanel #CountdownClock span.amount {
    display:block;
    font-size:5em;
    color:white;
    background-color:#2D0433;
    margin:.2em;
    margin-bottom:0;
}

#CountdownPanel #CountdownClock span.title {
    display:block;
    font-size:2em;
    line-height:1.8;
}

#CountdownSubtitle {
    font-size:1.5vw;
    text-align:center;
}

#JoinMsg {
    font-size:1.5vw;
    text-align:center;
    display:none;
}

.Advertisement img {
    display:block;
    position:relative;
    max-width:97%;
    margin-right:auto;
    margin-left:auto;
    padding-top:.5em;
    padding-bottom:.5em;
}

.Dialog.Instructions {
    left:3em;
    right:1em;
    width:auto;
}

.Dialog.Instructions .Content {
    padding:2%;
}

.scrim {
    display:block;
    position:absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    width:100%;
    height:100%;
    overflow:hidden;
    background-color:rgba(0,0,0,.8);
    z-index:2;
}

.scrim h1 {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    font-size:2vw;
    margin:0;
    line-height:2;
    bottom: auto;
}


.scrim #Krush {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top:4vw;
    bottom:0;
    background-color: black;
}

.scrim .Krush {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    top: 4vw;
    bottom: 0;
    background-color: black;
    overflow: hidden;
    border: none;
}

.scrim .Krush #Krushframe {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: black;
    border: none;
}

@media screen and (orientation:portrait) {
    .scrim h1 {
        font-size: 4vw;
    }
    .scrim #Krush {
        top: 8vw;
    }
}

.scrim #KrushPlayer {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top:0;
    bottom:0;
    background-color:black;
}

.scrim #KrushPlayer #div-gpt-ad-1613776322473-0 {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}

.scrim #KrushPlayer #div-gpt-ad-1613776322473-0 div {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}

.scrim #KrushPlayer #div-gpt-ad-1613776322473-0 div iframe {
    width: 100% !important;
    height: 100% !important;
}


.scrim .adimage {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-position:50% 50%;
    background-repeat:no-repeat;
    background-size:auto auto;
}

.scrim .advideo {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 10%;
    bottom: 0;
    width: 100%;
    cursor:pointer;
}

.scrim .advideo .op-player {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    max-height: 100%;
    border: none;
    outline: none;
}

.scrim .advideo video {
    position: absolute;
    right: 0;
    bottom: 0;
    width:100%;
    height:100%;
    max-height: 100%;
    border:none;
    outline:none;
    object-fit:contain;
}

.scrim .adButton {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    max-height: 100%;
    border: none;
    outline: none;
    object-fit: contain;
    background-image: url(/UserControls/OpenPlayerJs/play.svg);
    background-size: 40% auto;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    opacity: 1;
    pointer-events: none;
    cursor:pointer;
}

.op-player__loader {
    display: none;
}





.tournament-text {
    font-style: normal;
    color: #FFFFFF !important;
    text-align: center !important;
}

.tournament-title {
    font-size: 40px;
    font-weight: 900;
    cursor: default !important;
}

.tournament-line1 {
    font-size: 24px !important;
    font-weight: 300 !important;
    line-height: 30px !important;
    white-space: normal !important;
}

.tournament-line2 {
    font-size: 24px !important;
    font-weight: 900 !important;
    line-height: 30px !important;
    white-space: normal !important;
}

.tournament-line3 {
    font-size: 20px !important;
    font-weight: lighter !important;
    line-height: 30px !important;
    margin: 0px !important;
    white-space: normal !important;
}

.tournament-register-button {
    font-size: 18px !important;
}

#LobbyList .Item.Link span.tournament-register-button {
    cursor: pointer;
}

@media screen and (max-width:1080px) {
    .tournament-title {
        font-size: 32px;
    }

    .tournament-line1 {
        font-size: 20px !important;
    }

    .tournament-line2 {
        font-size: 20px !important;
    }

    .tournament-line3 {
        font-size: 18px !important;
    }

    .tournament-register-button {
        font-size: 16px !important;
    }
}

@media screen and (max-width:900px) {
    .tournament-title {
        font-size: 28px;
    }

    .tournament-line1 {
        font-size: 18px !important;
    }

    .tournament-line2 {
        font-size: 18px !important;
    }

    .tournament-line3 {
        font-size: 16px !important;
    }

    .tournament-register-button {
        font-size: 16px !important;
    }
}

@media screen and (max-width:640px) {
    .tournament-title {
        font-size: 24px;
    }

    .tournament-line1 {
        font-size: 16px !important;
    }

    .tournament-line2 {
        font-size: 16px !important;
    }

    .tournament-line3 {
        font-size: 14px !important;
    }

    .tournament-register-button {
        font-size: 14px !important;
    }
}