html, body 
{
  font-family: 'Noto Sans KR', sans-serif; /* Body Font */
  height: 100%; /* Body Height */
  width: 100%; /* Body Width */
  margin: 0; /* Body Margin */
  background: -webkit-linear-gradient(90deg, rgb(72, 206, 254) 0%, rgb(235, 27, 254) 100%); /* Body Background Color */
}

#main /* Page Main Style */
{
  height: 100%; /* Height */
  width: 100%; /* Width */
  cursor: not-allowed; /* Set Cursor To not-allowed */
  display: flex; /* Display */
  justify-content: center; /* Set All Content In Center */
  align-items: center; /* Set All Items In Center */
}

#main > div /* Main div Style */
{
  filter: blur(30px); /* Set Blur Effect */
  transition: .2s; /* Set Transition Effect */
  text-align: center; /* Set Text In Center */
  transform: scale(.6); /* Set Transform Effect */
  position: fixed; /* Position */
}

#main > div.on /* Style When div Is On */
{
  transform: scale(1); /* Set Transform Effect */
  filter: blur(0); /* Set Blur Effect */
  z-index: 1; /* Set Z Axis */ 
}

#main > #game /* Game div Style */
{
  filter: blur(0); /* Set Blur Effect */
  transform: scale(1); /* Set Transform Effect */
}

#main > #game > #gameCanvas /* gameCanvas div Style */
{
  box-shadow: 0 0 30px 30px black; /* Set Glow-Shadow */
  background: black; /* Body Background Color */
  border: 1px dashed rgb(72, 206, 254); /* Border Around Canvas */
  transform: scale(1); /* Set Transform Effect */
}

#main > div.on ~ #game /* game div Style When div Is On */
{
  opacity: .78; /* Set Opacity Effect */
  filter: blur(15px); /* Set Blur Effect */
  transform: scale(.90); /* Set Transform Effect */
}

#ExitButton
{
  position: absolute; /* Exit Button Position */
  top: 105%; /* Exit Button Distance From Top */
  left: 60%; /* Exit Button Distance From Left */
  transform: scale(1.5); /* Set Transform Effect */
  background-color: rgb(0,0,0); /* Exit Button Background Color */
  color:rgb(72, 206, 254); /* Exit Button Background Color */
}

#ExitButton:hover /* Exit Button Style When Hover With Mouse */
{
  box-shadow: 0 0 5px 5px rgb(0,0,0); /* Add Glow-Shadow When Hover */ 
  opacity: 1; /* Change Opacity From 0.6 To 1 When Hover */
}

#PauseButton
{
  position: absolute; /* Pause Button Position */
  top: 105%; /* Pause Button Distance From Top */
  left: 20%; /* Pause Button Distance From Left */
  transform: scale(1.5); /* Set Transform Effect */
  background-color: rgb(0,0,0); /* Pause Button Background Color */
  color:rgb(72, 206, 254); /* Pause Button Background Color */
}

#PauseButton:hover /* Pause Button Style When Hover With Mouse */
{
  box-shadow: 0 0 5px 5px rgb(0,0,0); /* Add Glow-Shadow When Hover */ 
  opacity: 1; /* Change Opacity From 0.6 To 1 When Hover */
}

#gameScore /* Info Board */
{ 
  background: black; /* Game Score Background Color */
  width: 100%; /* Game Score Width */
  max-width: 302px; /* Game Score Max Width */
  margin: 5% auto; /* Game Score Margin */
  text-transform: uppercase; /* Game Score Uppercase Text */
  box-shadow: 0 0 35px 35px black; /* Add Glow-Shadow */ 
  color: rgb(72, 206, 254); /* Game Score Text Color */
  border-radius: 5px; /* Border Radius */
  font-weight: bold; /* Game Score Text Weight */
  font-size: 25px; /* Game Score Text Size */
}

button /* Page Buttons Style */
{
  background-color: rgb(72, 206, 254); /* Buttons Background Color */
  border: 0; /* Buttons Set Border To 0 */
  margin: 15px; /* Buttons Margin */
  letter-spacing: 1px; /* Buttons Font Size */
  font-size: 15px; /* Buttons Font Size */
  transition: .2s; /* Buttons Transition Effect */
  min-width: 165px; /* Buttons Minimum Width  */
  cursor: pointer; /* Buttons Cursor When Hover With Mouse */
  border-radius: 100px; /* Buttons Border Radius */
  text-transform: uppercase; /* Buttons Set Text To Uppercase */
  padding: 17px 25px; /* Buttons Padding */
  font-weight: bold; /* Buttons Font Weight */
  outline: none; /* Buttons Set Outline To None */
  opacity: 0.60; /* Buttons Opacity Effect */
  color: black; /* Buttons Text Color */
}
  
button:hover /* Page Buttons Style When Hover With Mouse */
{
  box-shadow: 0 0 5px 5px rgb(72, 206, 254); /* Add Glow-Shadow When Hover */ 
  opacity: 1; /* Change Opacity From 0.6 To 1 When Hover */
}
  
h1 /* Page H1 Style */
{
  color: rgb(72, 206, 254); /* H1 Color */
  text-transform: uppercase; /* H1 Set Text To Uppercase */
  font-size: 50px; /* H1 Font Size */
}

h2 /* Page H2 Style */
{
  color: rgb(72, 206, 254); /* H1 Color */
  text-transform: uppercase; /* H1 Set Text To Uppercase */
  font-size: 38px; /* H1 Font Size */
}