body {
background-image: url("blue1.jpg");
    margin: 0;
font-family: 'Delius Swash Caps', cursive;
color: #336699;
}
h1 {
font-family: 'Glass Antiqua', cursive;
font-size:4em;
color: #336699;
text-shadow:2px 2px #fff;
 text-align: center;
padding left:: 35%;
}
.logo {
  float: left;
padding:10px;
  width: 200px;
}
.indrag {
  float: left;
padding-top:20px;
padding-left:20px;
}
.rund {
float: left;
padding-top:20px;
padding-left:20px;
padding-right:40px;
}

 {
  box-sizing: border-box;
}
.menu {
  float:left;
  width:20%;
  text-align:center;
}
.menu a {
   padding-top:5px;
 padding-bottom:4px;
  margin-top:7px;
  display:block;
font-family: 'Delius Swash Caps', cursive;
  color:#fff;
 text-decoration: none;
}
.main {
background-image: url("blue2.jpg");
  float:left;
  width:60%;
  padding:0 10px;
   border-radius: 20px;
border: 2px solid #ffffff;
margin-left:3%;
margin-right:3%;
}
.right {
float:left;
width:10%;
padding:10px;
margin-top:7px;
text-align:center;
}
  footer {
      background-color: #99b8cc;
      padding: 20px;
    }

#knapp {
    border-radius: 13px;
border: 2px solid #ffffff;
    background: url(bla.jpg);
    background-position: left top;
    background-repeat: repeat;
    padding-top: 4px; 
padding-bottom: 3px; 
    width: 120px;
    height: 28px; 
margin-left: 5%;
z-index:-1;
}


#bild {
    position: absolute;
    left: 5%;
    top:5%;
    z-index: 2;
}

#bild2 {
    position: absolute;
    right: 2%;
    top:5%;
    z-index: -1;
}

@media only screen and (max-width:620px) {
  /* For mobile phones: */
  .menu, .main, .right {
    width:100%;
  }
}