<style>
/*
* {
 margin: 0;
 padding: 0;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
}
*/
.wrapper {
max-width: 900px;
width: 100%;
margin: 0 auto;
margin-top: 0px;
position: relative;
} 


img {
 max-width: 100%;
 height: auto;
 margin-top: 2px;
}

.table:after  {
 content: "";
 display: block;
 clear: both;
}
 
.field {
 width: 14%;
 margin: 1% 1%;
 height: 150px;
 border: 1px solid #000;
 border-radius: 8px;
 float: left;
 cursor: pointer;
}


.inner-wrap {
 width: 100%;
 height: 100%;
 transition: all 0.6s;.
 -webkit-transition: all 0.6s;
 transform-style: preserve-3d;
 position: relative;
}

.front {
 background: url(/norbert_memory/pattern.jpg) no-repeat top center;
 width: 100%;
 height: 100%;
 border-radius: 8px;
 z-index: 2;
 transform: rotateY(0deg);
 -webkit-transform: rotateY(0deg);
 -moz-transform: rotateY(0deg);
 -o-transform: rotateY(0deg);
}

.flipped {
 transform: rotateY(180deg);
 -webkit-transform: rotateY(180deg);
 -moz-transform: rotateY(180deg);
 -o-transform: rotateY(180deg);

}

.front, .back {
 backface-visibility: hidden;
 -webkit-backface-visibility: hidden;
 position: absolute;
 top: 0;
 left: 0;
}

.back {
 transform: rotateY(180deg);
 -webkit-transform: rotateY(180deg);
 -moz-transform: rotateY(180deg);
 -o-transform: rotateY(180deg);
 text-align: center;
}

p.result {
    font-size: 200%;
    font-weight: bold;
    font-family: verdana;
    text-align: center;
    position: relative;
    color: #FF00FF;
    margin-bottom: 0px;
}

p.counter {
	font-family: verdana;
    text-align: center;
    font-size: 200%;
    font-weight: bold;
    color: #FF00FF;
    margin-top: 0px;
    margin-bottom: 0px;
}

span {
    text-align: center;
    display: block;
    font-family: verdana;
}

.wrapper > p {
    text-align: center;
    margin-bottom: 0px;
}

#container {
  display: flex;                  /* establish flex container */
  flex-direction: row;            /* default value; can be omitted */
  flex-wrap: nowrap;              /* default value; can be omitted */
  justify-content: space-between; /* switched from default (flex-start, see below) */
  margin-top: 0px;
}

 .button {
  font-family: verdana;
  font-weight: bold;
  color: #FFFFFF;
  font-size: 0.75vw;
  padding: 8px 16px;
  -moz-border-radius: 45px;
  -webkit-border-radius: 45px;
  border-radius: 45px;
  border: 4px solid #CFDCEC;
  background: #306BBB;
  text-decoration: none;
}
.button:hover {
  background: #458500;
  border: 4px solid #AFD283;
  text-decoration: none;
}

</style>

