html, body {
    height: 100%;
    padding: 0;
    margin: 0;
}

#ancestors { 
    display: grid;
    grid-template-areas: 
        "nav"
        "header"
        "main"
        "footer";
    background-image: url(MARI_BCKGRND_EDIT.png);
    background-repeat: no-repeat;
    background-size: cover;
    
    
    }

#spain { 
    display: grid;
    grid-template-areas: 
        "nav"
        "header"
        "main"
        "footer";
    background-image: url(MARI_BCKGRND_EDIT.png);
    background-repeat: no-repeat;
    background-size: cover;
    
    
    }
#korea {
      display: grid;
    grid-template-areas: 
        "nav"
        "header"
        "main"
        "footer";
    background-image: url(MARI_BCKGRND_EDIT.png);
    background-repeat: no-repeat;
    background-size: cover; 
    
}
#mexico {
    display: grid;
    grid-template-areas: 
        "nav"
        "header"
        "main"
        "footer";
    background-image: url(MARI_BCKGRND_EDIT.png);
    background-repeat: no-repeat;
    background-size: cover;
    
    
}

header { grid-area: header; }
nav    { grid-area: nav; }
main   { grid-area: main; }
footer { grid-area: footer; 

}


nav{
    display:grid;
    grid-area: nav;
    grid-template-columns: 1fr 1fr 1fr;
    text-align: center;
    background-color: aliceblue;
    font-size: 10pt;
    padding: 20px 20px ;
    letter-spacing: 2px;
    align-content: center;  
    
}


    /*
 * 
nav:hover  { transform: scale(1.1); } 
*/

nav a {text-decoration: none; 
        color:darkorchid; 
}

nav a:hover {color:darkorange;}

header{
   align-content: center;
    margin: 100px 0 0 0;
    letter-spacing: 10px;
    text-align: center; /* this is a note */
    
}

main {

    text-align-last: center;
    align-content: center;
    place-items: center;
    padding: 8rem;
    font-size:larger;



}

h2{
    letter-spacing: 5px;
}

@font-face {
  font-family: Futura;
  src: url('Futura.ttc');
}



h3.maintext{
    text-align: center;
    font-size: medium;
    font-family:"Futura"; 
    background-color: rgba(256,256,256, 0.4);
    border-radius: 20px;
    padding: 3rem;
    

    
        
        
    
}


footer {
    grid-area: footer;
    color:aliceblue;
    background-color: black;
    font-size: 10pt;
    width: 100%;
    letter-spacing: 5px;
    text-align: center;
    align-content: center;
    
    
     

}

footer a {color:darkorchid; text-decoration:none;}
footer a:hover {color:darkorange; }

/*
footer:hover  { transform: scale(1.1); } */

.koreatable{
    width:75%;
    border-radius: 20px; 
    padding: 10px;
    background-color: rgba(256,256,256, 0.4);
    max-width: 100%;
    height: auto;

    
    
    
}

.mexicanlady{
    width: 50%;
    border-radius: 20px; 
    padding: 15px;
    background-color: rgba(256,256,256, 0.4);
    max-width: 100%;
    height: auto;
}