/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */
 html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
     margin: 0;
     padding: 0;
     border: 0;
     font-size: 100%;
     font: inherit;
     vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
 article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
     display: block;
}
 body {
     line-height: 1;
}
 ol, ul {
     list-style: none;
}
 blockquote, q {
     quotes: none;
}
 blockquote:before, blockquote:after, q:before, q:after {
     content: '';
     content: none;
}
 table {
     border-collapse: collapse;
     border-spacing: 0;
}
/* - - - - - - */
 #main-container {
     position: absolute;
     top: 26px;
     left: 8%;
     width: 85%;
     height: 90%;
     display: grid;
     grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
     grid-template-rows: 1fr 1fr 1fr;
    /*background-color: rgba(106, 253, 159, 0.8);
    */
}
/* #nav {*/
/*    position: absolute;*/
/*    width: 50vw;*/
/*    height: 50vh;*/
/*    margin: 20vh 25%;*/
/*    list-style-type: none;*/
/*    background-color: #0000ff00;*/
/*}*/
.nav-item{
  /*padding: 4px;*/
}
a {
  text-decoration: none;
  font-size: 2.7em;
  color: black;
  -webkit-text-fill-color: white; /* Will override color (regardless of order) */
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: black;
}

#contact {
  text-decoration: none;
  font-size: 2.7em;
  color: black;
  -webkit-text-fill-color: white; /* Will override color (regardless of order) */
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: black;
}
 #exhibitions {
    /* position: absolute;
     top: 46%;
     right: 29%;
     background-color: white;
     text-align: center;
     */
}
 .grid-info {
   /*position: relative;*/
   /*background-color: #ffffff00;*/
   /*grid-column: 3/6;*/
    position: absolute;
    height: 100%;
    width: 100%;
    overflow-x: scroll;
}
 .grid-item {
     display: grid;
     grid-template-columns: auto auto auto;
     grid-template-rows: auto auto auto;
    /*background-color: rgba(220, 226, 255, 0.8);
     border: 1px solid rgba(180, 175, 241, 0.8);
    */
     font-size: 30px;
}


/* - - - - - - - - - - - - - */
 #e {
     color: red;
     grid-row: 2;
     grid-column: 2;
     background-color: #ffffff00;
    ;
     font-size: 1.6em;
}
 #r {
     color: blue;
     position: absolute;
     right: 97%;
     bottom: 78%;
     grid-row: 1;
     grid-column: 3;
     background-color: #ffffff00;
    ;
     font-size: 1.6em;
}
 #i {
     color: red;
     position: absolute;
     right: 72%;
     bottom: 108%;
     grid-row: 2;
     grid-column: 2;
     background-color: #ffffff00;
    ;
     font-size: 1.6em;
}
 #c {
     color: blue;
     position: absolute;
     right: 60%;
     bottom: 165%;
     grid-row: 3;
     grid-column: 3;
     background-color: #ffffff00;
    ;
     font-size: 1.6em;
}
 #rr {
     color: red;
     position: absolute;
     right: 44%;
     bottom: 104%;
     grid-row: 2;
     grid-column: 2;
     background-color: #ffffff00;
    ;
     font-size: 1.6em;
}
 #u {
     color: blue;
     position: absolute;
     right: 5%;
     bottom: 154%;
     grid-row: 3;
     grid-column: 2;
     background-color: #ffffff00;
    ;
     font-size: 1.6em;
}
 #s {
     color: blue;
     position: absolute;
     right: 93%;
     bottom: 21%;
     grid-row: 1;
     grid-column: 1;
     background-color: #ffffff00;
    ;
     font-size: 1.6em;
}
 #cc {
     color: red;
     position: absolute;
     right: 79%;
     bottom: 22%;
     grid-row: 1;
     grid-column: 1;
     background-color: #ffffff00;
    ;
     font-size: 1.6em;
}
 #h{
     color: blue;
     position: absolute;
     right: 71%;
     bottom: 3%;
     grid-row: 1;
     grid-column: 1;
     background-color: #ffffff00;
     font-size: 1.6em;
}
 #m{
     color: red;
     position: absolute;
     right: 55%;
     bottom: 12%;
     grid-row: 2;
     grid-column: 2;
     background-color: #ffffff00;
     font-size: 1.6em;
}
 #a{
     color: blue;
     position: absolute;
     right: 29%;
     bottom: 4%;
     grid-row: 2;
     grid-column: 2;
     background-color: #ffffff00;
     font-size: 1.6em;
}
 #n{
     color: red;
     position: absolute;
     right: 13%;
     bottom: 12%;
     grid-row: 2;
     grid-column: 2;
     background-color: #ffffff00;
     font-size: 1.6em;
}

@media screen and (min-width:320px) {
    #nav {
        position: absolute;
        margin: 2em;
    }
    .show {
        padding-top:2em;
    }
   
}
@media screen and (min-width:700px) {
    #nav {
    position: absolute;
    width: 50vw;
    height: 50vh;
    margin: 17vh 20%;
    list-style-type: none;
    background-color: #0000ff00;
}
}