body {
    color: white;
    background: rgb(93,93,93);
    background: -moz-radial-gradient(circle, rgba(93,93,93,1) 0%, rgba(46,46,46,1) 65%);
    background: -webkit-radial-gradient(circle, rgba(93,93,93,1) 0%, rgba(46,46,46,1) 65%);
    background: radial-gradient(circle, rgba(93,93,93,1) 0%, rgba(46,46,46,1) 65%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#5d5d5d",endColorstr="#2e2e2e",GradientType=1);
}

.modal-header img {
    height: 45px;
}

.logo {
    height: 8rem !important;
}

.icon {
    height: 1.5rem;
}

.flex {
    -ms-flex: 1;
    -webkit-flex: 1;
    flex: 1;
}

.font2 {
    font-size: 2em;
}

.font4 {
    font-size: 4em;
}

.square {
    border: solid white 3px;
    max-height: 100%;
    max-width: 100%;
    margin: auto;
    -moz-border-radius: 10%;
    -webkit-border-radius: 10%;
    border-radius: 10%;
}

.listPlayers {
    border-left: solid 2px white;
}

.btn-control {
    padding: 0;
    border: none;
    background: transparent;
}

    .btn-control:disabled {
        opacity: .5;
    }

    .btn-control img {
        height: 50px;
    }

.valida {
    position: absolute;
    height: 25px;
    bottom: 0;
    left: 0;
}

.field {
    background: #0008;
    text-align: center;
    color: white;
    font-size: 1.2em;
}

    .field:focus {
        background: #0005;
        color: white;
    }


.grid-4-col,
.grid-5-col {
    display: grid;
    grid-gap: 10px;
}

.grid-4-col {
    grid-template-columns: repeat(4, 1fr);
}

.grid-5-col {
    grid-template-columns: repeat(5, 1fr);
}

    .grid-4-col > div,
    .grid-5-col > div {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

        .grid-4-col > div > input,
        .grid-5-col > div > input {
            min-width: 0;
            width: 100%;
        }

.span-col-4 {
    -ms-grid-column: span 4;
    grid-column: span 4;
}

.span-col-5 {
    -ms-grid-column: span 5;
    grid-column: span 5;
}
#Main{
    z-index:0;
}
    #Main:before {
        content: "";
        background: url(/Images/Logo.svg) no-repeat center;
        z-index: -1;
        position:absolute;
        width:100%;
        height:100%;
        opacity:.05;
    }

.Valide-Blue {
    filter: hue-rotate(215deg);
}

.Valide-Green {
    filter: hue-rotate(140deg);
}

.Valide-Gray {
    filter: saturate(0);
}

.crown {
    position: absolute;
    top: -5px;
    left: 30px;
    height: 20px;
    -moz-filter: hue-rotate(-40deg);
    -webkit-filter: hue-rotate(-40deg);
    filter: hue-rotate(75deg);
}
    .crown.all {
        -moz-filter: none;
        -webkit-filter: none;
        filter: none;
    }

#SuggestionDialog md-content[md-theme=docs-dark] md-input-container {
    margin-bottom: 0;
}

md-toast.md-success-theme .md-toast-content {
    background: #6ed76d;
    color: #323232;
}

.md-button-dark {
    color: #fff !important;
    background-color: #343a40 !important;
}

    .md-button-dark[disabled] {
        background-color: rgba(0,0,0,0.12) !important;
    }

/* typical phone screen resolution */
@media only screen and (max-width : 991px) {
    .grid-xs-3-col {
        grid-template-columns: repeat(3, 1fr);
    }

    .span-xs-col-3 {
        -ms-grid-column: span 3;
        grid-column: span 3;
    }

    .font-xs-2 {
        font-size: 2em;
    }

    .font-xs-1 {
        font-size: 1em;
    }
}
/* landscape orientation */
@media only screen and (min-width : 375px) and (max-width : 667px) and (orientation : landscape) {
}
/* portrait orientation */
@media only screen and (min-width : 375px) and (max-width : 667px) and (orientation : portrait) {
}