/*  !
 * Tic-Tac-Toe Game Web App
 * Copyright (c) 2025 Tushar Kumar Sahu
 * Licensed under the Apache License 2.0
 * See LICENSE file for more information.
 * http://www.apache.org/licenses/LICENSE-2.0
*/

*{
      font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
      color:#fefefe;
      box-sizing:border-box;
   } 
     
   div{
      position:fixed;
      top:0;
      left:0;
      right:0;
      bottom:0;
      background-color: #04044d23;
      background-image: linear-gradient(115deg,#5c07588e,#2f065598), url("Tic-Tac-Toe-Game.jpg");
      background-repeat: no-repeat;
      background-size: 100% 100%;
      background-position: center;
      overflow:hidden;
   } 
     
   main{
      width:900px;
      height:calc(60vh);
      max-width:100%;
      background-color:#04044d5d;
      margin-left:auto;
      margin-right:auto;
      margin-top:calc(10vh);
      margin-bottom:calc(10vh);
      overflow:auto;
      padding:0;

   } 

   h1{
      display:block;
      margin:auto;
      text-align:center;
      position:sticky;
      top:0;
      background-color:#04044d23;
      padding:10px;
      background-image:linear-gradient(115deg,#5c07588e,#2f065598), url("Tic-Tac-Toe-Game.jpg");
      background-repeat:no-repeat; 
      background-position:center;
   } 

 h3,h4,p,ul,ol{
      margin-left:15px;
      margin-right:15px;
      margin-top:5px;
      margin-bottom:5px;
 }

  .footer{
     width:100%;
     height:calc(20vh);
     line-height:0.5;
     font-size:0.5rem;
     margin:0px;
     overflow:hidden;
     background-color:#03030312;
     text-align: center;
     padding:2px 20px 2px 20px;
   }

@media only screen and (max-height:700px){

      div{
            overflow:scroll;
      } 

      main{
            height:auto;
            margin-bottom:10px;
            margin-top:10px;
      }

      footer{
            margin-top:10px;
            margin-bottom:0px;
            heiglht:auto;
            padding-top:5px;

      } 
} 

