@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap');

* {
    margin: 0;
    padding: 0;
    user-select: none;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}

:root {
    --yellow-color: #ffc947;
    /*--black-color: #1b1b1b;*/
    --bleu-color: #2874A6;
    --white-color: #fff;
}

nav {
    background: var(--bleu-color);
}

    nav:after {
        content: '';
        clear: both;
        display: table;
    }

    nav .logo {
        float: left;
        color: var(--white-color);
        font-size: 15px;
        font-weight: 600;
        line-height: 70px;
        padding-left: 40px;
    }

    nav ul {
        float: left;
        margin-left: 35px;
        list-style: none;
        position: relative;
    }

        nav ul li {
            float: left;
            display: inline-block;
            background: var(--bleu-color);
            margin: 0 5px;
        }
            nav ul li a {
                color: var(--white-color);
                line-height: 70px;
                text-decoration: none;
                font-size: 18px;
                padding: 8px 15px;
                transition: 0.3s all ease;
            }

                nav ul li a:hover {
                    color: var(--yellow-color);
                    border-radius: 5px;
                    box-shadow: 0 0 5px var(--yellow-color), 0 0 10px var(--yellow-color);
                }

        nav ul ul li a:hover {
            box-shadow: none;
        }

        nav ul ul {
            position: absolute;
            top: 90px;
            z-index: 100;
            border-top: 3px solid var(--yellow-color);
            opacity: 0;
            visibility: hidden;
            transition: top .3s;
        }

            nav ul ul ul {
                border-top: none;
            }

        nav ul li:hover > ul {
            top: 70px;
            opacity: 1;
            visibility: visible;
        }

        nav ul ul li {
            position: relative;
            margin: 0px;
            width: 290px;
            float: none;
            display: list-item;
            border-bottom: 1px solid rgba(0,0,0,0.3);
        }

            nav ul ul li a {
                line-height: 50px;
            }

        nav ul ul ul li {
            position: relative;
            top: -60px;
            left: 110px;
        }

.show, .icon, input {
    display: none;
}

.fa-plus {
    font-size: 15px;
    margin-left: 40px;
}

.content_s {
    position: relative;
}

    .content_s::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-image: url('images/bg.jpg');
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        width: 100%;
        height: calc(100vh - 70px);
    }

    .content_s::after {
        /*content: '';*/
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: calc(100vh - 70px);
        background-color: rgba(0,0,0,.50);
    }

@media all and (max-width:968px) {
    nav ul {
        margin-right: 0px;
        float: left;
    }

    nav .logo {
        padding-left: 30px;
        width: 100%;
    }

    .show + a, ul {
        display: none;
    }

    nav ul li, nav ul ul li {
        display: block;
        width: 100%;
    }

        nav ul li a:hover {
            box-shadow: none;
        }

    .show {
        display: block;
        color: var(--white-color);
        font-size: 18px;
        padding: 0 12px;
        line-height: 70px;
        cursor: pointer;
    }

        .show:hover {
            color: var(--yellow-color);
        }

    .icon {
        display: block;
        color: var(--white-color);
        position: absolute;
        top: 0;
        right: 40px;
        line-height: 70px;
        cursor: pointer;
        font-size: 25px;
    }

    nav ul ul {
        top: 70px;
        border-top: 0px;
        float: none;
        position: static;
        display: none;
        opacity: 1;
        visibility: visible;
    }

        nav ul ul a {
            padding-left: 40px;
        }

        nav ul ul ul a {
            padding-left: 80px;
        }

        nav ul ul ul li {
            position: static;
        }

    [id^=btn]:checked + ul {
        display: block;
    }

    nav ul ul li {
        border-bottom: 0px;
    }

    span.cancel:before {
        content: '\f00d';
    }
}