.mb-1_5 {

    margin-bottom: 2rem;

}



.mb-2 {
    margin-bottom: 2rem;
}



.mb-4 {

    margin-bottom: 4rem;

}



.mt-1 {

    margin-top: 1rem;

}



.mt-3 {

    margin-top: 2.5rem;

}



.flex {

    display:flex;

}



.gap-1 {

    gap:1.25rem;

}



.gap-4 {

    gap:4.5rem;

}

.page-template-calculator-template-php .header {
    z-index: 100;
}


#green_shadow {

    background: var(--forest-20, rgba(33, 76, 59, 0.20));

    backdrop-filter: blur(3.5px);

    position: fixed;

    left: 0;

    width: 100%;

    height: 100%;

    z-index: 9;

}



.calc_modal {

    position: fixed;

    display: flex;

    align-items: center;

    width: 100%;

    height: 100%;

    justify-content: center;

    z-index: 99;

}



.calc_modal .calc_area {

    background: var(--Seafoam, #E4EBE8);

    border-radius: 10px;

    width: 29.3rem;

    height: 32.4rem;

    display: flex;

    justify-content: center;

    flex-direction: column;

    padding: 3.5rem;

    

    .submit_form {

        display: inline-block;

        padding-top: 2rem;

         width: 100%;

        button {

            display: flex;

            height: 3rem;

            padding: 0rem 1.25rem 0.4rem 0;

            justify-content: center;

            align-items: center;

            gap: 0.5rem;

            border-radius: 4rem;

            background: var(--Forest, #1C332B);

            width: 100%;

            font-family: 'Inter';

            color: #fff;

            font-size: 1rem;

            font-style: normal;

            font-weight: 600;

            line-height: 130%;

            letter-spacing: -0.025rem;

            cursor: pointer;

            outline: none;

            border: none !important;

            transition: all 0.4s ease;

        }  

        button:hover {

            background: #0a3323;

        }

        svg {

            display: inline-block;

            position: relative;

            top: 2px;

        }

    } 



}



.calc_modal .calc_area .title {

    padding-bottom: 1.5rem;

}



.calc_modal .features {

    display: flex;

    flex-direction: column;

    gap: 1rem;

    padding-bottom: 1.5rem;

}



.calc_modal .features li {

    color: var(--Forest, #1C332B);

    font-family: "Inter";

    font-size: 0.875rem;

    font-style: normal;

    font-weight: 400;

    line-height: 130%;

    letter-spacing: -0.0125rem;

    display: flex;

    align-items: center;

    gap: 1rem;

}



.calc_modal .features li span {

    display: flex;

    width: 1rem;

    height: 1rem;

    padding: 0.5rem;

    justify-content: center;

    align-items: center;

    border-radius: 4rem;

    border: 1px solid var(--forest-20, rgba(33, 76, 59, 0.20));

}



.calc_modal .calc_area .title span {

    color: var(--Forest, #1C332B);

    font-size: 3.0625rem;

    font-style: normal;

    font-weight: 350;

    line-height: 100%;

    letter-spacing: -0.05513rem;

}



.form_input_area {

    width: 100%;

    .inputs { 

        flex-direction: row;

        flex-wrap: wrap;     

        .input_item {            

            display: flex;                            

            flex-direction: column;                            

            max-width: 13.8rem;

        }

    }

    .block {

        display: inline-block;

    }

    .block.full {

        width:100%;

    }

    .relative {

        position: relative;

    }

    .input {

        display: inline-block;

    }

    .full {

        width:100%;

        input {

            width: calc( 100% - 2rem );

        }

    }

    label.for_input {

        color: var(--Forest, #1C332B);

        font-family: "Inter";

        font-size: 0.875rem;

        font-style: normal;

        font-weight: 600;

        line-height: 130%;

        letter-spacing: -0.0125rem;

        width: 100%;

        display: flex;

        align-items: center;

        gap: 0.38rem;

        padding-bottom: 0.38rem;

    svg {

         width: 0.875rem;

        height: 0.875rem;

        }

    }

    input.enter {

        background: none;

        display: flex;

        padding: 0.625rem 0.875rem;

        align-items: center;

        gap: 0.5rem;

        flex: 1 0 0;

        border-radius: 0.5rem;

        border: 1px solid var(--forest-60, rgba(33, 76, 59, 0.60));

        color: var(--forest-20, #1C332B);

        font-family: "Inter";

        font-size: 1rem;

        font-style: normal;

        font-weight: 400;

        line-height: 130%;

        letter-spacing: -0.025rem;

        outline: none;

    }

    input::placeholder {

        color: var(--forest-20, rgba(33, 76, 59, 0.20));

    }

    span.currency {

        color: var(--Forest, #1C332B);

        font-family: "Inter";

        font-size: 1rem;

        font-style: normal;

        font-weight: 400;

        line-height: 130%;

        letter-spacing: -0.025rem;

        position: absolute;

        right: 4px;

        top: 4px;

        padding: 0.40rem;

        -webkit-border-top-right-radius: 0.5rem;

        -webkit-border-bottom-right-radius: 0.5rem;

        -moz-border-radius-topright: 0.5rem;

        -moz-border-radius-bottomright: 0.5rem;

        border-top-right-radius: 0.5rem;

        border-bottom-right-radius: 0.5rem;

        background: var(--Seafoam, #E4EBE8);

    }

}



.form_approve {

    display: inline-block;

    width: 100%;

    padding-top: 1.12rem;

    .content {

        display: flex;

        gap: 1rem;

        align-items: center;

    }

    .label_text {

        color: var(--Forest, #1C332B);

        font-family: "Inter";

        font-size: 0.75rem;

        font-style: normal;

        font-weight: 400;

        line-height: 130%;

        display: inline-block;

        width: 100%;

    }

}



#pie_1 {

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

}



#pie_2 {

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

}



.pie_text {

    color: var(--Forest, #1C332B);

    text-align: center;

    font-size: 1rem;

    font-style: normal;

    font-weight: 400;

    line-height: 130%;

    letter-spacing: -0.3px;

    position: absolute;

}



.calculater {

    display: inline-block;

    width: 100%;

    font-size: 1rem;

    .themeContainer {

        max-width: 67.25rem;

    }

    h1 {

        font-size:5.9375rem;

        color: #1C332B;

        font-size: 3.8125rem;

        font-style: normal;

        font-weight: 350;

        line-height: 100%;

        letter-spacing: -0.20781rem;

    }

    .card {

        padding: 2.5rem;

        border-radius: 10px;

        background: var(--Seafoam, #E4EBE8);

        width:calc( 100% - 5rem );

        h2 {

            color: var(--Forest, #1C332B);

            font-size: 1.9375rem;

            font-style: normal;

            font-weight: 400;

            line-height: 120%; 

            letter-spacing: -0.01938rem;

            padding-bottom: 0.81rem;

        }

        p {

            color: var(--Forest, #1C332B);

            font-family: "Inter";

            font-size: 1rem;

            font-style: normal;

            font-weight: 400;

            line-height: 130%;

            letter-spacing: -0.025rem;

        }

        .item {

            width: 100%;

            max-width: 28.87rem;

            .inputs { 

                flex-direction: row;

                flex-wrap: wrap;     

                .input_item {

                    display: flex;

                    flex-direction: column;

                    max-width: 13.8rem;

                    position: relative;

                }

            }

            .block {

                display: block;

            }

            .block.full {

                width:100%;

            }

            .relative {

                position: relative;

            }

            .input {

                display: inline-block;

            }

            label.for_input {

                color: var(--Forest, #1C332B);

                font-family: "Inter";

                font-size: 0.875rem;

                font-style: normal;

                font-weight: 600;

                line-height: 130%;

                letter-spacing: -0.0125rem;

                margin-bottom: 0.38rem;

                svg {

                 width: 0.875rem;

                height: 0.875rem;

                }

            ;

                display: inline-block;

            }

            input.enter {

                background: none;

                display: flex;

                padding: 0.625rem 0.875rem;

                align-items: center;

                gap: 0.5rem;

                flex: 1 0 0;

                border-radius: 0.5rem;

                border: 1px solid var(--forest-60, rgba(33, 76, 59, 0.60));

                color: var(--forest-20, #1C332B);

                font-family: "Inter";

                font-size: 1rem;

                font-style: normal;

                font-weight: 400;

                line-height: 130%;

                letter-spacing: -0.025rem;

                outline: none;

            }

            input::placeholder {

                color: var(--forest-20, rgba(33, 76, 59, 0.20));

            }

            span.currency {

                color: var(--Forest, #1C332B);

                font-family: "Inter";

                font-size: 1rem;

                font-style: normal;

                font-weight: 400;

                line-height: 130%;

                letter-spacing: -0.025rem;

                position: absolute;

                right: 4px;

                top: 4px;

                padding: 0.40rem;

                -webkit-border-top-right-radius: 0.5rem;

                -webkit-border-bottom-right-radius: 0.5rem;

                -moz-border-radius-topright: 0.5rem;

                -moz-border-radius-bottomright: 0.5rem;

                border-top-right-radius: 0.5rem;

                border-bottom-right-radius: 0.5rem;

                background: var(--Seafoam, #E4EBE8);

            }

        }

        .result_total {

                border-radius: 0.5rem;

                background: var(--forest-5, rgba(33, 76, 59, 0.05));

                margin-top:1.5rem;

                justify-content: space-between;

                align-items: center;

                padding: 1rem;

                width: calc( 100% - 1.5rem );

            span {

                color: var(--Forest, #1C332B);

                font-size: 1.25rem;

                font-style: normal;

                font-weight: 400;

                line-height: 130%;

                letter-spacing: -0.01875rem;

            }

            .dkk::after{

                content: ' DKK';

                position: relative;

            }

            .percent::after{

                content: '%';

                position: relative;

            }

        }

        .range_area {

            height: 11.6rem;

            display: flex !important;

            align-items: center;

            width: 100%;

            flex-direction: column;

            justify-content: center;

            input {

                width: 100%;

            }

            .percents {

                width: 100%;

                justify-content: space-between;                

                padding-top: 1rem;

                font-family: 'Inter';

                color: var(--Forest, #1C332B);

                font-size: 0.875rem;

                font-style: normal;

                font-weight: 400;

                line-height: 130%;

                letter-spacing: -0.0125rem

            }



            .rangeslider__fill {

                background-color: #1C332B;

            }



            .rangeslider--horizontal {

                height: 0.5rem; 

                background: rgba(33, 76, 59, 0.20);

                box-shadow: none;

            }



            .rangeslider__handle {

                background: #fff;

                width: 1.5rem !important;

                height: 1.5rem !important;

                box-shadow: none !important;

                top: -0.55rem;

                border: 1px solid rgba(33, 76, 59, 0.20) !important;

            }



            .rangeslider__handle:after {

                background: #fff;

            }



        }

        .card_footer {

            margin-top: 1.5rem;

            padding: 1.5rem 0 0 0;

            border-top:1px solid rgba(33, 76, 59, 0.20);

            p {

                color: var(--Forest, #1C332B);

                font-family: "Inter";

                font-size: 0.8125rem;

                font-style: normal;

                font-weight: 400;

                line-height: 130%; 

            }

        }

    }

    .card.big {

        span.dkk_cur {

            color: var(--Forest, #1C332B);

            font-size: 3.8125rem;

            font-style: normal;

            font-weight: 350;

            line-height: 100%; 

            letter-spacing: -0.07625rem;

        }

        .labels {

            display: flex;

            gap: 1rem;

            li.current:after {

                background-color: #C4AC8F;

            }

            li.green:after {

                background-color: #1C332B;

            }

            li.current_green:after {

                background-color: rgba(33, 76, 59, 0.60);

            }

            li.shares:after {

                background-color: #95122C;

            }

            li.cash:after {

                background-color: #C4AC8F;

            }

            li.bonds:after {

                background-color: #1C4F83;

            }

            li.alter:after {

                background-color: rgba(33, 76, 59, 0.60);

            }

            li {

                list-style: none;

            color: var(--Forest, #1C332B);

            font-family: "Inter";

            font-size: 0.875rem;

            font-style: normal;

            font-weight: 400;

            line-height: 130%;

            letter-spacing: -0.0125rem;

            display: flex;

            flex-direction: row-reverse;

            gap: 0.5rem;

            align-items: center;

            }

            li:after {

                content: '';

            position: relative;

            width: 1rem;

            height: 1rem;

            display: inline-block;

            border-radius: 50%;

            background-color: #1C332B;

            top: 2px;



            }

        ;

        }



        .full2 .labels {

            justify-content: center;

        }



        .sub_card{

            padding: 1.25rem;

            display: flex;

            margin-top: 2.5rem;

            border-radius: 0.5rem;

            background: var(--forest-5, rgba(33, 76, 59, 0.05));

            flex-wrap: wrap;

            gap: 1rem;

            .sub_item {

                .content {

                    display: flex;

                    align-items: center;

                    gap:0.75rem;

                }

            }

            .label_text {

                color: var(--Forest, #1C332B);

                font-family: "Inter";

                font-size: 0.875rem;

                font-style: normal;

                font-weight: 400;

                line-height: 130%;

                letter-spacing: -0.0125rem;

                display: flex;

                align-items: center;

                justify-content: center;

                gap: 0.30rem;

                .tooltip {

                position:relative;

                svg {

                        position:relative;

                font-weight: bold;

                    }

                }

            }

        }

    }

}



.clear {

    clear: both;

}



.checkBox {

    display: block;

    cursor: pointer;

    width: 0.875rem;

    height: 0.875rem;

    border: 3px solid rgba(255, 255, 255, 0);

    border-radius: 5px;

    position: relative;

    overflow: hidden;

    box-shadow: 0px 0px 0px 2px rgba(33, 76, 59, 0.60);

}



.checkBox div {

    width: 2rem;

    height: 2rem;

    background-color: rgba(33, 76, 59, 0.60);

    top: -52px;

    left: -52px;

    position: absolute;

    transform: rotateZ(45deg);

    z-index: 100;

}



.checkBox input[type=checkbox]:checked + div {

    left: -5px;

    top: -10px;

}



.checkBox input[type=checkbox] {

    position: absolute;

    left: 50px;

    visibility: hidden;

}



.transition {

    transition: 300ms ease;

}



.dkk_cur::before{

    content: '+';

    position: relative;

}



.dkk_cur::after{

    content: ' DKK';

    position: relative;

}



.risk-class {

    font-weight: 300;

    font-size: 16px;

}



.line_area {

    position: relative;

    height: 20rem;

    margin-bottom: 2rem;

}

.line_area .ruler {

    position: relative;

    left: 0;

    height: 100%;

    width: 15px;

    display: flex;

    justify-content: space-between;

    writing-mode: vertical-rl;

    margin-right: 1rem;

    float: left;

    font-family: 'Inter';

    border-right: 1px solid rgba(33, 76, 59, 0.20);

    padding-right: 12px;

    flex-direction: row-reverse;

}

.line_area .ruler text {writing-mode: lr;color: var(--Forest, #1C332B);font-size: 0.75rem;font-style: normal;font-weight: 400;line-height: 138%;}

.line_area .lines {

    display: flex;

    width: 100%;

    max-width: 400px;

    gap: 1.2rem;

    height: 100%;

}

.line_area .lines .line {

    width: 145px;

    background-color: #000;

    height: 0;

    transition: all 0.4s ease;

    border-radius: 0.375rem;

    display: inline-block;

}

.line_area .lines .line_item {

    display: flex;

    flex-direction: column;

    position: relative;

    height: 100%;

    justify-content: flex-end;

}

.line_area .lines .line_item .text {

    display: flex;

    flex-direction: column;

    padding-bottom: 0.67rem;

}

.line_area .lines .line_item .text text {

    color: var(--Forest, #1C332B);

    font-size: 1.25rem;

    font-style: normal;

    font-weight: 500;

    line-height: 130%;

    letter-spacing: -0.01875rem;

}

.line_area .lines .line_item .text small {

    color: var(--Forest, #1C332B);

    font-size: 1rem;

    font-style: normal;

    font-weight: 100;

    line-height: 140%;

    letter-spacing: -0.01rem;

}



.attr {

    position: absolute;

    right: -7rem;

    display: flex;

    flex-direction: column;

    width: 6.2rem;

    bottom: 0;

    opacity: 0;

}



.attr text {

    color: var(--Forest, #1C332B);

    font-size: 1.25rem;

    font-style: normal;

    font-weight: 400;

    line-height: 130%; 

    letter-spacing: -0.01875rem;

}



.attr risk {

    color: var(--Forest, #1C332B);

    font-size: 1rem;

    font-style: normal;

    font-weight: 400;

    line-height: 140%; 

    letter-spacing: -0.01rem;

}



.attr small {

    color: var(--Forest, #1C332B);

    font-family: "Inter";

    font-size: 0.75rem;

    font-style: normal;

    font-weight: 400;

    line-height: 138%; 

}



.dkk::after{

    content: ' DKK';

    position: relative;

}



.page-id-381 .apexcharts-tooltip-text-y-label {

    color: #fff;

    font-family: "Inter";

    font-size: 0.75rem;

    font-style: normal;

    font-weight: 400;

    line-height: 138%; 

}



.page-id-381  .apexcharts-tooltip * {

    color:#fff;

    font-size: 0.75rem;

    gap: 0;

}



.page-id-381 .apexcharts-tooltip {

    max-width: 84px;

    max-height: 60px;

    align-items: center;

    justify-content: center;

}



.page-id-381 .apexcharts-tooltip-text-y-label {

    font-size:12px;

}



.sub_item .for_input {

    display: flex;

    gap: 10px;

}



.tooltip_area {

    position: absolute;

    width: 22.5rem;

    display: flex;

    padding: 1.25rem;

    border-radius: 0.75rem 0.75rem 0.75rem 0rem;

    background: var(--Forest, #1C332B);

    color: var(--Background-Green, #F5F5EE);

    font-family: "Inter";

    font-size: 0.75rem;

    font-style: normal;

    font-weight: 400;

    line-height: 138%;

    z-index: -1;

    opacity: 0;

}



.tooltip_area.show {

    opacity:1;

    z-index: 9;

}



.trigon {

    position: absolute !important;

    left: 0;

    bottom: -10px;

}



@media (max-width: 1150px) {  
    

    .range_area {
        margin-top: 20px;
    }


    /* html {

        overflow-x: hidden;

    } */



    .tooltip_area.very_big {
        left: -170px !important;
        width: 20rem;
        .trigon {
            right: 53px;
            left: unset;
        }
    }

    .tooltip_area.big {
        width: 13rem;
    }

    .tooltip_area {
        max-width: 230px;
        font-size: 0.7rem;
        width: 6rem;
        padding: 0.7rem;
    }



    .pt8 {

        padding-top: 6rem;

    }

    .calculater {

        .title.mb-4 {

           margin-bottom: 1.5rem; 

        }

        h1 {

            color: var(--Forest, #1C332B);

            font-size: 2.4375rem;

            font-style: normal;

            font-weight: 400;

            line-height: 100%;

            letter-spacing: -0.03656rem;

        }

        .themeContainer {

            max-width: 80rem;

        }

    }

}



@media (max-width: 900px) {

    .calc_area .form_input_area .row {
        flex-direction: column;
    }



    .attr text {

        font-size: 16px;

    }

    

    .attr risk {

        font-size: 14px;

    }



    .attr small {

        font-size: 12px;

    }



    .mobile_flex_column {

        flex-direction: column;

        gap: 2rem;

    }



    .result_total span {
        font-size: 1rem !important;
    }



    .block.mb-2 {

        margin-bottom: 1.5rem;

    }



    .range_area {

        height: 8rem !important;

    }



    .range_area ~ .result_total {

        margin-top: 0.5rem !important;

    }



    .line_area .lines .line {

        width: 80px;

    }



    .line_area {

        display: flex;

    }



    .line_area .lines .line_item .text text {

        font-size:1rem;

    }



    .line_area .lines .line_item .text small {

        font-size:14px;

    }



    .calculater {

        .card.big {

            span.dkk_cur.big {

                color: var(--Forest, #1C332B);

                font-size: 2.4375rem;

                font-style: normal;

                font-weight: 400;

                line-height: 100%; 

                letter-spacing: -0.03656rem;

            }

            .sub_card {

                .label_text {

                    font-size: 0.875rem;

                }

            }

        }

        .card {

            padding: 1.5rem;

            width: calc(100% - 3rem);

            .block {

                width: 100%;

            }

            .input_item {

                max-width: 100% !important;

                width: 100%;

                .input {

                    width: 100%;

                    .enter {

                        /*width: calc(100% - 1.7rem);*/

                    }

                }

            }

            h2 {

                color: var(--Forest, #1C332B);

                font-size: 1.5625rem;

                font-style: normal;

                font-weight: 400;

                line-height: 120%;

                letter-spacing: -0.01563rem; 

                padding-bottom: 0.5rem;

            }

            p {

                color: var(--Forest, #1C332B);

                font-size: 0.875rem;

                font-style: normal;

                font-weight: 400;

                line-height: 130%;

                letter-spacing: -0.0125rem;

            }



            .block {        

                .labels {

                    gap: 0.5rem;

                    flex-direction: column;

                    li {

                        font-size: 12px;

                        justify-content: flex-end;

                    }

                    li.dv1 {
                        width: max-content;
                    }

                    li:after {

                        width: 0.75rem;

                        height: 0.75rem;

                        top:0;

                    }

                }

            }



        }

    }



    .checkBox {

        width: 1rem;

        height: 1rem;

    }



    .calc_modal {width: 100%;display: inline-block;max-width: calc( 100% - 3rem );margin-top: 100px;padding: 0 1.50rem;position: absolute;left: 0;top: 0;

        .calc_area{width: calc(100% - 3rem);padding: 1.5rem;height: auto;display: block;overflow-y: auto;max-height: 80dvh;

            .title {

                padding-bottom: 1rem;

                span {

                    font-size: 1.5625rem;

                    letter-spacing: -0.01563rem;

                    font-weight: 400;

                    line-height: 120%;

                }

            }

        }

        .features {

            li {

                color: var(--Forest, #1C332B);

                font-family: "Inter";

                font-size: 0.8rem;

                font-style: normal;

                font-weight: 400;

                line-height: 130%;

                letter-spacing: -0.0125rem;

                span {

                    width:0.8rem;

                    height:0.8rem;

                }

            }

        }

        .form_input_area {

            .input_item {

                max-width: 100%;

                width:100%;

                .block { width:100% }

                .input {

                    width: 100%;

                    .enter {

                        /*width: calc(100% - 2rem);*/

                    }

                }

            }

        }

    }

}

.move_pos {
    float: right; 
    position: absolute !important; 
    right: -25px;
}



.tooltip:hover .tooltip_area {

    opacity: 1;

    z-index: 99;

    bottom: 40px;

    left: 0px;

}



span.tooltip {

    position: relative;

}



.follower {

    background-color: #0a3323;

    color: #fff;

    font-size: 16px;

    font-style: normal;

    font-weight: 400;

    justify-content: center;

    border-radius: 8px;

    margin-bottom: 14px;

    display: flex;

    padding: 8px;

    flex-direction: column;

    width: 29px;

    height: 22px;

    align-items: center;

    position: absolute;

    top: 25px;

    transition: opacity 0.4s ease;

    opacity: 0;

}

#chart_line {
    position: absolute;
    left: -1000px;
}

risk {
    color: var(--Forest, #1C332B);
    font-family: "Reckless Neue TRIAL";
    font-size: 1rem;
    font-style: normal;
    font-weight: 350;
    line-height: 140%;
    letter-spacing: -0.01rem;
    display: block;
    padding-top: 0.5rem;
}

.overflow_h .calc_modal { display: none; }
.overflow_h #green_shadow { display: none; }

.calculater .line_area .lines #second.line {
    border-bottom: 1px solid #1C332B !important;
}

.calculater .line_area .lines #first.line {
    border-bottom: 1px solid #C4AC8F;
}