/* Style the header with a grey background and some padding */
.header {
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 10;    
  /*overflow: hidden;*/  
  /*background-color: #aebaba;*/
  /*background-color: #c7c1bb;*/
  /*background-color: #AD9C93;*/
  background-color: #e9d8d0;
}

/* Style the header links */
.header-1strow {
  color: #351919;
  text-align: left;
  padding: 6px;
  font-size: 18px;
  line-height: 25px;
}

.header-1strow img {
  height: 150px;
}

.table_header_1strow {
  width: "90%";
  padding-top: 20px;
  padding-bottom: 10px;
}

/* Float the link section to the right */
.side_left {    
  position: fixed;
  width: 550px;
  height: 50px;
  left: -230px;
  top: 450px;
  z-index: 10;    
  font-size: 30px;
  /*overflow: hidden;*/  
  /*background-color: #aebaba;*/ 
  /*background-color: #c7c1bb;*/
  /*background-color: #AD9C93;*/
  background-color: #e9d8d0;
  transform: rotate(-90deg);
  transform-origin: 0%, 0%;
}

.side_left a {  
  text-align: center;
  margin-right: 10px;
  padding: 12px;
  text-decoration: none;
  font-size: 30px;
  
  line-height: 50px;
  
  /*border: 5px solid #763A44;*/
  /*color: rgb(150, 150, 150);
  background-color: #444343;
  
  088b85*/
  color: #351919;
  /*background-color: #aebaba;*/
  background-color: #e9d8d0;
}

.image_gototop {
  height: 30px;
} 

.btn_gototop a{
  /*display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 120px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */    
  text-decoration: none;
  border: 5px solid #763A44;
  outline: none; /* Remove outline */
  color: rgb(110, 110, 110);
  background-color: fff6f3;
  border-radius: 4px;
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 12px;
  font-size: 30px;
}

.btn_gototop a:hover {
  background-color:#763A44;
  color: #351919;
}

.header-infotext {
  color: rgb(61, 56, 56);
  font-size: 36px;
  font-weight: bold;
}

.content {
  margin-left: 30px;
  margin-top: 00px;
  z-index:1;
}

.TOPmarker{
  font-size: 1px;
}

/* quicksand-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/quicksand-v31-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* quicksand-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/quicksand-v31-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

h1 {
  color:#763A44;
  background-color: #e9d8d0;
  text-align: center;  
  font-weight: bold;
  font-family: 'Quicksand';
  font-size: 30px;
}

body {
  /*background-color: #aebaba;*/
  background-color: #e9d8d0;
  /*background-color: #088b85;*/
  /*background-color: #077a75;*/
  /*088b85 - petrol 1st try */
  font-family: 'Quicksand';
}

/* Style the header with a grey background and some padding */
.section_top_start {
  margin-top: 300px;
}

.section_top_start2 {
  margin-top: 250px;
}

.section_text {
  font-size: 18px;
  color: #351919;
  text-align: center;
}

.section_text_1{
  font-size: 25px;
  text-align: left;
}

.section_text_1 a{
  text-decoration: underline;
  color: #763A44;
}

.section_text_2{
  font-size: 25px;  
  font-weight: bold;
  text-align: center;
}

.section_text_3{
  font-size: 35px;
  color: #763A44;
  font-weight: bold;
  text-align: left;
}

.section_text_4{
  font-size: 25px;
  text-align: left;
  font-style: italic;
}

.section_text_5{
  font-size: 25px;
  text-align: left;
  text-decoration: underline;
}

.section_text_6{
  font-size: 18px;
  text-align: left;
}

ul {
  list-style-image:url("./pictures/kringel_25_sub.png");
  line-height: 200%;  
}

.tr_aboutme_sepp{
  height: 300px;
}

.tr_HR_before {
  height: 150px;
}
.tr_HR{
  height: 5px;
}
.tr_HR_after {
  height: 150px;
}

.td_HR_before {
  width: 65px;
}
.td_HR {
  background-color: #763A44;
}
.td_HR_after {
  width: 50px;
}

.td_first{
  width: 120px;
}

.td_third_a{
  width: 20px;
}

.td_third_b{
  width: 50px;
}

.td_fifth{
  width: 20px;
}

.td_pic_top{
  vertical-align: top;
}

.tr_VR {
  background-color: #763A44;
}

.tr_VR_space {
  width: 100px;
}

.image_aboutme {
  width: 250px;
}

.image_ausbildung {
  width: 300px;
}

.image_ws {
  width: 350px;
}

.image_info {
  width: 250px;
}

.image_at {
  width: 250px;
}


.td_pic {
  width: 350px;
}

/* Style the footer with a grey background and some padding */
.footer {  
  width: 100%;  
  overflow: hidden;
  
 /* background-color: #f1f1f1;*/
  padding: 20px 10px;
}

/* Style the footer links */
.footer a {
  float: center;
  color: black;
  text-align: center;
  padding: 12px;
  text-decoration: none;
  font-size: 18px;
  line-height: 25px;
  border-radius: 4px;
}
  
/* Style the logo link (notice that we set the same value of line-height and font-size to prevent the header to increase when the font gets bigger */
.footer a.logo {
  font-weight: bold;
}

.footer a:hover {
  background-color: #763A44;
  color: black;
}

.footer-center {
  text-align:center;
}


/* Add media queries for responsiveness - when the screen is 500px wide or less, stack the links on top of each other */
@media screen and (max-width: 1200px) { 
  .header-1strow img {
    height: 50px;
  }
  .header-1strow {
    line-height: 12px;
  }
 
  /* Float the link section to the right */
  .side_left {    
    position: fixed;
    width: 250px;
    height: 25px;
    left: -100px;
    top: 250px;
    z-index: 10;    
    font-size: 15px;
    /*overflow: hidden;*/  
    /*background-color: #aebaba;*/ 
    /*background-color: #c7c1bb;*/
    /*background-color: #AD9C93;*/
    background-color: #e9d8d0;
    transform: rotate(-90deg);
    transform-origin: 0%, 0%;
  }

  .side_left a {  
    text-align: center;
    margin-right: 10px;
    padding: 12px;
    text-decoration: none;
    font-size: 15px;
    
    line-height: 25px;
    
    /*border: 5px solid #763A44;*/
    /*color: rgb(150, 150, 150);
    background-color: #444343;
    
    088b85*/
    color: #351919;
    /*background-color: #aebaba;*/
    background-color: #e9d8d0;
  }

  .tr_aboutme_sepp{
    height: 75px;
  }

  .td_first{
    width: 50px;
  }

  .td_third_a{
    width: 5px;
  }

  .td_third_b{
    width: 20px;
  }

  .td_fifth{
    width: 1px;
  }

  .tr_VR_space {
    width: 5px;
  }

  .tr_HR_before {
    height: 75px;
  }

  .tr_HR{
    height: 2px;
  }

  .tr_HR_after {
    height: 75px;
  }

  .td_HR_before {
    width: 30px;
  }
  
  .td_HR_after {
    width: 5px;
  }

  .content {
    margin-top: 0px;
    z-index:1;
  }

  .section_text_1{
    font-size: 9px;
  }
  
  .section_text_2{
    font-size: 9px;  
  }
  
  .section_text_3{
    font-size: 12px;
  }
  
  .section_text_4{
    font-size: 9px;
  }
  
  .section_text_5{
    font-size: 9px;
  }
  
  .section_text_6{
    font-size: 7px;
  }
  
  .td_pic {
    width: 80px;
  }

  .image_aboutme {
    width: 75px;
  }

  .image_ausbildung {
    width: 75px;
  }

  .image_ws {
    width: 75px;
  }

  .image_info {
    width: 75px;
  }

  .image_at {
    width: 75px;
  }

  .section_top_start {
    margin-top: 100px;
  }

  .section_top_start2 {
    margin-top: 150px;
  }

  /*.btn_gototop a{
    display: none;
  }*/

  .image_gototop {
    height: 10px;
  } 

  .btn_gototop a{
    right: 10%; /* Place the button 30px from the right */   
    border: 2px solid #763A44;   
    border-radius: 2px;   
    padding: 10px;
    font-size: 10px;
  }
  
  .btn_gototop a:hover {
    background-color: #e9d8d0;
  }

  ul {
    list-style-image:url("./pictures/kringel_9_sub.png");
    line-height: 100%; 
    padding: 20px; 
  }

  .footer a.logo {
    font-weight: none;
  }
  .footer a {
    font-size: 9px;
  }
  .footer a:hover {
    background-color: #e9d8d0;
  }
}