/* Réinitialisation des styles */
body, h1, h2, h3, p, ul, ol, li, figure, figcaption, blockquote, dl, dd {
    margin: 0;
    padding: 0;
}

body {
    font-family: 'Montserrat', sans-serif;
    color: black;
    background-color: #ebebeb;
}

/* HEADER */
nav {
    position: relative;
    background-color: white;
    height: 75px;
    width: 100%;
    border-bottom: 1px solid #060a82;
}

nav ul {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

nav ul li {
    padding: 0 20px;
}

nav a {
    text-decoration: none;
    color: black;
    letter-spacing: 1px;
}

nav a:hover {
    font-weight: bold;
}

/* ACCUEIL */
#fond_ldc {
    width: 100%;
    height: auto;
}

#citation1_index {
    width: 100%;
    height: 250px;
    margin-top:-5px;
    padding-top:75px;
    text-align:center;
}

#p1 {
    width: 75%;
    font-size:30px;
    margin: 0 auto;
}

#p2 {
    font-size:20px;
    margin-top: 25px;
}

#a_decouvrir {
    width: 100%;
}

#a_decouvrir h1 {
    margin: 0 auto;
    text-align: center;
}

#section1 {
    display: flex;
    align-items: start;
    justify-content: space-around;
    height: 760px;
}

.partie_film {
    margin-top: 50px;
    height: 550px;
    width: 40%;
    padding: 20px; /* Ajout de padding pour l'espace intérieur */
    text-align: center; /* Centrage du contenu */
}

.partie_film h2{
margin: 25px 0;
}

.partie_film a {
    padding: 12.5px 30px;
    border-radius: 50px;
    text-decoration: none;
    color: black;
    box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.3);
}

.partie_film a:hover {
    background-color: #aaaaaa;
    color: white;
}

.resume_film {
    width: 90%;
    margin: 0 auto;
    height: 190px;
}

.coupure_film {
    margin-top: 50px;
    width: 2px; /* Largeur de la coupure */
    height: 350px; /* Hauteur de la coupure */
    background-color: black;
}

.partie_film img {
    max-height: 309px;
    max-width: 550px;
    object-fit: cover;
}


/* LISTING */
#titre_listing {
    text-align: center;
}

#img_bnr_listing {
    width: 100%;
    object-fit: cover;
    margin-bottom: 2.5%;
    border-bottom: solid 1px #060a82;
}

#div_bouton_retour_accueil {
    text-align: center;
    margin: 3.5% 0 2% 0;
}

#bouton_retour_accueil {
    padding: 12.5px 30px;
    border-radius: 50px;
    text-decoration: none;
    color: black;
    box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.3);
}

#bouton_retour_accueil:hover {
    background-color: rgb(221, 221, 221);
}

main {
    width: 100%;
    margin: 0 auto;
}

.main_listing {
    padding-bottom: 5%;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    width: 90%;
}

.main_listing .bloc_joueur {
    margin: 1.5% 0;
    width: 28%;
    height: 325px;
    background-color: rgb(224, 224, 224);
    border-radius: 20px;
    display: flex;
    color: white;
    box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.3);
}

.img_joueur {
    position: relative;
    object-fit: cover;
    width: 47.5%;
    height: 325px;
    border-right: solid 1px;
    border-radius: 20px 0 0 20px;
}

.info_joueur {
    display: flex;
    flex-direction: column;
    color: white;
}

.bloc_joueur .bloc_info_joueur {
    background-image: url("../images/ldc.jpg");
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 500px 325px;
    width: 52.5%;
    border-radius: 0 20px 20px 0;
}

.bloc_info_joueur h2 {
    margin-top:15px;
    font-size: 20px;
    text-align: center;
}

.info_joueur img {
    height: 50px;
    width: auto;
    margin: 15px auto -5px auto;
}

.info_joueur ul {
    list-style: none;
    padding: 0;
    margin-left: 15px;
}

.info_joueur li {
    padding: 5px 0;
}

.div_listing {
    margin: 50px auto 0 auto;
}

#hasard_liste {
    margin: 30px auto 0 auto;
}

/* FORM RECHERCHE */
.main_form_recherche form {
    text-align: center;
    padding-top: 3%;
}

.main_form_recherche label {
    font-size: 25px;
}

.main_form_recherche input {
    width: 75%;
    height: 30px;
    margin: 30px auto;
    font-size: 25px;
}

#main_table1, #main_gestion2 {
    height: auto;
    margin-bottom:75px;
}

#drapeau_gestion1{
    height: 15px;
    width:auto;
}

#photo_gestion1, #logo_gestion2 {
    height: 75px;
    width:auto;
}

#rep_rech_txt {
    text-align:center;
    font-size:25px;
    margin-top: 3%;
}

#separation {
    height: 1px;
    width: 80%;
    margin-left:10%;
    background-color: black;
}

#random_p_joueurs {
    text-align:center;
    font-size: 20px;
    margin-top: 4%;
}

/* FOOTER */
footer {
    height: 40px;
    background-color: white;
    border-top: 1px solid black;
    position: fixed;
    bottom: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

@media screen and (max-width: 1420px) {
    .resume_film {
        width: 90%;
        margin: 0 auto;
        height: 205px;
    }
    #section1 {
        display: flex;
        align-items: start;
        justify-content: space-around;
        height: 775px;
    }
}

@media screen and (max-width: 1350px) {
    #img_rmcsport {
        width: 100%;
        object-fit: cover;
    }
}


@media screen and (min-width: 1200px) {
    .main_listing .bloc_joueur {
        margin: 1.5% 0;
        width: 28%;
        height: 325px;
        background-color: rgb(224, 224, 224);
        border-radius: 20px;
        display: flex;
        color: white;
        box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.3);
    }
  }
  @media screen and (max-width: 1199px) {
    .main_listing .bloc_joueur {
        margin: 1.5% 0;
        width: 40%;
        height: 325px;
        background-color: rgb(224, 224, 224);
        border-radius: 20px;
        display: flex;
        color: white;
        box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.3);
    }
  }
  @media screen and (max-width: 875px) {
    .main_listing .bloc_joueur {
        width: 51%;
    } 
    .main_listing {
        margin-top:30px;
    }
}

@media screen and (max-width: 650px) {
    .main_listing .bloc_joueur {
        width: 65%;
    } 
}

  @media screen and (max-width: 500px) {
    .resume_film {
        height: 260px;
    }

    .resume_rmc {
        height: 125px;
    }

    .coupure_film {
        display:none;
    }

    #p1 {
        font-size: 20px;
    }
    
    #p2 {
        font-size: 16px;
    }
    #a_decouvrir {
        margin-top:25px;
}

        .partie_film {
        flex-direction: column; /* Réorganise le contenu en colonne */
        align-items: center; /* Centre les éléments horizontalement */

    }

    #section1 {
        display: flex;
        align-items: start;
        flex-direction: column;
        width: 100%;
        height: 1350px;
    }

    .partie_film img {
        max-height: 249px;
        max-width: 490px;
        object-fit: cover;
    }

    .partie_film {
        width: 90%;
        height: 550px;
        margin-top:-50px;
    }

    #partie_film_rmc {
        height: 450px;
        margin-top:-100px;
    }

    .main_listing .bloc_joueur {
        width: 75%;
    } 
    #rep_rech_txt {
        text-align:center;
        font-size:20px;
        margin-top: 3%;
    }
    nav a {
        text-decoration: none;
        color: black;
        font-size:10px;
    }
  }

  @media screen and (max-width: 475px) {
    .partie_film img {
        max-height: 230px;
        max-width: 445px;
        object-fit: cover;

  }}

  @media screen and (max-width: 445px) {
    .partie_film img {
        max-height: 215px;
        max-width: 445px;
        object-fit: cover;

  }}

  @media screen and (max-width: 430px) {
    .main_listing .bloc_joueur {
        width: 85%;
    } 
    #titre_listing {
        font-size:20px;
        margin-bottom:25px;

    }
    .partie_film img {
        max-height: 219px;
        max-width: 460px;
        object-fit: cover;
    }

    .partie_film {
        height: 600px;
    }

    #partie_film_rmc {
        height: 550px;
    }

    .resume_film {
        height:275px ;
    }

    .resume_rmc {
        height: 175px;
    }

    #a_decouvrir h1 {
        font-size:27px;
    }

  }

  @media screen and (max-width: 415px) {
    .partie_film img {
        max-height: 210px;
        max-width: 445px;
        object-fit: cover;
    }
  }

  @media screen and (max-width: 410px) {
    .partie_film img {
        max-height: 180px;
        max-width: 445px;
        object-fit: cover;
    }}