*
{
  font-family: 'Lato', sans-serif;
  line-height: 1.4em;
}

body
{
  padding-bottom: 100px;
}

a
{
  color: #007788;
  text-decoration: none;
}

a:hover
{
  color: #02aeba;
}

body
{
  background: #ffffff;
  margin: 0;
}


div#content
{
  width: 960px;
  margin: 0 auto;
}

div.block
{
  margin: 10px 10px;
  width: 460px;
  min-height: 280px;
}

.dot
{
  display: inline-block;
  margin: 5px 10px;
  width: 16px;
  height: 16px;
}

h2
{
  margin: 5px 0 10px 0;
}

h3
{
  margin: 10px 0 5px 0;
}

div.block.mobilesmall
{
  height: 50px;
  min-height: 50px;
}


div.row
{
  display: flex;
}

div.klapp
{
  height: 50px;
  display: block;
  overflow: hidden;
}

div.klapp.offen
{
  height: auto;
}


div.row:nth-child(even)
{
  flex-direction: row-reverse;
}


div.parallaximage
{
  width: 460px;
  height: 280px;
  background-size: 512px 384px;
}

div.parallaximage. noeffect
{
  background-size: 460px 345px;
}


div.parallaximage.double
{
  width: 460px;
  height: 580px;
  background-size: 512px 768px;
}

div.parallaximage
{
  opacity: 0;
}

div.double > div:first-child
{
  margin-bottom: 20px;
}

.rotateleft
{
  -webkit-transition-duration: 2s;
  -moz-transition-duration: 2s;
  -o-transition-duration: 2s;
  transition-duration: 2s;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  -o-transition-property: -o-transform;
}
.rotateleft:hover
{
   transition-property: transform;
  -webkit-transform:rotate(90deg);
  -moz-transform:rotate(90deg);
  -o-transform:rotate(90deg);
}

div.logos
{
  background: #02aeba;
}

div.logos img
{
  display: inline-block;
  margin: 10px 10px;
}


.logo1
{
 height: 200px;
 max-height: 30vh;
 float: right;
 margin: 10px 0 10px 10px;
}


@media only screen and (max-width : 980px)
{

  div.block
  {
    margin: 1vw 1vw;
    width: 48vw;
    overflow: hidden;
    min-height: 28vw;
  }

  div#content
  {
    width: 100%;
    margin: 0 auto;
  }

  div.parallaximage
  {
    width: 48vw;
    height: 28vw;
    background-size: 58vw 43.5vw;
  }

  div.parallaximage.noeffect
  {
    background-size: 48vw 36vw;
  }

  div.doublecont
  {
    width: 48vw;
    margin-left: 1vw;
    margin-right: 1vw;
    overflow: hidden;
  }

  div.doublecont div.block
  {
    width: 48vw;
    margin-left: 0;
    margin-right: 0;
  }

  div.double div.block
  {
    margin-left: 0;
    margin-right: 0;
  }

  div.parallaximage.double
  {
    width: 48vw;
    height: 58vw;
    background-size: 58vw 87vw;
    margin-left: 0;
    margin-right: 0;
  }

  .logo1
  {
   height: 20vw;
   margin: 1vw 0 1vw 1vw;
  }

}


@media only screen and (max-width: 600px)
{

  div.block
  {
    margin-left: 0;
    width: 100vw;
    margin-right: 0;
  }

  div.parallaximage
  {
    width: 100vw;
    height: 58.3vw;
    background-size: 110vw 82.5vw;
  }

  div.parallaximage.noeffect
  {
    background-size: 100vw 75vw;
  }

  div.doublecont
  {
    width: 100vw;
    margin-left: 0;
    margin-right: 0;
    overflow: hidden;
  }

  div.doublecont div.block
  {
    width: 100vw;
    margin-left: 0;
    margin-right: 0;
  }

    div.parallaximage.double
  {
    width: 100vw;
    height: 121vw;
    background-size: 110vw 146.7vw;
  }





  div.block.logos > p
  {
    padding-left: 7px;
    padding-right: 7px;
  }

  div.logos img
  {
    margin-bottom: 20px;
    margin-top: 20px;
  }

  div.row:first-child > div:first-child
  {
    /* height: 20px; */
    min-height: 20px;
  }

  div.row
  {
    display: block;
    flex-direction: row;
  }

  div.block > h2
  {
    margin-top: 20px;
  }


  div.block > p,
  div.block > h2,
  div.block > h3,
  div.block > table,
  div.block > div.klapp
  {
    padding-left: 20px;
    padding-right: 20px;
  }

  div.block
  {
    margin: 10px 0;
  }

  div.block:first-child
  {
    margin-top: 0;
  }

  div#content
  {
    width: 100%;
    margin: 0 auto;
  }
}