.content {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    display: grid;
    grid-template-columns: repeat(12, minmax(.6rem, 8rem));
    grid-template-rows: auto;
    justify-content: space-between;
    align-content: start;
    margin-top: 0;
    height: auto;
}



.headings {
    grid-column: 1/13;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(12, minmax(.6rem, 8rem));
    grid-template-rows: auto;
    justify-content: center;
    justify-items: center;
    background-color: #113250;
    opacity: .7;
    color: white;
}


/*    .headings * {
        background-color: #113250;
        opacity: .7;
        color: #FFFFF0;
    }
*/
.datalists {
    grid-column: 1/13;
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    background-color: #f1ede1;
    height: auto;
    min-height:80vh;
    overflow: auto;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    
}

.menu-logo {
    height: 48px;
    width: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
}



/*    .headings > * {
        border: thick solid blue;
    }
*/

.hdg1 {
    grid-row: 2/3;
    grid-column: 1/7;
    text-align: center;
    width: 100%;
    color:#FFFFF0;
    margin-bottom:.5rem;
}

.hdg2 {
    grid-row: 2/3;
    grid-column: 7/13;
    text-align: center;
    width: 100%;
    color: #FFFFF0;
    margin-bottom: .5rem;
}


.hdg-logo {
    grid-column: 6/8;
    grid-row: 1/1;
    text-align: center;
    height: 48px;
    width: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    opacity: .2;
}


.LabelSubscriptionType {
    display: inline-block;
    grid-row: 1/2;
    grid-column: 3/11;
    color: #FFFFF0;
    text-align: center;
    margin-bottom: 16px;
}

.headings h2 {
    width: 100%;
    text-align: center;
    margin: 0;
    margin-left: auto;
    margin-right: auto;
    
}

    .headings h2 a {
        width: 100%;
        display: block;
        text-align: center;
        color: #FFFFF0;
        border-radius: .2rem;
        font-weight:normal;
        
    }

        .headings h2 a:hover {
            color: #333;
            /* box-shadow: 1px 1px 2px 1px gray;*/
            background-color: #f1ede1;
        }


.datalists-css {
    background-color: #FFFFF0;
    text-align: center;
    width: 100%;
    height: auto;
}

.hyperlinks {
    display: block;
    text-align: center;
    padding: .2rem;
    border-radius: .2rem;
    color: black;
    width: 100%;
    margin: .2rem;
    margin-left: auto;
    margin-right: auto;
    text-decoration: none;
    font-size: 1.25em;
}

    .hyperlinks:hover {
        background-color: #eee;
        cursor: pointer;
        text-decoration: underline;
    }

    .hyperlinks:active {
    }


a {
    display: block;
    margin-right: auto;
    margin-left: auto;
    padding: .3rem;
    text-align: left;
    width: auto;
    color: #000;
}

    a:hover {
        background-color: #f1ede1;
    }

    a:active {
        box-shadow: 2px 2px 2px #444 inset;
    }

p {
    text-align: left;
    padding: 1.0rem;
    padding-top: 0;
}


.list2 {
    display: inline-block;
    background-color: #FFFFF0;
    margin: 2px;
    margin-bottom: 5px;
    margin-top: 0;
    width: 50%;
    text-align: center;
    border-radius: 8px;
    height: auto;
    box-shadow: 1px 1px 10px 1px #999;
    padding: .5rem;
}

    .list2 > h2 {
        width: 100%;
        margin-bottom: 0;
    }

        .list2 > h2 a {
            width: 100%;
            margin-left: auto;
            margin-right: auto;
            text-align: center;
            color: #222;
            text-shadow: .5px .5px 1px black;
        }

.LabelSubscriptionType2 {
    color: gray;
    margin-bottom: 1rem;
    height: auto;
    display: inline-block;
}


.list3 {
    grid-column: 2/12;
    padding: 1rem;
    width: 100%;
    background-color: #FFFFF0;
    margin-bottom: .5rem;
}


    .list3 a {
        
        text-decoration: none;
        font-weight: bold;
        text-align: center;
        margin: 1rem;
        /* background-color: #ffd171;
        border: solid medium #333;
        border-radius: .5rem;*/
    }

        .list3 a:hover {
            background-color: #f1ede1;
            cursor: pointer;
        }


    .list3 p {
    }

.hidden {
    opacity: 0;
}



@media screen and (max-width:992px) {
    .maindiv {
        grid-column: 1/13;
    }

    .headings {
    }

    .content > div:nth-child(n+3):nth-child(-n+5) {
        padding: .5rem;
    }

   /* .hyperlinks {
        width: 100%;
        font-size: 95%;
        padding: .4rem;
    }*/


    .list3 a {
        border-radius: .4rem;
    }

    .list3 p {
    }
}


@media screen and (max-width: 768px) {

    .headings {
    }

  /*  .hyperlinks {
        width: 100%;
        font-size: 90%;
        padding: .3rem;
    }*/

    .hdg-logo {
        height: 36px;
    }

    .menu-logo {
        height: 36px;
    }

    .content > div:nth-child(n+3):nth-child(-n+5) {
        padding: .5rem;
    }

    p {
    }

    .list3 a {
        border-radius: .4rem;
    }

    .list3 p {
    }
}



@media screen and (max-width: 600px) {

    /*.hyperlinks {
        width: 100%;*/
        /*padding: .2rem;
    }*/

    .list3 a {
        border-radius: .4rem;
    }

    .list3 p {
    }
}