* {
	margin: 0;
	padding: 0;
	box-sizing: border-box; 
}

section { 

	background: rgb(120, 245, 153);
	height: 100vh;
	font-family: 'Zen Dots', cursive;
 }
 .score { 

 	/*color */
 	height: 18vh;
 	display: flex;
 	justify-content: space-around;
 	align-items: center;
 	font-size: 30px;
  }
  .score p{
  	text-align: center;
  	padding: 10px;
  }

  .intro { 
  	background: rgb(120, 245, 153);
  	height: 50vh;
  	display: flex;
  	flex-direction: column;
  	align-items: center;
  	justify-content: space-around;
  	font-size: 50px; 
  	text-align: center;
    transition: 0.9s ease;
   }
   .intro button,
   .match button {
    width:  250px;
    height: 75px; 
    background: rgb(25, 97, 11);
    border: none;
    border-radius: 20px;
    color: white;
    font-size: 50px;

   }

   .match{

    background: rgb(159, 226, 191);
    font-size: 50px;
    position: absolute;
    width: 100%;
    height:  70%;
    transform: translate(0%,-70%);
    opacity: 0;
    pointer-events: none;
    transition: 0.5s ease;
    transition-delay: 0.9s;


   }
   .winner{

    text-align: center;
   }

   .hands{
    display: flex;
    justify-content: space-around;
   }

   .options { 
      display:  flex;
      justify-content: space-around;

    }
    .player-hand
    {
      transform: rotateY(180deg);
    }

    div.fadeOut { 

      opacity: 0;
      pointer-events: none;

     }
     div.fadeIn
     {
      opacity: 1;
      pointer-events: all;
     }


     @keyframes shakePlayer
     {
      0%{ transform: rotateY(180deg) translate(-50px); 
      }
      15%{ transform: rotateY(180deg) translate(0px); 
      }
      30%{ transform: rotateY(180deg) translate(-50px); 
      }
      50%{ transform: rotateY(180deg) translate(0px); 
      }
      75%{ transform: rotateY(180deg) translate(-50px); 
      }
      100%{ transform: rotateY(180deg) translate(0px); 
      }
     }
      @keyframes shakeComputer
     {
      0%{ transform: translate(-50px); 
      }
      15%{ transform: translate(0px); 
      }
      30%{ transform: translate(-50px); 
      }
      50%{ transform: translate(0px); 
      }
      75%{ transform: translate(-50px); 
      }
      100%{ transform: translate(0px); 
      }
     }
.signature { 
   position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  text-align: right;
  margin: 10px;
  padding-right:  20px;

 }