html, body {
    margin: 0;
    padding: 0;
}


/**********************************************************************
*************************** CONTAINER ************************************
***********************************************************************/

.header
{
  width:100%;
  position: relative;
  text-align: center;
  margin: 0 auto;
  padding: 30px 0;

  background: rgba(255,255,255,1);
  background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(240,240,240,1) 100%);
  background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(100%, rgba(240,240,240,1)));
  background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(240,240,240,1) 100%);
  background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(240,240,240,1) 100%);
  background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(240,240,240,1) 100%);
  background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(240,240,240,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f0f0f0', GradientType=0 );

}

#mimitos_cat {
  margin: 0 auto;/*38*/
  padding: 0 0 50px 0;
  width: 100%;
  text-align: center;
}

#menu_stores {
  text-align: center;
  margin: 0 auto;
  padding: 0;
  display: block;
}

ul {
  padding: 0;
  text-align: center;
}

div#menu_stores ul li {
  display: inline;
  padding: 0px 10px 0 10px;
  text-align: center;
}

#images {
  width: 100%;
  max-width: 1000px;

  text-align: center;
  margin: 60px auto;
}


div#images ul li a img
{
   width: 45%;
   padding: 0 0.5% 1% 0.5%;
}

div#images ul li
{
   display: inline;
}


.embed-container {
    position: relative;
    margin: 0 auto;
    width: 50%;
    padding: 0 10% 33.25% 10%;
    height: 0;
    overflow: hidden;
}
.embed-container iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}

div#description {
    width: 31%;
    margin: 37px auto;
    text-align: center;
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    color: rgb(53, 47, 47);
    line-height: 1.5;
    font-size: 18px;
}




/**********************************************************************
*************************** MEDIA QUERY ************************************
***********************************************************************/

/*@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) and (orientation : portrait)*/
@media only screen
and (min-device-width : 220px)
and (max-device-width : 568px)
and (orientation : portrait) {

  .header
  {
    padding: 14px 0;
  }

  #mobile { display: none; }

  div#description {
      width: 82%;
      margin: 37px auto;
      text-align: justify;
      font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
      color: rgb(53, 47, 47);
      line-height: 1.5;
      font-size: 17px;
  }

  .header img {
      width: 70%;
  }

  #mimitos_cat
  {
    width: 70%;
    padding: 0 0 28px 0;
  }

  #images {
    margin: 20px auto;
  }

  div#menu_stores{
    /*padding: 50px 0px;*/
  }

  div#menu_stores ul li {
    padding: 0 0;
  }

  div#menu_stores ul li a img{
    width: 45%;
    padding: 8px 7px;
  }

  div#images ul li a img
  {
     width: 90%;
     border-radius: 14px;
     margin: 0px 0px 14px 0px;
  }

  .embed-container {
      width: 75%;
      padding: 0 5% 54.25% 5%;
  }
  .embed-container iframe {

      width: 100%;
      height: 100%;
  }


}



/********IPAD MEDIA QUERIES******/
@media only screen
and (min-device-width : 568px)
and (max-device-width : 1024px),
only screen and (max-device-width: 767px) and (orientation : landscape)
{

  #mobile { display: none; }

  .game h1 {
    font-size: 42;
    padding: 20px 0px 20px 0px;
  }

  .game h2 {
    font-size: 32;
  }

  div#store_buttons{
    padding: 50px 0px;
  }

  div#store_buttons ul li a img{
    width: 30%;
  }


}