.theme-light {
    --color-primary: rgb(186, 186, 186);
    --color-secondary: rgb(156, 156, 156);
    --color-tertiary: rgb(156, 156, 156);
    --font-color: rgb(186, 186, 186);
    --color-switch:rgb(63, 63, 63);
    --color-text:rgb(82, 82, 82);
    --color-text2:rgb(0, 0, 0);
  }

.theme-dark {
    --color-primary: rgb(20, 20, 20);
    --color-secondary: rgb(31, 31, 31);
    --color-tertiary: rgb(31, 31, 31);
    --font-color: rgb(20, 20, 20);
    --color-switch:rgb(182, 182, 182);
    --color-text:rgb(214, 214, 214);
    --color-text2:rgb(255, 255, 255);
  }
  
a{
    cursor: url("https://cdn.discordapp.com/attachments/829638052494311444/863826163301613628/curseur2.png"),pointer;
    text-decoration:none
}

p{
    color: var(--color-text);
    cursor: url("https://cdn.discordapp.com/attachments/829638052494311444/864143302042845225/text_cursor.png"), text;
}

p2{
    color: var(--color-text2);
    cursor: url("https://cdn.discordapp.com/attachments/829638052494311444/864143302042845225/text_cursor.png"), text;
}

ul{
    cursor: url("https://cdn.discordapp.com/attachments/829638052494311444/864143302042845225/text_cursor.png"), text;
}

.logoweb{
    height:30px;
}

body{
    font-family: Arial, Helvetica, sans-serif;
    padding: 0;
    margin: 0;
    background: var(--font-color);
    cursor: url("https://cdn.discordapp.com/attachments/829638052494311444/863821443678470164/Sprite-0002.png"), default;
}

body .page .onglets{
    margin: 5px 70px;
    z-index: 2; 
}
body h1 p{
    text-align: center ;
}
/* Barre de navigation */
nav{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    position: sticky;
    top: 0;
    background: var(--color-secondary);
    padding: 10px 50px;
    z-index: 5;
}
nav .onglets{
    display: flex;
    flex-wrap: wrap;
    margin-top: 10px;
}

nav .onglets .index{
    margin-right: 50px
}

nav .onglets a{
    margin-right: 20px;
}
nav .onglets .other{
    background-color:  var(--color-secondary);
    color: rgb(255, 255, 255);
    cursor: url("https://cdn.discordapp.com/attachments/829638052494311444/863826163301613628/curseur2.png"),pointer;
}

nav .boutons button{
    padding: 13px 20px;
    color: rgb(255, 255, 255);
    border: none;
    font-size: 15px;
    cursor: pointer;
    outline: none;
    border-radius: 10%;
}

nav .boutons .switch{
    background: var(--color-switch);
    cursor: url("https://cdn.discordapp.com/attachments/829638052494311444/863826163301613628/curseur2.png"),pointer;
}

nav .boutons .discord{
    background-color: rgb(114, 137, 218);
    cursor: url("https://cdn.discordapp.com/attachments/829638052494311444/863826163301613628/curseur2.png"),pointer;
}
nav .boutons .apropos{
    background-color: rgb(114,0,0);
    margin-right: 10px;
    cursor: url("https://cdn.discordapp.com/attachments/829638052494311444/863826163301613628/curseur2.png"),pointer;
}

/* Fin de la barre de navigation */

/* Header */
header{
        text-align: center;
        background:url('./background.png');
        background-repeat:no-repeat;
        background-position: center;
        background-size: 1000px;
        font-size: 60px;
        padding: 150px;
}

.staff-team {
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	margin: auto auto auto auto;
	width: 100%;
}

.staff {
	padding: 20px 0;
    overflow-x:hidden;  
}

.staff h2 {
	margin-top: 0;
}

.staff-team > div {
	padding: 10px;
	margin: 5px;
	background-color: rgba(131, 131, 131, 0.5);
	color: white;
	text-align: center;
	transition: all ease 0.3s;
	width: 150px;
	font-size: 10px;
	z-index: 1;
    border-radius: 5%;
}

.staff-team > div:hover {
	transform: scale(1.02);
}

.staff-team h3 {
	margin-bottom: 10px;
	font-weight: 600;
}

.staff-team img {
	width: 150px;
	margin-top: 10px;
}

.ma {width: 78%; background: #f44141;}
.mb {width: 96%; background: #33af33;}
.mc {width: 98%; background: #4286f4;}

.owner,
.manager,
.admin {
	padding: 12px;
}

.owner {background-color: rgba(244, 65, 65, .5);border-radius: 10%;}
.manager {background-color: rgba(66, 134, 244, .5);border-radius: 10%;}
.admin {background-color: rgba(59, 211, 42, .5);border-radius: 10%;}

.contenu .staff .staff-team img {
    margin-right: 50px;
}

/* Fin header */
.contenu .banner{
    max-width : 100%;
    height : auto;
    display: block;
    margin: auto;
  }

/* Pied de page*/
footer{
    background-color: var(--color-secondary);
    padding: 25px 100px;
    color: rgb(131, 131, 131);
}
footer .colonnes .a{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
/* Fin pied de page*/
@media screen and (max-width: 640px){
    body .page{
        margin: 10px;
    }

    nav.onglets{
        display: none;
        padding: 10px;
    }
    nav .onglets a{
        margin-right: 10px;
        margin: 0.5px;
    }
    body .boutons{
        margin-left: 75px;
    }
    header{
        background-size: 500px 250px;
            font-size: 30px;
            padding: 10px;
            margin-left: 10px;
    }

    .staff-team {
        display: flex;
        justify-content: space-around;
        flex-wrap: wrap;
        margin: auto auto auto auto;
        width: 10%;
    }

    h1{
        font-size: 10px;
    }
    h1 .discord2{
        font-size: 10px;
    }
    .banner{
    max-width: 350px;
    
}
}