.sideNav p {
        color: #edf3ffff;
    }
    .sideNav h1 {
         color: inherit;
    }
    .sideNav h2 {
        color: inherit;
    }
    .sideNav h3 {
        color: inherit;
    }
    .sideNav h4 {
        color: inherit;
    }
    .sideNav h5 {
        color: inherit;
    }
    .sideNav h6 {
        color: inherit;
    }

    .sideNav {
        display: none;
        position: fixed;
        top: 50%;
        left: -15px;
        transform: translateY(-50%);
        transition: 0.5s;

    }
    .sideNav a {
        text-decoration: none;
    }
    .sideNav .body {
        background: rgba( 31, 31, 31, 0.55 );
        box-shadow: 5px 6px 6px rgba( 255, 255, 255, 0.37 );
        backdrop-filter: blur( 4.5px );
        -webkit-backdrop-filter: blur( 5.0px );
        border-radius: 15px;
        border: 1px solid rgba( 255, 255, 255, 0.18 );
        text-align: center;
        color: inherit;
        transition: 0.5s;
    }
    .sideNav .vertical {
        writing-mode:tb;
        white-space:nowrap;
        display:block;
        margin: 0.5rem;
        padding-left: 1.25rem;
    }
    .sideNav .vertical h6 {
        margin:1rem 0;
        color: #edf3ffff;
        font-family: 'Exo 2', sans-serif;
        font-size: 1.125rem;
        text-transform: uppercase;
        transition: 0.5s;
    }
    .sideNav:hover {
        left:-10px;
    }
    .sideNav:hover .body {
        box-shadow: 5px 6px 6px rgba( 0, 170, 243, 0.37 );
    }
    .sideNav:hover h6 {
        transform: scale(1.1);
    }
    /* LARGE TABLET / SMALL DESKTOP VIEW MIN 768px MAX 991.98px */


        @media (min-width: 576px) and (max-width: 991.98px) {
           .sideNav {
               top:5%;
               left: 50%;
               transform: translate(-50%);
           }
           .sideNav .body {
               padding: 0.5rem 1rem 0;
           }
           .sideNav .vertical {
               writing-mode:lr;
           }
           .sideNav .vertical h6 {
               font-size: 1rem;
           }
        }


    /* TABLET VIEW MIN 576px MAX 768px */

        @media (min-width: 576px) and (max-width: 767.98px) {
           .sideNav {
               top:5%;
               left: 50%;
               transform: translate(-50%);
           }
           .sideNav .body {
               padding: 0.5rem 1rem 0;
           }
           .sideNav .vertical {
               writing-mode:lr;
           }
           .sideNav .vertical h6 {
               font-size: 1rem;
           }
         }

     /* MOBILE VIEW MAX 576px */

         @media (max-width: 575.98px) {
            .sideNav {
                top:5%;
                left: 50%;
                transform: translate(-50%);
            }
            .sideNav .body {
                padding: 0.5rem 1rem 0;
            }
            .sideNav .vertical {
                writing-mode:lr;
            }
            .sideNav .vertical h6 {
                font-size: 1rem;
            }

          }