@font-face {
    font-family: 'OpenSans-Regular';
        src: url('design/fonts/OpenSans-Regular.ttf');
        src: url('design/fonts/OpenSans-Regular.ttf') format ('truetype')
}


@font-face {
    font-family: 'OpenSans-Bold';
        src: url('design/fonts/OpenSans-Bold.ttf');
        src: url('design/fonts/OpenSans-Bold.ttf') format ('truetype')
}

/* Setup --------------------------------------------- */
:root{
    --main-color: black;
    --sec-color: #464646;
    --gradient: radial-gradient(ellipse, rgb(149, 206, 255) 0%, rgb(91, 128, 192) 100%);
}
a { color: black;  }
a:visited { color: var(--main-color); }
a:hover { color: rgb(91, 128, 192) !important; cursor: pointer; }
a:focus { outline: thin dotted; }
a:link{color: var(--main-color); text-decoration: none;}
body { font-family: 'OpenSans-Regular', Futura, Trebuchet MS, Arial, sans-serif; }
pre {font-family:monospace,serif;font-size:1em;white-space:pre;white-space:pre-wrap;word-wrap:break-word;margin:0;padding:0}
code {font:inherit;font-family:monospace,serif;font-size:1em;margin:0;padding:0}
em{font-style: italic;}
strong{ font-family:'OpenSans-Bold'; }
video{width: 100%;}
body{max-width:100%; overflow-x:hidden; background-color: white; background-attachment:fixed; background-size: cover; position: relative;}
h1 {margin-bottom:3.5vw; color:var(--main-color);line-height: 1.7em; font-family:'OpenSans-Bold'; text-align: center;}
h2, h2 span {margin-bottom:0.5vw;margin-top:0; line-height: 1.7em; color: var(--main-color); font-family:'OpenSans-Bold';}
h3 {margin-bottom:0.5vw;margin-top:0;line-height: 1.7em; color:var(--main-color); font-family:'OpenSans-Bold'}
h4 {margin-bottom:.25em;margin-top:0;line-height: 1.7em; color:black;}
p{ font-family:'OpenSans-Regular'; margin-bottom: 1vw; color:var(--main-color);  line-height: 1.7em;}
li, label{line-height:1.7em}
ul{margin:0; padding:0;}


@supports (-webkit-appearance: none) {
    li{ padding-left: 1em; margin-left:0; text-indent: -1.5em;}
}

@supports (-moz-appearance: none) {
    li { 
        padding-left: 1em; 
        margin-left: 0; 
        text-indent: 0; /* Standard-Einrückung für Firefox */
    }
}

td,th{padding: 0.5em;}
tr, td{border: 1px solid black;}

#header{background: var(--gradient); width: 100vw; position: relative; margin-bottom: 2rem;}
#header_inner{position: relative; background-color:white; width: 100vw; height: 4vw; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); }

/* Mobile Menu ####################################################################################*/

#mobile_wrapper{overflow:hidden; width: 5vw;}

#mobile_navi_inner{display:none; text-align: left; overflow: hidden; position: absolute; width: 102vw; background-color: rgb(36, 35, 35); z-index: 3; font-size: 2vw; top:6vw; left:-7vw; border-bottom: 3px solid var(--main-color);}
#hamburger_line_wrapper{ width:100%; height:100%;}
.hamburger_line{position:relative; height:6px; margin:0 auto 0.25rem auto; width: 100%; background-color: #3A3A3A; display:block; border-radius: 2rem;}
.hamburger_text{font-size: 1.1em; width: 55px; display: block; margin-top: 0.5em; font-family: 'OpenSans-Bold'; color: var(--main-color);}
#mobile_logo img, #mobile_logo{max-width:40px; max-height: 40px;}
#mobile_logo{ float:right; margin-right: 1em;}
#mobile_navi_inner ul {display: block; overflow: hidden;}

#mobile_navi_inner a, #mobile_navi_inner a:visited {color: white; }

#mobile_navi_inner ul li {  border-top: 1px solid rgb(84, 84, 84); width: 100%;}
#mobile_navi_inner ul li:last-child{border-bottom: none;}
#mobile_navi_inner ul li.current a{ font-family: 'OpenSans-Bold'; color: white;}
#mobile_navi_inner ul li ul li.current a{ font-family: 'OpenSans-Bold' !important;}
#mobile_navi_inner ul li ul{display: block;}
#mobile_navi_inner ul li ul li{width: 100%; border: none; padding-top: 0; padding-bottom: 0;}
#mobile_navi_inner ul li a{font-family: 'OpenSans-Regular';  padding: 1.5em 10%;display: block; }

#mobile_navi_inner ul li ul li a{font-family: 'OpenSans-Regular' !important; font-size: 0.8em;}
#mobile_navi_inner ul li.current ul li a{color: white;}


.mobileTargerRot{transform: rotate(90deg);}
#mobile_navi_inner ul li ul{display: none;}
#mobile_navi_inner ul > li a.mobileTarget{float:right; width:20px; height: 20px; text-align: center; cursor:pointer; padding: 0 100px 0 0;}
#mobilemenu{display: none;}

/* Mobile Menu END ################################################################################*/

/* Navigation Menu */
#navi{position: absolute; top:50%; left:50%; transform: translate(-50%, -50%);}
#navi_inner ul li{display: inline-block; padding:0 1vw;}
#navi_inner a{font-family: 'OpenSans-Bold'; font-size: 1vw; color:black;}
#navi_inner a:hover{color: var(--sec-color);}

#mobile_wrapper{display:none;}

/*Content*/
#content{width: 62.3vw; margin: 5rem auto;}

/*Shoppingcart*/
#shoppingCart input, #shoppingCart lable{display: block;}
.sdja_custom_checkbox{box-sizing: border-box; border: 2px solid #3A3A3A;background-color:#3A3A3A; cursor: pointer; color: white; flex:0 0 calc(25% - 1rem)!important; margin: 1rem 0.5rem; position: relative; min-height: 75px; padding: 0.5rem;}
.sdja_custom_checkbox div:first-child{width: 80%;}
.sdja_custom_checkbox div:last-child{width: 8%; aspect-ratio: 1; position: absolute; right: 0.125rem; bottom: 0.125rem; text-align: center; vertical-align: middle;}
.sdja_custom_checkbox_seleced div:last-child{background-image: url("../../elements/jobs/images/sdja_icon_check.svg"); } 
.sdja_custom_checkbox:hover{border: 2px solid #A1D115;}

/*Footer*/
#footer{width: 100%; background-color: rgb(91, 128, 192);}
#footer_container{width: 62.3vw; margin: 0 auto; display: flex; flex-direction: inherit;}
.footer_row{ width: 50%; padding:2rem 0}
#footer a{color: white; }

/*FONT*/
h1 {font-size:2.5vw;}
h2 {font-size:1.5vw;}
h3 {font-size:1.25vw; margin-top: 2em;}
h4 {font-size:1.25vw;}
p{font-size: 1vw;}
a{font-size: 1vw;}
input, label, textarea{font-size: 1vw;}
#content ul li, #content li{font-size: 1vw; margin-left:1em;}

.sdja_sa_job_container_detail{font-size: 1rem;}
.sdja_sa_job_container_info{font-size: 1rem;}
.sdja_text_container ul li {font-size:1vw;}

.container_filter h2 {font-size: 1.25rem;}
.ro_ssknd_container h1{font-size: 175%;}

.debug{background-color: rgb(32, 28, 40); padding: 1rem; color: red !important;}
.debug_red{ color: red !important;}
.debug_green{color: limegreen !important;}
.debug_blue{color: lightskyblue !important;}
.debug_white{color: white !important;}
.debug_border{padding:0.25em; border: 1px solid; box-sizing: border-box;}


/*SA*/
.sdja_sa_job_container{width: 60vw; min-height: 1vw; background-color: white; margin: 0 auto 2rem auto; padding:1% 0 1% 1%; position: relative;}
.sdja_sa_job_container_info{width: 100%; }

.sdja_sa_job_container_detail{ width: 98%;  display: block; margin-top: 1rem; border-top: 1px solid black; padding-top: 1rem;}
.sdja_sa_job_container_details_column{ box-sizing: border-box; min-height: 50px; width: 23.75%; margin-right: 1%;  display: inline-block; vertical-align: top;}
.sdja_sa_job_container_details_column:last-child{margin-right: 0;}

.sdja_sa_icon{display: inline-block; padding: 0.25rem; border-radius: 10px;}
.sdja_sa_icon img{width: 1.5rem; vertical-align: middle;}

.sdja_sa_job_container_info_one{width: 68%; display: inline-block;}
.sdja_sa_job_container_info_two{width: 26%; display: inline-block;}
.sdja_sa_job_container_info_three{width: 5%; display: inline-block;}
.sdja_sa_job_container_info_three img{width: 100%;}
.sdja_sa_job_container_info_four{width: 5%; display: inline-block;}
.sdja_sa_job_container_info_four select{margin: 0 auto; color: white !important; width: 50%; text-align: center; display: block;}
.sdja_btn_arrow{width: 1rem;}

/*A*/
.sdja_container{width: 100%; max-width: 1000px; margin: 0 auto; padding: 2%;}
.sdja_container h1 ,.sdja_container p{margin: 0; color: black;}

#sdja_jobs_container{width: 98%; background-color: white; padding:1%; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; position: relative; filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.5));}
.sdja_jobListContainer{display: flex; justify-content: left; padding: 1rem 0; border-bottom: 1px solid #aeca05;}
.sdja_innerJobListContainer{ display:flex; flex-direction: column; align-items: center; background-color: #aeca05; border-radius: 10px; padding:1%; margin-right: 1rem;}

/*HEADER*/
.headerSelectImg{width: 1vw;}

#header_inner{font-size: 1.03vw !important;}
#header_btn_container_rgt form{transform: translateY(15%)}
.header_infKundenBereich{background-color:rgb(91, 128, 192); text-align:center;}
.header_infKundenBereich p{font-size: 120%; margin: 0; padding: 0.5em 0; color: white;}

#user_header{margin-top: 2rem;margin-left: 2rem;}
#header_logo{width: 25%; display: block; margin: 0 auto;}

#header_btn_container_rgt{position: absolute; top:50%; right:5%; transform: translateY(-50%);}
#header_btn_container_lft{position: absolute; top:50%; left:5%; transform: translateY(-50%);}
.header_btn{display: inline-block; margin-right: 1rem; padding: 0.5rem 1rem; border-radius: 0.25rem; border: none; color: white !important;}
/* .header_btn:last-child{margin-right: 0;} */

/*ELEMENTE*/
.flex_container { display: flex; flex-flow: wrap;}
.flex_container > div { flex: 1;}
.infoPageImg_Container{display: flex; flex-direction: row; align-items: stretch;}
.infoPageImg_Container img{object-fit: cover; width: 50%;}

.ncms_image_upload{display: block; border: 1px solid #ddd; border-radius: 4px; width: 30%; position: relative; overflow: hidden;}
.ncms_image_upload > div{position: absolute; bottom: 0; padding:0.5em; background-color:var(--sec-color); border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; width: calc(100% - 1em);}
.ncms_image_upload div a {display: inline-block; padding: 0.125em 0.25em; border-radius: 10px; color: white;}
.ncms_image_upload div a:first-child{margin-right: 0.5em;}
.ncms_image_upload img{width: 95%; margin: 0.5em auto 3em auto; display: block;}

.sdja_text_container{width: 60vw; margin: 0 auto;}
.sdja_text_container ul { list-style-type: disc !important; padding-left: 20px; margin: 1rem 0; }
.sdja_text_container ul li { margin-bottom: 0.5rem;  }

.sdja_job_container{width: 60vw; min-height: 12vw; background-color: white; margin: 0 auto 2rem auto; padding:1% 0 1% 1%; position: relative; display: flex; flex-wrap: nowrap;}
.sdja_job_container p{ margin-bottom: 1rem;}
.sdja_container_shadow{filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.5))}
.sdja_job_container_inner_info{ flex: 0 0 75%;}
.sdja_job_container_inner_option{ border-left: 2px solid #ccc; flex: 0 0 25%; }
.sdja_job_container_inner_info hr{border-width: 2px; margin: 2rem 0 2rem 0;}
.sdja_job_container_inner_option select{width: 80%; border-radius: 10px; text-align: center; appearance: none !important; margin: 0.5rem auto; color: white; border: none;}
.sdja_job_container_inner_option a{width:80%; margin: 0.5rem auto; display: block;}

.sdja_job_state_green{border-radius: 10px; background-color: #aeca05; color: white; display: inline-block; padding: 0.25rem 0.5rem;}
.sdja_job_state_red{border-radius: 10px; background-color: red; color: white; display: inline-block; padding: 0.25rem 0.5rem;} 
.sdja_job_state_orange{border-radius: 10px; background-color: #ff7300; color: white; display: inline-block; padding: 0.25rem 0.5rem;} 
.sdja_job_state_grey{border-radius: 10px; background-color: #C2C2C2; color: white; display: inline-block; padding: 0.25rem 0.5rem;} 
.sdja_job_state_icon{display: block; margin: 0 auto; width: 1.25vw;}

.sdja_popup_small{width: 50%; min-height: 100px; background-color:white; position:absolute; border-radius: 10px; padding: 2rem 3rem 2rem 2rem;}
.sdja_popup_small p{margin-bottom: 1rem;}
.sdja_popup_background{background-color: rgba(0, 0, 0, 0.5); width: 100vw; height: 100vh; position: fixed; top: 0;}
.sdja_popup_center{top:30%; left:50%; transform:translateX(-50%);}
.sdja_btn_top_right{position: absolute; top:0; right:0; padding: 0.5rem 1rem !important;}

.sdja_popup_fullscreen{position: fixed; width: 100vw;  height: 100vh; z-index: 99; top: 0;  background-color: rgba(0, 0, 0, 0.75);}
.sdja_popup_fullscreen > div{background-color: white; width: 60vw; height: 85vh; top: 5%; position: relative; margin: 0 auto; padding:1em; overflow-y:scroll;}
.sdja_popup_fullscreen > div li{margin-left: 1em;}
.sdja_popup_blur{filter: blur(5px);}
.sdja_popup_btn_close{color: white; background-color: black; border: 1px solid white; border-radius: 100px; padding: 0.25em 0.75em; position: absolute; top: 5%; right: 10%;}
.sdja_popup_btn_close:hover{color: white; background-color: rgb(50, 50, 50);}

#bewerbunsForm input[type="checkbox"]{min-width:20px; min-height:20px;}
.requiredInput{border:1px solid red;}

.faq_container{text-align: left; background-color: white; padding: 1.5em 1em; border-bottom: 1px solid #bbbaba;}
.faq_q{position: relative;}
.faq_container:last-child{border: none;}
.faq_container div p{margin-bottom: 0;}
.faq_container div a{ aspect-ratio: 1/1;  width:32px; background: url('../../elements/FAQ/images/faq_icon.png'); position:absolute; top: 50%; right: 5%; transform: translateY(-50%);}
.faq_container div a:hover{background-position-y: -32px;}
.faq_container div a.faq_current_target{background-position-y: -64px;}
.faq_container div a.faq_current_target:hover{background-position-y: -32px;}
.faq_container:has(.faq_current_target) { background-color:rgb(211, 232, 249);}
.faq_btn{background-color:rgb(32, 221, 15); padding: 0.25em 0.5em; border-radius: 10px; color: white;}

/*FORM*/
.sdja_form_container{width: 60vw; margin-left: auto; margin-right: auto;}
label { display: block; margin-bottom: 0.33rem; font-weight: bold; color: #333; }
.label_readonly{color: #bbbaba !important;}

input[type="text"], input[type="email"], input[type="password"], input[type="number"], textarea { width: 98%; padding: 1%; margin-bottom: 1rem; border: 1px solid #ddd; border-radius: 4px;  transition: border-color 0.3s ease; }
input:required{ background-color: white; }
input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus { border-color: #007bff; outline: none; box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25); }
input[type="submit"], button { width: 100%; padding: 0.75rem; background-color: #007bff; color: white; border: none; border-radius: 4px;  cursor: pointer; transition: background-color 0.3s ease; }
input[type="submit"]:hover { background-color: #0056b3; }
input[type="date"] { width: 98%; padding: 1%; margin-bottom: 1rem; border: 1px solid #ddd; border-radius: 4px;  transition: border-color 0.3s ease; }
input[type="date"]:focus { border-color: #007bff; outline: none; box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25); }
.input_readonly{border-color: #dcdbdb !important;}
.input{border: 1px solid black; padding: 0.5rem; border-radius: 1rem;}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }
.input_checked{background-color: #dcec85f7;}
.input_error{border: 1px solid red !important;}


select {
    width: 100%;
    padding: 0.5rem;
    margin-bottom: 1rem;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: white;
    transition: border-color 0.3s ease;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: right 0.7rem top 50%;
    background-size: 0.65rem auto;
}

select:focus { border-color: #007bff; outline: none; box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25); }
#errorMessages { margin-top: 20px; padding: 10px; background-color: #f8d7da; border: 1px solid #f5c6cb; border-radius: 4px; color: red; }
#errorMessages ul { margin: 0; padding-left: 1rem; }

/*MARGINS*/
.margin_b{margin-bottom: 2rem !important;}
.margin_t{margin-top: 2rem;}
.margin_r{margin-right: 1rem;}
.margin_l{margin-left: 1rem;}

/*PADDINGS*/
.padding_b{padding-bottom: 1rem;}
.padding_t{padding-top: 1rem;}
.padding_r{padding-right: 1rem;}
.padding_l{padding-left: 1rem;}

/*DISPLAY*/
.display_inline_block{display: inline-block;}
.display_none{display: none;}
.display_block{display: block;}

/*POSITION*/
.position_relative{position: relative;}

/*BTN*/
.btn{padding:0.5rem 1rem; border-radius: 0.25rem; color: white !important;}
.btn_sdja{border-radius: 10px; padding: 0.25rem; color: white !important; text-align: center; min-width: 1.5vw;}
.btn_square{aspect-ratio: 1;}
.btn_sdja:hover{color: white;}
.btn_form{ display: block; margin-top: 1rem; padding: 0.5rem 1rem; border-radius: 0.25rem; border: none; color: white !important; text-align: center; }

.btn_blue:hover { background-color: #0056b3; transition: background-color 0.3s ease; color: white !important;}
.btn_green:hover { background-color: #28b84a; transition: background-color 0.3s ease; color: white !important;}
.btn_red:hover { background-color: rgb(201, 0, 0); transition: background-color 0.3s ease; color: white !important;}
.btn_blue{background-color: #007bff;}
.btn_green{background-color: #30d757;}
.btn_red{background-color: red;}
.btn_grey{background-color: #C5C5C5;}
.btn_orange{background-color:#ff7300}

.btn_blink{animation: blink 1s infinite; }

@keyframes blink {
    0% { background-color: red; }
    50% { background-color: rgb(0, 255, 4); }
    100% { background-color: red; }
}


/*CUSTOM DROPDOWN*/
.sdja_dropdown_container{width: 75%; position: absolute; height: 500px; background-color: rgb(205, 205, 205); overflow-y: scroll; z-index: 1; border-radius: 1rem;}
.sdja_dropdown_btn{background-color: rgb(238, 238, 238); border-bottom: 2px solid rgb(205, 205, 205); display: block; color: black; cursor: pointer; padding: 1rem;}
.sdja_dropdown_btn:hover{background-color: #dcec85f7; color: black;}
.sdja_dropdown_btn ul{margin: 0;}
.customDropDown_default_option{background-color: #e6eebaf7 !important;}
.customDropDown_default_option:hover{background-color: #dcec85f7 !important;}


/*READOUT*/

.ro_wrapper_full{width: 100%;}
.ro_wrapper_small{width: 75%; display: table-cell;}
.ro_wrapper_small h2{width: 85%;}
.ro_img_container{width: 25%;display: table-cell; height: 100%; position: relative;}
.ro_img_container img {width: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.lk_container{background-color: #3A3A3A; box-sizing: border-box; color: white; padding: 1.5em 1em 1em; position: relative; cursor: pointer;}
.lk_container p {color: white; line-height: 1.5em; margin-bottom:0; font-size: 0.75vw;}
.lk_container a{color: white; font-size: 0.6vw !important;  display: block;}
.lk_location{position: absolute; background-color: #A1D115; padding:0.25rem 0.5rem; top:0; left: 0; border-radius:10px; transform:translate(10%, -50%); line-height: 1.5em; font-size:0.75vw; color:#3A3A3A;}
.flex_container > .lk_container {
    flex:0 0 calc(25% - 1rem); margin: 1rem 0.5rem;
}


/*ORDER*/
.orderContent { margin: 2em auto; padding: 2em; border: 1px solid #ccc; border-radius: 8px; background-color: #f9f9f9; }
.orderContent table { width: 100%; border-collapse: collapse; margin-top: 1em; }
.orderContent th, .orderContent td { padding: 1em; text-align: left; border-bottom: 1px solid #ddd; }
.orderContent th { background-color: #A1D115; color: white; }
.orderContent tr:hover { background-color: #f1f1f1; }
.orderContent tr:last-child { font-family: 'OpenSans-Bold'; color: #A1D115; border-bottom: 1px solid black; }
.orderContent tr:last-child td{ border-bottom: 1px solid black; }


/*ADMIN READOUT*/
.sdje_admin_container { width: 98%; background-color: rgb(231, 255, 220); padding: 1%; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; position: relative; border:1px solid rgb(32, 221, 15)}
.sdje_admin_content{padding: 1rem;}

@media only screen and (max-width: 720px) {
    .ro_ssknd_container{display: block;}
    .ro_img_container{display: block; width: 50%; margin: 0 auto;}
    .ro_img_container img{width: 100%; position: relative; transform: none; left: auto; top: auto;}
    .ro_container_date{position: relative; top: auto; right: auto;}
}

#ro_filter_container{width: 100%; min-height:100px; border: 2px solid #C5C5C5; box-sizing: border-box; border-radius: 0.5rem; margin-bottom:1rem; padding: 1rem;}
#ro_filter_container input{margin-right: 3rem;}
#ro_filter_container div{display: inline-block; vertical-align:top;}
#ro_filter_container input, #ro_filter_container select {margin-bottom: 1rem; border: 1px solid rgb(200, 200, 200); border-radius: 5px;}
#ro_filter_container select{padding-left: 0.25rem; background-color: white; width: 75.5%;}
#ro_filter_container label{display: block;}

.ro_container_date{position: absolute; top: 1rem; right: 1rem; z-index: 1; }





.ro_btn, .ro_btn:hover, .ro_btn:visited, .ro_btn:link{background-color: #709D00;-webkit-user-select: none; -ms-user-select: none;  user-select: none; cursor:pointer; border-radius: 0.5rem 0 0.5rem; padding: 0.5rem 1rem; color: white; font-weight: bold;}

.ro_ssknd_btn:hover .ro_ssknd_container{background-color: #d1e7ff; transition: background-color 0.5s ease;}

.container_filter{width: 15%; background-color: white; position: fixed; top: 10%; left: 0; min-height: 350px; z-index:1; filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.5)); padding: 2%; }
.filter_anim_hidden{transform: translateX(-100%);}
.filter_anim_view{transform: translateX(0);}
.filter_anim_transition{transition: transform 0.3s ease;}
.filter_trigger{width: 3vw; height: 3vw; background-color: white; border-radius: 100px; position: absolute; right: 0; top:15%; transform: translateX(50%);}
.filter_trigger a{ position: absolute; top: 50%; left: 60%; transform:translateY(-50%);}
.container_filter input{border: 1px solid #ddd; padding: 0.5rem; border-radius: 1rem; width: 90%;}
.filter_placeholder_text{color: #ddd;}
.filter_tag{width: 92%; color: #ddd; padding: 2% 2%; display: block; text-align: center; margin-bottom: 0.25rem;}

.filter_deselected{border: 1px solid #ddd; border-radius: 1rem;}
.filter_deselected:hover{color:white;  background-color: #0056b3; transition: background-color 0.3s ease; }
.filter_selected{border: 1px solid #007bff; border-radius: 1rem; background-color: #007bff; color: white;}
.filter_selected:hover{color:white;}
.container_filter h2 { color: #007bff;}


.container_filter select {
    width: 97%;
    padding: 0.5rem;
    margin-bottom: 1rem;
    border: 1px solid #ddd;
    border-radius: 1rem;
    background-color: white;
    transition: border-color 0.3s ease;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: right 0.7rem top 50%;
    background-size: 0.65rem auto;
}

.ro_ssknd_container{ min-height: 200px; width: 100%; display: table; background-color: white; filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.5)); position: relative; box-sizing: border-box; margin-bottom:1rem; padding: 1rem; position: relative;}
.ro_ssknd_container h1{text-align: left; margin-bottom: 1vw;}

/*in Verwendung?*/
.org_link_container{position: relative; padding-top: 1rem; display: inline-block;} 
.org_link_container a:hover {color: red;}
.org_link_container a {padding-left: 2rem;}
.org_link_container a span{color: red;}
.icon_achtung{display: block; position: absolute; width: 1.5rem; top: 0.5rem}

@media only screen and (max-width: 1600px) {
    #content{width: 80vw;}
    #header_btn_container_rgt form img {width: 2vw;}
    
    .flex_container > .lk_container{flex: 0 0 calc(33% - 1rem)}
    .lk_container {padding: 2.5em 2em 2em}
    .footer_row{line-height: 2.5em;}
    #navi{left: 33vw}
    #header_inner{height: 6vw;}
}

@media only screen and (max-width: 1200px) {
     h1 {font-size:3.5vw;}
    h2 {font-size:2.5vw;}
    h3 {font-size:2.25vw;}
    h4 {font-size:2.25vw;}
    p, a, button, input, label, textarea, #content ul li, #content li, .sdja_text_container ul li{font-size: 2vw;}
    .lk_location, .lk_container p{font-size:1.75vw;} 
    #navi_inner a{font-size: 2vw;} 
}

@media only screen and (max-width: 900px) {
    #content{width: 90vw;}
    #header_btn_container_rgt form img {width: 3vw;}
    h1 {font-size:4.5vw;}
    h2 {font-size:3.5vw;}
    h3, h4 {font-size:3.25vw;}
    p, a, button, input, label, textarea, #content ul li, #content li, .sdja_text_container ul li{font-size: 3vw;}
    .lk_location, .lk_container p{font-size:2.75vw;}
    .flex_container > .lk_container{flex: 0 0 calc(50% - 1rem)}
    .lk_container {padding: 3.5em 3em 3em}
    .footer_row{line-height: 3.5em;}
    #header_inner{height: 8vw;}
    #navi_inner{display:none;}
    #mobile_wrapper{display: block;}
    #navi{left:10vw;}
    #mobile_wrapper{width: 7vw;}
    #header_logo{width: 50%;}
      
}

@media only screen and (max-width: 600px) {
    #content{width: 90vw;}
    .ro_wrapper_small{width: 100%;}
    .ro_wrapper_small h2{width: 100%;}
    .ro_image_container{display:none;}
    .ro_container_date{position: relative; top: auto; right: auto;}
    h1 {font-size:6vw;}
    h2 {font-size:5vw;}
    h3, h4 {font-size:4.75vw;}
    p, a, button, input, label, textarea, #content ul li, #content li, .sdja_text_container ul li{font-size: 4.5vw;}
    .lk_location, .lk_container p{font-size:4.25vw;}
    .flex_container > .lk_container{flex: 0 0 calc(100% - 1rem)}
    .lk_container {padding: 4.5em 4em 4em}
    .footer_row{line-height: 6em;}
    #header_inner{height: 15vw;}
    #mobile_wrapper{width: 10vw;}
    #header_logo{width: 75%;}
    #mobile_navi_inner{top:10vw;}   
}
