body {

    /*font-family: 'Cabin', sans-serif;*/
    font-family: 'Roboto Slab', serif;
    background-color: #F8F8FF;

}

#nojavascript {

    /* fallback */
    background-color: #156b7a;

    /* Safari 4-5, Chrome 1-9 */
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#382224), to(#156b7a));

    /* Safari 5.1, Chrome 10+ */
    background: -webkit-linear-gradient(top, #156b7a, #382224);

    /* Firefox 3.6+ */
    background: -moz-linear-gradient(top, #156b7a, #382224);

    /* IE 10 */
    background: -ms-linear-gradient(top, #156b7a, #382224);

    /* Opera 11.10+ */
    background: -o-linear-gradient(top, #156b7a, #382224);

    height: 100%;
    width: 100%;
    position: absolute;
    /*padding-top: 38vh;*/
    padding-top: 45vh;

    font-family: 'Cabin', sans-serif;
    text-align: center;

    color: #F8F8FF;

}

#loading {

    /* fallback */
    background-color: #156b7a;

    /* Safari 4-5, Chrome 1-9 */
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#382224), to(#156b7a));

    /* Safari 5.1, Chrome 10+ */
    background: -webkit-linear-gradient(top, #156b7a, #382224);

    /* Firefox 3.6+ */
    background: -moz-linear-gradient(top, #156b7a, #382224);

    /* IE 10 */
    background: -ms-linear-gradient(top, #156b7a, #382224);

    /* Opera 11.10+ */
    background: -o-linear-gradient(top, #156b7a, #382224);

    height: 100vh;
    /*padding-top: 38vh;*/
    padding-top: 47vh;

}

#loader {

    margin: auto;
    height: 5vh; /* These two lines are counted as one :-)       */
    width: 30vh; /* These two lines are counted as one :-)       */
    background-color: #09cec4;

}

#load {

    height: 100%;
    background-color: #50ffc9;

}

.logo {

    text-align: center;
    margin-bottom: 5vh;

}

.vertical-center {

    /* empty, set in media */

}

.btn-primary {

    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    background-color: transparent;
    border: 10px solid #09cec4;
    color: #09cec4;
    font-family: 'Cabin', sans-serif;
    text-align: center;

}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary:active:hover, .btn-primary.active:hover {

    background-color: #09cec4;
    color: #F8F8FF;
    cursor:pointer;
    border: 10px solid #09cec4;

}

.btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .btn-primary:visited {

    outline:none;
    border: 10px solid #09cec4;

}

/* Phones */
@media (max-width: 768px) {

}

/* Small devices (tablets, 768px to 992px) */
@media (min-width: 768px) and (max-width: 992px) {

}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {

}

/* Medium devices (desktops, 992px to 1200px) */
@media (min-width: 992px) and (max-width: 1200px) {

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {

    .vertical-center {

        min-height: 100%;  /* Fallback for browsers do NOT support vh unit */
        min-height: 100vh; /* These two lines are counted as one :-)       */

        display: flex;
        align-items: center;

    }

}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

}
