﻿@import url('http://fonts.googleapis.com/css?family=Lato');

body {
    padding-top: 10px;
    padding-bottom: 20px;
}

.body-content {
    padding-left: 10px;
    padding-right: 10px;
}

.dl-horizontal dt {
    white-space: normal;
}

input,
select,
textarea {
    max-width: 280px;
}

#work-in-progress {
  position: fixed;
  width: 100%;
  height: 100%;
  font-size: 150px;
  text-align: center;
  vertical-align: middle;
  color: #000000;
  z-index: 200000;
  background-color: #FFFFFF;
}

.work-spinner {
  background-color: rgba(0,0,0,0);
  border: 9px solid rgba(27,61,226,0.9);
  opacity: .9;
  border-left: 5px solid rgba(0,0,0,0);
  border-radius: 120px;
  -webkit-box-shadow: 0 0 35px #1B3DE2;
  box-shadow: 0 0 35px #1B3DE2;
  width: 100px;
  height: 100px;
  margin: 0 auto;
  -moz-animation: spin .5s infinite linear;
  -webkit-animation: spin .5s infinite linear;
  -o-animation: spin .5s infinite linear;
  animation: spin .5s infinite linear;
}

body, html, a, p, h1, h2, h3, h4, h5, h6, input, label {
	font-family: 'Lato', sans-serif;
}

span {
    font-family: 'Lato', sans-serif;
}

.question ul,
.question tr,
.questionp ul,
.questionp tr {
    list-style: none;
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}

.question ul li,
.question td,
.question th,
.questionp ul li,
.questionp td,
.questionp th{
  color: #111111;
  position: relative;
  min-height: 60px;
}

.question tbody th {
    vertical-align:middle !important;
}

.question ul li {
  display: block;
  float: left;
}

.question td,
.question th,
.questionp td, 
.questionp th {
    text-align: center;
}

/*.question ul li {
    width: 100%;
}*/

/*.question ul li input[type=radio],
.question td input[type=radio] {
  position: absolute;
  visibility: hidden;
}*/

.question ul li label, 
.question td label{
  font-size: 1.08em;
  min-height: 20px;
}

/*.question ul li:hover label{
	color: #FFFFFF;
}*/

/*.question ul li .check, 
.question td .check {
    display: block;
    position: absolute;
    border: 3px solid #222222;
    border-radius: 100%;
    height: 25px;
    width: 25px;
    top: 30px;
    left: 20px;
    z-index: 5;
    transition: border .25s linear;
    -webkit-transition: border .25s linear;
}*/
.question td .check,
.questionp td .check {
    left: 45% !important ;
}

/*.question ul li:hover .check {
  border: 5px solid #FFFFFF;
}*/

/*.question ul li .check::before,
.question td .check::before {
    display: block;
    position: absolute;
    content: '';
    border-radius: 100%;
    height: 15px;
    width: 15px;
    top: 2px;
    left: 2px;
    margin: auto;
    transition: background 0.25s linear;
    -webkit-transition: background 0.25s linear;
}*/

.question ul li input[type=checkbox] {
    display: block;
    position: absolute;
    border: 3px solid #222222;
    border-radius: 100%;
    height: 25px;
    width: 25px;
    /*top: 30px;*/
    left: 20px;
    z-index: 5;
    transition: border .25s linear;
    -webkit-transition: border .25s linear;
}

.question ul li input[type=checkbox]::before {
    display: block;
    position: absolute;
    content: '';
    border-radius: 100%;
    height: 15px;
    width: 15px;
    top: 2px;
    left: 2px;
    margin: auto;
    transition: background 0.25s linear;
    -webkit-transition: background 0.25s linear;
}

.question ul li .checkbox input[type=checkbox] ~ label {
    display: inline !important;
}

.questionp ul li,
.question ul li {
  /*color: #111111;
  display: block;
  position: relative;
  float: left;*/
  width: 100%;
  /*height: 90px;*/
}

.questionp ul li input[type=radio], 
.questionp td input[type=radio], 
.question ul li input[type=radio],
.question td input[type=radio]{
  position: absolute;
  visibility: hidden;
}

.questionp ul li label,
.questionp td label,
.question ul li label, 
.question td label{
  display: block;
  position: relative;
  font-weight: 300;
  padding: 25px 24px 25px 60px;
  margin: 5px auto;
  z-index: 9;
  cursor: pointer;
  -webkit-transition: all 0.25s linear;
}

.questionp ul li label,
.questionp td label {
  font-size: 1.5em;
  height: 40px;
}
/*.question ul li:hover label{
	color: #FFFFFF;
}*/

.questionp ul li .check, 
.questionp td .check,
.question ul li .check, 
.question td .check {
    display: block;
    position: absolute;
    border: 3px solid #222222;
    border-radius: 100%;
    height: 25px;
    width: 25px;
    top: 30px;
    left: 20px;
    z-index: 5;
    transition: border .25s linear;
    -webkit-transition: border .25s linear;
}

.questionp ul li .check::before,
.questionp td .check::before,
.question ul li .check::before,
.question td .check::before {
    display: block;
    position: absolute;
    content: '';
    border-radius: 100%;
    height: 15px;
    width: 15px;
    top: 2px;
    left: 2px;
    margin: auto;
    transition: background 0.25s linear;
    -webkit-transition: background 0.25s linear;
}

.question .matrix  th,
.questionp .matrix  th span{
    white-space:pre-line ! important;
}


input[type=radio]:checked ~ .check {
  border: 3px solid #4ab443;
}

input[type=radio]:checked ~ .check::before {
    background: #4ab443;
}

input[type=radio]:checked ~ label{
  color: #4ab443;
  font-weight: bold;
}


.question ul li .checkbox input[type=checkbox]:checked {
    border: 3px solid #4ab443;
    color: #4ab443;
    font-weight: bold;
    background: #4ab443;
    background-color: #4ab443;
}

.question ul li .checkbox input[type=checkbox]:checked ~ label {   
    color: #4ab443;
    font-weight: bold;
}



#clockdiv{
    font-family: sans-serif;
    color: #fff;
    display: inline-block;
    font-weight: 100;
    text-align: center;
    font-size: 24px;
}

#clockdiv > div{
    padding: 6px;
    border-radius: 6px;
    background: #00BF96;
    display: inline-block;
}

#clockdiv div > span{
    padding: 10px;
    border-radius: 8px;
    background: #00816A;
    display: inline-block;
}

.smalltext{
    padding-top: 5px;
    font-size: 14px;
}

@media print {
    .progress {
        position: relative;
    }

        .progress:before {
            display: block;
            content: '';
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            z-index: 0;
            border-bottom: 2rem solid #eeeeee;
        }

    .progress-bar {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        border-bottom: 2rem solid #337ab7;
    }

    .progress-bar-success {
        border-bottom-color: #67c600;
    }

    .progress-bar-info {
        border-bottom-color: #5bc0de;
    }

    .progress-bar-warning {
        border-bottom-color: #f0a839;
    }

    .progress-bar-danger {
        border-bottom-color: #ee2f31;
    }
}