/* Trek
 * Copyright© 2002. Vedagiri Vijayakumar. All Rights Reserved.
 */  

html, body {
    height: 100%;
    margin-left: 8%;
    margin-right: 8%;
 }
 
 
body {
    min-height: 100%;
    background-color: dodgerblue;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
 
header {
    margin-top: 1rem;
    font-size: x-large;
}
 
nav {
   font-size: normal;
}

img {
   width: 65%;
   height: auto;
}

table[id=gameGrid] {
    max-width: 65%;
    width: auto;
    height: auto;
    margin-top: 1.0rem;
    margin-left: auto;
    margin-right: auto;
}
 
 .center {
    margin-left: auto;
    margin-right: auto;
 }
 
p {
   font-size: 1.5rem;
   line-height: 1.8rem;
}

#footer {
   max-width: 100%;
    padding-left: 1.0rem;
    padding-right: 1.0rem;
    padding-bottom: 1.0rem;
    padding-top: 1.0rem;
    color: lemonchiffon;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1.0rem;
    text-align: center;
}

#footer p {
   font-size: smaller;
   line-height: 1.2rem;
}

a.playLink {
    font-size: large;
    padding: 0.60rem;
}
 
#messageBlock {
   color: firebrick;
   text-align: center;
}

.centerimage {
   display: block;
   margin-left: auto;
   margin-right: auto;
   width: 65%;
}

#statusMessage {
    text-align: center;
    color: black;
 }
 
 #statusBlock {
    font-family:Arial, Helvetica, sans-serif;
    font-weight: bolder;
    font-size: 3.0rem;
    color: #f0f0f0;
 }
 
/* game.html styles */

/*
button.piece {
   width: 10.0rem;
   height: 10.0rem;
   padding: 0.5rem;
   border-radius: 0.8rem;
   font-size: 3.0rem;
   transition: border-radius 0.5s ease; 
}
*/

button.piece {
   width: 72px;
   height: 72px;
   padding: 6px 6px;
   border-radius: 9px;
   font-size: 36px;
   transition: border-radius 0.5s ease; 
}

button.piece:hover {
   border-radius: 36px;
   box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
   cursor: pointer;
}

button.piece.selected {
   outline-style: dotted;
   outline-color: white;
   outline-width: 3px;
   outline-offset: 5px;
   border-radius: 5.0rem;
}