html, 
body {
  height: 100%;
}

body {
  background-image: url(/static/forkilla/black-background-wood.jpg);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-color: grey;
}

.footer {
   position: absolut;
   left: 0;
   bottom: 0;
   height:30%;
   width: 100%;
   background-color: grey;
   color: white;
   text-align: center;
}

p {
  color: white;
  font-size: 16px;
  text-align:left;
  font: arial;
}

h3 {
  color: white;
  font-size: 28px;
  font: arial;
}


/* Create three equal columns that floats next to each other */
.column {
  float: left;
  width: 33.33%;
  padding: 10px;
  
}

.column2 {
  float: left;
  width: 66.66%;
  padding: 10px;
  height: 200px;
  
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}	

* {
  box-sizing: border-box;
}

img { 
  width: 70%;
  height: 70%;  
}
.text {
  font-size:1vw;
}

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


.menu {
  float:left;
  width:33%;
  text-align:center;
}

.main {
  float:left;
  width:33%;
  padding:0 20px;  
  text-align:center;

}
.right {
  float:left;
  width:33%;
  padding:15px;
  margin-top:7px;
  text-align:center;
}

.drawer-elem 
{
   display: none;
}

@media all and (-tizen-geometric-shape: circle) 
{
   .drawer-handler 
   {
      width: 24px;
      height: 115px;
      position: fixed;
      top: 122px;
      right: 0;
      color: transparent;
      background-color: #a4a4a4;
      -webkit-mask-image: url(/*path of the image*/);
      -webkit-mask-size: 18px 36px;
      -webkit-mask-repeat: no-repeat;
      -webkit-mask-position: 0 40px;
   }
   .ui-bottom-button a + a 
   {
       display: none;
   }
}