@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro");
html {
  line-height: 1.15;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

 #animation_controls {
	position:absolute;
	top: 0px;
	visibility:visible;
	z-index: 100;
}

/*
#forklaring {
	position:relative;
	z-index: 200;
}

#oppgave {
	position:relative;
//	visibility:hidden;
	display:none;
	z-index: 200;
}

  #responseText {
		font-size: 30pt;
  }
*/

#animation_container {
	position:absolute;
	bottom:0px;
}

#canvas_text_fotokanon {
	position:absolute;

  height: 15%;
  font-size: 1rem;
	bottom:20px;
  left: 40px;
}

#canvas_text_hydrogen{
	position:absolute;

  height: 10%;
  font-size: 1rem;
	bottom:20px;
  left: 40%;
}
	
.electronList {
  background: #F8F8F8;
  list-style: none;
  margin: 0;
  padding: 0.5rem;
}

.electronList li {
  display: inline-block;
  margin: 0.12305rem;
}

.instructionText {
	  background: #F8F8F8;
	  padding: 0.5rem;
	    margin: 0;
}



button {
  background: white;
  border: 3px solid #20588F;
  border-radius: 4px;
  padding: 0.24609rem 0.49219rem;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s;
  font-weight: 700;
  color: #20588F;
}

button:hover,
button:active,
button:focus {
  background: #20588F;
  color: #ffffff;
  cursor: pointer;
}


label {
  margin-right: 2rem;
  color: #20588F;

}

input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 50%;
  width: 0.98438rem;
  height: 0.98438rem;
  border: 2px solid #20588F;
  -webkit-transition: 0.25s all linear;
  -o-transition: 0.25s all linear;
  transition: 0.25s all linear;
  outline: none;
  margin-right: 0.49219rem;
  position: relative;
  top: 4px;
}

input:checked {
  border: 0.49219rem solid #20588F;
}

input:focus {
  outline: 2px solid #20588F;
}




span.line {
  display: inline-block;
}

:root {
  font-size: 18px;
}

html, body {
  color: #444444;
  font-size: 0.7rem;
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-weight: 400;
  line-height: 1.44444;
}


@media (min-width: 640px) {

        html, body {
          font-size: 1rem;
        }

      #canvas_text_fotokanon {
        font-size: 1.7rem;
        height: 35%;

      }
      #canvas_text_hydrogen{

        font-size: 1.7rem;

      }

}