/**
 * css til indholdselementer
 */
     body{
        margin:0;
        padding-bottom: 200px;
        color: #2b4751;
    }
    p{
        margin: 0;
        padding:0;
    }

    img{
        /*border-radius: 8px;*/
        border-radius: 12px;
    }
    input, input:focus, textarea:focus, input:checked {
        outline: none;
    }

    * {

      box-sizing: border-box;
      z-index: 1;
      font-family: "Hanken Grotesk", sans-serif;
      font-optical-sizing: auto;
    }


/*
    @supports (counter-set:none) {
      li[data-list] {
        counter-set: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
      }
    }
     li[data-list] {
        counter-set: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
     }
    li[data-list="ordered"] {
      counter-increment: list-0;
      content: counter(list-0);
      line-height: 2;
    }

    li[data-list="ordered"] > .ql-ui::before {
      content: counter(list-0, decimal) '. ';
    }
    .ql-indent-1{
        list-style-type: none;
    }

    li {
     list-style-type: none;
      padding-left: 1.5em;
      position: relative;
    }
    .ql-bubble * {
      box-sizing: border-box;
    }
    li[data-list="bullet"] > .ql-ui::before {
      content: '\2022';
    }

    li > .ql-ui::before {
      display: inline-block;
      margin-left: -1.5em;
      margin-right: .3em;
      text-align: right;
      white-space:nowrap;
      width: 1.2em;
    }
    li.ql-indent-1:not(.ql-direction-rtl) {
      padding-left: 4.5em;
    }
*/

     #left_column{
        width: 33.33%;
        padding: 0px;
        padding-right: 30px;
        border: 0px solid #bbbbbb;
        float: left;
     }
     #left_column > a{
        text-decoration: none;
     }

    #content-wrapper{
        position: relative;
        width: 100%;
        padding: 65px;
    }

     #content{
        padding: 0px;
        border: 0px solid #bbbbbb;
        float: right;
     }

    #content{
        /*color: #255a6d;*/
        color: #132f39;
    }


      .content_element > .content_innerwrap{
        width: 100%;
        clear: both;
        position: relative;
        font-size: inherit;
      }

    .heading,
    .heading .content_innerwrap,
    .heading > p{

        font-weight: 210;
        line-height: 114%;
        margin-left: 0;
        margin-top: 16px;
        font-size: 30px;

     }

     .body_text, .body_text .content_innerwrap{
        /*font-size: 16.5px;*/
        font-size: 17px;
     }
     h1, h2, h3, h4{
        padding: 0;
        margin: 0;
        font-weight: 210;
     }
     .content_innerwrap h2{
        font-size: 20px;
     }
     /** ****************** */

     .content_25{
        width: 25%;
     }

     .content_33{
        width: 33.33%;
     }

     .content_50{
        width: 50%;
     }

     .content_66{
        width: 66.66%;
     }

     .content_75{
        width: 75%;
     }

     .content_100{
        width: 100%;
     }

     .column_element,
     .list_year{

        margin: 8px;
        padding: 11px 14px 11px 14px;
        background-color: #6fa8b1;
        border: 1px solid #6fa8b1;
        cursor: pointer;
        clear: both;
        color: #fff;
        border-radius: 8px;

     }
     #left_header{

        font-weight: 400;
        background-color: #fff;
        clear: both;
        font-size: 20px;
        margin: 16px;
        color: #a09fa7;
        border: 0px solid #a09fa78f;
        border-bottom-width: 1px;
        border-radius: 0;
        padding: 15px 14px 10px 6px;
        margin-top: 41px;
        margin-bottom: 16px;
        width: calc(100% - 32px);

     }

     .column_element:hover,
     .list_year:hover{
        background-color: #528c9f;
     }

     .list_year{
        font-size: 26px;
        font-weight: bold;
     }

    .contain_events_year{
        display: none;
        margin: 0px;
    }

    .contain_events_year > a{
        text-decoration: none;
    }

    .contain_events_year > .column_element,
    .contain_events_year > a > .column_element{
        background-color: #a09fa7;

    }
    .contain_events_year > .column_element:hover,
    .contain_events_year > a > .column_element:hover{
        background-color: #89888f;
    }


    .column_element > .event_date_time{
        font-size: 13px;

    }

    .column_element > div{
        padding: 3px 0px 3px 0px;
    }
    .column_element b{
        font-size: 20px;
        font-weight: 500;
    }

    .contain_events_year > .column_element,
    .contain_events_year > a > .column_element {
        padding: 7px 14px 8px 14px;
        line-height: 120%;
    }


    .content_element{
        margin: 10px;
        padding: 10px;
        position: relative;
        /*font-weight: 310;*/
        font-weight: 350;
    }
     .content_element.teaser {
        margin-left: 20px;
        margin-right: 6.0px;
    }


    .content_element.turkis,
    .content_element.green,
    .content_element.purple{

        margin: 20px;
        padding: 20px;
        /* margin: 50px 20px 10px 20px;*/
        margin: 10px 20px 10px 20px;
    }

    .heading.turkis,
    .heading.green,
    .heading.purple{

        /* margin: 50px 20px 10px 20px;*/
        margin: 50px 20px 10px 20px;
    }

    .heading.turkis > .content_innerwrap,
    .heading.green > .content_innerwrap,
    .heading.purple > .content_innerwrap{

        margin-top: 0px;
    }


    #in_menu_content{

        width: 100%;
        margin: 8px;
        padding: 10px 14px 10px 14px;
        clear: both;
        display: none;

    }
    #member_box{
        font-size: 17px;
    }
    #member_box > h3{
        font-weight: 350;
    }

    #member_list li, #member_list a{
        text-decoration:none;
        color: #4e96a1;
        width: 24%;
        min-width: 400px;
        /* color: #4e96a1; */
        /* font-weight: 324; */
        color: #2b666f;
        font-size: 17px;



    }
    #member_list > a > li::marker{
        color: red;
    }

    #member_list li{
        margin: 2px;
        padding: 3px;
    }
    #member_list a{
        display: block;
    }
    #member_list li:hover{
        color: #640C87;
    }

    .date_wrap{
        padding: 10px;
    }
    #menu_background{
        background-color: #2e1235;
        position: absolute;
        bottom: 0px;
        left: 0px;
        padding: 5px;
        z-index: 110;
        width: 100%;
        height: 36px;
        display: none;
    }

    .menupunkt_level_1{
        margin: 1px 10px 1px 10px;
        color: white;
        cursor: pointer;
        /** padding: 0.5px; */
        width: fit-content;
        display: block;
        float: left;
        padding-right: 10px;
        height: 32px;
        padding-top: 5px;
    }
    .menupunkt_level_1:hover{
        color: #A96CD1;
    }


    #menu_level_1 > #search_members{

        right: 44px;
        top: 5px;
        position: absolute;
        width: 188px;
        height: 22px;
        background-color: transparent;
        font-size: 11px;
        overflow: visible;
        z-index: 110;
        border-radius: 2px;
        display: block;
    }

    #member_search_input{

        width: 150px;
        height: inherit;
        outline: none;
        border: none;
        font-size: inherit;
        padding-left: 6px;
        display: block;
        border-radius: 3px;
        background-color: #a09fa7;
        color: #fff;
        font-weight: 500;
    }

    #menu_button, #menu_search_button{
        display: none;
    }


    #searh_button{

        position: absolute;
        background-image: url('/icons/search.png');
        background-repeat: no-repeat;
        background-position: 5px 5px;
        background-color: transparent;
        cursor: pointer;
        top: 0px;
        right: 3px;
        width:22.5px;
        height: 22.5px;
        filter: invert(1);
        background-size: 17px;

    }

    .header{
      background-image: linear-gradient(to bottom right, #4aa2a3, #4aa2a3, #655995);
      color: #ffffff;
      position:relative;
      font-size: 13.5px;
      height: 170px;
      padding: 15px;
      z-index: 110;
    }
    .footer{
        position:relative;
        padding: 15px;
    }


    #logo_div{

        position: absolute;
        top: 10px;
        left: 40px;
        background-image: url('/icons/logo-aks-579x1024.png');
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100%;

        height: 151px;
        width: calc(166px * 579 / 1024);
        top: 2px;
        left: 52px;
        width: calc(143px * 579 / 1024);


    }

    #header_text{

        text-align: left;
        font-weight: 210;
        width: 350px;
        font-size: 46px;
        margin-left: 160px;
        padding-top: 15px;
        line-height: 106%;

    }


    #menu_level_1{
        background-color: #2e1235;
        position: absolute;
        bottom: 0px;
        left: 0px;
        padding: 0px;
        z-index: 110;
        overflow: visible;
        width: 100%;
        padding-left: 77px;
        height: 32px;
    }

    #close_menu{
        display: none;
    }

    body .ui-front{
        z-index: 110;
    }

    .ui-autocomplete {

        max-height: 300px;
        overflow-y: auto;
        overflow-x: hidden;
    }

    #footer-padding{

        border: none;
        padding: 15px;
        background-color: transparent;
        color: #000000;
        height: 140px;
        display: none;
        clear:both;
    }
    #footer{
        clear: both;
        position: relative;
        height: 140px;
        bottom: 0px;
        z-index: 100;
        background-image: linear-gradient(to top right, #655995, #4aa2a3, #4aa2a3);
        padding:34px;

    }
    #footer > p{
        text-align:left;
        color: #ffffff;
        font-size: 12px;
    }
    #footer > h3{
        text-align:left;
        color: #ffffff;
        font-size: 18px;
        font-weight:400;
        margin-bottom: 4px;
    }

    #row, .page_menu {

      content: "";
      clear: both;
      display: table;
      background-color: #22cc22;
    }

    #initial_elements{

        background-color: #2222cc;
        color: #ffffff;
    }

    .image_window, .file_window{

        border: 0px solid #bbbbbb;
        position: relative;
        overflow: hidden;
    }

    .image >.image_window{
        overflow: visible;
    }

    .div_images > div {
        width: 100%;
        float: left;
        padding: 12px 0px 0px 0px;
    }

    .div_images > div > img{
        width: 100%;
    }

    .image_window{
        width: 100%;
        aspect-ratio: 16 / 9;
        padding:10px;
        padding-left: 1px;
        padding-top: 0px;
        margin-top: -6px;
        /*margin-top: -9px;*/
        margin-top: -9px;
    }

    .image_carousel .image_window,
    .image_fade .image_window{
        margin: -6px;
        margin-left: 0px;
    }

    .image_window > .slide_control_container{

        width: 33.33%;
        height: 100%;
        position: absolute;
        overflow: hidden;
        background-color: transparent;
        top:0px;
        z-index: 150;

    }
    .image_window > .sc_left{
        left: 0%;
    }
    .image_window > .sc_center{
        left: 33.3%;
    }
    .image_window > .sc_right{
        left: 66.6%;
    }

    div > .img_series{

        width:calc(100% - 20px);
        height:calc(100% - 20px);
        position:absolute;
        left: 10px;
        top:10px;
        display: none;

    }

    .image_carousel,
    .image_fade{

        margin:  -10px;
        margin-left: -6px;
    }

    .date_time,
    .image_carousel,
    .image_fade,
    .body_text{

        margin-top: -3px;
    }


    .thumb_series{
        width: fit-content;
        height: fit-content;
        display: inline-block;
        padding: 10px;
        text-align: center;
        border: 0px solid #bbbbbb;
        margin-top: 10px;
        margin-bottom: 10px;
        margin-right: 10px;
        margin-left:0px;
        justify-content: center;
        align-items: center;
        border-radius: 12px;


    }

    .thumb_series > img{
        max-width: 100%;
        max-height: 100%;
        display: inline-block;
        aspect-ratio: 16 / 9;
    }

    .slide_control_container > div{

        width: 54px;
        height: 54px;
        margin-top: -25px;
        top: 50%;
        position: absolute;
        cursor: pointer;
        background-repeat: no-repeat;
        background-position: 45% 50%;
        background-color: transparent;
        border: 3px solid #111111;
        border-radius: 27px;
        display: none;
        background-color: #d1deca;
        filter: invert(1);
        opacity: 70%;

    }

    .sc_left > div{
        background-image: url('/icons/br_prev.png');
        left: 10%;
        background-size: 24px 24px;
        background-position: 42% 50%;
    }

    .sc_center > div{
        background-image: url('/icons/playback_pause.png');
        margin-left: -25px;
        left: 50%;
    }

    .sc_right > div{
        background-image: url('/icons/br_next.png');
        right: 10%;
        background-size: 24px 24px;
        background-position: 50% 50%;
    }

    .slide_selector{

        width: calc(100% - 35px);
        border: 0px solid #ff0000;
        position: relative;
        overflow: hidden;
        text-align: center;
        margin-left: 17px;

    }

    .slide_selector > .move_slide_sel_button{

        position: absolute;
        overflow: hidden;
        background-repeat: no-repeat;
        top:0px;
        z-index: 150;
        opacity: 0;
        cursor:pointer;

        width: 42px;
        height: 42px;
        margin-top: -21px;
        top: 50%;
        border: 3px solid #111111;
        border-radius: 21px;
        background-size: 20px 20px;


        background-color: #d1deca;
        filter: invert(1);

    }

    .slide_selector > .move_slide_sel_backw{
        left: 0px;
        background-image: url('/icons/br_prev.png');
        background-position:  45% 50%;
    }
    .slide_selector > .move_slide_sel_forw{
        right: 0px;
        background-image: url('/icons/br_next.png');
        background-position: 50% 50%;
    }

    .slide_thumb_container{
        height: fit-content;
        overflow-x: visible;
    }

    .img_series img{

      display: block;
      position: absolute;
      /**top: 50%;*/
      top: 0px;
      left: 50%;
      max-height: 100%;
      max-width: 100%;
      transform: translate(-50%, 0%);

    }

    .image_window > .img_single {

      display: block;
      position: absolute;
      max-height: 100%;
      max-width: 100%;

    }

    .file_list{
/*
        display: inline flow-root list-item;
        margin: 0px 20px 10px 10px;
        list-style-image: url('/icons/file-download.png');*/



    }
    .file_window ul{
        padding: 0;
    }

    .file_window li{

        display: inline flow-root list-item;
        background-image: url('/icons/file-download.png');
        background-repeat: no-repeat;

        list-style: none;
        padding: 10px 30px;
        background-repeat: no-repeat;
        background-position: 10px center;
        background-size: 20px;
        padding: 10px 0px 10px 30px;
        background-color: #90574e;
        padding: 10px 12px 10px 40px;
        filter: drop-shadow(1px 1px 1px gray);
        border-radius: 8px;
        color: #000;
        filter:invert(1);
        margin: 0px 20px 20px 0px;

    }

    .file_list:hover{
       /* background-color:#cccccc; */
        font-weight:600;
    }

    .file_list div{
        display: flex;
        width:100%;
        height:100%;
        text-align: center;
        justify-content: center;
        align-items: center;
    }

    .file_window a{
        text-decoration: none;
        color: #255a6d;;
    }

    /** application form */



    #application_form_container{
        width: 100%;

    }

    #application_form > input,
    #application_form > textarea{
        width: 100%;
        display: block;
        clear: both;
        outline: none;
        border: 1px solid #7597a4;
        margin-bottom: 4px;
        border-radius: 5px;
        margin-top: 0px;
        margin-bottom: 8px;
        margin-left: 0px;
        font-size: 16px;
        padding-left: 8px;
    }

    #application_form input[type="text"] {
      height: 30px;
    }
    .opt_no{

        width: 80px;
        height: 18px;
        display: inline-block;
        float:left;
        padding-left:40px;
        position:relative;
    }

    ._opt_no, ._opt_yes{

        position: absolute;
        cursor: pointer;
        left:0px;
        top:0px;
        width: 18px;
        height: 18px;
        border: 3px solid #7597a4;
        border-radius: 9px;


    }

    ._opt_no{
        background-color: #ffffff;

    }
    ._opt_yes{
        background-color: #7597a487;

    }
    .add_txt{
        display: none;
        clear: both;
        margin: -0px 0px 0px 0px;
    }

    #application_otherapplications {
      background-color: #7597a43b;
    }

    #application_header{
        background-color: #fff;
        clear: both;
        font-size: 20px;
        margin: 24px 0px;
        /* font-weight: 400; */
        /* color: #7597a4; */
        font-weight: 300;
        color: #485e66;

    }

    #application_budget{
        width: 100%;
        padding: 20px;
        border: 1px solid #7597a4;
        border-radius: 3px;
        margin-bottom: 30px;
    }
    #income, #expences {
        margin-bottom: 10px;
        /* font-weight: 500; */
        /* color: #7597a4; */
        font-weight: 460;
        color: #495e66;
    }

    .budget_txt, .budget_amount, .budget_remove{
        outline: none;
        border: 1px solid #7597a4;
        margin-bottom: 4px;
        border-radius: 5px;
        margin-top: 0px;
        margin-bottom: 8px;
        margin-left: 0px;
        float: left;
        font-size: 15px;
        padding: 0px 8px;
        color: #505e64;
        font-weight: 600;
    }
    .budget_txt{
        width: 60%;

    }
    .budget_amount{
        width: 20%;
        text-align: right;
    }
    .budget_delim{
        width: 30px;
        padding:6px 8px 0px 10px;
        float:left;
    }
    .budget_remove{
        width: 30px;
        height:30px;
        color:red;
        float:right;
        border: 0px solid red;
        border-radius: 15px;
        font-size: 18px;
        color: red;
        cursor: pointer;
        text-align: center
    }
    #submit_application_form,
    #add_income,
    #add_expences{
        width: 100%;
        clear: both;
        height:30px;
        margin: 10px 0px 10px 0px;
        color: #43565e;
    }
    #budget_box_income_total,
    #budget_box_expences_total,
    #budget_box_budget_total{
        clear: both;
        margin-bottom:10px;
    }

    /** booking request */

    .ressource{
        display: inline-block;
        width: 150px;
        margin: 0px 0px 10px 0px;
        padding: 3px;
        border-radius: 3px;
        cursor: pointer;

    }
    .ressource > input, .ressource > label{
        cursor: pointer;
    }
    .booking{
        background-color: #a09fa7;
        border-radius: 12px;
    }

    #available_time{
        padding: 10px 0px 10px 0px;
        font-weight: 600;
        color: #ffffff;
        font-size: 18px;
    }

    #available_time > li{
        margin-left: 40px;
        margin-top: 8px;
    }


    #request_form_container .request_form_text{
        width: 492px;
        border-radius: 3px;
        margin-top:6px;
        margin-bottom: 4px;
        height: 30px;
        width: 100%;

    }

    #request_form_container > #request_form > textarea{
        height: 100px;
        margin-bottom:16px;
    }

    #request_form_container #date_time_form_wrap input{
        border-radius: 3px;
        margin-top:6px;
        margin-bottom: 4px;
        height: 32px;
        font-size: 15px;
    }

    #request_form_container #date_time_form_wrap .dd_mm_yyyy{
        width: 120px;
    }

    #request_form_container #date_time_form_wrap .hh_mm{
        width: 70px;
    }
    #request_form_container #date_time_form_wrap #date_end{
        margin-left: 10px;
    }

    #request_form_container  input[type=button],
    #application_form_container > input[type=button]{
        background-color: #801187;
        color: #ffffff;
        font-weight: bold;
    }

    #request_form_container  input[type=button]:hover,
    .ressource:hover{
        background-color: #a96cd1;
        cursor: pointer;
    }

    /** til kalender */




    #date_time_form_wrap{
        width: fit-content;
        border:none;
        position:relative;
        z-index: 111;

    }


    #request_form_container{

        padding: 20px 0px 20px 20px;
        border-radius: 2px;
        background-color: inherit;
        color: #ffffff;
        font-size: 15px;
        float: left;
        width: 50%;

    }

    #item_description{

        position: relative;
        height: 100%;
        padding: 20px;
        border-radius: 2px;
        background-color: #eeeeee;
        color: #333333;
        font-size: 15px;
        float: left;
        border-radius: 8px;
       /* width: calc(50% - 20px);*/
        width: calc(50% - 40px);
        margin: 20px;

    }

    .h3_link{
        font-weight: 600;
    }

    #hide_description{
        width: 16px;
        height: 16px;
        top: 10px;
        right: 10px;
        position: absolute;
        background-image: url('/icons/delete.png');
        background-repeat: no-repeat;
        cursor: pointer;
        background-position: center;
        border: none;
    }


    #request_form_container input,
    #request_form_container textarea
    {
        padding: 6px;
        cursor: default;
        background-color: #fafafa;
        border: 1px solid #333333;
        font-size: 14px;
        border-radius: 5px;
    }
    #request_form_container label{

        font-size: 16px;
        font-weight: 400;
    }

    #date_time_form_wrap input{

        padding: 6px;
        cursor: default;
        text-align: center;
        background-color: #eeeeee;
        border: 1px solid #333333;
        font-size: 14px;
        border-radius: 5px;

    }


    #date_time_form_wrap input:hover{
        background-color: #aaccdd;
        cursor: pointer;
    }

    #date_time_send{

        width: 55px;
        margin-left: 28px;

    }

    .dd_mm_yyyy{

        width: 110px;
        margin-right: 4px;
    }

    .hh_mm{

        width: 55px;
        margin-right: 14px;

    }
    .date_picker_wrap, #date_picker_wrap{

        border: 1px solid #333333;
        padding:10px;
        width: fit-content;
        display: none;
        position:absolute;
        z-index: 120;
        background-color: #eeeeee;

    }
    #month_selector_box{
        width: 98%;
        height:60px;
        margin-left: 1%;
        padding: 10px;
        border: 1px solid #333333;
        position:relative;
        text-align: center;
        z-index: 110;
    }
    .month_next_prev{
        width:36px;
        height:36px;
        top: 12px;
        position: absolute;
        cursor: pointer;
        background-repeat: no-repeat;
        background-position: center;
        background-size:24px 24px;
        z-index: 110;
    }

    #month_prev{
        left: 0px;
        background-image: url('/icons/br_prev.png');
    }
    #month_next{

        right: 0px;
        background-image: url('/icons/br_next.png');
    }

    .weekday, .monthday{
        width: 40px;
        height: 30px;
        text-align: center;
        display: inline-block;
        margin: 1px;
        vertical-align: middle;
        padding-top: 3px;
    }
    .weekday{
        background-color:#aaaaaa;
        border: 1px solid #666666;
    }
    .monthday{
        padding-top: 5px;
        font-size: 14px;
        border: 1px solid #aaaaaa;
        background-color:#f6f6f6;
    }
    .date_active{
        font-weight: bold;
        color:#111111;
        cursor: pointer;
    }
    .date_active:hover,
    .interval_bullet:hover{
        background-color: #aabbee;
        border: 1px solid #aaaaaa;
    }
    .date_passive{
        color:#999999;
        cursor: default;
    }

    #clock_picker_wrap{

        position:absolute;
        width: 340px;
        height: auto;
        border: 1px solid #333333;
        background-color: #eeeeee;
        display: none;
        z-index: 120;
    }


    #digi_clock_box{
        width: 320px;
        height:60px;
        margin:10px;
        padding: 10px;
        border: 1px solid #333333;
        position:relative;
        text-align: center;
        z-index: 110;
    }
    .digi_clock{
        margin-top: -10px;
        font-size:44px;
        display: inline-block;
        text-align: center;

    }
    #digi_hh, #digi_mm{
        width: 66px;
    }
    #digi_hh:hover, #digi_mm:hover{
        background-color: #cccccc;
        cursor: pointer;
    }

    #digi_hh{
        background-color: #bbbbbb;
    }

    #digi_colon{
        width:24px;
    }

    #digi_ok{
        position:absolute;
        top:13px;
        right: 20px;
        width: 48px;
        height: 32px;
        font-size: 24px;
        font-weight: normal;
        border: 2px solid #666666;
        color: #666666;
        cursor: pointer;
    }

    #clock_circle_hh, #clock_circle_mm{

        position:relative;
        width: 320px;
        height: 320px;
        border: 1px solid #333333;
        background-color: transparent;
        border-radius: 160px;
        margin: 10px;
    }
    #clock_circle_mm{
        display: none;
    }

    #clock_center_hh, #clock_center_mm{

        position:absolute;
        width: 0px;
        height: 0px;
        overflow: visible;
        top: 144px;
        left: 142px;
    }

    .interval_bullet{
        position: absolute;
        background-color: #eeeeee;
        text-align: center;
        font-weight: bold;
        cursor: pointer;
    }
    .big_bullet{
        padding-top: 6px;
        font-size: 14px;
        width:32px;
        height: 32px;
        border-radius: 16px;
    }
    .small_bullet{
        padding-top: 6px;
        font-size: 12px;
        width:28px;
        height: 28px;
        border-radius: 14px;
    }

    .event_date_time{
        display: inline;
    }

    /**
     * teaser box
     */
    .teaser_box{
        color: #ffffff;
        bottom: 0px;
        left: 0px;
        position: absolute;
        width: 100%;
        height: 50%;
        padding: 20px;
        border-radius: 0px 0px 16px 16px;

    }
    .teaser_img{
        color: #ffffff;
        top: 0px;
        left: 0px;
        position: absolute;
        width: 100%;
        height: 50%;
        padding: 20px;
        border-radius: 16px 16px 0px 0px;
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .teaser{
        margin: 60px 20px 60px 20px;
        width: calc(25% - 40px);
        float: left;
        aspect-ratio: 5 / 8;
        border-radius: 16px;
        cursor: pointer;
        opacity: 1;
        transition: 0.3s;
    }
    .teaser:hover{
        opacity:0.7;
    }

    .turkis{
        background-color: #a3cbc7;
        /*border-radius: 16px;*/
        color:#ffffff;
    }

    .green{
        background-color: #acc674;
        /*border-radius: 16px;*/
        color:#ffffff;
    }

    .purple{
        background-color: #9072c9;
        /*border-radius: 16px;*/
        color:#ffffff;
    }
    .turkis, .green, .purple{
        border-radius: 12px;
    }

    .teaser .turkis, .teaser .green, .teaser .purple{
        border-radius:  0px 0px 16px 16px;
        padding: 20px;
        margin: 0px;

    }

    .turkis > .image_window,
    .green > .image_window,
    .purple > .image_window{
        margin-top: 0px;

    }

    /**
    /* kontaktformular
    */

    #contact_form_wrap{
        max-width:1280px;
        display: flexbox;
        margin-right: auto;
        margin-left: auto;
        position: relative;
        color:#ffffff;
        background-color: #a09fa7;
        height: 400px;
        margin-top: -11px;
        width: calc(100% + 40px);
        margin-right: -20px;
        margin-left: -20px;
        border-radius: 8px;
    }

    #contact_left_content{
        font-size: 12px;
    }

    #contact_left_container h3{
        padding-left: .5rem;
    }

    #contact_form_wrap > div{

        display: inline-block;
        float: left;
        min-width: 200px;
    }

    #contact_form_wrap > div > div{
        padding: 20px;
    }

    #contact_form_wrap #contact_left_container{
        width: 250px;
        padding: 20px;
    }

    #contact_form_wrap #contact_right_container{
        width: calc(80% - 4px);
    }

     #contact_right_container #contact_form_container,
     #contact_right_container #map_container{
        width: 50%;
        background-color: #a09fa7;
        float: left;
    }

    #contact_form_container {
        padding-top: 9px;
    }

    #contactform_image{

        min-width: 200px;
        border-radius: 8px;
        width: calc(47% - 42px);
        float: right;
        margin: 48px 36px 20px 20px;
    }

    #contact_form_container > div{
        margin-top: 2.5px;
        font-size: 12px;
    }


    #contact_form .contact_form_text,
    #contact_form_container input[type=button]{

        width: 100%;
        margin-bottom: 4px;
        border-radius: 5px;
        margin-top: 0px;
        margin-bottom: 8px;
        margin-left: 0px;

    }
    #contact_form > label{

        font-size: 12px;
        margin-left: 5px;
    }

    #contact_form > textarea{
        height: 100px;
        margin-bottom:16px;
    }
    #contact_form  input[type=text]{
        height: 30px;
    }

    #contact_form_container input[type=button]{
        background-color: #801187;
        color: #ffffff;
        font-weight: bold;
        padding: 6px;
        cursor: default;
        border: 1px solid #333333;
        font-size: 14px;
        margin-top: 18px;

    }

    #contact_form_container input[type=button]:hover{
        background-color: #a96cd1;
        cursor: pointer;
    }

    #inner_contact_left_content, #contact_left_content{
        border:none;
        font-size: 14px;
    }
    #inner_contact_left_content{
        margin-top: 3px;
    }
/***************************************/
    .image_carousel .image_window,
    .image_fade .image_window{
        width: calc(100% + 31px);
    }

/***************************************/


    .left_33{
        float: left;
        width: calc(33% - 21px);
    }
    .left_50{
        float: left;
        width: calc(50% - 21px);
    }
    .left_66{
        float: left;
        width: calc(66% - 21px);
    }
    .right_33{
        float: right;
        width: calc(33% - 21px);
    }
    .right_50{
        float: right;
        width: calc(50% - 21px);
    }
    .right_66{
        float: right;
        width: calc(66% - 21px);
    }
    .clear_100{
        clear: both;
        width: calc(100% - 21px);
        float: left;

    }

    .clear_100.turkis,
    .clear_100.green,
    .clear_100.purple{

        width: calc(100% - 41px);

    }
    .left_33.turkis,
    .left_33.green,
    .left_33.purple,
    .right_33.turkis,
    .right_33.green,
    .right_33.purple{

        width: calc(33.3% - 41px);

    }

    .left_50.turkis,
    .left_50.green,
    .left_50.purple,
    .right_50.turkis,
    .right_50.green,
    .right_50.purple{

        width: calc(50% - 41px);

    }

    .left_66.turkis,
    .left_66.green,
    .left_66.purple,
    .right_66.turkis,
    .right_66.green,
    .right_66.purple{

        width: calc(66.6% - 40px);

    }




    [class*="col-"] {
      float: left;
      padding: 0.5vw;
    }

    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}

    #under_consrtuction{
        width: 600px;
        height: fit-content;
        position:fixed;
        background-color: #ffffff;
        opacity: 0.8;
        padding: 30px;
        top: 20px;
        left: calc(50% - 300px);
        z-index:999;
        display: none;
    }

    #totop{
        width: 46px;
        height: 46px;
        border: 2px solid #111111;
        border-radius: 23px;
        bottom: 36px;
        right: 36px;
        position: fixed;
        display: block;
        background-image: url('/icons/arrow-alt-to-top.png');
        background-repeat: no-repeat;
        background-position: 50% 8px;
        opacity: 0.9;
        cursor: pointer;
        z-index: 1000;
    }