* {
  box-sizing: border-box; }

.container {
  margin: 0 auto;
  width: 100%;
   }
  @media (min-width: 40em) {
    .container {
      } }
  
  .container section {
    position: relative;
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.2);
    border-radius: 1rem; }
    .container section ul {
      cursor: url("../img/game/cam.png") 8 8, default;
      margin: 0;
      padding: 6px;
      overflow: hidden;
      background:#f2f2f2;
       background-image: url("../img/game/back.png");
      
       }
      .container section ul li {
        display: block;
        float: left;
        
        padding: 2.5rem; }
        .container section ul li a {
          -webkit-transition: all .2s linear;
          -moz-transition: all .2s linear;
          -ms-transition: all .2s linear;
          -o-transition: all .2s linear;
          transition: all .2s linear;
          display: block;
          
          margin: 5rem auto;
         
          position: relative;
          -webkit-box-shadow: 0 0 1rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 1rem rgba(0, 0, 0, 0.1); }
          .container section ul li a::before {
            content: '';
            position: absolute;
            height: 8rem;
            width: 8rem;
            border-radius: 50%;
            top: calc(50% - 1.75rem);
            left: calc(50% - 1.75rem);
             }
        .container section ul li.active a {
           }
          .container section ul li.active a::before {
           
            background-image: url("../img/game/mol3.png");
             
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center 5px; }
          .container section ul li.active a:hover {
            background: #aaa116; }