/* Basic setup */

html {
    height: 100%;
}

body {
    font-family: 'Lato';
    height: 100%;
    color: #444;
    background: rgba(200, 232, 255, 0.28) linear-gradient(rgb(125, 200, 253), rgba(200, 232, 255, 0)) no-repeat;
}

a {
    color: #000;
    text-decoration: none;
    transition: color 0.5s;
}

a:hover,
a:focus {
    color: rgba(228, 2, 45, 1);
    text-decoration: underline;
    transition: color 0.5s;
}

.btn,
ul.pagination li {
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 0.3vmin;
    cursor: pointer;
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    padding: 0.75vmin 1.5vmin;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    transition: all 0.5s;
    font-size: 1.5vmin;
}

.btn-info {
    background: rgba(18, 117, 187, 0.2);
}

.btn-small {
    padding: 0.2vmin 0.5vmin;
}

.btn-info:hover {
    background: rgba(18, 117, 187, 0.1);
    border-color: rgb(0, 0, 0);
    transition: all 0.5s;
}

.mobile,
.hidden {
    display: none !important;
}

.print {
    display: none;
}

.width-container {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    overflow: auto;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

.text-center {
    text-align: center;
}

.text-justify {
    text-align: justify;
}

.text-nowrap {
    white-space: nowrap;
}

.text-lowercase {
    text-transform: lowercase;
}

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

.text-capitalize {
    text-transform: capitalize;
}

.text-strikethrough {
    text-decoration: line-through;
}

.text-muted {
    color: #777;
}

.text-primary {
    color: #337ab7;
}

.warning {
    background-color: rgba(18, 117, 187, 0.1);
}

/* navigation */

#mobile-menu {
    display: none;
}

#main-navigation {
    background: rgba(255, 255, 255, 1);
    padding: 0.5%;
    border: 1px solid rgba(18, 117, 187, 1);
    border-width: 0 0 1px 0;
    height: 6.5vh;
    box-shadow: 0px 0px 0.5vmin 0.5vmin rgba(18, 117, 187, 0.3);
}

.nav-left {
    background: url("/public/images/quiz-live-logo-100.png") no-repeat left;
    background-size: contain;
    width: 15%;
    float: left;
}

.nav-right {
    width: 85%;
    float: right;
    text-align: right;
}

#main-navigation h1 {
    font-size: 2vmin;
    margin: 2vmin 0 2vmin 4vmin;
}

#main-navigation ul {
    list-style-type: none;
    margin: 0.7vh 0 0 0;
    padding: 0;
    display: inline-block;
    font-size: 1.2vmin;
}

#main-navigation ul:not(:first-child) {
    border: 1px solid rgba(0, 0, 0, 0.3);
    padding-right: 0;
    border-width: 0 0 0 1px;
}

#main-navigation ul li {
    display: inline-block;
}

#main-navigation ul li span {
    display: inline-block;
    padding: 1.5vmin 1.5vmin 1.5vmin 4vmin;
}

#main-navigation ul li.pulldown span {
    padding-left: 6vmin;
}

/* here */

#main-navigation .dropdownContent {
    display: none;
    position: absolute;
    background-color: rgba(255, 255, 255, 1);
    min-width: 15vmin;
    box-shadow: 0 0.5vmin 0.5vmin 0 rgba(0, 0, 0, 0.2);
    z-index: 1;
}

#main-navigation ul li a,
#main-navigation span {
    display: inline-block;
    padding: 1vmin 1vmin 1vmin 5vmin;
    border: 1px solid rgba(0, 0, 0, 0);
    border-width: 1px 1px 0 1px;
}

#main-navigation span.selected {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(0, 0, 0, 0.5);
    border-width: 1px 1px 0 1px;
    border-radius: 0.3vmin 0.3vmin 0 0;
    box-shadow: 0 0.5vmin 0.5vmin 0 rgba(0, 0, 0, 0.2);
}

#main-navigation ul.dropdownContent {
    border: 1px solid rgba(0, 0, 0, 0.75);
    border-radius: 0 0.3vmin 0.3vmin 0.3vmin;
    text-align: left;
}

#main-navigation ul.dropdownContent {
    margin: 0;
    padding: 0;
}

#main-navigation ul.dropdownContent li {
    display: block;
    font-size: 1.4vmin;
    min-height: unset;
    padding: 0;
    margin: 0;
}

#main-navigation ul.dropdownContent li.spacer {
    color: rgb(0, 80, 38);
    background: rgba(0, 175, 77, 0.1);
    margin: 0;
    padding: 1.5vmin;
}

#main-navigation ul li.search {
    background: url(/public/images/search-55.png);
}

#main-navigation ul li.user {
    background: url(/public/images/user-55.png);
}

#main-navigation ul li.organisation {
    background: url(/public/images/organisation-55.png);
}

#main-navigation ul li.question {
    background: url(/public/images/question-55.png);
}

#main-navigation ul li.venue {
    background: url(/public/images/venue-55.png);
}

#main-navigation ul li.note {
    background: url(/public/images/list-55.png);
}

#main-navigation ul li.task {
    background: url(/public/images/list-55.png);
}

#main-navigation ul li.quiz {
    background: url(/public/images/quiz-55.png);
}

#main-navigation ul li.tag {
    background: url(/public/images/exclamation-mark-55.png);
}

#main-navigation ul li.dashboard {
    background: url(/public/images/dashboard-55.png);
}

#main-navigation ul li.quizmaster-academy {
    background: url(/public/images/quiz-55.png);
}

#main-navigation ul li.report {
    background: url(/public/images/graph-data-55.png);
}

#main-navigation ul li.admin {
    background: url(/public/images/exclamation-mark-55.png);
}

#main-navigation ul li.logout {
    background: url(/public/images/down-arrow-55.png);
}

#main-navigation ul li.search,
#main-navigation ul li.user,
#main-navigation ul li.organisation,
#main-navigation ul li.question,
#main-navigation ul li.venue,
#main-navigation ul li.note,
#main-navigation ul li.task,
#main-navigation ul li.quiz,
#main-navigation ul li.tag,
#main-navigation ul li.dashboard,
#main-navigation ul li.quizmaster-academy,
#main-navigation ul li.report,
#main-navigation ul li.admin,
#main-navigation ul li.logout {
    background-repeat: no-repeat;
    background-position: 0.5vmin center;
    background-size: auto 90%;
}

#main-navigation ul.dropdownContent li.organisation {
    background: url(/public/images/organisation-55.png);
}

#main-navigation ul.dropdownContent li.venue {
    background: url(/public/images/venue-55.png);
}

#main-navigation ul.dropdownContent li.note {
    background: url(/public/images/list-55.png);
}

#main-navigation ul.dropdownContent li.task {
    background: url(/public/images/exclamation-mark-55.png);
}

#main-navigation ul.dropdownContent li.question {
    background: url(/public/images/question-55.png);
}

#main-navigation ul.dropdownContent li.quiz {
    background: url(/public/images/quiz-55.png);
}

#main-navigation ul.dropdownContent li.tag {
    background: url(/public/images/exclamation-mark-55.png);
}

#main-navigation ul.dropdownContent li.dashboard {
    background: url(/public/images/dashboard-55.png);
}

#main-navigation ul.dropdownContent li.quizmaster-academy {
    background: url(/public/images/quiz-55.png);
}

#main-navigation ul.dropdownContent li.organisation,
#main-navigation ul.dropdownContent li.venue,
#main-navigation ul.dropdownContent li.note,
#main-navigation ul.dropdownContent li.task,
#main-navigation ul.dropdownContent li.question,
#main-navigation ul.dropdownContent li.quiz,
#main-navigation ul.dropdownContent li.tag,
#main-navigation ul.dropdownContent li.dashboard,
#main-navigation ul.dropdownContent li.quizmaster-academy,
#main-navigation ul.dropdownContent li.spacer.question,
#main-navigation ul.dropdownContent li.spacer.warning {
    padding-left: 4.5vmin;
    background-color: rgba(18, 117, 187, 0.1);
    background-repeat: no-repeat;
    background-position: 0.5vmin center;
    background-size: auto 70%;
}

#main-navigation ul.dropdownContent li a {
    display: inline-block;
    padding: 1.5vmin;
    transition: all 0.5s;
    color: #000;
    text-decoration: none;
    min-width: 15vmin;
}

#main-navigation ul.dropdownContent li a:hover,
#main-navigation ul.dropdownContent li a:focus {
    color: #a81212;
    text-decoration: underline;
    background: rgba(0, 0, 0, 0.1);
    transition: all 0.5s;
}

#main-navigation .show {
    display: block;
}

/* general content */

.content {
    background: rgba(255, 255, 255, 1);
    padding: 2%;
    margin: 4vmin auto 1vmin auto;
    border: 1px solid rgba(18, 117, 187, 1);
    border-radius: 0.5vmin;
    box-shadow: 0px 0px 0.5vmin 0.5vmin rgba(18, 117, 187, 0.3);
    overflow: auto;
}

.alert {
    margin: 2vmin 0;
    padding: 1vmin 0;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-width: 1px 0;
}

.alert-info {
    background: rgba(0, 0, 0, 0.05);
}

nav ul {
    list-style-type: none;
    margin: 1vmin 0;
    padding: 0;
    display: inline-block;
}

nav li {
    display: inline-block;
    padding: 0 1vmin 0 0;
}

h1 {
    font-size: 2vmin;
    margin: 2vmin 0;
}

h2 {
    font-size: 1.7vmin;
    margin: 2vmin 0;
}

p, li, td, th {
    font-size: 1.5vmin;
}

select::selection,
input::selection,
p::selection {
    background: rgba(18, 117, 187, 1);
    color: rgba(255, 255, 255, 1);
}

.content h1 {
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0.5vmin;
    background: rgba(0, 0, 0, 0.05);
    margin: 0 0 2vmin 0;
    padding: 1vmin;
    font-weight: 300;
}

.content h1.blue-header,
.content h1.blue-header-organisation,
.content h1.blue-header-venue,
.content h1.blue-header-question,
.content h1.blue-header-user,
.content h1.blue-header-profile,
.content h1.blue-header-search,
.content h1.blue-header-tag,
.content h1.blue-header-venue,
.content h1.blue-header-quiz,
.content h1.blue-header-note,
.content h1.blue-header-task,
.content h1.blue-header-home {
    color: rgba(13, 80, 128, 1);
    font-size: 1.6em;
    font-weight: 400;
    background: rgba(18, 117, 187, 0.1);
    padding: 1.5vmin 1.5vmin 1.3vmin 7.5vmin;
}

.content h1.organisation,
.content h1.blue-header-organisation {
    background: url(/public/images/organisation-55.png);
}

.content h1.question,
.content h1.blue-header-question {
    background: url(/public/images/question-55.png);
}

.content h1.user,
.content h1.blue-header-user,
.content h1.profile,
.content h1.blue-header-profile {
    background: url(/public/images/user-55.png);
}

.content h1.search,
.content h1.blue-header-search {
    background: url(/public/images/search-55.png);
}

.content h1.tag,
.content h1.blue-header-tag {
    background: url(/public/images/exclamation-mark-55.png);
}

.content h1.quiz,
.content h1.blue-header-quiz {
    background: url(/public/images/quiz-55.png);
}

.content h1.venue,
.content h1.blue-header-venue {
    background: url(/public/images/venue-55.png);
}

.content h1.note,
.content h1.blue-header-note {
    background: url(/public/images/list-55.png);
}

.content h1.task,
.content h1.blue-header-task {
    background: url(/public/images/exclamation-mark-55.png);
}

.content h1.home,
.content h1.blue-header-home {
    background: url(/public/images/plus-55.png);
}

.content h1.blue-header-organisation,
.content h1.blue-header-venue,
.content h1.blue-header-question,
.content h1.blue-header-user,
.content h1.blue-header-profile,
.content h1.blue-header-search,
.content h1.blue-header-tag,
.content h1.blue-header-quiz,
.content h1.blue-header-venue,
.content h1.blue-header-note,
.content h1.blue-header-task,
.content h1.blue-header-home {
    background-position: 0.6vmin center;
    background-size: auto 85%;
    background-color: rgba(18, 117, 187, 0.1);
    background-repeat: no-repeat;
    border: 0;
}

.content h1.organisation,
.content h1.venue,
.content h1.question,
.content h1.user,
.content h1.profile,
.content h1.search,
.content h1.tag,
.content h1.quiz,
.content h1.venue,
.content h1.home {
    background-color: rgba(0, 0, 0, 0.05);
    background-position: 0.6vmin center;
    background-size: auto 85%;
    background-repeat: no-repeat;
    padding: 1.5vmin 1.5vmin 1.3vmin 7.5vmin;
}

.tabs h1.blue-header,
.tabs h1.blue-header-venue,
.tabs h1.blue-header-question,
.tabs h1.blue-header-user,
.tabs h1.blue-header-profile,
.tabs h1.blue-header-search,
.tabs h1.blue-header-tag,
.tabs h1.blue-header-quiz,
.tabs h1.blue-header-venue,
.tabs h1.blue-header-home {
    font-size: 1.6vmin;
    padding: 1.5vmin 1.5vmin 1.3vmin 1.5vmin;
    border-radius: 0.5vmin;
    margin: 0 0 1.5vmin 0;
}

section.highlighted {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0.3vmin;
    padding: 2vmin;
}

fieldset {
    border: 1px solid rgba(0, 0, 0, 0.35);
    border-radius: 0.3vmin;
    padding: 1.5vw;
    margin: 1vmin 0;
}

div.form-group {
    margin: 0 0 1vmin 0;
    clear: both;
}

form div.inline-block.border {
    width: 13.5vw;
    float: left;
    border: 1px solid rgba(0, 0, 0, 0.35);
    border-radius: 0.3vmin;
    padding: 0 1vmin 0 1vmin;
    margin: 0 1vw 0 0;
    background: rgba(0, 0, 0, 0.05);
}

form div.inline-block.border div {
    margin: 0;
}

form div.inline-block.border label {
    padding-top: 0.5em;
}

label {
    display: inline-block;
    width: 14vw;
    float: left;
    font-size: 1.5vmin;
    padding-top: 1vmin;
}

span.fakeLabel {
    display: inline-block;
    width: 14vw;
}

span.help-block {
    clear: left;
    display: block;
    margin-left: 14vw;
    color: #a81212;
}

.input-margin {
    margin-left: 14vw;
}

div.input {
    margin: 0 0 1vmin 0;
}

legend {
    font-size: 1.8vmin;
    padding: 0.3vmin 0.8vmin;
    background-color: rgba(18, 117, 187, 0.1);
}

fieldset {
    border: 1px solid rgba(18, 117, 187, 0.3);
    border-radius: 0.3vmin;
}

input {
    display: inline-block;
}

input[type=text],
input[type=email],
input[type=tel],
input[type=password],
input[type=number],
input[type=date],
input[type=datetime-local],
textarea,
select {
    border: 1px solid rgba(0, 0, 0, 0.35);
    border-radius: 0.3vmin;
    padding: 1vmin;
    font-size: 1.5vmin;
}

input[type=checkbox],
input[type=radio] {
    margin: 1vmin 0;
}

textarea {
    height: 8vmin;
}

.input-wide input,
.input-wide textarea {
    width: 55vmin;
}

div.submit {
    margin: 1vmin 0;
    padding: 1vmin 0 0 14vw;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-width: 1px 0 0 0;
}

div.fieldset-submit {
    padding: 1vmin 0 0 15.5vw;
}

div.left-submit {
    padding: 1vmin 0 0 0vw;
}

.form-gentle-highlight {
    padding: 0 1vmin 1vmin;
    margin: 1vmin 0;
    background: rgba(0, 0, 0, 0.02);
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-width: 1px;
    border-radius: 0.3vmin;
}

video {
    border: 1px solid rgba(13, 80, 128, 1);
}

table {
    border: 1px solid rgba(0, 0, 0, 0.35);
    border-collapse: collapse;
    margin-bottom: 1.5vmin;
}

table.full-width {
    width: 100%;
}

.max-height {
    max-height: 30vmin;
    overflow-y: scroll;
}

thead {
    background: rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(0, 0, 0, 0.35);
}

tr:nth-of-type(odd) {
    background: rgba(0, 0, 0, 0.04);
}

tr.error:nth-of-type(even) {
    background-color: rgba(255, 0, 0, 0.2);
}

tr.error:nth-of-type(odd) {
    background-color: rgba(255, 0, 0, 0.1);
}

tr.warning:nth-of-type(even) {
    background-color: rgba(255, 255, 0, 0.2);
}

tr.warning:nth-of-type(odd) {
    background-color: rgba(255, 255, 0, 0.1);
}


th {
    padding: 1vmin;
    text-align: left;
}

th:last-of-type {
    text-align: center;
}

th:first-of-type {
    text-align: left;
}

th.date {
    width: 12vw;
    text-align: center;
}

th.date-left {
    text-align: left;
}

th.action {
    width: 14vw;
}

td {
    padding: 1vmin;
}

td:last-of-type {
    text-align: center;
}

td:first-of-type {
    text-align: left;
}

td.date,
td.action {
    text-align: center;
}

td.date-left {
    text-align: left;
}

table.vertical th {
    text-align: left;
    width: 8vw;
}

table.vertical td {
    text-align: left;
}

ul.pagination {
    margin: 1vmin 0;
    padding: 0;
}

ul.pagination li {
    display: inline-block;
    margin: 0.3vmin;
}

ul.pagination li:first-of-type {
    margin: 0.3vmin 1vmin 0.3vmin 0;
}

ul.pagination li:last-of-type {
    margin: 0.3vmin 0 0.3vmin 1vmin;
}

/* tabs */

nav.tabs ul {
    list-style-type: none;
    margin: 1vmin 0 0 0;
    padding: 0;
    display: inline-block;
    font-size: 1.2vmin;
}

nav.tabs ul:not(:first-child) {
    border: 1px solid rgba(0, 0, 0, 0.3);
    padding-right: 0;
    border-width: 0 0 0 1px;
}

nav.tabs ul li {
    display: inline-block;
    background: rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-width: 1px 1px 0 1px;
    border-radius: 1vmin 1vmin 0 0;
    margin: 0 1vmin 0 0;
    padding: 1.5vmin;
}

nav.tabs ul li.selected {
    background: rgb(184, 206, 217);
}

article.tabs {
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0 1vmin 1vmin 1vmin;
    margin: 0 0 2vmin;
    padding: 1vmin;
    display: none;
    overflow: auto;
}

article.tabs.selected {
    display: block;
}

.dashboard-left {
    width: 24vw;
    float: left;
}

.dashboard-right {
    margin-left: 26vw;
}

li.quiz-list {
    float: left;
    margin: 1vmin 1vmin 1vmin 0;
    list-style-type: none;
}

#organisation-search {
    margin: 2vmin 0;
}