﻿body {
    font-family: 'Segoe UI', sans-serif;
    margin:auto;
}

*{
    border-radius:0px !important;
}

h1{
    color:#740808;
    font-weight:normal;
}
h2{
    font-weight:normal;
}

hr{
    border:none;
    border-top:1px solid #ccc;
    background:none;
    margin-bottom:2px;
}
.header-right{
    padding-top:12px;
    text-align:right;
}

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

.question{
    background-color:#eee;
    color:#151569;
    min-height:300px;
    text-align:center;
}
.option{
    background-color:#cadaee;
    font-size:20px;
    padding:10px;
    margin:3px;
}
.option label{
    font-weight:normal;
}
    #quiz .options input[type=checkbox] {
        background-color:#eee;
        border:1px solid #ccc;
        height:22px;
        width:22px;
    }

    .quizNav {
        margin:auto;
        text-align:center;
    }
    .quizNav ul{
        margin:0;
    }


    .quizNav ul li{
        display:inline-block;
        list-style-type:none;
    }
    
div.review{
    text-align:center;
}
div.review > div {
    cursor:pointer;
}

.answered {
    background-color:#ccffcc;
    border:1px solid #aaeeaa;
    margin:2px 0;
    padding:12px;
}

.not-answered {
    background-color:#ffcccc;
    border:1px solid #eeaaaa;
    margin:2px 0;
    padding:12px;
}

.result-question{
    background-color:#eee;
    margin:4px;
    padding:6px;
}

    
/* Create Quiz Styles */
.create-quiz .question {
    text-align:left;
}
.create-quiz input[type=text]{
    border:1px solid #ddd;
    width:95%;
}
.create-quiz .tb-quiz-name{
    background-color:#ccffcc;
    text-align:center;
}

.create-quiz .tb-desc{
    background-color:#fff;
}

.create-quiz .options > div{
    margin-left:20px;
}
.create-quiz .options input[type=checkbox]{
    border: 1px solid #262626;
    display: inline-block;
    height:20px;
    margin-top:10px;
    margin-bottom:0;
    padding:0;
    width:20px;
    -webkit-appearance:checkbox;    
}


@media only screen and (max-width: 480px) {
    h1,.h1{
        font-size:22px;
    }
    h2,.h2{
        font-size:20px;
    }
    h3,.h3{
        font-size:18px;
    }
    .option {
        font-size: 16px;
        padding: 6px;
    }
}

.logo-evaluations {
    display: inline-block;
    max-width: 60px;
}

.evaluations-header {
    display: inline-block;
    margin-left: 10px;
    font-family: 'Lato', sans-serif;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 30px;
    margin-top: 5px;
}

.quiz-title {
    font-family: 'Lato', sans-serif;
    text-transform: uppercase;
    border-bottom: solid 1px;
    padding-bottom: 10px;
    color: #004284;
    font-size: 25px;
}

.quiz-result-title {
    font-family: 'Lato', sans-serif;
    text-transform: uppercase;
    color: #004284;
    font-size: 22px;
}

.label-warning {
    background-color: #004284;
    padding: 10px;
    text-transform: uppercase;
    font-size: 13px;
}

.question-text {
    font-family: 'Lato', sans-serif;
    font-size: 25px;
    padding: 10px 0;
}

.option {
    background-color: rgba(248, 193, 5, 0.46);
    cursor: pointer;
}

.option.option-selected {
    background: rgb(0, 66, 132);
    color: #fff;
}

.option label {
    cursor: pointer;
}

.quizNav {
    border-top: solid 1px #004284;
    margin-top: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.quizNav button, .menu-final button {
    border-color: #004284;
    color: #fff;
    background: #004284;
    outline: none !important;
}

.quizNav button.btn-default:hover,
.menu-final button.btn-default:hover,
.quizNav button.btn-default:active,
.menu-final button.btn-default:active,
.quizNav button.btn-default:focus,
.menu-final button.btn-default:focus,
.btn-back:focus,
.btn-back:hover {
    color: #004284;
    background-color: #f8c105;
    border-color: #004284;
}

.menu-final {
    border-top: solid 1px #004284;
    margin-top: 10px;
    padding-top: 10px;
}

a.alert.alert-info {
    display: block;
    background: #004284;
    color: #fff;
    margin-top: 15px;
}

.result-question {
    padding: 5px 20px;
}

.result-question h4.ng-binding {
    font-family: 'Lato', sans-serif;
    font-weight: bold;
}

.result-question input {
    width: 20px;
    font-size: 30px !important;
}

.result-option {
    margin-top: 5px;
    padding: 5px;
    font-family: 'Lato', sans-serif;
}

.result-option.option-correct {
    background: green;
    color: #fff;
}

.result-option.option-incorrect {
    background: red;
    color: #fff;
}

.btn-back {
    display: inline;
    background-color: #004284;
    color: #fff;
    border-color: #004284;
}