/* Allgemeine CSS */
.myImg {
  border-radius: 		5px;
  cursor: 					pointer;
  margin-top:				5px;
  transition: 			0.3s; }
.myImg:hover {
  opacity: 					0.7;
  z-index:          2;  }
.modal {
  background-color: rgb(0,0,0); 
  background-color: rgba(0,0,0,0.9); 
  display: 					none; 
  height: 					100%; 
  left: 						0;
  overflow: 				auto; 
  padding-top: 			100px; 
  position: 				fixed; 
  top: 							0;
  width: 						100%; 
  z-index: 					2; }
.modal-content {
  display: 					block;
  margin: 					auto;
  max-width: 				1000px;
  width: 						80%; }
#zoomerCaption {
  color: 						#ccc;
  display: 					block;
  height: 					150px;
  margin: 					auto;
  max-width: 				700px;
  padding: 					var(--padding) 0;
  text-align: 			center;
  width: 						80%; }
.modal-content, #zoomerCaption {
  animation-name: 						zoom;
  animation-duration: 				0.6s;
  -webkit-animation-duration: 0.6s;
  -webkit-animation-name: 		zoom; }
@-webkit-keyframes zoom {
  from {-webkit-transform:    scale(0)}
  to {-webkit-transform:			scale(1)} }
@keyframes zoom {
  from {transform:            scale(0)}
  to {transform:							scale(1)} }
.close {
  color: 					            #f1f1f1;
  font-size: 			            40px;
  font-weight: 		            bold;
  position: 			            absolute;
  right: 					            35px;
  top: 						            15px;
  transition: 		            0.3s; }
.close:hover,
.close:focus {
  color: 						#bbb;
  cursor: 					pointer;
  text-decoration:  none; }
/* Arrows used for .index_v3{} */
.arrow_001{
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid rgba(0, 0, 0, 1);
  animation: arrow_001_Fade 1s infinite; }
@keyframes arrow_001_Fade {
  0% { opacity: 1; transform: translateY(0); }
  50% { opacity: 0; transform: translateY(10px); }
  100% { opacity: 1; transform: translateY(0); } }
/* Print stuff */
@media print{
  .print_off{display:none;}
  .print_on{ visibility: visible !important; }
  @page { size: auto; margin-top: 0mm; }
}
/* Index CSS */
.index_v2{
  /* SLIDER */
  .slides_animate {
    position:       relative;
    animation:      slides_animate_left 10s }
  @keyframes slides_animate_left { 
    0% { 
      opacity:      0.1; 
      transition:   0.5s;        
    }
    33% { 
      opacity:      0.45; 
      transition:   0.5s;
    }
    100% { 
      opacity:      1; 
      transition:   8s;
    }
    33% { 
      opacity:      0.45; 
      transition:   8.5s;
    }
    0% { 
      opacity:      0.1; 
      transition:   8.5s;
    } }    
  /* BUTTONS */
  .btns_div{
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;}
  .btns_standard{
    width: var(--btn-size-w);
    height: var(--btn-size-h);
    font-size: var(--txt-size); 
    border: none; }
  .btn-9{
    position: relative;
    color: #2196f3;
    border:2px solid #2196f3;
    /*
    color: #42fbf2;
    border:2px solid #42fbf2;
    */
    background: white;
    text-transform: uppercase;
    overflow: hidden;
    transition: 0.2s;
    border-top: -2px; }
  .btn-9 span {
    position: absolute;
    display: block; }
  .btn-9 span:nth-child(1){
    top:0;
    left: -100%;
    width: 100%;
    height: 20px;
    background: linear-gradient(90deg, transparent, #31daf8); }
  .btn-9:hover{
    border:2px solid #42fbf2;
    font-weight: bold;
    z-index:1;
    color: #2196f3;
    /*
    color: #42fbf2;
    background: #7abcf2;
    border: 2px solid #2196f3;
    color: black;
    */
    cursor: pointer; }
  .btn-9:hover span:nth-child(1){
    left:100%;
    transition: 1s; }
  /* ANIMATIONS */    
  .oc {
    animation:  oc 3s 1 alternate }
  @keyframes oc {
    from  { opacity:  0; }
    to    { opacity:  1; } }
  /*** Inputs ***/ 
  .container_1{
    display: inline-block;
    /*
    display: flex;
    flex-direction: column;
    */
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;}
  .form_1{
    position: relative;
    width: 100%;
    height: var(--btn-size-h);
    display: inline-block; }
  .form_input_1{
    position: absolute;
    top:0;
    left:0;
    width: 50%;
    height: calc(var(--btn-size-h) - 6px);
    border: 2px solid white;
    font-family: inherit;
    font-size: inherit;
    color:white;
    outline:none;
    padding:1px;
    background:none;
    cursor: pointer; }
  .form_input_1:hover{
    border-color: lightblue; }
  .form_input_1:focus{
    border-color: red; }
  .form_label_1{
    position: absolute;
    left:1rem;
    top:calc(var(--btn-size-h) / 3);
    padding:0 1rem;
    color:white;
    cursor: text;
    transition:top 200ms ease-in; }
    /* Sagt aus: wenn placeholder nicht gezeigt und focus nicht verändert wurde, dann bleib oben wenn text geschrieben wurde ^_^ */
  .form_input_1:focus ~ .form_label_1,
  .form_input_1:not(:placeholder-shown).form_input_1:not(:focus) ~ .form_label_1{
    background: black;
    border-radius: 10px;
    top: -0.8rem;  }
  /*** Loadings ***/ 
  .loadings-2-container{
    margin-top: -16px;
    margin-left: 98px;
    width: 80px;
    height:40px;
    transform-origin: center;
    animation:loadings-2-rotate 2s ease forwards infinite; }
  .loadings-2-div{
    color:black;
    text-align: center;
    display: inline-block; }
  .loadings-2-circle{
    width: 40px;
    height:40px;
    border-radius:50%;
    position:relative;
    animation:loadings-2-roll 4.5s infinite; }
  .loadings-2-circle:nth-child(1){
    left: -100px;
    animation: loadings-2-slideleft 2s ease forwards infinite; }
  .loadings-2-ballroll{
    width: 40px;
    height: 40px;
    animation:loadings-2-ballroll 2s infinite; }
  @keyframes loadings-2-slideleft{
    0%{
      right:0px; 
      transform: translatex(0px);
    }
    50%{
      right:100px; 
      transform: translatex(100px);
    }
    100%{
      right:0px;
      transform: translatex(0px);
    } }
  @keyframes loadings-2-ballroll{
    0%{
      transform: rotate(0deg);
      height: 100%;
    }
    50%{
      transform: rotate(360deg);
      height: 20%;
    }
    100%{
      transform: rotate(0deg);
      height: 100%;
    } }

  @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;400;700&display=swap');
  :root{
    /* CSSSamples.css relevante Variablen! */
    --padding:          10px;
    --btn-size-w:       100%;
    --btn-size-h:       60px;
    --txt-size:         14px;
    /* Nur in dieser Page relevante Variablen */
    --hover:            lime;
    --logout:           black;
    --logout_:          white;
    --txt-font:         'Montserrat',sans-serif;
    --box-shadow:       1px 1px 10px 1px grey;
    --slide-h_min_w:    292px;
    --profilbild-h:     163px;
    --profilbild-w:     187px;
    --max-w-inpFields:  99%;
    --max-h-inpFields:  400px;  
    /* Mein Körper */
    --var-css_000_div_all_in_1: 97.0vw;
    --var-css_000_div_h_container: 90vh;  
    --var-css_000_div_h_container_2: 99vh;
    --var-css_000_div_w_container_a_1: 125px;  
    
    /* MÜLL
    --text-size:        16px;
    --text-font:        Arial, sans-serif;
    --btn_color:        AliceBlue;
    --btn-color_:       black;
    --inp_color:        Beige;
    --btn-size-w:       200px;
    --inp_color:        Beige;
    --txt-size:         1em;
    --menu-btns:        AliceBlue;
    --menu-btns_:       black;
    --chat-ich:         Aquamarine;
    --chat-ich_:        black;
    --chat-andere:      BlanchedAlmond;
    --chat-andere_:     black;
    --chat-seeMore:     CadetBlue;
    --chat-seeMore_:    white;
    --tbl-color-sp_1:   CadetBlue;
    --tbl-color-sp_2:   AliceBlue;
    --tbl-color-sp_3:   white;  
    */
  }
  *{
    margin-left: 0;
    /* Zu entfernen!
    background: black;
    color: white;
    margin-right: 1vw;
    */
  }
  /**************
  ** MAIN PAGE **
  ***************/
  .main_tbl_infos{
    text-align: justify; }
  .main_agb_addons{
    font-weight: bold;
    background: lightgrey;
    padding: var(--padding); }
  .printMe{
    padding: var(--padding);
    background: lavenderblush;
    width: 10%;
    cursor: pointer; }
  .printMe:hover{
    background: lightgreen; }
  .main_img_footer{
    height: 50px; }  
  .main_hr_line {
    display: block;
    text-align: center;
    overflow: hidden;
    white-space: nowrap; }
  .main_hr_line > span {
    position: relative;
    display: inline-block;
    padding: 10px; }
  .main_hr_line > span:before,
  .main_hr_line > span:after {
    content: "";
    position: absolute;
    top: 50%;
    width: 9999px;
    height: 1px;
    background: #2196f3; }
  .main_hr_line > span:before {
    right: 100%;
    margin-right: 15px; }
  .main_hr_line > span:after {
    left: 100%;
    margin-left: 15px; }    
  .main_msg_err{
    width: 100%;
    top: -200px;
    align-content: center;
    text-align: center;
    max-width: 718px; }
  .main_err_box{
    max-width:  700px;
    text-align: center; }  
  .main_login{
    position: relative;
    color:red;
    z-index: 3;
    /*
    top: calc( var(--slide-h_min_w) - 1.90*var(--slide-h_min_w) );
    */
    top: 80px; }      
  .main_btn_Clicked, .main_btn_Clicked:hover {
    color: lime;
    font-weight: bold; }
  .main_btn_Disabled, .main_btn_Disabled:hover {
    color: red;
    font-weight: bold; }
  .main_pin_info{
    background: rgb(216, 215, 215);
    border-radius: 10px;
    color: red; }
  .main_login_tbl_corr_2{
    width: 102%;
    margin-left: -2px; }
  .main_info{
    position: relative;
    font-size: 30px;
    left:0;
    color:black;
    z-index: 2;
    top: 40px;
    /*
    top: calc( var(--slide-h_min_w) - 1.90*var(--slide-h_min_w) );
    */
    margin-top: -40px; }      
  .main_none{
    display:none; }
  .main_fadeIn {
    z-index:2;
    -webkit-animation-name: main_fadeIn;
    -webkit-animation-duration: 2s;animation-duration: 2s;
    animation-name: main_fadeIn; }   
  @-webkit-keyframes main_fadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;} }
  @keyframes main_fadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;} }
  .main_login_tbl{
    margin-bottom: -130px;
    margin-top: 0px; }  
  .btns_standard_corr{
    margin-bottom: -4px; }
  .main_login_tbl_td{
    width: 250px; }  
  .main_reg_tbl_2{
    width: 100%;
    border-collapse: collapse; }
  .main_reg_tbl_2 td{
    border: 0px solid black; }
  .cv_main_profilbild{
    height: var(--profilbild-h);
    width: var(--profilbild-w);
    align-self: center;
  }
  .cv_main_tbl_arbeit_schulung_css{
    width: 100%;
    border-collapse: collapse;
  }
  .cv_main_tbl_arbeit_schulung_css td{
    border: 1px solid red;
  }
  .cv_main_tbl_arbeit_schulung_css_td{
    border: 0px solid black;
    padding: 10px;
  }
  .cv_main_tbl_arbeit_schulung_css_td_addon{
    width:100%;
  }
  /* Projekt 001 - Alles was mit CV zu tun hat */
  .pj_001_tbl_arbeit_schulung{
    width: 100%;
    text-align: center;
  }
  .pj_001_tbl_arbeit_schulung_corr_1{
    text-align: left !important;
  }
  .pj_001_tbl_arbeit_schulung_imgages{
    align-items: center;
  }
  /* CSSSamples.css Ergänzungen */
  .btn-9_corr{
    padding-left: 10px;
    padding-right: 10px; }
  .form_input_1{
    border: 2px solid #2196f3;
    background: gray;
    width: 100%; }
  .form_input_1:hover{
    border-color: lightblue; }
  .form_input_1:focus{
    border-color: lightblue; }
  .form_label_1{
    color:white; }
  .cv_main_inp_corr_X_2{
      max-width: calc( var(--max-w-inpFields) - 60px );
      margin-right: -30px; }
  .cv_main_inp_corr_X_3{
    width: calc( var(--max-w-inpFields) + 4px + 1% );
    border-collapse:collapse;
    margin-left: 2px; }
  .cv_main_inp_corr_X_5{
    margin-left: -6px;
    top: 1px;  }
  .cv_main_inp_corr_X_10{
    width: 60px;
    float: left;  }
  .cv_main_inp_corr_X_12{
    display: block;
    margin-bottom: -6px;  }
  .cv_main_inp_corr_X_11{
    width: calc( var(--max-w-inpFields) - 8px - 60px + 1% );
    left: -2px;
    float: left;  }
  .cv_main_profilbild_div_X_2{
    padding-left: 20px; }  
  .cv_main_profilbild_div_X_2a{
    display:flex;
  }
  .dasIstDerTest{
    width:100%;
  }
  .btns_container_correct{
    margin-top: -2px;
  }
  /* DELETE BUTTON ANIMATION */
  .css_main_delete_btn_delete_crossing_corr {
    width: 50px; }
  .css_main_delete_btn_delete_crossing {
    height: 50px;
    width: 50px;
    border-radius: 20px;
    position: relative;
    -webkit-animation:spin 4s linear infinite;
    -moz-animation:spin 4s linear infinite;
    animation:css_main_delete_btn_spin 4s linear infinite; }
  .css_main_delete_btn_delete_crossing:after {
    width: 50px;
    color: red;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    content: "\274c";
    font-size: 30px; 
    color: #FFF;
    line-height: 50px;
    text-align: center; }
  @-moz-keyframes css_main_delete_btn_spin { 
    100% { -moz-transform: rotateY(360deg); } }
  @-webkit-keyframes css_main_delete_btn_spin { 
    100% { -webkit-transform: rotateY(360deg); } }
  @keyframes css_main_delete_btn_spin { 
    100% { 
      -webkit-transform: rotateY(360deg); 
      transform:rotateY(360deg); 
    } }
  /********/
  /*** Allgemeine Einstellungen für Desktop- und Mobile-Version ***/
  @media (max-width: 730px){
    .btns_div {
      margin-top: -2px; }
    .main_tbl{
      border:0px solid black;
      width: 100%; }
    .main_login{
      height: 0px;
      z-index: 3;
      margin-bottom: 0px;
      position: relative;
      right: 0%; }   
    .main_slides {
      display:        none;
      width:          100%;
      height:         var(--slide-h_min_w); }
    .main_img_firmlogo{
      height: var(--btn-size-h);
      margin-bottom: 4px;
      margin-left: 5%;
      display: block; }
    .btns_reg_corr_2{
      margin-bottom: -6px; }  
    .btn-9_corr_2{
      margin-right: 0px;
      width: calc(100% + 6px); }
    .cv_1stReg_tbl_corr{
      max-width:100%; }
    .cv_1stReg_inp_corr{
      margin-bottom: -6px;
      width: calc( 99.4% - 8px ); }
    .cv_1stReg_btn_corr{
      width: 99%;
      margin-bottom: -6px; }
    .cv_info{
      max-width:100%;
      text-align: justify; }
    .cv_main_inp_corr{
      max-width: 100%;
      margin-bottom: -6px; }
    .cv_main_div_corr{
      display: inline-block;
      margin-left: -2px;
      margin-top: -2px;
      width: calc(100% - 2px);
      /*
      width: 100%;
      */
    }
    .cv_main_div_2_corr{
      width: 100%;
      /*
      align-content: center;
      align-self: center;
      margin: 1px;
      */
    }
    .cv_main_profilbild{
      margin-left: calc(50% - var(--profilbild-w)/2);  
    }
    .cv_main_btn_upload_corr{
      margin-left: -2px;
      width: calc(100% + 6px);
      margin-bottom: -2px;  
      /*
      width: calc(100% + 4px);    
      margin-top: -2px;
      */
    }
    .cv_main_div_3_corr{
      margin-left: -2px;
      width: calc(100% + 0px);    
    }
    .cv_main_div_4_corr{
      margin-left: -2px;
      width: calc(100% + 12px);
    }
    .cv_main_inp_corr_X_1, .cv_main_inp_corr_X_1a, 
    .cv_main_inp_corr_X_1b{
      max-width: calc( var(--max-w-inpFields) + 6px );
      margin-bottom: -6px; }
    .cv_main_profilbild_div_X_1{
      width: calc( (var(--max-w-inpFields) + 0% + 4px) );
      height: calc( var(--max-h-inpFields) / 3 );
      margin-bottom:4px;
      margin-left: -4px; }
    .cv_main_btn_upload_corr_X_1{
      margin-left: -10px;
    }  
    .cv_main_inp_corr_X_4{
      width: 60px;
      left:-6px;
      margin-top: 20px; }
    .cv_main_btn_corr_X_2{
      top: -2px;
      left: 0px;
      width: calc( var(--max-w-inpFields) + 2px );   }
    .cv_main_inp_corr_A_1{
      margin-bottom: -6px;
    }
    .cv_main_profilbild_div_A_1{
      height: var(--profilbild-h);
      width: var(--profilbild-w);
    }
    .cv_main_btn_upload_corr_A_1{
      margin-top: -4px;
      margin-bottom: -2px;
    }
    .cv_main_inp_corr_A_2{
      width: calc( var(--max-w-inpFields) );
      margin-left: -6px;
      margin-bottom: -6px;
    }
    .cv_main_profilbild_div_X_1_addmon{
      height: 35px; }
  }
  @media (min-width: 730px){ /* über 800px */
    /* Damit nach 730px ein margin aller sections entsteht */
    .btns_div {
      max-width:100%;
      display: inline-block;
      padding: 0px; }
    .main_login{
      height: 0px;
      z-index: 3;
      margin-bottom: 0px;
      position: relative;
      right: 0%; } 
    .main_slides {
      display:        none;
      width:          720px;
      height:         var(--slide-h_min_w); }   
    .main_img_firmlogo{
      height: var(--btn-size-h);
      margin-bottom: -22px;
      display: inline-block; } 
    .btns_reg_corr_2{
      display: inline-block !important;
      width: 49.5%;
      margin-bottom: -6px; }
    .btn-9_corr_2{
      margin-right: 0px;
      width: calc(100% + 2px); }
    .cv_1stReg_tbl_corr{
      max-width:70%; }
    .cv_1stReg_inp_corr{
      margin-bottom: -6px;
      width: calc( 100% - 6px );
      /*
      margin-left: -6px;
      */
      margin-right: -6px; }
    .cv_1stReg_btn_corr{
      margin-bottom: -6px; }
    .cv_info{
      max-width:70%;
      text-align: justify; }
    .cv_main_inp_corr{
      /*
      */
      max-width: 49.5%;
      margin-bottom: -6px; }
    .cv_main_div_corr{
      float:left;
      width: calc(100% - var(--profilbild-w)); 
      /*
      margin-bottom: 8px;
      margin-left: -2px;
      margin-top: -2px;
      */
    }
    .cv_main_div_2_corr{
      float:left;
      margin-bottom: -8px;
    }
    .cv_main_div_3_corr{
      width: calc(49.5% + 49.5% + 1% + 4px);
    }
    .cv_main_div_4_corr{
      width: calc(49.5% + 49.5% + 1% + 6px);
    }
    .cv_main_btn_upload_corr{
      margin-top: 2px;
      width: calc(100% + 1%);
      /*
      width: 100%;
      margin-left: 0px;
      width: var(--profilbild-w);
      */
    }
    .cv_main_BW_div_1{
      margin-left: calc( 50% - 103px );
    }
    .cv_main_inp_corr_X_1{
      max-width: calc( var(--max-w-inpFields)*0.8 + 0px );
      margin-bottom: -6px; }
    .cv_main_inp_corr_X_1a{
      max-width: calc( var(--max-w-inpFields)*0.2 - 0px );
    margin-bottom: -6px; }   
    .cv_main_inp_corr_X_1b{
      max-width: calc( var(--max-w-inpFields) + 1% + 4px );
      margin-bottom: -6px; }     
    .cv_main_inp_corr_X_1_1{
      max-width: calc( var(--max-w-inpFields) + 4px );
      left:-6px;
      margin-bottom: -6px; }        
    .cv_main_profilbild_div_X_1{
      width: calc( (var(--max-w-inpFields) + 1%) - 8px );
      margin-bottom:5px;
      height: calc( var(--max-h-inpFields) / 3 );
      /*
      */
      margin-right: -20px; }
    .cv_main_profilbild_div_X_1a{
      width: calc( (var(--max-w-inpFields) + 1%) - 8px );
      height: calc( var(--max-h-inpFields) / 1 ); }
    .cv_main_profilbild_div_X_1_addmon{
      height: 35px; }
    .cv_main_profilbild_div{
      width: calc( (var(--max-w-inpFields) - 10px) / 3 );
      float: left; }
    .cv_main_profilbild_div_schulung{
      width: calc( (var(--max-w-inpFields) - 10px) / 5 );
      float: left; }
    .cv_main_btn_upload_corr_X_1{
      width: calc( (var(--max-w-inpFields) - 10px) ); }
    .cv_main_inp_corr_X_2{
      max-width: calc( var(--max-w-inpFields) - 60px );
      margin-right: -20px; }
    .cv_main_inp_corr_X_3_1{
      width: calc( var(--max-w-inpFields) + 4px + 1% );
      border-collapse:collapse;
      margin-left: 0px; }
    .cv_main_inp_corr_X_4{
      width: 60px; }
    .cv_main_inp_corr_X_6{
      margin-left: 0px;
      margin-right: -16px;
      top: 1px; }
    .cv_main_btn_corr_X_2{
      top: -2px;
      left: 0px;
      width: calc( var(--max-w-inpFields) + 10px ); }
    .cv_main_inp_corr_A_3{
      margin-left: -8px;
      width: calc( (var(--max-w-inpFields)  ) + var(--profilbild-w)*0.02 - 1px );
      margin-top: -2px; }
    .cv_main_inp_corr_A_2{
      width: calc( (var(--max-w-inpFields) / 2 ) + var(--profilbild-w)*0.0001 - 1px );
      margin-top: -6px;
      float:left; }
    .cv_main_btn_upload_corr_A_1{
      top: -4px; }
    .cv_main_inp_corr_A_1{
      width: calc( ((var(--max-w-inpFields) + var(--profilbild-w)) / 2 ) - var(--profilbild-w) );
      float:left;
      margin-bottom: -2px; } 
    .cv_main_profilbild_div_A_1{
      height: calc( var(--profilbild-h) + 11px);
      width: var(--profilbild-w); }
    .cv_main_btn_upload_corr_A_2{
      width: var(--profilbild-w);
      margin-top: -178px;
      margin-left: 4px;
      float:left; }  
    .cv_main_btn_upload_corr_A_2a{
      width: var(--profilbild-w);
      margin-left: 4px;
      float:left; }  
  }
  @media (min-width: 990px){ /* über 1000px */ 

  }
  @media only screen and (max-width: 730px) {
    body {
      width: 100%;
      font-size: 10px;
    }
  }
  /* Noch Müll */
  .main_fadeOut {
    z-index:-2;
    -webkit-animation-name: main_fadeOut;
    -webkit-animation-duration: 2s;animation-duration: 2s;
    animation-name: main_fadeOut; }   
  @-webkit-keyframes main_fadeOut {
    0% {opacity: 1;}
    100% {opacity: 0;} }
  @keyframes main_fadeOut {
    0% {opacity: 1;}
    100% {opacity: 0;} }
    
  /******************
  ** LOGIN PAGE CV **
  *******************/  
  .cv_main_tbl{
    width:100%;
  }

  /***************/
  /* Mein Körper */
  /***************/
  .cv_main_div_top_mid_footer{
    width: var(--var-css_000_div_all_in_1);
    display: block; }
  .cv_main_diagramm{
    height:200px !important;
    width:calc(var(--var-css_000_div_all_in_1));
    border: 1px solid black; }
  .cv_main_diagramm{
    height:200px !important;
    width:calc(var(--var-css_000_div_all_in_1));
    border: 1px solid black; }   
  .css_000_div_x_in_1{
    float: left;
    display: block;
    width: 120px; }
  .css_000_container_a_1{
    height: calc(var(--var-css_000_div_h_container) - 202px);
    width: var(--var-css_000_div_w_container_a_1);
    overflow-x: hidden;
    overflow-y: scroll; }
  .css_000_container_a_2{
    height: calc(var(--var-css_000_div_h_container) - 202px);
    width: calc(var(--var-css_000_div_all_in_1) - var(--var-css_000_div_w_container_a_1));
    overflow-x: scroll;
    overflow-y: scroll; }  
  .css_000_fix_top {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 2; }
  .css_000_fix_top[scope=row] {
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    z-index: 1; }
  .css_000_fix_top:not([scope=row]) {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 2; }
  .css_000_button_1{
    background: rgb(152, 200, 245);
    cursor: pointer;
    text-align: center;
    border: 1px solid black;
    border-radius: 6px;
    padding: 10px; }
  .css_000_button_2{
    background: rgb(215, 218, 211);
    cursor: pointer;
    text-align: center;
    border: 1px solid black;
    border-radius: 6px;
    padding: 10px; }
  .css_000_checkbox:hover{
    background: greenyellow;
    cursor: pointer; } 
  .css_000_div_x_in_2{
    display: block;      
    width: calc(var(--var-css_000_div_all_in_1)); }  
  .css_000_tbl_werte{
    width: 100%;
    border-collapse: collapse; }
  .css_000_tbl_werte tr:nth-child(2n+1){
    background: rgb(199, 207, 245); }  
  .css_000_tbl_werte_tr_1{
    background: rgb(199, 207, 245); }  
  .css_000_tbl_werte_badNews{
    color: red;
    font-weight: bold; }  
  .css_000_div_txt_1{
    padding-top: 10vh;
    text-align: center;}  
  .css_000_button_blutwerte:hover{
    cursor: pointer; }  
  .css_000_button_1:hover, .css_000_button_2:hover, .css_000_protokoll_tr:hover, .css_000_button_blutwerte:hover{
    background: greenyellow; }    
  .css_000_tbl_info{
    width: 100%;
    border-collapse: collapse; }
  .css_000_tbl_werte_tr_0{
    background: rgb(158, 144, 240) !important; }
  .tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black; }
  .tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;  
    /* Position the tooltip text - see examples below! */
    position: absolute;
    top: 20px;
    left: -100px;
    z-index: 1; }
  .tooltip:hover .tooltiptext {
    visibility: visible; }
  .css_000_urlNotBlue{
    color: red !important; }
  .css_000_tbl_werte_td{
    text-align: center; }
  .css_000_tbl_werte_tr_2{
    background: white !important;}
  /* BEREICH - BLUTWERTE - SUCHFUNKTION / DIAGNOSTIKHELFER  */  
  .css_000_images_info{
    /* 400 zu 240 */
    width: 133px;
    height: 80px; }
  .cv_main_blutwerte_settingsSearchInput{
    position: relative;
    display: inline-block;
    width: calc( var(--var-css_000_div_all_in_1) - 2vw);
    background-color: #f1f1f1;
    border: 1px solid black;
    /*
    margin-top: -1px;
    margin-left: -2px;
    margin-right: -2px;
    height: var(--btn-size-h);
    */
    padding: 20px;
    font-size: 16px;
    text-align:	center; }
  .cv_main_blutwerte_that1_x {
    padding:10px;
    width: calc( var(--var-css_000_div_all_in_1) - 50px); }
  .cv_main_blutwerte_that1 {
    display: none; }
  .cv_main_blutwerte_SetDivsODD {
    background-color:#a3d3ff;
    cursor: pointer; }
  .cv_main_blutwerte_SetDivsEVEN {
    background-color:#e4e4e4;
    cursor: pointer; }
  .cv_main_blutwerte_SetDivsODD:hover,
  .cv_main_blutwerte_SetDivsEVEN:hover {
    background-color:#7FFF00;
    cursor: pointer; }
  .cv_main_blutwerte_suchfunktion_btns{
    width: calc( var(--var-css_000_div_all_in_1) + 1vw);
    margin-top: -2px; }
  .cv_main_blutwerte_suchfunktion_korrektur{
    width: calc( var(--var-css_000_div_all_in_1) - 50px + 1vw);
    float:left; }
  .cv_main_blutwerte_suchfunktion_X{
    margin-left: -4px;
    width: 50px; }
  .cv_main_blutwerte_search_selected{
    margin-top: -1px;
    border-collapse: collapse; }
  .css_main_tbl_td_correct{
    text-align: center; }
  .css_main_medizin_tbl_blutwerte{
    width: 99vw;
    border-collapse: separate; 
    border-spacing: 0 10px;  }
  .css_main_medizin_tbl_blutwerte td{
    border: 1px solid black;
    text-align: center;
    border-style: solid none;
    border-radius: 10px;
    font-weight: bold; }
  .css_main_medizin_tbl_blutwerte_bad{
    background: rgb(255, 63, 63); }  
  .css_main_medizin_tbl_blutwerte_corr{
    margin-top: -21px; }
  .css_main_medizin_tbl_uberschussMangel{
    width: 99vw;
    border: 1px dotted black;
    border-collapse: collapse; }
  .css_main_medizin_tbl_uberschussMangel td{
    border: 1px dotted black; }
  .css_000_info_JN{
    background: greenyellow; }
}
.index_v3{
  /* allgemeines */
  background: white;
  margin: 0;
  #loading {
    display: none;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    color: white;
    font-size: 2em;
    text-align: center;
    padding-top: 20%; }
  .red, .div_007{ color:red; }
  .green{ color:green; }
  .display_none{ display:none; }
  .strich{ position: relative; display: inline-block; }
  .strich::after {
    content: "";
    position: absolute;
    bottom: -12px;
    left: 6px;
    width: 100%;
    height: 100%;
    border-top: 2px solid red; /* Rote Linie von links unten nach rechts oben */
    transform: rotate(-15deg); /* Drehung um 45 Grad gegen den Uhrzeigersinn */
    transform-origin: left bottom; /* Ursprung der Rotation */ }
  /* Hr linie */
  .main_hr_line {
    display: block;
    text-align: center;
    overflow: hidden;
    white-space: nowrap; }
  .main_hr_line > span {
      position: relative;
      display: inline-block;
      padding: 10px; }
  .main_hr_line > span:before,
  .main_hr_line > span:after {
    content: "";
    position: absolute;
    top: 50%;
    width: 9999px;
    height: 1px;
    border-top: 1px dashed #2196f3; /* Geändertes Styling */
    transform: translateY(-50%); }
  .main_hr_line > span:before {
    right: 100%;
    margin-right: 15px; }
  .main_hr_line > span:after {
    left: 100%;
    margin-left: 15px;}
  /* Buttons */
  .btns_007, .btns_007.inactive{
    position: relative;
    text-align: center;
    padding: 10px;
    color: white;
    background: #2196f3;
    border:2px solid #2196f3;
    text-transform: uppercase;
    overflow: hidden;
    transition: 0.2s;
    border-top: -2px; }
  .btns_007_logout, .btns_007_logout.inactive{
    position: relative;
    text-align: center;
    padding: 10px;
    color: white;
    background: #000000;
    border:2px solid #2196f3;
    text-transform: uppercase;
    overflow: hidden;
    transition: 0.2s;
    border-top: -2px; }
  .btns_007 span, .btns_007_logout span{
    position: absolute;
    display: block; }
  .btns_007 span:nth-child(1), .btns_007_logout span:nth-child(1){
    top:0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, #31daf8); }
  .btns_007:hover, .btns_007_logout:hover{
    border:0px solid #42fbf2;
    font-weight: bold;
    z-index:1;
    color: white;
    cursor: pointer; }
  .btns_007:hover span:nth-child(1), .btns_007_logout:hover span:nth-child(1){
    left:50%;
    transition: 1s; }
  .btns_007, .btns_007_logout{
    border:none; }
  .btns_007::before, .btns_007_logout::before{
    content: '';
    position: absolute;
    left: 0px;
    bottom:0px;
    z-index:-1;
    width: 100%;
    height:100%;
    background: transparent;
    box-shadow: inset 0px 0px 0px #6098FF;
    display: block;
    -webkit-transition: all 0.5s cubic-bezier(.5, .24, 0, 1);
    transition: all 0.5s cubic-bezier(.5, .24, 0, 1) }
  .btns_007:hover::before{
    box-shadow: inset 300px 0px 0px #6098FF; }  
  .btns_007.active,  .btns_007_logout.active{
    color: greenyellow;
    z-index:2; }
  .btns_008 {
    width: 100%;
    margin: 5px;
    text-align: center;
    border: 1px solid black;
    color: white;
    background: #2196f3;
    border:2px solid #2196f3;
    text-transform: uppercase;
    padding: 10px;
    transition: 0.2s;
    border-top: -2px; }
  .btns_008:hover {
    font-weight: bold;
    color: white;
    cursor: pointer; }
  .si-buttons-scifi__style-5__button-1 {
    /* == BUTTON SETTINGS == */
    font-family: Jura, monospace;
    font-size: 16px;
    color: white !important;
    border: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: center;
    align-self: center;
    vertical-align: middle;
    appearance: none;
    box-sizing: border-box;
    text-decoration: none;
    position: relative;
    word-spacing: 3px;
    letter-spacing: 0.4px;
    cursor: pointer;
    transition: 0.3s;
    line-height: initial;
    min-height: 30px;
    min-width: 70px;
    white-space: nowrap;
    z-index: 1;
    user-select: none;
    outline: 0;
    padding: 15px 30px;
    background-color: transparent;}
  .si-buttons-scifi__style-5__button-1:before,
  .si-buttons-scifi__style-5__button-1:after {
    content: '';
    inset: 0;
    background: #0bb3b3; /* Border color */
    position: absolute;
    z-index: -1;
    clip-path: polygon(
      0 5px, 5px 0, calc(100% - 5px) 0, 100% 5px, 
      100% calc(100% - 5px), calc(100% - 5px) 100%, 
      calc(calc(50% - 5px - 30px) + 5px + 60px + 5px) 100%, 
      calc(calc(50% - 5px - 30px) + 5px + 60px) calc(100% - 5px), 
      calc(calc(50% - 5px - 30px) + 5px) calc(100% - 5px), 
      calc(50% - 5px - 30px) 100%, 5px 100%, 0% calc(100% - 5px)
    );
    box-shadow: inset 0 0 25px -10px #0bb3b3; }
  .si-buttons-scifi__style-5__button-1:after {
    inset: 1px;
    background: #22c99d; }
  .si-buttons-scifi__style-5__button-1 .helper-1:before {
    content: '';
    position: absolute;
    height: 3px;
    width: 63px;
    background: #0bb3b3;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    clip-path: polygon(2px 0%, calc(100% - 2px) 0%, 100% 100%, 0% 100%); }
  .si-buttons-scifi__style-5__button-1 .helper-2:before,
  .si-buttons-scifi__style-5__button-1 .helper-2:after {
    content: '';
    position: absolute;
    height: 80%;
    width: 3px;
    top: 50%;
    left: 5px;
    transform: translateY(-50%);
    clip-path: polygon(0 0, 100% 3px, 100% calc(100% - 3px), 0 100%);
    background: #0bb3b3; /* Border color */
    opacity: 0.3; }
  .si-buttons-scifi__style-5__button-1:hover span {
    font-weight: bold; }
  .si-buttons-scifi__style-5__button-1 .helper-2:after {
    left: unset;
    clip-path: polygon(0 3px, 100% 0, 100% 100%, 0 calc(100% - 3px));
    right: 5px; }
  [class*='si-buttons-scifi'].disabled,
  [class*='si-buttons-scifi']:disabled {
    pointer-events: none;
    opacity: 0.5;
    cursor: default; }
  [class*='si-buttons-scifi'] .ripple {
    inset: 0;
    position: absolute;
    overflow: hidden;
    clip-path: polygon(
      0 5px, 5px 0, calc(100% - 5px) 0, 100% 5px, 
      100% calc(100% - 5px), calc(100% - 5px) 100%, 
      calc(calc(50% - 5px - 30px) + 5px + 60px + 5px) 100%, 
      calc(calc(50% - 5px - 30px) + 5px + 60px) calc(100% - 5px), 
      calc(calc(50% - 5px - 30px) + 5px) calc(100% - 5px), 
      calc(50% - 5px - 30px) 100%, 5px 100%, 0% calc(100% - 5px)
    ); }
  [class*='si-buttons-scifi'] .ripple:after {
    content: '';
    position: absolute;
    inset: 0 auto 0 -200%;
    width: 200%;
    transform: skewX(-20deg);
    opacity: 0.5;
    background-image: linear-gradient(to right, transparent, #ffffff, transparent); }
  .helper_active{ background: #7FFF00 !important; }
  .helper_inactive{ background: red !important;}
  [class*='si-buttons-scifi']:hover .ripple:after {
    left: 200%;
    transition: 1.6s ease; }
  [class*='si-buttons-scifi'] .shine {
    position: absolute;
    inset: 0;
    overflow: hidden;
    clip-path: polygon(
      0 5px, 5px 0, calc(100% - 5px) 0, 100% 5px, 
      100% calc(100% - 5px), calc(100% - 5px) 100%, 
      calc(calc(50% - 5px - 30px) + 5px + 60px + 5px) 100%, 
      calc(calc(50% - 5px - 30px) + 5px + 60px) calc(100% - 5px), 
      calc(calc(50% - 5px - 30px) + 5px) calc(100% - 5px), 
      calc(50% - 5px - 30px) 100%, 5px 100%, 0% calc(100% - 5px)
    ); }
  [class*='si-buttons-scifi'] .shine:after {
    content: '';
    position: absolute;
    inset: 0 auto 0 -70px;
    width: 30px;
    opacity: 0.8;
    background: #ffffff;
    transition: all 0.3s linear;
    transform: skewX(-15deg) translateX(0);
    animation: shine 3.5s ease-in-out infinite; }
  [class*='si-buttons-scifi']:hover .shine:after {
    animation: unset; }
  @keyframes shine {
    70% { left: -70px; }
    100% { left: calc(100% + 70px); } }
  /* Images */
  .img_000{ height: 114px; }
  /* Tables */
  .tbl_001{ border-collapse: collapse; min-width:413px; white-space: nowrap; }
  .tbl_001 tr:nth-child(1){ background-color: black; color:white; }
  .tbl_001 td, .tbl_002 td{ text-align: center; }
  .tbl_001 tr:nth-child(even){ background-color: #2196f3; color:white; }
  .tbl_001_corr{ text-align: left !important; font-weight: bold; }
  .tbl_002{ border-collapse: collapse; min-width:413px; white-space: nowrap; }
  .tbl_002 tr:nth-child(1){ background-color: black !important; color:white !important; }
  .tbl_002 tr:nth-child(odd){ background-color: #2196f3; color:white; }
  .tbl_002 td, th{ border: 1px solid black; padding: 5px; }
  .tbl_003{ border-collapse: collapse; width:100%; white-space: nowrap; }
  .tbl_003 tr:nth-child(1){ background-color: black; color:white; }
  .tbl_003 td{ text-align: center; border: 1px solid black; padding: 5px; }
  .tbl_003 tr:nth-child(3n+2){ background-color: #2196f3; color:white; }  
  /* textarea */
    .textarea_001 {
      width: 100%;
      height: 12px;
      padding: 10px;
      border: 2px solid #00d4ff;
      border-radius: 8px;
      background: rgba(0, 0, 0, 0.8);
      color: #fff;
      font-size: 16px;
      font-family: 'Courier New', monospace;
      resize: none;
      outline: none;
      transition: all 1s ease;
      overflow: hidden; }
    .textarea_002 {
      position: relative;
      display: inline-block;
      justify-content: space-between;
      margin:15px;
      width: 300px; }
    .textarea_001:focus {
      position: relative;
      height: 200px;
      width: 500px;
      overflow-y: auto;
      z-index: 99;
      background: rgba(0, 0, 0, 0.95);
      box-shadow: 0 0 15px #00d4ff, inset 0 0 10px #00d4ff; }
        /*
    .textarea_002::before {
      content: ">>";
      position: absolute;
      cursor: pointer;
      top: 47px;
      right: 12px;
      font-size: 16px;
      color: #00d4ff;
      pointer-events: none;
      transition: transform 1s ease; }
      */
    .textarea_001:focus ~ .textarea_002::before {
      transform: rotate(90deg); }
  /* divs */
  .div_002{ display: grid; }
  .div_005.active{ display: block !important; }
  .div_005.inactive{ display:none !important; }
  .div_011{ max-width: 700px; text-align: justify; }
  .div_012{
    background-color: yellow;
    color:black;
    margin:2px;
    width:260px;
    height: 14px;
    top: 2px; }
  .div_013{
    position: absolute;
    top: 42px;
    right: -18px;
    background: #00d4ff;
    color: #000;
    border: none;
    z-index: 99;
    border-radius: 5px;
    padding: 5px 10px;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
    transition: background 0.3s ease, transform 0.2s ease; }
  .div_013:hover{
    background: #00b8e6;
    transform: scale(1.1); }
  .div_014{
    position: absolute;
    top: 200px;
    left: 20px;
    font-size: 24px;
    font-weight: bold;
    display: flex;
    white-space: nowrap; /* Verhindert Zeilenumbruch */
    overflow: hidden;
  }
  .div_14_letter{
    opacity: 0;
    transform: translateX(100%);
    animation: div_14_letter_in 5s ease forwards;
  }
  @keyframes div_14_letter_in {
    0%{ opacity: 0; transform: translateX(100%); }
    100%{ opacity: 1; transform: translateX(0); }
  }
  /* Login + Reg */
  .tbl_login_001{
    width:100%;
    padding-top: 20px;
    border-collapse: collapse;
  }
  .errMSG_corr{
    margin-bottom: 14px;
  }
  .tbl_login_003{
    min-width:300px;
  }
  .tbl_login_004{
    width:10%;
  }
  .btns_007_login_001{
    height: 122px;
    margin-top:-6px;
    width: 100%;
  }
  .btns_007_reg_001{
    height: 44px;
    margin-top: -2px;
    width: 101.5%;
  }
  .btns_007_pw_lost_001{
    position: relative;
    height: 40px;
    top:-7px;
    width: 100%;
  }
  .btns_007_pw_lost_002{
    height: 60px;
    width: 100%;
  }
  .btns_007_pin_reg_001{
    height: 60px;
    width: 40px;
    left:6px;
  }
  .tbl_pw_lost_004{
    position: relative;
    top:-8px;
  }

  .main_reg_tbl_2{
    width: 100%;
    border-collapse: collapse; }
  .main_reg_tbl_2 td{
    border: 0px solid black; }
  .form_1{
    position: relative;
    width: 100%;
    height: 60px;
    display: inline-block; }
  .btns_standard_corr{
    margin-bottom: -4px; }
  .form_input_1:hover{
    border-color: lightblue; }
  .form_input_1:focus{
    border-color: lightblue; }
  .form_input_1{
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    height: calc(60px - 6px);
    border: 2px solid white;
    font-family: inherit;
    font-size: inherit;
    color:black;
    outline:none;
    padding:1px;
    background:none;
    cursor: pointer; }
  .form_input_1:hover{
    border-color: lightblue; }
  .form_input_1:focus{
    border-color: red; }
  .form_label_1{
    position: absolute;
    left:1rem;
    top:calc(60px / 3);
    padding:0 1rem;
    color:white;
    cursor: text;
    transition:top 200ms ease-in; }
    /* Sagt aus: wenn placeholder nicht gezeigt und focus nicht verändert wurde, dann bleib oben wenn text geschrieben wurde ^_^ */
  .form_input_1:focus ~ .form_label_1,
  .form_input_1:not(:placeholder-shown).form_input_1:not(:focus) ~ .form_label_1{
    background: white;
    border-radius: 10px;
    top: -0.8rem;  }
  .form_label_1{
    color:black; }
  .form_label_PIN{
    color:red !important; }
  .form_label_PW_reset{
    top: -2px;
  }
  .form_pawword_reset {
    position: relative;
    left: 90%;
    top: 35%;
    transform: translateY(-50%);
    cursor: pointer;
  }
  @media(width > 900px){
    .tbl_001{  width: 100%; }
    .div_max{  max-width: 100%;
      /* 
      box-sizing: border-box;
      oder auto  */
      overflow-x: scroll;
      white-space: nowrap; }
    .div_000{ display: flex; height: 124px; width: 100%; }
    .div_001{
      display: flex;
      flex-wrap: wrap;
      /*
      display: flex; height: 38.67px; width: 100%; 
      */
    }
    .div_002{ flex-direction:row; }
    .div_003{ width: calc(100% - 0% - 2px); float: left; order: 1; }
    .div_004{
      height: 124px; width: calc(100% - 75% - 2px); 
      position: absolute; overflow: hidden;
      cursor: pointer; transition: height 1s; 
      top: 0; right: 0; 
      order: 2; }
    .div_004:hover { height: 410px; }
    .div_010{
      position: absolute; 
      top: 0; right: 0; 
      display: flex; justify-content: flex-end;
      /*
      overflow: hidden;
      height: 38.67px; width: calc(100% - 75% - 2px); 
      cursor: pointer; transition: height 1s; 
      order: 2; 
      */
    }
    .div_010x{
      position: absolute; 
      display: flex; justify-content: flex-end;
    }
    .div_010y{
      margin-top:38.67px;
      display: flex; 
    }
    .div_008{ min-width: 45.1%; }
    .div_009{ min-width: calc(100% - 72% - 2px); height: 130px; }
    /* Modifications because classes not working if under .index_v { ... } */
    .arrow_001{
      margin-top: 104px;
      overflow: visible;
      margin-left: calc(3% - 2px); 
      z-index: 2; }
    /* Login + Reg */

    
    


  }@media screen and (min-width: 680px) and (max-width: 900px){
    .div_000{ margin-left: calc( (100% - 643px)/2 ); }
    .div_008, .div_009{ display: inline-block; }
    .div_004, .div_007{ width: 648px; }
    /* Modifications because classes not working if under .index_v { ... } */
    .arrow_001{ display:none; }
  }@media(width <= 680px){
    .div_000, .div_009{ display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; width: 100%; }
    .div_004, .div_007{ min-width: 413px; }
    /* Modifications because classes not working if under .index_v { ... } */
    .arrow_001{ display:none; } }
    .tbl_login_001{
      max-width: 420px;
    }
}
.cv_v3{
  width: 100%;
  .beruf_ausbildung_tbl{ border-collapse:  collapse; border: 1px solid black; }
  .oc{ animation: oc 5s 1 alternate; }
  @keyframes oc {
    from { opacity: 0; }
    to { opacity: 1; } }
  .foo_out{ display:none; }
  .sortieren{ padding: 10px; background: white; border: 1px solid black; border-right: 0px solid black; }
  .btn_sortieren{ padding: 10px; cursor: pointer; background: #FAEBD7; border-top: 1px solid black; border-bottom: 1px solid black; }
  .printMe{ cursor: pointer; }
  .btn_sortieren:hover, .printMe:hover, .beruf_ausbildung_td_divs_3:hover{ background: lime; }
  .imgME{ width: 130px; }
  .beruf_ausbildung_td_divs_3_imgs{ width: 300px; }
  .btn_sortieren_right{ border-right: 1px solid black; }
  .personelle_daten_tbl_td{ padding: 5px; }
  .personelle_daten_tbl{ border-collapse: collapse; }
  .beruf_ausbildung_td{ border: 0px solid black; padding: 10px; cursor:pointer; }
  .beruf_ausbildung_td_x{ border: 0px solid black; padding: 10px;  }
  .beruf_ausbildung_tbl{ border-collapse: collapse; border: 0px solid black; }
  .beruf_ausbildung_css_berufe{ background: #F0FFFF; }
  .beruf_ausbildung_css_ausbildung{ background: #F5F5DC; }
  .beruf_ausbildung_td_divs{ vertical-align: top; padding: 10px; }
  .beruf_ausbildung_td_divs_3{ float: left; padding: 10px; background: #F5F5DC; cursor: pointer; }
}
.cv_v3_1{
  width: 100%;
  .sortieren{ padding: 10px; background: white; border: 1px solid black; border-right: 0px solid black; }
  .btn_sortieren_right{ border-right: 1px solid black; }
  .printMe{ cursor: pointer; }
  .oc{ animation: oc 5s 1 alternate; }
  @keyframes oc {
    from { opacity: 0; }
    to { opacity: 1; } }
  #loading-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    z-index: 9999;
    transition: opacity 0.5s ease-out;
    display: none;
  }

  /* Animierter Spinner */
  .spinner {
    border: 6px solid rgba(255, 255, 255, 0.2);
    border-top: 6px solid #00d4ff;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin .5s linear infinite;
    margin-left: 15px;
  }

  @keyframes spin {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(90deg); }
    50% { transform: rotate(180deg); }
    75% { transform: rotate(270deg); }
    100% { transform: rotate(360deg); }
  }
  @media print {
    .no-print {
      display: none;
    }
  }
  .div_0{
    width:669px;
  }
  .beruf_ausbildung_tr{ width: 300px; }
  .divs_2{ width: 300px; }
  .divs_3{
    border: 1px solid black;
    cursor: pointer;
    display: inline-block; 
    padding: 5px;
  }
  .divs_3:hover, .beruf_ausbildung_tr:hover{
    cursor: pointer;
    background-color: #7FFF00;
    border: 1px solid #7FFF00;
  }
  .td_0{
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 36px;
    width:669px;
    max-width: 669px;
  }
  .tbl_0 td, .tbl_1 td{
    border: 0px solid black;
    border-collapse: collapse;
  }
  .td_1{
    font-weight: bold;
    text-transform: uppercase;
    font-size: 18px;
    width:669px;
    max-width: 669px;
  }
  .tbl_1 td{ border-collapse:  collapse; border: 0px solid black;}
  .td_2{
    width:70px;
  }
  .td_3{
    vertical-align:top;
  }
  .td_4{
    width:300px;
  }
  .tr_1{
    cursor: pointer;
  }
  .imgME{
    width:140px;
  }
  /*
  .beruf_ausbildung_tbl{ border-collapse:  collapse; border: 1px solid black; }
  .foo_out{ display:none; }
  .btn_sortieren{ padding: 10px; cursor: pointer; background: #FAEBD7; border-top: 1px solid black; border-bottom: 1px solid black; }
  .btn_sortieren:hover, .printMe:hover, .beruf_ausbildung_td_divs_3:hover{ background: lime; }
  .imgME{ width: 130px; }
  .beruf_ausbildung_td_divs_3_imgs{ width: 300px; }
  .personelle_daten_tbl_td{ padding: 5px; }
  .personelle_daten_tbl{ border-collapse: collapse; }
  .beruf_ausbildung_td{ border: 0px solid black; padding: 10px; cursor:pointer; }
  .beruf_ausbildung_td_x{ border: 0px solid black; padding: 10px;  }
  .beruf_ausbildung_tbl{ border-collapse: collapse; border: 0px solid black; }
  .beruf_ausbildung_css_berufe{ background: #F0FFFF; }
  .beruf_ausbildung_css_ausbildung{ background: #F5F5DC; }
  .beruf_ausbildung_td_divs{ vertical-align: top; padding: 10px; }
  .beruf_ausbildung_td_divs_3{ float: left; padding: 10px; background: #F5F5DC; cursor: pointer; }
  */
}