@import url(https://fonts.googleapis.com/css?family=Orbitron:400,500,700,900);


body {
    background:url('../images/bg-car.jpg');
    background-size:cover;
}

p {
    font-size:16px;
}


form.form {
    width:400px;
    height:220px;
    border:1px solid #D2D2D2;
    padding:15px;
    margin:5px;
    display:block;
    margin:auto;
    margin-top:15%;
    background-color:#FFF;
    box-shadow: 4px 4px 5px #352E2E;
}

form#vraagToevoegen label {
    color:white;
    font-size:16px;
}

.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../images/page-loader.gif') 50% 50% no-repeat rgb(249,249,249);
}

.blockAr {
    display: block;
    border: 1px solid #505050;
    width: 150px;
    height: 150px;
    background-color: #C74D4D;
    cursor: pointer;
    color:white;
    font-weight:900;
}

.blockAr h3 {

}

.examenBlock {
    background-color: #4F7D96;
    padding: 25px;
    height:auto;
        box-shadow: 10px 10px #272727;
}

.examenBlock img {
    float:left;
    width:100%;
}

.cala {
    background-color: #1F1F1F;
    width:378px;
    padding: 6px;
    margin-top: 96px;
}


.uitlogButton {
    margin-top:20px;
    width:125px;
}

.navbar {
    height:85px;
    background-color:#2D87DF;
    border:0;
}

.cal {
    width: 365px;
    height: 400px;
    margin-top: 12px;
    padding-top:10px;
}

.cal .buttonX {
    width: 63px;
    height: 57px;
    margin: 5px;
    background-color: #4C4C4C;
    background: -webkit-linear-gradient(#444444, #101010); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#444444, #101010); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#444444, #101010); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#444444, #101010); /* Standard syntax */
    display: inline-block;
    border-radius: 10px;
    float: left;
    color: white;
    font-size: 34px;
    text-align: center;
    line-height: 57px;
}

.cal .buttonX:hover {
    background-color: #34542E;
    background: -webkit-linear-gradient(#34542E, #101010); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#34542E, #101010); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#34542E, #101010); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#34542E, #101010); /* Standard syntax */
    cursor:pointer;
}

.jn {
    background-color: #475431;
    background: -webkit-linear-gradient(#5C8455, #101010); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#5C8455, #101010); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#5C8455, #101010); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#5C8455, #101010); /* Standard syntax */
    width: 170px;
    height: 50px;
    display: inline-block;
    margin: 5px;
    border-radius: 5px;
    color: white;
    text-align: center;
    font-size: 30px;
    line-height: 50px;
    font-weight: 900;
}

.jn:hover {
    background-color:#114611;
    background: -webkit-linear-gradient(#56AB47, #101010); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#56AB47, #101010); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#56AB47, #101010); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#56AB47, #101010); /* Standard syntax */
    cursor:pointer;
}

.wc {
    background-color: #87AF44;
    width: 97%;
    height: 50px;
    display: inline-block;
    margin: 5px;
    border-radius: 5px;
    color: white;
    text-align: center;
    font-size: 30px;
    line-height: 50px;
    font-weight: 900;
}

.wc:hover {
    cursor:pointer;
    background-color: #B8F750;
}

.beeld {
    background-color: #FAFFC8;
    height: 100px;
    line-height: 100px;
    padding-left: 15px;
    font-size: 18px;
    width:365px;
    font-family: 'Orbitron', sans-serif;
}

#antwoord {
    padding-left: 20px;
    font-size: 25px;
    font-weight: 900;
}

#vVraag {
    background-color:#AD2424;
}

.small {
    font-size:15px !important;
}

.startExamen {
    border:0;
}

.startExamen p {
    margin:0 !important;
}

.arJumb {
    background-color: #eee;
}

#vraagTitle {
    color:white;
}

#antwoordenBox p {
    color: white;
    font-size: 18px;
    border: 1px solid;
    padding: 5px;
    width: 720px;
    background-color: #2D2D2D;
}

#antwoordenBox {
    margin-top:10px;;
    float:left;

}

.logoTitle {
    color:#FFF;
}



.form-signin input[type="text"] {
        margin-bottom: 5px;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }
    .form-signin input[type="password"] {
        margin-bottom: 10px;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }
    .form-signin .form-control {
        position: relative;
        font-size: 16px;
        font-family: 'Open Sans', Arial, Helvetica, sans-serif;
        height: auto;
        padding: 10px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

      .vertical-offset-100 {
        padding-top: 100px;
    }

     .panel {
    margin-bottom: 20px;
    background-color: rgba(255, 255, 255, 0.75);
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    }
/* ARI 1 OKTOBER */

.codeInput {
    border:none;
    border-bottom:1px solid white;
    border-radius: 0;
}



.ari-button-login {
    background: #057bfe;
    border: 1px solid #ffffff40;
    border-radius: 0;
    color:#FFF;
}

.ari-button-login:hover {
    color:#FFF;
    background:#0671e8;
}