html{
  min-height:100%;/* make sure it is at least as tall as the viewport */
  position:relative;
}

body {
  font-family: 'Dosis', sans-serif;
  font-weight: 300;
  margin: 0;
  padding: 0;
  height: 100%;
}

.wrapper {
  padding: 0;
  width: 100%;
  height: 100%;
  margin: 0;

  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  overflow:hidden;
}

h1 {
  display: none;
}

h2, h3, h4 {
  width: 60%;
  text-align: center;
  margin: 0 auto 20px;
  padding: 0px 20px;
  color: #fcfcfc;
}

p {
  font-size: 13pt;
  color: #fcfcfc;
  width: 70%;
  margin: 0 auto;
  text-align: center;
  line-height: 150%;
}

.left {
  width: 50%;
  height: 100%;
  float: left;
  background: #3d3d3b;
}

.visitsite {
  color: #3d3d3b;
  text-align: center;
  margin: 30px auto;
  text-transform: uppercase;
}

.visitsite a {
  text-decoration: none;
  color: #3d3d3b;
  text-transform: uppercase;
  background: #fcfcfc;
  padding: 10px 70px;
  line-height: 43px;
}

.languagelink {

}

.left .visitsite {
  margin-top: 56px;
}

.left .visitsite a:hover {
  background: #dbb465;
}

.right .visitsite a:hover {
  background: #8bd7f7;
}

.right {
  width: 50%;
  height: 100%;
  float: right;
  background: #1e70b9;
}

.logo {
  text-align: center;
}

.logo img {
  max-width: 60%;
  margin: 55px 0px;
}

@media (max-width: 1250px) and (min-width: 971px) {
  .visitsite a {
    padding: 10px 45px;
  }
}

@media (max-width: 970px) {

  html {
    min-height: 200%;
    position: relative;
  }

  .visitsite a{
    font-size: 13px;
    padding: 8px 55px;
    line-height: 35px;
  }

  .languagelink{
    display: block;
  }

  .break{
    display:none;
  }

  .left,
  .right {
    float: none;
    width: 100%;
    max-height: 50%;
  }

  .left .visitsite {
    margin-top: 30px;
  }

  h2, h3, h4,
  p {
    width: 80%;
    font-size: 11pt;
  }

  h2{
    font-size: 1.2em;
  }

  .logo img{
    max-width: 60%;
    margin: 15px 0px;
  }
}

@media (max-width: 615px) {
  .logo img {
    max-width: 80%;
  }
}