:root {
    --aksla: #FF2523;
}

@font-face {
    font-family: Rupert;
    src: url('../../fonts/Rupert-Display.woff');
}

@font-face {
    font-family: Pressura;
    src: url('../../fonts/GT-Pressura-Light.woff2');
}

*, :after, :before {

    box-sizing: border-box;
}

svg:not(:root) {

    overflow: hidden;
}

@media (min-width: 576px) {

    .navbar {

        padding-bottom: 0;
    }
}

a {

    color: #FF2523;
}

.grassroot {

    width: 100%;
}

body {

    letter-spacing: .4px;
    line-height: 1.4;
}

h1,h2,h3,h4,h5,h6 {

    font-weight: 400;
    margin: 0;
}
h1,h2,h4,h5,h6 {

    margin: 1em;
    color: #FF2523;
}
h3 {

    font-size: .9rem;
}
p {
    font-size: 0.8rem;
}
img {
    border: 0;
}

.bg-thirtiary {

    background: #FF2523;
}

nav a{

    color: #fff !important;
}
a.nav-link {

    padding-bottom: 1em;
}

a.nav-link:hover, a.nav-link.active {

    background: #e02120;
}

.dropdown-item:hover, .dropdown-item.active {

    color: #fff !important;
    background: none !important;
}

.team-table .ownteam {

    background: #FF2523;
    color: white;
}

nav a.navbar-brand {

    text-transform: uppercase;
    font-weight: 700;
    font-size: 150% !important;
}

.navbar-toggler {
    outline:none !important;
}

.fixtures {

    font-size: 80%;
    margin-top: 1em;
}

.fixture:first-child {

    border-top: 1px solid #e9e8e8;
}

.fixture {

    font-family: Helvetica Neue, sans-serif;
    border-bottom: 1px solid #e9e8e8;
}

.fixture.odd {
    background: #f6f6f6;
}

.fixture.even {
    background: #fff;
}


.fixture-content {

    position: relative;
    padding: 25px 2.4%;
}

.fixture-row:before {

    content: " ";
    display: table;
}

.fixture-row:after {
    content: " ";
    display: table;
    clear: both;
}

.fixture-status {

    width: 6%;
    padding-right: 1%;
    display: block;
    float:left;
    min-height: 40px;
    vertical-align:top;
}

.fixture-status span {

    font-size: 0.8rem;
    font-family: "Gotham Narrow SSm A", "Gotham Narrow SSm B", Arial, sans-serif;
    display: block;
    text-align:center;
    height: 40px;
    max-width: 40px;
    padding: 13px 0 0;
    font-weight: 700;
    background: #ddd;
}

.fixture-status span.win {

    background: #2fdca5;
}
.fixture-status span.loss {

    background: #ff2523;
    color: white;
}
.fixture-status span.home {

    background: #FF2523;
    color: #a30900;
}
.fixture-status span.away {

    background: #ddd;
    color: #a8a8a8;
}

.fixture-status span abbr {

    text-decoration: none;
    border: none;
}

.fixture-block {

    padding-right: 1%;
    display: block;
    float: left;
    min-height: 40px;
    vertical-align: top;
}

.fixture-block-first {

    width: 13%;
}
.fixture-block-heading {

    margin: 5px 0 0;
}
.fixture-block-heading-topline {

    display: inline-block;
    line-height: 1;
    padding-bottom: 5px;
}
.fixture-block-heading-bottomline {

    line-height: 1;
    padding-bottom: 5px;
    display: block;
    font-size: .8rem;
    color: #747678;
}
.fixture-block-split {

    width: 45%;
    padding-right: 0;
}

.fixture-block-result {

    font-size: 1.2rem;
    font-family: Helvetica, sans-serif;
    margin: 0;
}

.fixture-block-result-left, .fixture-block-result-right {

    width: 40%;
    padding-top: 10px;
}
.fixture-block-result-left, .fixture-block-result-right, .fixture-block-result-center {

    display: block;
    float: left;
}
.fixture-block-result-left {

    text-align: right;
}
.fixture-block-result-left img, .fixture-block-result-right img, .fixture-block-result-center img {

    display: block;
    height: 40px;
    margin-top: -10px;
}
.fixture-block-result-center {

    vertical-align:top;
    padding: 10px 2%;
    width: 20%;
    text-align:center;
}
.fixture-block-result-left img {

    float: right;
    margin-left: 8px;
}
.fixture-block-result-right img {

    float: left;
    margin-right: 8px
}

.fixture-block-second {

    width: 22%;
}
.fixture-block-third {

    width: 18%;
}

.fixture-block-crest {

    display: block;
    float: left;
    height: 40px;
    margin-right: 12px;
}
.fixture-block-heading-bottomline a {
    color: inherit;
    text-decoration: none;
}
.fixture-block .icon {

    fill: #747678;
    height: 10px;
    margin-right: 3px;
    float: left;
    width: 10px;
}

td.statistics-table-col {

    vertical-align: middle;
}

.statistics-table-avatar {

    display: block;
    height: 70px;
    width: 70px;
}

.statistics-table-avatar .img-thumbnail {

    margin-bottom: 0;
    padding-bottom: 0;
}




.player-top-wrapper {

    height: 220px;
    /*width: 80%;*/
    background: #ff2523;
    margin: 0 auto;
    position: relative;
    margin-top: 1em;
}

.player-top-logo {

    background: url('../../img/icons/icon-384.png') -40px no-repeat;
    opacity: .1;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.player-top-bottom {

    position: absolute;
    top: 50%;
    height: 50%;
    bottom: 0;
    width: 100%;
    background: #a70a00;
    opacity: 0.3;
}

.player-top-image {

    position: absolute;
    bottom: 0;
}

.player-top-info {

    color: white;
    position: absolute;
    top: 15%;
    left: 200px;
    right: 0;
}

.player-top-name {

    font-family: 'Source Sans Pro', sans-serif;
    font-size: 1rem;
    font-weight: 300;
}

.player-top-name a {
    color: inherit;
}

.player-top-name-bottomline {

    font-size: 2rem;
    font-weight: 700;
}

.player-top-info-left {

    position: absolute;
    bottom: -115px;
    opacity: .8;
    font-size: .8rem;
}

.player-top-info-left.statistics {

    top: 90px;
}

.player-top-info-left td:first-child {
    min-width: 6rem;
}

.player-top-info-right-block:not(:last-of-type) {

    border-right: 1px solid rgba(238, 238, 238, .35);
}

.player-top-info-right-topline {

    font-size: 1.5rem;
}

.player-top-info-right-bottomline {

    font-size: 2.5rem;
}

table td.table-fit,
table th.table-fit {
    white-space: nowrap;
    width: 1%;
}

/* Players index -- User page */
.player-list-position {
    margin-left: 0;
    margin-right: 0;
    font-size: 200%;
    font-family: "Trebuchet MS", sans-serif;
}

.players-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: stretch;
}

.player-container {
    position: relative;
    box-shadow: 0 3px 10px rgb(255 0 0 / 0.2);
    width: 250px;
    margin: 0 20px 20px 0;
}

.player-container a {
    text-decoration: none;
}

.player-shirt-number {
    position: absolute;
    top: 0;
    right: 5px;
    font-size: 70px;
    line-height: 71px;
    -webkit-text-stroke: 2px #FF2523;
    color: transparent;
    transition: color .2s ease-in-out;
    z-index: 10;
}

.player-names {
    vertical-align: middle;
    padding: .5rem;
    font-size: 140%;
    background: #fff;
    transition: background,color .2s ease-in-out;
}

.player-container:hover .player-names {
    background: #FF2523;
    color: #fff;
}

.player-container:hover .player-shirt-number {
    color: #FF2523;
}

.player-name {
    display: block;
    margin: 5px 0;
}

.player-image {
    position: relative;
    background-image: url("../../img/redship.png");
    background-size: cover;
    text-align: center;
}

.player-flag {
    position: absolute;
    bottom: 8px;
    left: 8px;
}

.player-flag img {
    width: 30px;
}

/* End of Players index -- User page */

/* Start of Players view -- User page */
.player-bio {
    font-family: Pressura, Arial, Helvetica, "sans-serif";
}

.bio-container {
    position: relative;
    background: #f2f2f2;
    border-bottom: .1rem solid #e5e5e5;
}

.bio-background-logo {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-size: cover;
    background: url('../../img/icons/icon-384.png') -40px no-repeat;
    opacity: .1;
}

.bio-link {
    display: block;
    width: 100%;
    height: 100%;
    color: inherit;
}

.bio-header-container {
    display: flex;
    justify-content: center;
}

.bio-header-container-reverse-detail-image {
    flex-direction: row-reverse;
}

.bio-header-container-align-center {
    align-items: center;
}

.bio-information {
    padding: 1rem;
    flex-grow: 1;
    max-width: 500px;
}

.bio-information {
    text-align: center;
    color: var(--aksla);
}

.bio-container-reverse-colors {
    background: var(--aksla);
}

.bio-container-reverse-colors .bio-information{
    color: #eee !important;
}

.bio-information-summary {
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.23rem;
    font-family: Rupert, Arial, Helvetica, "sans-serif";
}

.bio-information-shirt {
    font-size: 2rem;
}

.bio-information-first-name {
    font-size: 3.5rem;
    margin-top: -1.2rem;
}

.bio-information-last-name {
    font-size: 5rem;
    margin-top: -2.2rem;
}

.bio-information-details {
    font-size: 1.4rem;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -.5rem;
}

.bio-information-location {
    display: flex;
    align-items: center;
}

.bio-information-details > div {
    margin: 0 5px;
}

.bio-information-details img {
    height: 20px;
    margin-bottom: 6px;
}

.bio-information-divider {
    font-size: 80%;
    margin-bottom: 5px !important;
}

.bio-player-image-container {
    position: relative;
    display: flex;
    justify-content: center;
    min-width: 250px;
    min-height: 230px;
    max-width: 500px;
}

.bio-player-image {
    position: absolute;
    bottom: 0;
}

.bio-information-stats {
    margin: 1rem auto;
    padding: 0 1rem;
    text-align: center;
    max-width: 1000px;
}

.bio-information-stats-main-header {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 1.5rem;
}

.bio-stats {
    margin: 2rem;
    overflow: auto;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.bio-stats-unit {
    width: 25%;
    padding-bottom: 3rem;
}

.bio-stats-unit-larger {
    width: 33%;
}

.bio-stats-unit-description {
    font-size: 1.4rem;
}

.bio-stats-unit-value {
    font-size: 2.5rem;
    color: var(--aksla);
}

.bio-stats-unit-value-text {
    font-size: 1.5rem;
    color: var(--aksla);
}

.bio-stats-unit-value-card {
    display: inline-block;
    font-size: 1.125rem;
    margin: 4px;
    padding: 10px;
    position: relative;
    width: 40px;
    top: -9px;
    text-align: center;
}

.bio-stats-unit-value-card-yellow {
    color: #333;
    background-color: #fdb913;
}

.bio-stats-unit-value-card-red {
    color: #eee;
    background-color: #e21b23;
}

.seasons-stats {
    margin: 0 .5rem;
}

.seasons-stats h4 {
    text-align: center;
}

.seasons-table {
    max-width: 1000px;
    width: 100%;
    border-collapse: collapse;
    border-radius: .5em;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(103, 103, 103, 0.2);
    margin: 0 auto 2rem auto;
}

.seasons-table thead {
    background-color: var(--aksla);
    color: #eee;
}

.seasons-table tbody {
    background-color: #f3f3f3;
}

.seasons-table tr:nth-child(even) {
    background-color: #fff;
}

.seasons-table th, .seasons-table td {
    padding: .75rem;
    text-align: center;
}

/* End of Players view -- User page */

@media (max-width: 1343px) {

    .fixture-content {

        padding-left: 1.7%;
        padding-right: 1.7%;
    }
    .fixture-block-split {

        width: 70%;
    }
    .fixture-block-second {

        width: 30%;
    }
    .fixture-block-third {

        width: 16.6%;
    }
}

@media (max-width: 1024px) {

    .fixture-content {

        padding-left: 2.7%;
        padding-right: 2.7%;
    }
    .fixture-status {

        width: 7%;
    }
    .fixture-block {

    }
    .fixture-block-first {

        width: 18%;
    }
    .fixture-block-split {

        width: 70%;
    }
    .fixture-block-second {

        width: 30.5%;
        margin-left: 3%;
    }
    .fixture-block-third {

        width: 20%;
    }
}

@media (max-width: 700px) {

    .fixture-content {

        padding-left: 6.8%;
        padding-right: 6.8%;
    }
    .fixture-status {

        min-height: 40px;
        width: 35px;
        padding-right: 0;
    }

    .fixture-status span {

        height: 25px;
        max-width: 25px;
        padding: 6px 0 0;
    }
    .fixture-block {

        min-height: 40px;
        width: 25%;
    }
    .fixture-block-first {

        width: 55%;
        margin-bottom: 50px;
    }
    .fixture-block-second {

        position: absolute;
        top: 60px;
        text-align:center;
        width: 80%;
        left: 10%;
    }
    .fixture-block-third {

        width: 30%;
        text-align: right;
        float: right;
        padding-right: 0;
    }
    .fixture-block-crest {

        float: none;
        display: inline-block;
    }
    .fixture-block-second .fixture-block-heading {

        display: inline-block;
        vertical-align: top;
        padding-top: 7px;
    }
    .fixture-block-second .fixture-block-heading-topline {

        font-size: 1.2rem;
        font-family: Helvetica, sans-serif;
    }
    .fixture-block-heading-topline,.fixture-block-heading-bottomline {

        display: inline-block;
    }
    .fixture-block-heading-topline {

        font-size: .8rem;
        font-family: Helvetica, sans-serif;
    }
    .fixture-block-heading-bottomline {

        font-size: .8rem;
        color:inherit;
        position: absolute;
        right: 7%;
        top: 31px;
        font-family: Helvetica, sans-serif;
    }
    .fixture-block-split {

        margin-left: 0;
        margin-top: -50px;
        margin-bottom: 20px;
        width: 100%;
    }
    .fixture-block-result {

        font-size: .8rem;
    }
    .fixture-block-result-left img, .fixture-block-result-right img {

        height: 30px;
        margin-top: -5px;
    }
    .fixture-block-result-left img {
        float: right;
        margin-left:8px;
    }
    .d-sm-none {

        display: inline-block;
    }
}

/* Start of Players view -- User page */
@media screen and (max-width: 660px) {
    .bio-header-container {
        flex-direction: column-reverse;
    }

    .bio-background-logo {
        background-position: center;
    }

    .bio-information-first-name {
        font-size: 2rem;
        margin-top: -.3rem;
    }

    .bio-information-last-name {
        font-size: 3rem;
        margin-top: -.8rem;
    }

    .bio-information-details {
        font-size: 1rem;
        margin-top: 0;
    }

    .bio-information-details-text-larger {
        font-size: 180%;
    }

    .bio-stats-unit {
        width: 50%;
        margin: 0 auto;
    }

    .bio-stats-unit-keep-large {
        width: 100%;
    }
}
/* End of Players view -- User page */

@media (max-width: 575px) {

    nav.navbar {

        border-bottom: 1px solid #cb2523;
    }
    a.navbar-brand {

        position: absolute;
        left: 45%;
        top: 5px;
    }
    .navbar-brand img {

        height: 40px;
    }


    .players {

        margin-top: 2rem;
    }

    .player-top-wrapper {

        width: 100%;
        margin-top: 0;
    }

    .player-top-image {

        left: -15px;
    }

    .player-top-info {

        left: 180px;
    }
}

.trivia-name {
    font-size: 1.4rem;
}

@media screen and (max-width: 568px) {
    .player-list-position {
        text-align: center;
    }
    .players-row {
        justify-content: center;
    }
}