html {
  width  : 100%;
  height : 100%;
}

body {
  position    : absolute;
  top         : 0px;
  left        : 0px;
  width       : 100%;
  height      : 100%;
  margin      : 0px;
  padding     : 0px;
  overflow-x  : hidden;
  font-family : 'calibri';
}

.navi:hover {
  background : rgba(0,0,0,.5);
}

.navi {
  position    : relative;
  min-width   : 160px;
  height      : 100%;
  float       : left;
  margin-left : 3px;
  color       : #fff;
  background  : rgba(0,0,0,0.3);
  text-align  : center;
  line-height : 3.5em;
  transition  : all .15s;
  cursor      : pointer;
}

#logo img {
  height         : 100%;
  vertical-align : top;
}

#logo {
  position       : relative;
  top            : 10%;
  width          : 100px;
  height         : 80%;
  float          : left;
  margin-left    : 50px;
  vertical-align : top;
}

#header {
  z-index    : 9999;
  position   : absolute;
  top        : 0px;
  left       : 0px;
  width      : 100%;
  height     : 60px;
}

canvas {
  width  : 100%;
  height : 100%;
}

hr {
  height     : 6px;
  border     : 0;
  background : url('/images/hr.png') repeat-x 0 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin  : 0px;
  padding : 0px;
}

h1 {
  font-size : 300%;
}

h3 {
  font-size : 150%;
}

.shape {
  position   : relative;
  top        : 0px;
  left       : 0px;
  width      : 100%;
  background : #eee;
  text-align : center;
}

.midPart {
  position   : relative;
  width      : 35%;
  min-width  : 300px;
  min-height : 100vh;
  margin     : 0px auto;
  color      : #fff;
  background : rgba( 0, 0, 0, 0.8);
  text-align : center;
}

.contentSpacer {
  position   : relative;
  width      : 100%;
  height     : 50px;
  background : #fff;
}

.interaction {
  z-index     : 9;
  position    : relative;
  width       : 80%;
  min-width   : 300px;
  height      : 30%;
  margin      : 0px auto;
  padding-top : 5%;
  text-align  : center;
}

.textfeld {
  position      : relative;
  width         : 100%;
  max-width     : 300px;
  height        : 30px;
  margin-bottom : 5px;
  border-style  : none;
  border-radius : 0px;
  background    : #eee;
  text-align    : center;
}

button {
  position     : relative;
  width        : 100%;
  max-width    : 200px;
  height       : 30px;
  border-color : #5ab1dd;
  border-width : 4px;
  border-style : none none solid none;
  background   : #6fceff;
}

.popBg {
  position   : absolute;
  top        : 0px;
  left       : 0px;
  width      : 100%;
  height     : 100%;
  background : rgba(0, 0, 0, 0.7);
}

.popFrame {
  z-index  : 999;
  display  : none;
  position : fixed;
  top      : 0px;
  left     : 0px;
  width    : 100%;
  height   : 100%;
}

.popContent {
  position   : relative;
  top        : 20%;
  width      : 60%;
  height     : 60%;
  margin     : 0px auto;
  background : #fff;
}

.whom {
  position      : relative;
  top           : 0px;
  width         : 100%;
  min-height    : 200px;
  margin-bottom : 10px;
}

#three {
  position : absolute;
  top      : 0px;
  left     : 0px;
  width    : 100%;
  height   : 100%;
}

.whom > .img {
  position      : relative;
  max-width     : 200px;
  height        : 200px;
  margin        : 0px auto;
  overflow      : hidden;
  border-radius : 50%;
}

.whom img {
  width  : 100%;
  height : auto;
}

.whom > .content {
  position   : relative;
  top        : 0px;
  left       : 0px;
  min-width  : 150px;
  height     : 100%;
  margin     : 0px auto;
  text-align : center;
}

.counts {
  display        : inline-block;
  position       : relative;
  width          : 200px;
  height         : 100px;
  margin         : 5px;
  background     : rgba(0,0,0,0.3);
  text-align     : center;
  vertical-align : top;
  font-size      : 150%;
}

#displayLink {
  display       : none;
  width         : 100%;
  height        : 0px;
  margin-bottom : 0px;
  padding       : 0px;
  color         : #000;
  border-style  : none;
  text-align    : center;
}

@media
  only screen
  and (max-width : 599px) {
  .whom > .content {
    width : 95%;
  }
}

@media
  only screen
  and (min-width : 600px) {
  .whom > .content {
    width : 60%;
  }
}
