body {
    font-family: "Source Sans Pro", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
    background-color: #EDF7E4;
    padding-bottom: 24px;
}

a {color: #71C837; }
a:hover {color: #65B131; }

th,
td {
  border-bottom: 1px solid #71C837; }

.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
    color: #FFF;
    background-color: #71C837;
    border-color: #71C837; }
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
    color: #FFF;
    background-color: #65B131;
    border-color: #65B131; }

input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
    border: 1px solid #65B131;
    outline: 0; }

/* Customizations */

/*.ranking-table td {margin:0;} */
.ranking-table td,th {padding-bottom: 0; padding-top: 0; border-bottom: 1px solid #71C837;}
.ranking-table-area-divider td {padding-bottom: 0; padding-top: 0; border-bottom: 1.5px solid #4C8625;}
.scoreboard-table td,th {border-bottom: 1px solid #71C837; padding: 2pt 4pt;}
.matchday-table td,th {border-bottom: 1px solid #71C837;}
.matchday {clear: both;}

.rest-betting-time {padding-left: 1em; color: red;}

.bold {font-weight: bold;}
.normal {font-weight: normal;}
.underline {text-decoration: underline;}

table.ranking-table {min-width: 90%;}
table.matchday-table {min-width: 90%}

.right-aligned {text-align: right;}
.left-aligned {text-align: left;}
.centered {text-align: center;}
.no-padding {padding: 0;}
.ongoing {color: red;}
td img {margin-top: 6pt;}
td input {margin-bottom: 0;}
tfoot td {border-bottom: 0;}
.bet-points {color: #0f7cce; text-align: right; padding-right: 0.4ex; font-weight: 800;}
.my-bet {text-align: right; padding-right: 0;}
.other-bet {color: DarkOrange;}
.other-bet-points {color: Orange;}
.other-user-header {font-weight: 600; float: right; padding-right: 0; padding-top: 1ex;}

.no-bet {color: #0f7cce; font-weight: 800;}
.bet-points-total-text {color: #0f7cce; text-align: right; font-weight: 800;}
.no-bet-points-total-text {color: #0f7cce; text-align: center; font-weight: 800;}
.bet-points-total {border-bottom-style: double; border-color: #0f7cce; text-align: right; font-weight: 800;}

.reload-button {width: 30px;}
.matchday-selector {text-align: center; padding-top: 0; margin: 0;}
#matchday-selector-form {padding: 0; margin: 0;}
#matchday-select-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border:none;
    border-radius: 0;
    height: 2em;
    font-size: x-large;
    width: 1em;
    background-color: rgba(0,0,0,0);
    padding: 0; margin: 0;
}

select::-ms-expand {
    display:none;
}

.lt-ie10 select {
    background-image: none;
}

#group-id-width-helper {
    position: absolute;
    top: -10em;
    left: 0;
    height: auto;
    width: auto;
    font-size: x-large;
    white-space: nowrap;
    color: rgba(0,0,0,0);
}

.about {padding-top: 6em;}
.about h1 {font-weight: bold; font-size: xx-large; padding: 0; margin-top: 1em;}
.about h2 {font-weight: bold; font-size: x-large; padding-top: 2em; margin: 0;}
.about img {margin-right: 1ex;}
.about p {margin-bottom: 0.2em; margin-top: 0.9em;}
.upper-reg-button {position: absolute; top: 28px; left: 0px;}

.tournament-title {font-size: larger; text-align: center; padding-top: 1em; padding-bottom: 0em; margin: 0;}
.matchday-link {font-size: x-large;}
.matchday-link a {text-decoration: none;}
.matchday-title {font-size: x-large;}
.disabled {color: #A8A8A8;}

.team-name {width: 40%;}
.regular-team-name {display: none !important;}
.short-team-name {display: none !important;}
.goal-input {width: 4em;}

.ranking-table .team-logo {max-width: 18pt; max-height: 18pt; display: block; margin-left: auto; margin-right: auto; padding-top: 0pt; padding-bottom: 6pt;}
.ranking-table .left-aligned {vertical-align: middle; padding-top: 1pt;}
.ranking-table .left-aligned {vertical-align: middle; padding-top: 1pt;}

/* .team-logo-cell {} */
.matchday-table .team-logo {display: block; max-width: 0; margin-left: auto; margin-right: auto; padding-bottom: 1.1ex;}
.matchday-table td {border-bottom: 0;}
.matchday-table th {border-bottom: 0;}

.page-icon {vertical-align:middle; width: 38px; padding-bottom: 0.4ex;}
/* .page-title {} */

.invite-link {padding-left: 2em;}

table.usergroups-table {width: 100%;}
.usergroups-table td.usergroup-selected {border-bottom: 0;}
.usergroup-details {margin-left: 1.3em; padding: 10px; border: 1px dashed #71C837;}

/*table.usergroup-members-table {width: 100%;}*/
table.usergroup-members-table {margin-left:auto; margin-right:auto;}

.usergroup-members-table td {border-bottom: 0; padding: 0;}

.regular-header {display: none !important;}
.no-decoration {text-decoration: none;}
.delete-button {
    background:none;
    border:none;
    margin:0;
    padding:0;
    font-size: initial;
}
.delete-mark {color: red; padding-right: 0.75ex;}
.critical {color: red; font-weight: bold;}
.match-start-time-cell {color: #777; font-size: small; padding-bottom: 0; padding-top: 1em; border-top: 1pt solid #71C837;}

/* .matchday-table tr:first-child {border:none;} */
.clipboard {width: 24px; margin: 0; padding: 0; padding-top: 0.6ex;}
.clipboard-join-hint {width: 24px; vertical-align: middle;}

.copyright {position: absolute; color: #A8A8A8; float: left; bottom: -10px; top: auto;}
.openligadbkudos {position: absolute; color: #A8A8A8; float: left; bottom: 1.6em; top: auto;}
.imprint {float: right;}

hr {border-top: 1px solid #71C837;}

.dashboard {
    border: 1px dashed #71C837;
    padding: 0 2rem;
    margin: 1.5ex 0 2rem;
}

.dashboard .welcome {font-size: large; text-align: center; margin-top: 1em;}
.dashboard .welcome-nickname {display: inline; overflow: hidden; word-wrap: break-word; max-width: 95%; text-overflow: ellipsis;}
.dashboard-entry {margin-top: 1ex;}

.login {margin: 1.5rem 0 2rem;}
.logout {margin: 0 auto; width: 50%; display: block;}
.login-title {font-weight: bold; padding-bottom: 1em;}
.reg {text-align: center;}
div#password-forgotten {text-align: center;}
.password-forgotten-title {font-weight: bold; font-size: large;}

.me {font-weight: bold;}
.selected {color: DarkOrange;}
.open-close {font-size: large;}

.up-down-arrow {display: inline-block; vertical-align: middle;}
.betting-vs {padding-left: 1ex; padding-right: 1ex; text-align: center;}
.statistics {padding-left: 0.5ex;}
.ranking-diff {vertical-align: middle; display: none !important; padding-left: 2pt;}

.nickname-usergroup {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 8em;}

.ranking-group-title {padding-top: 1.6ex; font-weight: bold; font-size: large;}

table.scoreboard-table {min-width: 100%;}
.points-abbreviated {display: none;}

.reg-submit {float: right;}
.reg-title {font-size: large; font-weight: bold; margin-top: 2em; margin-bottom: 1em;}

div.logo-div {text-align: center; padding: 0; margin-top: 2ex;}
.about-link {position: absolute; bottom: 47px; top: auto;}

.logo-caption {text-transform: uppercase;}

.teaser {
    border: 1px dashed #71C837;
    padding: 0 2rem;
    margin: 1.5ex 0 6rem;
}
.teaser-text p {margin: 0 0 1em 0; padding: 0;}
.teaser-title {font-weight: bold; font-size: large; text-align: center; margin-top: 1em; margin-bottom: 0.75em;}
.reg-now {text-align: center; padding-top: 1ex;}
.reg-now-button {margin: 0;}

.thanks {
  height: 22px;
  padding: 0 6px;
  margin-right: 1em;
  font-size: 8px;
  font-weight: 300;
  line-height: 18px;
  letter-spacing: .1rem;
  border-radius: 2px;
  border: 1px solid #bbb; }

.logo {width: 100pt;}
.logo-link {text-decoration: none;}
.tournament-logo {width: 100pt;}

div.logo-div p {
    padding: 0;
    margin: 0;
    color: #71C837;
    text-indent: 0;
    font-variant: small-caps;
}

.matchday-table td {font-size: 90%;}

.tabs {padding-top: 0.7em; padding-bottom: 0.7em; margin: 0; float: left;}

[role=tablist] li {
    display:inline-block
}

ul.tabs[role=tablist] {
    border-bottom: 0px;
}

.tabs-off a {
    border: 1px dashed #71C837;
    display: inline-block;
    text-align: center;
    padding: .5rem 1rem;
}

a[role=tab] {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border: 1px dashed #71C837;
    display: inline-block;
    text-align: center;
    padding: .5rem 1rem;
}

a:hover[role=tab][aria-selected=false] {
    text-decoration: underline;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border: 1px dashed #71C837;
    display: inline-block;
    text-align: center;
    padding: .5rem 1rem;
    background-color: rgba(0, 0, 0, 0);
}

a[role=tab][aria-selected=true] {
    border: 1px solid #71C837;
    text-decoration: none;
    background-color: #71C837;
    display: inline-block;
    text-align: center;
    padding: .5rem 1rem;
    color: #fff;
    pointer-events: none;
    cursor: default;
}

a:focus[role=tab][aria-selected=true] {
    outline-width: 0;
    outline-style: none;
}

.dashboard-link-div {float: right; padding-right: 0; padding-top: 2ex;}
.usergroup-selector {display:inline; padding: 0; margin: 0;}
.usergroup-selector-title {font-weight: bold; padding-right: 1ex;}
/* .usergroup-select-input {diplay: inline; overflow: hidden; max-size: 100%;} */

.profile-title {font-size: x-large; font-weight: bold; padding-top: 1.5em; padding-bottom: 1em;}
.profile-section {padding-top: 1em;}
.profile-section-title {font-size: large; font-weight: bold; padding-bottom: 1ex;}
.admin-usergroup-name {font-weight: bold;}
.usergroup-code {font-family: "Inconsolata", monospace;}
.create-usergroup-name-input {width: 17em;}

.button.button-secondary,
button.button-secondary,
input[type="submit"].button-secondary,
input[type="reset"].button-secondary,
input[type="button"].button-secondary {
    color: #FFF;
    background-color: red;
    border-color: red;
    /* width: 100%; */ }
.button.button-secondary:hover,
button.button-secondary:hover,
input[type="submit"].button-secondary:hover,
input[type="reset"].button-secondary:hover,
input[type="button"].button-secondary:hover,
.button.button-secondary:focus,
button.button-secondary:focus,
input[type="submit"].button-secondary:focus,
input[type="reset"].button-secondary:focus,
input[type="button"].button-secondary:focus {
    color: #FFF;
    background-color: darkred;
    border-color: darkred; }

#wrapper {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center;
}

#left {
  flex: 0 1 auto;
}
#right {
    flex: 0 1 auto;
    margin-left: 10px;
}

.dropdown {
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyAgIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIiAgIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgICB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgICBpZD0ic3ZnOCIgICB2ZXJzaW9uPSIxLjEiICAgdmlld0JveD0iMCAwIDExLjY0NTM2OCAxMC4wODUxODUiICAgaGVpZ2h0PSIxMC4wODUxODVtbSIgICB3aWR0aD0iMTEuNjQ1MzY4bW0iPiAgPGRlZnMgICAgIGlkPSJkZWZzMiIgLz4gIDxtZXRhZGF0YSAgICAgaWQ9Im1ldGFkYXRhNSI+ICAgIDxyZGY6UkRGPiAgICAgIDxjYzpXb3JrICAgICAgICAgcmRmOmFib3V0PSIiPiAgICAgICAgPGRjOmZvcm1hdD5pbWFnZS9zdmcreG1sPC9kYzpmb3JtYXQ+ICAgICAgICA8ZGM6dHlwZSAgICAgICAgICAgcmRmOnJlc291cmNlPSJodHRwOi8vcHVybC5vcmcvZGMvZGNtaXR5cGUvU3RpbGxJbWFnZSIgLz4gICAgICAgIDxkYzp0aXRsZT48L2RjOnRpdGxlPiAgICAgIDwvY2M6V29yaz4gICAgPC9yZGY6UkRGPiAgPC9tZXRhZGF0YT4gIDxnICAgICB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMzEuNTc2NTA5LC04NS40MzY2NTcpIiAgICAgaWQ9ImxheWVyMSI+ICAgIDxwYXRoICAgICAgIGQ9Im0gMzcuMzk5MTkzLDk1LjUyMTg0MiAtNS44MjI2ODQsLTEwLjA4NTE4NCAxMS42NDUzNjgsLTEwZS03IHoiICAgICAgIGlkPSJwYXRoNDQ4OSIgICAgICAgc3R5bGU9ImNvbG9yOiMwMDAwMDA7Y2xpcC1ydWxlOm5vbnplcm87ZGlzcGxheTppbmxpbmU7b3ZlcmZsb3c6dmlzaWJsZTt2aXNpYmlsaXR5OnZpc2libGU7b3BhY2l0eToxO2lzb2xhdGlvbjphdXRvO21peC1ibGVuZC1tb2RlOm5vcm1hbDtjb2xvci1pbnRlcnBvbGF0aW9uOnNSR0I7Y29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzOmxpbmVhclJHQjtzb2xpZC1jb2xvcjojMDAwMDAwO3NvbGlkLW9wYWNpdHk6MTtmaWxsOiNmZmZmZmY7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmU7c3Ryb2tlLXdpZHRoOjAuNDg5NjIyMzI7c3Ryb2tlLWxpbmVjYXA6cm91bmQ7c3Ryb2tlLWxpbmVqb2luOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjQ7c3Ryb2tlLWRhc2hhcnJheTpub25lO3N0cm9rZS1kYXNob2Zmc2V0OjA7c3Ryb2tlLW9wYWNpdHk6MTtjb2xvci1yZW5kZXJpbmc6YXV0bztpbWFnZS1yZW5kZXJpbmc6YXV0bztzaGFwZS1yZW5kZXJpbmc6YXV0bzt0ZXh0LXJlbmRlcmluZzphdXRvO2VuYWJsZS1iYWNrZ3JvdW5kOmFjY3VtdWxhdGUiIC8+ICA8L2c+PC9zdmc+) no-repeat #71C837;
    background-size: 1.3rem;
    color: #fff;
    border-color: #71C837;
    border-radius: 0;
    /* width: 100%; */
    max-width: 100%;
    cursor: pointer;
    padding-right: 1.8em;
    background-position: 95% 50%;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
}

@media (min-width: 370px) {
    .matchday-table .team-logo {min-width: 22pt; max-width: 22pt; max-height: 22pt; display: block !important;}
    .ranking-table .team-logo {max-width: 26pt; max-height: 26pt;}
    .ranking-diff {display: inline-block !important;}
    .nickname-usergroup {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 12em;}
}

/* Larger than mobile */
@media (min-width: 400px) {
    .nickname-usergroup {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 13em;}
    .matchday-table .tiny-team-name {display: block !important;}
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
    .matchday-table td {font-size: 100%;}
    .nickname-usergroup {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 30em;}
    .tiny-header {display: none !important;}
    .regular-header {display: block !important;}
    .short-team-name {display: block !important;}
    .tiny-team-name {display: none !important;}
    .matchday-table .tiny-team-name {display: none !important;}
}

/* Larger than tablet */
@media (min-width: 750px) {
    .matchday-selector {padding-top: 0; padding-bottom: 1em; margin: 0;}
    div.logo-div {position: absolute; top: 18px; right: 0px;}
    /* .reload-button {display: none !important;} */
    .logo {width: 100pt;}
    div.tournament-logo-div {position: absolute; top: 18px; left: 0px;}
    .tab {padding-bottom: 1em;}
    .about-link {position: absolute; top: 28px; left: 0px; bottom: auto;}
}

@media (min-width: 800px) {
    .goal-input {width: 3.8em;}
    .logo {width: 120pt;}
}

@media (min-width: 900px) {
    .dashboard-link-div {display: none !important;}
    .nickname-usergroup {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 5em;}
    .points-abbreviated {display: block !important;}
    .points-regular {display: none !important;}
}

/* Larger than desktop */
@media (min-width: 1000px) {
}

@media (min-width: 1025px) {
    .nickname-usergroup {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 7em;}
}

/* Larger than Desktop HD */
@media (min-width: 1200px) {
    .regular-team-name {display: block !important;}
    .short-team-name {display: none !important;}
    .points-abbreviated {display: none !important;}
    .points-regular {display: block !important;}

    /* .nickname-usergroup {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 8em;} */
}

[hidden] {display: none;}
