/* Allgemein */

*, *:before, *:after {
  box-sizing : border-box;
  transition : width 0.75s ease-out;
}

.clearfix:before, .clearfix:after {
  content : " ";
  display : table;
}

.clearfix:after {
  clear : both;
}

.section {
  clear : both;
  margin : 0;
  background : transparent;
}

html, body {
  font-family : tahoma, Verdana, Segoe, "Open Sans", helvetica, arial, roboto, sans-serif;
  font-size : 62.5%;
  line-height : 1.5;
  height : 100%;
}

body {
  font-size : 1.6rem;
  font-weight : normal;
  margin : 0 auto;
  background-color : #DFDFDF;
  color : #000;
  margin : 0;
}

.container_haupt {
  margin : 0;
  width : 100%;
  height : 100%;
}

h1, h2, h3, h4, h5 {
  font-weight : normal;
}

h1 {
  font-size : 4rem;
  line-height : 4.4rem;
  margin-top : 0;
  margin-bottom : 2.5rem;
}

h2 {
  font-size : 3rem;
  line-height : 3.4rem;
  margin-top : 0;
  margin-bottom : 2rem;
}

h3 {
  font-size : 2.3rem;
  line-height : 2.6rem;
  margin-top : 1.5rem;
  margin-bottom : 1rem;
}

pre {
  margin-bottom : 2rem;
}


/* Speziell */

.hpname {
  display : block;
  font-weight : bold;
  font-size : 2.5rem;
  margin-top : 1rem;
  color : #2d2d2d;
  letter-spacing : 0.1rem;
}

.hpname span {
  margin-bottom : 0.4rem;
  display : inline-block;
  font-size : 1.5rem;
}

.rund {
  border-radius : 36rem;
}

.zelle {
  display : table-cell;
  width : 100%;
  vertical-align : top;
  border-collapse : separate;
}

.tabelle {
  display : table;
  width : 100%;
  table-layout : fixed;
  border-spacing : 0 0;
}

.links {
  table-layout : fixed;
  width : 100%;
  white-space : nowrap;
  margin-left : auto;
  margin-right : auto;
}

.links td {
  white-space : nowrap;
  overflow : hidden;
  text-overflow : ellipsis;
}

.cv {
  table-layout : fixed;
  width : 100%;
  margin-left : auto;
  margin-right : auto;
  border-spacing: 0px 25px;
}

.cv td {
  word-wrap: break-word;
  vertical-align: top;  
}

.cv tr,td {
  border-bottom: 3px solid #F5FBEF;
}


.pr {
  table-layout : fixed;
  width : 100%;
  margin-left : auto;
  margin-right : auto;
  border-spacing: 0px;
}

.pr td {
  word-wrap: break-word;
  vertical-align: top;  
}

.pr tr,td {
  border-bottom: 1px dotted #2E2E2E;
}



.zelle-logo {
  display : table-cell;
  height : 100vh;
  text-align : center;
  vertical-align : middle;
  padding-top : 1rem;
  padding-bottom : 1rem;
}

.wrapper-content {
  display : block;
  text-align : center;
  margin : 0 auto;
}

/* Startseite */

.bereich-1-start {
  color : #2d2d2d;
  background-color : #DFDFDF;
  background-attachment : fixed;
  position : fixed;
  height : 100%;
  overflow : auto;
  top : 0;
  left : 0;
  background-image : url(images/logo.jpg);
  background-repeat : no-repeat;
  background-position : 50% 50%;
}

.bereich-1-start .content {
  display : block;
  margin : 1rem auto;
  width : 90vw;
  padding : 1rem;
  background-color : rgba(255, 255, 255, 0.7);
  text-align : center;
  vertical-align : middle;
  border-radius : 2rem;
}

.bereich-1-start .fa {
  color : #2d2d2d;
  background : rgba(255, 255, 255, 0.6);
  font-size : 2.5rem;
  border-radius : 36rem;
  border : silver solid 0.1rem;
  height : 5rem;
  line-height : 5rem;
  width : 5rem;
}

.bereich-1-start .intro {
  font-size : 200%;
  text-align : center;
  font-weight : bold;
  color : white;
  padding : 1rem 1rem 1rem 1rem;
}

.bereich-1-start a:link, .bereich-1-start a:visited, .bereich-1-start a:active {
  color : #2d2d2d;
  text-decoration : underline;
  padding : 0.6rem;
}

.bereich-1-start a:hover {
  background-color : white;
  box-shadow: 2px 2px 2px #170303;
  color : #610B21;
  text-decoration : none;
}

/* Abschalter der mouse-over Effekte */

.nohover a:hover {
  background-color : transparent;
  box-shadow: none;
  text-decoration : none;
}


/* Unterseiten */

.bereich-1 {
  background-color : white;
  background-attachment : fixed;
  position : fixed;
  height : 100%;
  overflow : auto;
  top : 0;
  left : 0;
  background-image : url(images/logo.jpg);
  background-repeat : no-repeat;
  background-position : 50% 50%;
  background-size : cover;
}

.bereich-1 h1 {
  text-align : center;
  margin-bottom : 1rem;
}

.bereich-1 h2 {
  text-align : center;
}

.bereich-1 h3 {
  text-align : center;
}

.bereich-1 .content-unterseiten {
  display : block;
  margin : 1rem auto;
  width : 90vw;
  padding : 1rem;
  background-color : rgba(255, 255, 255, 0.8);
  text-align : center;
  vertical-align : middle;
  border-radius : 2rem;
}

.wrapper-img {
  text-align : center;
  display : inline-block;
  width : 100%;
}

.bereich-1 img {
  max-width : 80%;
  display : inline;
  height : auto;
  margin-left : 0.5rem;
  margin-right : 0.5rem;
  margin-bottom : 1rem;
  margin-top : 0;
  border : white solid 0.0rem;
}

.bereich-1 .fa {
  color : #2d2d2d;
  background : rgba(255, 255, 255, 0.6);
  font-size : 4.5rem;
  border-radius : 36rem;
  border : silver solid 0.1rem;
  height : 6rem;
  line-height : 6rem;
  width : 6rem;
}

.bereich-1 .text {
  text-align : center;
  padding : 1rem 1rem 5rem 1rem;
}

.bereich-1 #menu2 ul {
  margin : 0;
  padding : 0;
}

.bereich-1 #menu2 li {
  display : block;
  list-style-type : none;
  margin : 0;
  padding : 0;
 }

.bereich-1 #menu2 li a:link, .bereich-1 #menu2 li a:visited, .bereich-1 #menu2 li a:active {
  display : inline-block;
  text-align : left;
  color : #2d2d2d;
  text-decoration : underline;
  padding : 0;
  margin-bottom : 1rem;
  width : 26rem;
  border : #858585 solid 0.1rem;
  transition : all 0.5s ease-in-out;
}

.bereich-1 #menu2 li a:hover {
  color : #2d2d2d;
  text-decoration : none;
  border-radius : 0;
  background-color : rgba(255, 255, 255, 0.7);
  border-top-right-radius : 36rem;
  border-bottom-right-radius : 36rem;
}

.bereich-1 #menu2 .fa {
  color : #2d2d2d;
  text-align : center;
  background : rgba(255, 255, 255, 0.6);
  margin-top : 0.4rem;
  margin-bottom : 0.4rem;
  margin-right : 1rem;
  margin-left : 0.4rem;
  border-radius : 36rem;
  border : silver solid 0.1rem;
  font-size : 1rem;
  height : 4rem;
  line-height : 4rem;
  width : 4rem;
  transition : all 0.5s ease-in-out;
}

.bereich-1 #menu2 a:hover i {
  color : red;
  text-align : center;
  background-color : #DFDFDF;
}

.bereich-1 a:link, .bereich-1 a:visited, .bereich-1 a:active {
  color : #2d2d2d;
  text-decoration : underline;
}

.bereich-1 a:hover {
  background-color : white;
  box-shadow: 2px 2px 2px #170303;
  color : #610B21;
  text-decoration : none;
}
/* Abschalter der mouse-over Effekte */

.nohover-1 a:hover {
  background-color : transparent;
  box-shadow: none;
  text-decoration : none;
}


/* Unterseite - Fussmenue */

.bereich-1 .fussmenu {
  width : 100%;
  margin : 0;
}

.bereich-1 .fussmenu ul {
  padding : 0;
  margin : 0;
}

.bereich-1 .fussmenu li {
  display : inline;
}

.bereich-1 .fussmenu a:link, .bereich-1 .fussmenu a:visited, .bereich-1 .fussmenu a:active {
  display : inline-block;
  font-size : 1.5rem;
  background : transparent;
  color : black;
  text-shadow : 0 0 0.1rem white;
  margin : 0.5rem 0.2rem 0.5rem 0.2rem;
  text-decoration : underline;
}

.bereich-1 .fussmenu a:hover {
  background-color : white;
  box-shadow: 2px 2px 2px #170303;
  color : #610B21;
  text-decoration : none;
}

.bereich-1 .icon a:hover {
  background-color : transparent;
  box-shadow: none;
  text-decoration : none;
}


/* Media Anpassungen */

@media (min-width:600px) {
  .bereich-1-start .content {
  width : 40rem;
  padding : 1rem;
  }

  .bereich-1 .content-unterseiten {
    padding : 2rem 3rem 4rem 3rem;
  }

  .bereich-1 .text {
    text-align : justify;
  }
}

@media (min-width:680px) {
  html {
    font-size : 64%;
  }
}

@media (min-width:768px) {
  html {
    font-size : 66.5%;
  }

  .bereich-1-start .content {
    width : 70vw;
    padding : 2rem;
  }

  .bereich-1 h3 {
    text-align : left;
  }

  .bereich-1 .content-unterseiten {
    padding : 4rem;
    margin : 5rem auto;
    width : 90vw;
  }

  .bereich-1 #menu2 li a:link, .bereich-1 #menu2 li a:visited, .bereich-1 #menu2 a:active {
    width : 50rem;
  }
}

@media (min-width:1024px) {
  html {
    font-size : 69%;
  }

  .bereich-1 .content-unterseiten {
    padding : 4rem;
    margin : 5rem auto;
    width : 80vw;
  }

  .bereich-1 img {
    max-width : 45%;
  }
}

@media (min-width:1280px) {
  html {
    font-size : 72%;
  }

  .bereich-1 .content-unterseiten {
    padding : 5rem;
    margin : 5rem auto;
    width : 70vw;
  }

  .bereich-1 #menu2 li a:link, .bereich-1 #menu2 li a:visited, .bereich-1 #menu2 a:active {
    text-decoration : none;
  }
}

@media (min-width:1420px) {
  html {
    font-size : 82%;
  }
}