@background-color-1: #2a6ebf;
@background-color-2: #003069;


@font-face {
    font-family: "Blinker";
    src: url("fonts/Blinker/Blinker-Regular.ttf") format("truetype");
}


body{
    margin: 0px;
    padding: 0px;
}

button{
    background: #022A35;
    color: white;
}

button:hover{
    background: #224A55;
}

button[disabled]{
    background: #aaa;
}

#main-bg{
    width: 100%;
    height: 100%;
    background-image: url('/img/background.png'), linear-gradient(@background-color-1, @background-color-2);
    background-size: 100%;
    padding-top: 20px;
}

#main-container{
    max-width: 1000px;
    background: #F3F3F3;
    border-radius: 5px;
    min-height: 300px;
    margin: 0px auto 0px auto;
    box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.5);
}

#main-title{
    width: 100%;
    border-radius: 5px 5px 0px 0px;
    background: #022A35;
    color: white;
    height: 100px;
    line-height: 100px;
    font-size: 40px;
    font-family: 'Blinker';
    padding-left: 30px;
}

#main-content{
    padding: 30px;
}

#team-name{
    font-size: 30px;
    line-height: 108px;
}

#team-logo{
    float: right;
}

.table{
    margin-bottom: 40px;
}

.table-header-row{
    font-weight: bold;
    font-size: 16px;
    width: 100%;
}

.table-header-cell, .table-cell{
    display: inline-block;
}

.table-row{
    line-height: 30px;
    padding-left: 10px;
}

.team-player-position{
    min-width: 100px;
    text-align: center;
}

.team-player-name{
    width: 50%;
    min-width: 300px;
}

.team-player-strength{
    text-align: center;
    min-width: 50px;
}

.team-total-row{
    font-weight: bold;
    border-top: 1px solid #888;
}

.colored-player-row{
    background-color: #b1fccc;
}

.heading-2{
    font-size: 25px;
    font-weight: bold;
    font-family: 'Blinker';
    border-bottom: 2px solid #444;
    width: 100%;
}