/******************
    User custom CSS
    ---------------
    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/

/************************* Fonts *************************/
@font-face {
    font-family: "DIN Next";
    src: url("/themes/fonts/1448933/bbb280b3-b74d-49f2-908d-0395516a3dc8.eot?#iefix");
    src: url("/themes/fonts/1448933/bbb280b3-b74d-49f2-908d-0395516a3dc8.eot?#iefix") format("eot"), url("/themes/fonts/1448933/95d17c42-537a-4cbf-a8c1-60fcc6edf28f.woff2") format("woff2"), url("/themes/fonts/1448933/3097f8f0-50b7-4d8d-8745-6281850a1b05.woff") format("woff"), url("/themes/fonts/1448933/ac4b95cb-49c4-493a-a895-471d763cea38.ttf") format("truetype"), url("/themes/fonts/1448933/239a6552-f940-4e58-abe7-34dea8cf9fb6.svg#239a6552-f940-4e58-abe7-34dea8cf9fb6") format("svg");
    font-display: swap;
}

@font-face {
    font-family: "DIN Next Bold";
    src: url("/themes/fonts/1448941/435ec954-73b2-4a0c-89ed-0c36d79ee595.eot?#iefix");
    src: url("/themes/fonts/1448941/435ec954-73b2-4a0c-89ed-0c36d79ee595.eot?#iefix") format("eot"), url("/themes/fonts/1448941/7e3bc38e-72f2-4d0b-8e96-4c466b57b052.woff2") format("woff2"), url("/themes/fonts/1448941/8283248b-29aa-4d91-8920-841505269e68.woff") format("woff"), url("/themes/fonts/1448941/929bfe48-8086-4796-820d-ff0222f68dd0.ttf") format("truetype"), url("/themes/fonts/1448941/e347011e-4195-4ce4-8d0e-ddd49960ca09.svg#e347011e-4195-4ce4-8d0e-ddd49960ca09") format("svg");
    font-display: swap;
}

/************************* Body *************************/
body {
    font-family: "DIN Next" !important;
    font-size: 18px;
}

/************************* Headlines ********************/

h4,
.h4 {
    font-size: 20px;
}

/************************* Questions ********************/
.question-title-container .ls-label-question {
    font-size: x-large;
    color: #237BAC;
    font-family: "DIN Next Bold" !important;
}

.question-title-container .asterisk .text-danger {
    color: #237BAC;
}

/************************* Text *************************/
.fruity .text-primary {
    color: #237BAC;
}

.fruity .text-info{
    color: #237BAC;
}

.fruity .text-muted {
    color: #237BAC;
}

.fruity a {
    color: #237BAC;
}

.fruity a:hover {
    color: #237BAC;
}


/************************* Warnings *************************/
.alert {
    border-radius: 0;
}

.fruity .alert-warning {
    color: #fff;
    border: 0 solid #237BAC;
    background-color: #237BAC;
}

.fruity .text-danger {
    color: #237BAC;
    font-weight: 400;
    margin-right: 4px;
}

.h4.text-danger {
    font-size: 18px;
}

/************************* Buttons *************************/
.btn {
    border-radius: 0;
    padding: 12px 16px;
}


.fruity .btn-primary[disabled], button.btn-primary[disabled] {
    background-color: #EFF4FA;
    border: 1px solid #EFF4FA;
    font-family: "DIN Next Bold" !important;
    color: #0F293D;
}

.fruity .btn-primary[disabled]:hover, button.btn-primary[disabled]:hover,
.fruity .btn-primary[disabled]:focus, button.btn-primary[disabled]:focus,
.fruity .btn-primary[disabled]:active, button.btn-primary[disabled]:active {
    background-color: #EFF4FA;
    border: 1px solid #EFF4FA;
    font-family: "DIN Next Bold" !important;
    color: #0F293D;
}

.fruity .btn-primary, button.btn-primary, .fruity .btn-info, button, html input[type=button], input[type=reset], input[type=submit] {
    color: #fff;
    background-color: #FF7523;
    border: 1px solid #FF7523;
    font-family: "DIN Next Bold" !important;
}

.fruity .btn-primary:hover, button.btn-primary:hover, .fruity .btn-info:hover, button:hover, html input[type=button]:hover, input[type=reset]:hover, input[type=submit]:hover,
.fruity .btn-primary:focus, button.btn-primary:focus, .fruity .btn-info:focus, button:focus, html input[type=button]:focus, input[type=reset]:focus, input[type=submit]:focus,
.fruity .btn-primary:active, button.btn-primary:active, .fruity .btn-info:active, button:active, html input[type=button]:active, input[type=reset]:active, input[type=submit]:active {
    color: #FF7523;
    background-color: #fff;
    border: 1px solid #FF7523;
    font-family: "DIN Next Bold" !important;
}

.fruity .close {
    opacity: .75;
}

.fruity .close:hover {
    opacity: 1;
}

.close:focus,
.close:active,
.close:hover {
    color: #fff;
}

.fruity .btn-default {
    background-color: #FF7523;
    border: 1px solid #FF7523;
    font-family: "DIN Next Bold" !important;
    transition: all .2s ease-in-out;
    color: #FFF;
}

.fruity .btn-default:hover,
.fruity .btn-default:focus,
.fruity .btn-default:active,
.fruity .btn-default.active,
.fruity .open .dropdown-toggle.btn-default {
    color: #FF7523;
    border: 1px solid #FF7523;
    background-color: #fff;
}

.btn-group-lg > .btn,
.btn-lg {
    font-family: "DIN Next Bold" !important;
    border-radius: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

@media screen and (max-width: 768px) {
    #navigator-container {
        padding-left: 1em;
        padding-right: 1em;
    }
}

/************************* Progress Bar *************************/
.fruity .progress-bar {
    background-color: #0F293D;
}

/************************* Formulare *************************/
/** Radio & Checkbox **/
input[type=checkbox],
input[type=radio] {
    float: left;
    margin-right: .5rem;
    width: 17px;
    height: 17px;
}

.fruity input[type="checkbox"]:checked:after,
.fruity .checkbox input[type="checkbox"]:checked:after,
.fruity .checkbox-inline input[type="checkbox"]:checked:after {
    background-color: #FF7523;
    border-color: #FF7523;
}

/** Labels **/
label {
    font-weight: 400 !important;
}

body .answer-item label::after {
    background-color: #0F293D;
}

.checkbox-item input[type="checkbox"]:checked + label::after,
.checkbox-item input[type="radio"]:checked + label::after {
    background-color: #0F293D;
    color: white;
}

.checkbox-item label::before {
    top: 3px;
}

.checkbox-item label::after {
    width: 17px;
    height: 17px;
    padding-left: 1px;
    padding-top: 1px;
    font-size: 12px;
    top: 3px;
}


.list-unstyled .radio-item label::before {
    top: 3px;
}

.list-unstyled .radio-item label::after {
    top: 6px;
}

/** Textarea **/
.fruity textarea.form-control {
    font-weight: 400;
    background-color: #fff;
    border: 1px solid #e7ecf2;
    border-radius: 0;
    color: #0f293d;
    display: block;
}

.fruity .form-control:focus {
    border: 1px solid #FF7523;
    box-shadow: none;
}


/************************* Panel *************************/

.fruity .panel-primary > .panel-heading {
    color: #fff;
    background-color: #0F293D;
    border: 1px solid #0F293D;
}

.panel-heading {
    border-top-left-radius: 1px;
    border-top-right-radius: 1px;
}

.panel-footer {
    border-bottom-right-radius: 1px;
    border-bottom-left-radius: 1px;
}

/************************* Header *************************/
.logo-container > img {
    max-height: 80px;
}

@media (max-width: 1024px) {
    .logo-container > img {
        max-height: 60px;
    }
}

@media (max-width: 767px) {
    .logo-container {
        display: block !important;
    }
}

.navbar-default .navbar-brand:focus,
.navbar-default .navbar-brand:hover {
    color: #4f4f4f;
}

.fruity .navbar a.animate:after {
    background-color: #163750;
}

/************************* Tabellen *************************/
@media screen and (max-width: 1024px) {
    .fruity .table-bordered {
        border: 0 solid #dadada;
    }
}

/************************* Messages *************************/
.fruity .well {
    background-color: #E8F8F7;
    border: 1px solid #E8F8F7;
    box-shadow: none;
}