/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

@import url('https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css');


@media only screen and (max-width: 992px) {
    .calc-hladon table {
        width: 100%;
        border-collapse: collapse;
        border-spacing: 0;
        display: block;
        position: relative;
    }

    .calc-hladon table tbody {
        display: block;
        width: auto;
        position: relative;
        overflow-x: auto;
    }

    .calc-hladon .input-field {
        margin-top: 2rem;
    }

    .calc-hladon .input-field > label {
        top: -14px;
    }

    .calc-hladon .select-wrapper + label {
        top: -26px;
    }
}

.calc-hladon .calc-subtitle {
    font-size: 28px;
}

.calc-hladon a.btn {
    margin-top: 10px;
}

/* label color */
.calc-hladon .input-field label {
    color: #000;
}
/* label focus color */
.calc-hladon .input-field input[type=text]:focus + label,
.calc-hladon .input-field input[type=tel]:focus + label,
.calc-hladon .input-field input[type=number]:focus + label,
.calc-hladon .input-field input[type=email]:focus + label,

.calc-hladon .input-field input.validate[type=text]:focus + label,
.calc-hladon .input-field input.validate[type=tel]:focus + label,
.calc-hladon .input-field input.validate[type=email]:focus + label,
.calc-hladon .input-field input.validate[type=number]:focus + label
{
    color: #000;
}
/* label underline focus color */
.calc-hladon .input-field input[type=text]:focus,
.calc-hladon .input-field input[type=tel]:focus,
.calc-hladon .input-field input[type=email]:focus,
.calc-hladon .input-field input[type=number]:focus,

.calc-hladon .input-field input.validate[type=text]:focus,
.calc-hladon .input-field input.validate[type=tel]:focus,
.calc-hladon .input-field input.validate[type=email]:focus,
.calc-hladon .input-field input.validate[type=number]:focus
{
    border-bottom: 1px solid #000;
    box-shadow: 0 1px 0 0 #000;
}
/* valid color */
.calc-hladon .input-field input[type=text].valid,
.calc-hladon .input-field input[type=tel].valid,
.calc-hladon .input-field input[type=email].valid,
.calc-hladon .input-field input[type=number].valid
{
    border-bottom: 1px solid #000;
    box-shadow: 0 1px 0 0 #000;
}
/* invalid color */
.calc-hladon .input-field input[type=text].invalid,
.calc-hladon .input-field input[type=tel].invalid,
.calc-hladon .input-field input[type=email].invalid,
.calc-hladon .input-field input[type=number].invalid
{
    border-bottom: 1px solid #E60108;
    box-shadow: 0 1px 0 0 #E60108;
}
.calc-hladon .input-field input[type=text].invalid + label,
.calc-hladon .input-field input[type=tel].invalid + label,
.calc-hladon .input-field input[type=email].invalid + label,
.calc-hladon .input-field input[type=number].invalid + label
{
    color: #E60108;
}

/* icon prefix focus color */
.calc-hladon .input-field .prefix.active {
    color: #000;
}

.calc-hladon .dropdown-content li>a, .calc-hladon .dropdown-content li>span{
    color: #000;
}
.calc-hladon .mb-10{
    margin-bottom: 10px;
}
.calc-hladon .btn, .calc-hladon .btn-large, .calc-hladon .btn-small{
    background-color: #E60108;
    border-radius: 10px;
}
.calc-hladon .btn:hover, .calc-hladon .btn-large:hover, .calc-hladon .btn-small:hover{
    color: var( --e-global-color-secondary );
    background-color: #E60108;
}
.toast.calc-toast-error {
    background-color: #E60108;
}

.calc-hladon h2 {
    color: #242424;
    font-family: "Nunito", Sans-serif;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.3em;
    text-align: center;
    margin-bottom: 30px;
}

.calc-hladon {
    padding-top: 30px;
}
@media print {
    .printSelected > * ,
    .hide-on-print
    {display: none; }
    .printSelected >.printSelection { display: block; padding:25px;}
    .collapsible-body.calc-to-print{display: block}
}
.printSelection{display:none;}