html {
    font-size: 10px;
    scrollbar-color: #14b2d2 #afeefa;
}
/*@media (min-width: 320px) {
    html {
        font-size: 12px;
    }
}
*/
@media (min-width: 480px) {
    html {
        font-size: 13px;
    }
}
@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}


::-webkit-scrollbar {
    background-color: rgb(175 242 255);
}
::-webkit-scrollbar-button {
    background: rgb(20 178 210);
}
::-webkit-scrollbar-thumb {
    background: #14b2d2;
}


header {
    position: absolute;
    display: flex;
    z-index: 1;
}
header img {
    margin: 1rem;
    height: 4rem;
    width: 4rem;
    box-shadow: 
        1px 1px 1px #c3f1ff,
        1px 2px 5px #1ba3cd,
        -1px 2px 5px #1ba3cd,
        6px 6px 8px #1ba3cd;
    box-shadow: 1px 1px 1px #fff, 1px 2px 5px #1ba3cd, -1px 2px 5px #1ba3cd, 6px 6px 8px #1ba3cd;
}
header div {
    display: flex;
    align-items: center;
}
header h1 {
    color: rgb(227, 249, 253);
    text-shadow: 
        1px 1px 1px #002b38,
        1px 2px 5px #1ba3cd,
        -1px 2px 5px #1ba3cd,
        6px 6px 8px #1ba3cd;
    /*text-shadow: 1px 1px 1px #004c63,1px 2px 5px #1ba3cd,-1px 2px 5px #1ba3cd,6px 6px 8px #1ba3cd;*/
    color: rgb(255, 255, 255);
}
@media (max-width: 600px) {
    header img {
        margin: 0.8rem;
        height: 3rem;
        width: 3rem;
    }
    header h1 {
        font-size: 1.5rem;
    }
}



/*header div:nth-child(1) {
    display: flex;
}
header div:nth-child(2) {
    display: none;
}
main div.doc-body div:nth-child(1) {
    display: none;
}

@media (max-width: 480px) {
    header div:nth-child(1) {
        display: none;
    }
    header div:nth-child(2) {
        display: flex;
    }
    main div.doc-body div:nth-child(1) {
        display: flex;
    }
}

header div:nth-child(1) h1 {
    font-size: calc(7.0vw - 5px);
}
header div:nth-child(2) h1 {
    font-size: calc(14.0vw - 10px);
}
main div.doc-body div:nth-child(1) h1 {
    font-size: 3.5rem;
    margin-bottom: 7rem;*/
    /*display: inline-block;*/
/*}*/



/*header div {
    position: absolute;
    width: calc(100% - 1rem);
    flex-direction: column;
    align-items: center;
}*/

/*header div h1, */
footer {
    font-style: italic;
    font-weight: normal;
    color: rgb(227, 249, 253);
    text-shadow: 1px 1px 1px #055b6c,1px 2px 5px #14b2d27d,-1px 2px 5px #14b2d287,6px 6px 8px #14b2d27d;
    font-size: 1.0rem;
}

footer div {
    text-align: center;
}
/*header div h1 {   
    margin: 1rem 0;
    user-select: none;
}*/





body {
    margin: 0;
    border-style: solid;
    border-color: rgb(55, 211, 243) #14b2d2 rgb(10, 145, 173) rgb(12, 181, 216);
    border-width: 0.5rem;
    /*color: white;*/
    color: #002325;
    background: linear-gradient(180deg, #0dc5ec 0%, #21A1CA 100%);
}

main div img {
    width: 100%;
    box-sizing: border-box;
    box-shadow: 0px 2px 2px 2px #003331;
    min-height: 72vw;
}

main .doc-body {
    padding: 2rem;
    max-width: 47rem;
    margin: auto;
}

main .doc-body h1, main .doc-body h2, main .doc-body h3, div.table-cont div, footer {
    text-shadow: 1px 1px 1px #003331,1px 2px 5px #003331,-1px 2px 5px #003331,6px 6px 8px #003331;
    color: rgb(227, 249, 253);
    color: white;
}

main .doc-body h2, main .doc-body h3, div.table-cont div {
    /*    text-shadow: 1px 1px 1px #003331,1px 2px 5px #003331,-1px 2px 5px #003331,6px 6px 8px #003331;
color: rgb(227, 249, 253);*/
    font-size: 2rem;
    font-weight: bold;
}

div.table-cont div {
    margin: 0.9rem 0;
}

div.table-cont div:nth-child(1) {
    /*background-color: red;*/
    width: 11rem;
}

div.table-cont div:nth-child(2) {
    /*background-color: purple;*/
    width: 17rem;
}


.flex-center, footer {    
    display: flex;
    justify-content: center;
}

.underline {
    border-bottom: 0.05rem solid whitesmoke;
    padding: 0 6rem;
    line-height: 4rem;
    margin-top: 4rem;
}

main div.doc-body div.table-cont {
    display: flex;
    justify-content: space-evenly;
}

footer {
    margin-top: 4rem;
    padding: 1rem;
}


/*html {
  position: relative;
  min-height: 100%;
}*/

