.woodBackground
  {
    background-image: url("http://www.apsys-inc.com/DIZAD_Web_Libraries/Images/FreeCodeCamp/FCC10SimonGame/woodBackground.jpg");
    background-size: cover; 
  }

body
  {
    background-image: url("http://www.apsys-inc.com/DIZAD_Web_Libraries/Images/FreeCodeCamp/FCC10SimonGame/fence.jpg");
    background-percentage: 100% 100%; 
    text-align: center;
    color: lime;
    font-family: Helvetica, sans-serif;
    font-size: 30px;
    margin: auto;
    transition: 1s ease;
  }

.fontTitle
  {
    background-image: url("http://www.apsys-inc.com/DIZAD_Web_Libraries/Images/FreeCodeCamp/FCC10SimonGame/title.png");   
    background-repeat: no-repeat;
    background-position: center;
    background-size: 399px 75px; /*Width/Height*/
    height: 75px;
  }

.fontFootNote
  {
    transform: scaleY(-1); /*Corrects for border flip*/
    font-size: 15px;
    font-weight: normal;
    color: white;
    max-width: 225px;
    background-color: darkgreen;
    border-radius: 10px;
    margin: auto;
    text-align: center;
    opacity: 0.8;
    border-width: 5px;
    border-color: white;
    border-style: solid;
  }

.leafBorder
  {
    background-image: url("http://www.apsys-inc.com/DIZAD_Web_Libraries/Images/FreeCodeCamp/FCC10SimonGame/leafBorder.png"); 
    background-position: center;
    background-size: 448px 150px; /*Width/Height*/
    height: 150px;
    background-position: center;
    background-size: 448px 150px; /*Width/Height*/
  }

.butSimonDefault
  {
    position:absolute;
    transition: 1.0s ease;
    text-align: center !important;
    margin: auto;
    width : 200px;
    height: 200px;
    mix-blend-mode: hue;
  }

.butSimonDefault:hover
  {
     mix-blend-mode: normal;
    cursor: pointer;
  }

.butGreen
  {
   border-top-left-radius : 100%;
   background-color: green; 
  }

.butRed
  {
   border-top-right-radius : 100%;
   background-color: red;
   transform: translate(200px, 0px);
  }

.butBlue
  {
   border-bottom-right-radius : 100%;
   background-color: blue; 
   transform: translate(200px, 200px);
  }

.butYellow
  {
   border-bottom-left-radius : 100%;
   background-color: yellow; 
   transform: translate(0px, 200px);
  }

.simonBoard
  {
    background-image: url("http://www.apsys-inc.com/DIZAD_Web_Libraries/Images/FreeCodeCamp/FCC10SimonGame/boardBackground.jpg"); 
    width : 400px;
    height: 400px;
    background-color: orange;
    margin: auto;
    box-shadow: inset 0 0 10px #000000;
    border-radius: 50%;
    border-width: 7px;
    border-color: white;
    border-style: solid;
  }

.controlBoard
  {   
    background-image: url("http://www.apsys-inc.com/DIZAD_Web_Libraries/Images/FreeCodeCamp/FCC10SimonGame/controlBoard.jpg"); 
    background-size: 250px 250px; /*Width/Height*/  
    transform: translate(0px, 20.5%);
    text-align: center;
    margin: auto;
    width : 250px;
    height: 250px;
    background-color: red;
    border-radius: 50%;
    border-width: 7px;
    border-color: white;
    border-style: solid;
  }

#labelStatus
  {
    font-family: Caesar Dressing;
    color: LightGoldenRodYellow;
    transform: translate(0px, 67px);
  }

.butStart
  {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: green;
    transform: translate(39px, 111px);
    transition: 0.5s ease;
  }

.butStart:hover
  {
    background-color: lime;
    transition: 0.5s ease;
    cursor: pointer;
  }

.butStrict
  {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: yellow;
    transform: translate(112px, 130px);
    transition: 0.5s ease;
  }

.butStrict:hover
  {
    background-color: LightGoldenRodYellow;
    transition: 0.5s ease;
    cursor: pointer;
  }

.butStrictLighten
  {
    background-color: white;
    box-shadow: 0px 0px 30px yellow;
  }

#labelStep
  {
    font-family: Caesar Dressing;
    color: LightGoldenRodYellow;
    transform: translate(74px, 41px);
  }

#hLine
  {
    border-top: 7px solid white;
    transform: translate(0px, 200px);
  }

#vLine
  {
    border-top: 7px solid white;
    transform: translate(0px, 189.5px) rotate(90deg);
  }

.lighten
  {
    transition: 0.7s ease;
    mix-blend-mode: normal;
   background-color:white !important;
  }