/*
Theme Name: Femis
Theme URI: https://umazuma.com
Author: Yann Gibert
Author URI:https://umazuma.com
Description: thème A Chacun son Box basé sur Bootstrap 5
Version: 1.0.0
License: MIT
License URI: https://opensource.org/licenses/MIT
Text Domain: femis
*/
/* Google fonts */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@100;400&display=swap');

/** ---------------------------------------------------------- */
/** HEADER
/** ---------------------------------------------------------- */

body {
    font-family: 'Lato', sans-serif;
    font-weight: 400;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Lato', sans-serif;
    font-weight: 700;
}

header {
    background: url('/wp-content/themes/femis/assets/img/bg-strip.png'), url('/wp-content/themes/femis/assets/img/home.jpg');
    background-size: auto, cover;
    height: 300px;
    background-position: top;
}

.site-title {
    margin: 2rem 0;
}

#main {
    display: flex;
    min-height: calc(100vh - 470px);
}

#content {
    /*min-height: calc(100vh - 232px);
    padding-bottom: 5rem;*/
}

/** ---------------------------------------------------------- */
/** MENU
/** ---------------------------------------------------------- */

a[href="#open-menu"] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    font-size: 2rem;
    color: #fff;
    border: 1px solid #fff;
    width: 3rem;
    text-align: center;
    background: #ffffff51;
    display: none;
    z-index: 250;
}
.logout {
    color: #ffffffb1;
    margin-top: 2rem;
    display: block;
    text-decoration: none;
    font-size: 1.2rem;
}

nav {
    background: #436498ff;;
}

sup {
    text-transform: lowercase;
}

.menu-item-0 {
    border-right: 1px solid #fff;
    transition: all .4s;
    position: relative;
}

.menu-item-0:first-of-type {
    border-left: 1px solid #fff;
}

.menu-item-0 a {
    padding: 1rem;
    color: #fff;
    font-family: 'Lato', sans-serif;
    font-size: .85rem;
    font-weight: 700;
    text-transform: uppercase;
    display: block;
    text-decoration: none;
    width: 100%;
}

.menu-item-0:hover {
    background: #7c9ac9;;
}

.menu-item-0:hover a {
    color: #284161;
}

.menu-item-0.active {
    background: #284161;
}

.list-films {
    background: #284161;
    min-height: calc(100vh - 470px);
    position: relative;
    height: 100%;
}

.sub-menu {
    list-style: none;
    padding: 50px 0;
    margin: 0;
    position: relative;
}

.sub-menu li {
    display: block;
}

.sub-menu li a, .no-href {
    color: #fff8;
}

.sub-menu li.active > a {
    color: #ffff;
}

.sub-menu small {
    font-size: 63%;
    color: #ffffff66;
    padding-left: 0.4rem;
}

.menu-item-1 a, .menu-item-bis a, .sub-menu li .no-href{
    padding: 1rem .8rem 0;
    font-family: 'Lato', sans-serif;
    font-size: 1.0rem;
    font-weight: 700;
    text-transform: uppercase;
    display: block;
    text-decoration: none;
    width: 100%;
}

.menu-item-bis a {
    font-size: 1.5rem;
}

.menu-item-2 a, .sub-menu li li .no-href  {
    padding: .7rem;
    font-family: 'Lato', sans-serif;
    font-size: .85rem;
    font-weight: 700;
    text-transform: uppercase;
    display: block;
    text-decoration: none;
    width: 100%;
}

.no-href {
    color: #ffffff44;
}

.sub-menu li li a, .sub-menu li li .no-href{
    min-height: .5rem;
    margin-bottom: 0;
    padding: inherit;
}

.sub-menu > li {
    position: relative;
    height: inherit;
}

.sub-menu li ul {
    position: relative;
}

.el-vid {
    margin-bottom: 1rem;
}

/** ---------------------------------------------------------- */
/** LOGIN
/** ---------------------------------------------------------- */

.login-forms {
    color: #fff;
    max-width: 768px;
    width:50%;
    margin: 5rem auto;
    padding: 2rem;
    border-radius: 0;
    background: #436498ff;
}

.form-lost-pw {
    display: none;
}

.form-login input, .form-lost-pw input  {
    background: #fff;
    border-radius: 0;
    border: 0;
    width: 300px;
    margin: auto;
}

form .btn.btn-primary {
    border: 0;
    background: #5e80b6;
    margin: auto;
    display: block;
    width: 300px;
    border-radius: 0;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 700;
    padding: 12px;
}

.pw-oublie-annule{
   color: #b4cff6;
}


/** ---------------------------------------------------------- */
/** VIDEO
/** ---------------------------------------------------------- */
.player iframe {
    height: calc(100vh - 340px);
    /*width: calc((100vh - 340px) * 1.7778);*/
}

.card img {
    aspect-ratio: 16/9;
}

/** ---------------------------------------------------------- */
/** FOOTER
/** ---------------------------------------------------------- */
@media (max-width: 769px) {
    #site-footer {
        position: fixed;
        bottom: 0;
        width: 100%;
        padding: .1rem !important;
    }
    a[href="#open-menu"] {
        display: block;
    }
    nav {
        background: #436498ff;
        position: absolute;
        top: 4.4rem;
        right: 0;
        width: 100vw;
        left: 0;
        z-index: 100;
    }
    nav ul.nav{
        display: none;
    }
    .menu-item-0 {
        border: 0 !important;
        transition: all .4s;
        position: relative;
        width: 100%;
    }

    .sub-menu {
        max-height: 200px;
        overflow: scroll;
        padding:0;
        top: -8rem;
        min-height: auto;
        box-shadow: inset 0 0 12px rgba(0,0,0,1);
    }

}