body {
    background-image: url('/static/media/dust_background.png');
    background-position: left top;
    background-size: auto;
    background-repeat: repeat;
    background-attachment: scroll;
}


#site-logo{
    width: 120px;
}
#site-heading{
    font-size:35px;
    text-align:center;
    margin-top:50px;
    line-height:60px;
    font-family: Helvetica, Arial, sans-serif;
    color:grey;
}

  .ui.menu {
    margin: 3em 0em;
    margin-top:-1px;
    background-color:#8ec4d8;

  }

  .ui.menu a{
      color:white;
  }

  .ui.menu.menu a{
      color:rgba(0, 0, 0, 0.95);
  }


  .ui.menu:last-child {
    margin-bottom: 110px;
  }


  .last.container {
    margin-bottom: 300px !important;
  }
  h1.ui.center.header {
    margin-top: 3em;
  }
  h2.ui.center.header {
    margin: 4em 0em 2em;
  }
  h3.ui.center.header {
    margin-top: 2em;
    padding: 2em 0em;
  }
  #footer{
      width:100vw;
  }
  .row-button{
      margin-bottom:10px!important;
  }


  @media only screen and (max-width: 1400px) {
      .hide-on-mobile{
          display:none;
      }
  }

 @media only screen and (max-width: 767.98px){
  .ui.menu {
    margin: 0.5em 0em;
    margin-top:-1px;

  }
}


.engraved {
font-size: 100px;
font-family: Futura;
background-color: #666666;
-webkit-background-clip: text;
-moz-background-clip: text;
background-clip: text;
color: transparent;
text-shadow: rgba(245,245,245,0.5) 3px 5px 1px;
}

.gray-out {
    filter: grayscale(100%);
}


.progress-bar-box{
    height:15px;
    margin:10px;
}
.progress-bar{
    background-color:lightgreen;
    height:100%;
    border-radius:10px;
}


.correct {
 background-color:green;

}