.tabs:not(:last-child) {
    margin-bottom: 2rem;
}

.tabs li {
    font-family:"Neo Sans W01 Medium";
}

.tabs li > span {
    color: #ccc;
    align-items: center;
    border-bottom-color: #dbdbdb;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    display: flex;
    justify-content: center;
    margin-bottom: -1px;
    padding: .5em 1em;
    vertical-align: top;
}

/*a {*/
/*    color: #004f8c;*/
/*}*/

/*a:visited {*/
/*    color: #6c8dbb;*/
/*}*/

.tabs a {
    color: hsl(0, 0%, 48%);
}

.tabs li.is-active a {
    border-bottom-color: #004f8c;
    color: #004f8c;
}

.navbar.is-dark {
    background-color: #004f8c;
}

.navbar.is-dark .navbar-brand .navbar-link.is-active,
.navbar.is-dark .navbar-brand .navbar-link:focus,
.navbar.is-dark .navbar-brand .navbar-link:hover,
.navbar.is-dark .navbar-brand > a.navbar-item.is-active,
.navbar.is-dark .navbar-brand > a.navbar-item:focus,
.navbar.is-dark .navbar-brand > a.navbar-item:hover {
    background-color: #004173;
    color: #f5f5f5;
}

.navbar.is-dark .navbar-end .navbar-link.is-active,
.navbar.is-dark .navbar-end .navbar-link:focus,
.navbar.is-dark .navbar-end .navbar-link:hover,
.navbar.is-dark .navbar-end > a.navbar-item.is-active,
.navbar.is-dark .navbar-end > a.navbar-item:focus,
.navbar.is-dark .navbar-end > a.navbar-item:hover,
.navbar.is-dark .navbar-start .navbar-link.is-active,
.navbar.is-dark .navbar-start .navbar-link:focus,
.navbar.is-dark .navbar-start .navbar-link:hover,
.navbar.is-dark .navbar-start > a.navbar-item.is-active,
.navbar.is-dark .navbar-start > a.navbar-item:focus,
.navbar.is-dark .navbar-start > a.navbar-item:hover {
    background-color: #004173;
    color: #f5f5f5;
}

.navbar.is-dark .navbar-start > a.navbar-item:hover,
.navbar.is-dark .navbar-item.has-dropdown:hover .navbar-link {
    background-color: #004173;
    color: #f5f5f5;
}

.navbar.is-dark {
    border-bottom: 8px solid #6c8dbb;
}

body, button, input, select, option, textarea {
    font-weight: normal;
    font-family:"Neo Sans W01";
}

.container.user-content {
    padding-top: 2em;
    padding-bottom: 2em;
}

strong, b,
.label, .title {
    font-weight: normal;
    font-family:"Neo Sans W01 Medium";
}

h1.title {
    margin-bottom: 2rem;
}

.field {
    padding-left: 2em;
    padding-right: 2em;
}

fieldset {
    border: none;
}

.table td {
    vertical-align: middle;
}

.table td.exercise-result {
    /*display: inline-block;*/
    vertical-align: middle;
    /*margin: .5em;*/
    text-align: center;
    /*cursor: pointer;*/
    padding-left: 2px;
    padding-right: 2px;
}

.exercise-item {
    border-radius: 10em;
    box-shadow: 0 0 2px darkblue,
    0 2px 4px hsla(0, 0%, 0%, .1);
    font-size: 11px;
    line-height: 3em;
    width: 3em; height: 3em;
    color: #999;
}

label.radio {
    margin-bottom: .5em;
}

.control + .label {
    margin-top: 1em;
}

.exq .message {
    margin-top: 1.5em;
}

#user-exercise {
    padding-bottom: 2em;
}

.thread-item .content {
    font-size: 15px;
}

.thread-item,
#user-exercise .exq {
    padding-top: 2em;
    padding-bottom: 1.5em;
    margin: 0;
}

#user-exercise .radio input[type="radio"] {
    float: left;
    margin-top: .4em;
}

#user-exercise .radio .radio-option {
    display: block;
    margin-left: 25px;
    line-height: 1.4;
}

.timeline-item:nth-child(2n+1) {
    background-color: hsla(240, 20%, 80%, .1);
}

.thread-item:nth-child(2n),
#user-exercise .exq:nth-child(2n) {
    background-color: hsla(240, 20%, 80%, .1);
}

.timeline-content .content {
    padding-right: 1em;
}

.badge[data-badge]::after {
    top: .15rem;
}

.badge.is-badge-left::after {
    left: 0;
}

.badge[data-badge]::after {
    box-shadow: none;
    border-radius: 9rem;
}

.navbar-link > .badge,
.navbar-item > .badge {
    padding-left: 2.1rem;
}

.is-mine {
    color: hsla(0, 0%, 0%, .5);
}

.tl-legend {
    float: right;
    font-size: 12px;
    padding-left: 2em;
    padding-right: 2em;
}

.tl-icon {
    font-size: 12px;
    background-color: #dbdbdb;
    color: white;
    border-radius: 5em;
    padding: .3rem;
    margin-left: 1em;
}

.tl-icon.is-new {
    background-color: #23d160 !important;
}

.tl-conv-icon {
    display: inline-block;
    vertical-align: baseline;
    margin-right: .5em
}

.fa-stack[data-count]:after {
    position:absolute;
    right: -4px;
    top: -3px;
    content: attr(data-count);
    font-size:60%;
    padding:.6em;
    border-radius:999px;
    line-height:.75em;
    color: white;
    background: #23d160;
    text-align:center;
    min-width:2em;
    font-family:"Neo Sans W01 Medium";
}

.num {
    font-variant-numeric: tabular-nums;
}

.num.valid {
    color: hsl(141, 71%, 48%);
}

.num.invalid {
    color: hsl(348, 100%, 61%);
}

.valid-invalid-answers strong {
    display: inline-block;
    font-size: 2em;
    line-height: 1;
    width: 1.5em;
    text-align: right;
}

.valid-invalid-answers span {
    font-size: 1em;
}

.cvert {
    display: flex;
    align-items: center;
}

.chorz {
    display: flex;
    justify-content: center;
}

.attachment-link {
    display: block;
}

.attachment-preview {
    display: inline-block;
    margin: 0 .5em .5em 0;
}

.attachment-preview img {
    width: auto;
    max-height: 200px;
    /*box-shadow: 0 2px 4px hsla(0, 0%, 0%, .3);*/
    box-shadow: 0 8px 6px -6px hsla(0, 0%, 0%, .5);
}

.exq .label {
    font-weight: normal;
}

.exq .label img {
    display: inline-block;
    vertical-align: top;
    margin: 1em 1em 1em 0;
}

.dropzone {
    border: 1px solid #ddd;
    margin-top: 1em;
    border-radius: 4px;
}

#deviation-matrix td {
    vertical-align: top;
}

.stage { height: 100%; padding-left: 6px; border-left: 4px solid transparent }
.stage-complete { border-color: hsl(139, 76%, 51%) }
.stage-alert    { border-color: hsl(48, 100%, 67%) }
.stage-missed   { border-color: hsl(348, 100%, 61%) }
.stage-pending  { border-color: hsl(0, 0%, 71%) }

.unselectable {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

fieldset[disabled] a.button {
    opacity: 1;
    cursor: pointer;
}

.stat-flag {
    width: 1em;
    height: 1em;
    border-radius: 1em;
    display: inline-block;
    background-color: hsl(0, 0%, 71%);
}

.stat-flag.success {
    background-color: hsl(139, 76%, 51%);
}

.stat-flag.warning {
    background-color: hsl(48, 100%, 67%);
}

.stat-flag.failure {
    background-color: hsl(348, 100%, 61%);
}

.fas.complete {
    color: hsl(0, 0%, 71%);
}

.fas.success {
    color: hsl(139, 76%, 51%);
}

.fas.warning {
    color: hsl(48, 100%, 67%);
}

.fas.failure {
    color: hsl(348, 100%, 61%);
}

.table-container {
    overflow-x: auto;
}

.eq-question .label {
    font-size: 1.1rem;
    margin-bottom: 1em;
}

.course-stats {
    padding-left: 2.5em;
}

.course-stat {
    padding: 2em .5em 2em 0;
    /*border-bottom: 1px solid #6c8dbb;*/
    border-bottom: 1px solid #dbdbdb;
}

.course-stat:first-child {
    padding-top: 0;
}

.course-stat i.fas {
    width: 18px;
}

.course-stat .title {
    margin-bottom: 1rem;
}

.course-stat .stat-flag {
    margin-right: .25em;
    position: relative;
    top: 1px;
}

.course-articles {
    /*border-right: 1px solid #6c8dbb;*/
    /*border-right: 1px solid #dbdbdb;*/
    padding-right: .5em;
    display: grid;
}

.course-articles article {
    position: relative;
    background-color: white;
    box-shadow:
        2px 2px 8px 0 rgba(0,0,0,0.15);
        /*0 1px 1px 0 rgba(0,0,0,0.15);*/
    margin-bottom: 1.5em;
}

.course-articles article.has-cover {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top left;
    padding-left: 34%;
}

.course-articles article .text {
    padding: 1em 1em 3.5em 1.5em;
    background-color: white;
}

.course-articles article .text h3 {
    font-size: 1.25rem;
}

.course-articles article .text h4 {
    font-size: .9rem;
}

.course-articles article .text .excerpt {
    font-size: .85rem;
}

.course-articles article .read-more {
    position: absolute;
    bottom: 1.25em;
    background-color: #004f8c;
    color: white;
    border: none;
}

/*
@media screen and (min-width: 960px) {

    .course-articles {
        grid-template-columns: repeat(3, 1fr);
        grid-auto-rows: minmax(220px, auto);
        grid-gap: 2em;
    }

    .course-articles article {
        margin-bottom: 0;
    }

    .course-articles article.has-cover {
        grid-row-end: span 2;
    }

    .course-articles article.has-cover {
        padding-left: 0;
        //padding-top: 50%;
    }

    .course-articles article.has-cover .text {
        position: absolute;
        height: 46%; width: 100%;
        bottom: 0;
    }

    .course-articles article:nth-child(2),
    .course-articles article:nth-child(3) {
        grid-row-end: span 1;
        grid-column-end: span 2;
    }

    .course-articles article:nth-child(2).has-cover,
    .course-articles article:nth-child(3).has-cover {
        padding-left: 40%;
        padding-top: 0;
    }

    .course-articles article:nth-child(2).has-cover .text,
    .course-articles article:nth-child(3).has-cover .text {
        height: 100%; width: 60%;
    }
}
*/

.useful-links i {
    width: 18px;
    color: hsl(0, 0%, 71%);
}

.student-widgets {
    display: grid;
    margin-top: 2em;
}

.student-widgets section {
    background-color: #f7f7f7;
    min-height: 4em;
    padding: 1.5em;
}

@media screen and (min-width: 960px) {

    .student-widgets {
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 2em;
    }
}

#course-student-dashboard .title:not(:last-child),
#course-student-dashboard .subtitle:not(:last-child) {
    margin-bottom: .25em;
}

#course-student-dashboard section i {
    margin-right: .2em;
}

#exam-results td input {
    border-style: solid;
    border-width: 1px;
    padding: .2em .4em;
}

#exam-results td input[type="number"] {
    width: 4em;
}

#exam-results td input[type="text"] {
    width: 14em;
}

#exam-results td input.success {
    border-color: #26D76B;
}

#exam-results td input.failure {
    border-color: #FF416B;
}