html {    
    background: url('vocabulary_football.jpg') no-repeat center center fixed;     
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    overscroll-behavior: none;
}

body {
    overflow-y: scroll;
    font-family: Arial, Helvetica, Sans-Serif;
}

#buttonA {   
    background-color: #fff;
    color: black;
    border: none;
    position: fixed;
	padding: 0px;
    text-align: center;
    float:left;
	width: 3rem;
	height: 2rem;
	font-size: 16px;
    top: 80%;
    left: 45%;
}
#buttonB {   
    background-color: #fff;
    color: black;
    border: none;
    position: fixed;
	padding: 0px;
    text-align: center;
	width: 3rem;
	height: 2rem;
	font-size: 16px;
    top: 80%;
    right: 45%;
    float:left;
}
#buttonReset {  
    background-color: #fff;
    color: black;
    border: none;
    position: fixed;
	padding: 0px;
    text-align: center;
	font-size: 16px;
    top: 90%;
    left: 45%;
	width: 3rem;
	height: 2rem;
}

#coinButton {
    background-color: transparent;
    border: none;
    position: fixed;
	padding: 0px;
    top: 65%;
    left: 46.5%;
	width: 80px;
	height: 80px;
}
#drawingCanvas1 {
  position: fixed;
  top: 70%;
  left: 10%;
  border:1px solid white;
}
#drawingCanvas2 {
  position: fixed;
  top: 70%;
  left: 62%;
  border:1px solid white;
}
#clearDrawing {
  background-color: #fff;
  color: black;
  border: none;
  position: fixed;
  padding: 0px;
  text-align: center;
  font-size: 16px;
  top: 90%;
  right: 45%;
  width: 3rem;
  height: 2rem;
}

#draggable-children {
    position:absolute;
    top: 34%;
    left: 48.8%;
}

#draggable-children > div {
    background: url("football_small.png") no-repeat center;
    height: 45px;
    width: 45px;
    cursor: grab;
}

#draggable-children > div.dragging {
    cursor: grabbing;
}

p {
    color: white;
}
#minutes{
    font-size:2em;
    color: white;
}
#seconds{
  font-size:2em;
  color: white;
}

#button-start{
    color: black;
}

#button-stop{
    color: black;
}

#button-reset{
    color: black;
}

#button-rules {
    color: black;
}

#rules {
    position: fixed;
    top: 20%;
    left: 30%;
    width: 40%;
    border:1px solid rgb(0, 0, 0);
    font-family: Arial, Helvetica, Sans-Serif;
    font-size: 0.6em;
    color: rgb(0, 0, 0);
    background: rgb(255, 255, 255);
}

ul.a {
    list-style-type: circle;
}

h3 {
    text-align: center;
}

.wrapper{
background: transparent;
color: white;
border: none;
position: fixed;
padding: 0px;
font-size: 1.2em;
width: 30%;
/*margin: 10px;*/
top: 0%;
left: 45%;
}