﻿.pagenav {
}

    .pagenav .title {
        background-color: #239EBC;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        padding: 25px 30px;
        color: #fff;
        font-size: 24px;
        font-weight: 600;
        text-transform: uppercase;
    }

    .pagenav ul {
        list-style-type: none;
        padding-left: 0;
    }



    .pagenav > ul {
        background-size: cover;
        background-image: url('/img/navbg.png');
        background-color: rgba(0,0,0,0.35);
        padding-bottom: 16px;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }

    .pagenav a,
    .pagenav a:hover {
        color: #fff;
        text-decoration: none;
        display: block;
    }

    .pagenav > ul > li {
        background-color: rgba(0,0,0,0.85);
        margin-bottom: 8px;
        font-size: 20px;
        color: #fff;
    }

        .pagenav > ul > li > a {
            padding-top: 10px;
            padding-bottom: 10px;
            padding-left: 2rem;
            padding-right: 2rem;
        }

        .pagenav > ul > li:not(.current) li {
            display: none;
        }

        .pagenav > ul > li.current {
            background-color: rgba(103, 204, 37, 0.8);
        }

        .pagenav > ul > li.current > ul {
            padding-top: 8px;
            padding-bottom: 16px;
            background-color: rgba(35, 158, 188, 0.8);
        }

            .pagenav > ul > li > ul > li > a {
                padding-top: 3px;
                padding-bottom: 3px;
                padding-left: 4rem;
                padding-right: 2rem;
            }

                .pagenav > ul > li > ul > li.current > a,
                .pagenav > ul > li > ul > li.current > a:hover {
                    background-color: #D3ECF2;
                    color: #000;
                }