/* cmsms stylesheet: 1-Design modified: jeudi 31 juillet 2025 22:27:43 */
@font-face {
    font-family: "opensans";
    src: url(https://eralliance-auberdine.fr/uploads/_interface/polices/OpenSans.woff2) format('woff2');
}

html
{
    width: 100%;
    margin: 0;
    padding: 0;
}

body
{
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    z-index: auto;
    font-family: "opensans", arial;
    color: white;
    background-color: black;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond-2.jpg);
    background-attachment: fixed;
    background-size: 100% auto;
    overflow-x: hidden;
}

@media screen and (max-width: 765px)
{
body
{
    background-color: black;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-attachment: fixed;
    overflow-x: hidden;
}
}


legend
{
    color: #238C7C;
    font-weight: bold;
    text-align: left;
    text-transform: uppercase;
}

fieldset
{
    border-radius: 5px;
}

.sous-legend
{
    color: grey;
    font-weight: bold;
    text-align: left;
    text-transform: uppercase;
    font-size: 80%;
}

h1, h2, h3
{
    color: #238C7C;
    text-transform: uppercase;
    font-family: "Trebuchet MS";
    
}

h4
{
    color: white;
}

input[type="text"], input[type="email"], input[type="date"], input[type="tel"], input[type="password"], select
{
    width: 100%;
    max-width: 300px;
    height: 30px;
    border: 1px solid black;
    font-weight: bold;
}

input[type="text"]
{
    width: 97%;
}

input[type='checkbox'] {
  appearance: none;
  width: 20px;
  height: 20px;
  background-color: #d1d3d1;
  border: 1px solid #fff;
  cursor: pointer;
  position: relative;
  border-radius: 4px;
}

input[type='checkbox']:checked {
  background-color: #238C7C;
  border-color: #238C7C;
}

input[type='checkbox']:checked::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 6px;
  width: 4px;
  height: 8px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

input[type="number"]
{
    width: 100%;
    max-width: 50px;
    height: 30px;
    border: 1px solid black;
    font-weight: bold;
}

select[multiple]
{
    height: 138px;
    font-weight: bold;
}

#pseudo
{
    text-transform: capitalize;
}

a
{
    color: white;
    text-decoration: none;
    transition: 200ms ease-out;
    font-weight: bold;
}

a:hover
{
    color: #238C7C;
    text-decoration: none;
    transition: 200ms ease-out;
}

a.active
{
    padding: 5px;
    font-size: 20px;
    border: 1px solid white;
}

/* Classe */
.Chasseur
{
    color: #aad372;
}

.Back-Chasseur
{
    background-color: #aad372;
    color: white;
}

.Demoniste, .Démoniste
{
    color: #8788ee;
}

.Back-Demoniste
{
    background-color: #8788ee;
    color: white;
}

.Druide
{
    color: #ff7c0a;
}

.Back-Druide
{
    background-color: #ff7c0a;
    color: white;
}

.Guerrier, .Tank
{
    color: #c69b6d;
}

.Back-Guerrier, .Tank
{
    background-color: #c69b6d;
    color: white;
}

.Mage
{
    color: #3fc7eb;
}

.Back-Mage
{
    background-color: #3fc7eb;
    color: white;
}

.Paladin
{
    color: #f48cba;
}

.Back-Paladin
{
    background-color: #f48cba;
    color: white;
}

.Pretre
{
    color: #ffffff;
}

.Back-Pretre
{
    background-color: #ffffff;
    color: black;
}

.Voleur
{
    color: #fff468;
}

.Back-Voleur
{
    background-color: #fff468;
    color: black;
}

.Desenchanteur
{
    color: #131CE5;
}

/* Background des classes */
.ChasseurB
{
    background-color: #aad372;
}

.DemonisteB, .DémonisteB
{
    background-color: #8788ee;
}

.DruideB
{
    background-color: #ff7c0a;
}

.GuerrierB
{
    background-color: #c69b6d;
}

.MageB
{
    background-color: #3fc7eb;
}

.PaladinB
{
    background-color: #f48cba;
}

.PretreB
{
    background-color: #ffffff;
}

.VoleurB
{
    background-color: #fff468;
}
/* Background des classes */


/* Classe */

/* Priorité */
.Basse
{
    color: #95a5a6;    
}

.Moyenne
{
    color: #bfedd2;    
}

.Haute
{
    color: #3598db;    
}

.Top
{
    color: #b96ad9;    
}

.message-flottant {
    position: fixed;
    top: 5%;
    left: 50%;
    transform: translateX(-50%);
    background-color: #000;
    color: white;
    padding: 12px 24px;
    border-radius: 6px;
    font-weight: bold;
    box-shadow: 0 0 10px rgba(0,0,0,0.3);
    z-index: 15;
    opacity: 1;
    transition: opacity 0.3s ease;
}
.message-flottant.erreur {
    background-color: #f44336;
}

.message-flottant.valide {
    background-color: #238C7C;
}

/* Priorité */

.retour
{
    position: absolute;
    padding-top: 15px;
    left: 5%;
    transition: 400ms;
    opacity: 1;
}

.retour:hover
{
    transition: 400ms;
    opacity: 0.7;
    transform: scale(1.05);
}

@media screen and (max-width: 765px)
{
.retour
{
    position: relative;
}
}

.bleu
{
    color: #33C4FF;
    font-weight: bold;
}

.rouge
{
    color: red;
    font-weight: bold;
}

.orange
{
    color: orange;
    font-weight: bold;
}

.violet
{
    color: purple;
}

.vert
{
    color: green;
    font-weight: bold;
}

.vert_era
{
    color: #238C7C;
}

.left
{
    text-align: left;
}

.center
{
    text-align: center;
}

.right
{
    text-align: right;
}

.strong
{
    font-weight: bold;
}

.information {
    background: #238C7C url(https://eralliance-auberdine.fr/uploads/_interface/images/info.png) 10px 50% no-repeat;
    border: 1px solid #058dc7;
    width: auto;
    padding: 5px 5px 5px 40px;
    margin: auto;
    margin-top: 5px;
    margin-bottom: 5px;
    display: inline-block;
    font-size: 90%;
}

.warning
{
    background: #faf6d4 url(https://eralliance-auberdine.fr/uploads/_interface/images/warning.gif) 10px 50% no-repeat;
    border: 1px solid #058dc7;
    width: auto;
    padding: 5px 5px 5px 40px;
    margin: auto;
    margin-top: 5px;
    margin-bottom: 5px;
    display: inline-block;
    font-size: 90%;
    color: red;
    font-weight: bold;
}

.bouton
{
    min-width: 100px;
    min-height: 30px;
    background-color: #238C7C;
    border: 1px solid #238C7C;
    color: white!important;
    transition: 200ms;
}

.bouton:hover
{
    min-width: 100px;
    min-height: 30px;
    background-color: #004d41;
    border: 1px solid #004d41;
    color: white;
    transition: 200ms;
}

.bouton-image
{
    background-color: transparent;
    border: none;
}

.ligne:nth-child(odd)
{
    background-color: rgb(42,41,41,0.3);
    transition: all 200ms ease-in;
}

.ligne:nth-child(odd):hover
{
    background-color: #2a2929;
    transition: all 200ms ease-out;
}

.ligne:nth-child(even)
{
    background-color: transparent;
    transition: all 200ms ease-in;
}

.ligne:nth-child(even):hover
{
    background-color: #2a2929;
    transition: all 200ms ease-out;
}

.ligne-grise
{
    background-color: #2a2929;
}

::-webkit-scrollbar {
  width: 5px;
  height: 3px;
}

::-webkit-scrollbar-track {
  background: #eee;
}

::-webkit-scrollbar-thumb {
  background: #238C7C;
}

::-webkit-scrollbar-thumb:hover {
  background: #238C7C;
}


.label
{
    width: 40%!important;
    text-align: left;
}

.input
{
    width: 60%;
    text-align: left;
}

.table-block
{
    display: table;
    width: 100%;
}

.table-block .icone
{
    display: table-cell;
    width: 10%;
    vertical-align: middle;
}

.table-block .titre
{
    display: table-cell;
    width: 80%;
    padding-left: 5px;
    vertical-align: middle;
}

.table-block .fermer
{
    display: table-cell;
    width: 10%;
    vertical-align: middle;
    text-align: right;
}

#header
{
    display: flex;
    flex-wrap: nowrap;
    text-align: center;
    align-items: center;
}

#header .gauche, #header .milieu, #header .droite
{
    width: 33%;
}

#header img
{
    max-width: 100px;
    max-height: auto;
}

@media screen and (max-width: 765px)
{
#header h1, #header h3
{
    font-size: 90%;
}    
    
#header img
{
    max-width: 50px;
    display: inline-block;
    vertical-align: top;
}
    
#header .gauche, #header .milieu
{
    width: 48%;
    display: inline-block;
    vertical-align: top;
}

#header .droite
{
    width: 95%;
    margin: auto;
}
}

#menu-responsive-show, #menu-responsive-hide
{
    display: none;
    width: 40px;
    margin-left: 5px;
}

#menu
{
    height: 35px;
    padding-top: 5px;
    background-color: rgb(42,41,41,1);
    position: sticky;
    top: 0;
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
    border-radius: 5px;
    font-size: 90%;
}

#menu .lien-actif
{
    background-color: #238C7C;
    padding-left: 15px;
    padding-right: 15px;
    border-radius: 5px;
}

#menu .liens
{
    width: 100%;
    margin: auto;
}

#menu .home
{
    width: 1%;
    min-width: 25px;
    display: inline-block;
    white-space: nowrap;
    position: relative;
}

#menu .lien
{
    margin-left: 10px;
    margin-right: 10px;
    display: inline-block;
    position: relative;
    z-index: auto;
    
}

#menu .lien .sous-liens
{
    display: none;
}

#menu .lien:hover .sous-liens
{
    display: block;
    min-width: 200px;
    position: absolute;
    padding: 10px;
    padding-left: 30px;
    background-color: rgb(42,41,41,1);
    text-align: left;
}

#menu .lien:hover .sous-liens ul
{
    padding-left: 0; 
}

#menu .lien:hover .sous-liens ul li
{
    line-height: 2;
}

@media screen and (max-width: 765px)
{
#menu-responsive-show
{
    width: 40px;
    margin-left: 5px;
    display: inline-block;
    vertical-align: top;
}

#menu
{
    max-height: 35px;
    text-align: left;
    padding-left: 10px;
    position: sticky;
    top: 0;
    z-index: 15;
}

#menu .liens
{
    position: relative;
    display: none;
    width: 60%;
    padding-left: 15px;
    margin: 0;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    border: 1px solid white;
    border-radius: 5px;
    text-align: left;
    z-index: 15!important;
}    
    

#menu .lien-actif
{
    background-color: #238C7C;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 0;
    padding-right: 0;
    border-radius: 5px;
}

#menu .lien
{
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-top: 10px;
    padding-bottom: 10px;
}
}

#contenu
{
    width: 95%;
    margin: auto;
    min-height: 500px;
    text-align: center;
}

/* Accueil */
#accueil
{
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    margin-top: 15px;
}

#accueil .gauche
{
    width: 20%;
}

#accueil .milieu
{
    width: 60%;
}

#accueil .droite
{
    width: 20%;
}

/* Annonces */
#accueil .annonces
{
    text-align: left;
}

#accueil .annonces .articles
{
    margin-bottom: 10px;
}

#accueil .annonces .articles .infos
{
    padding: 2px;
    background-color: #238C7C;
    border-radius: 5px;
}
/* Annonces */

/* Guides */
#accueil .guides
{
    text-align: left;
}

#accueil .guides .articles
{
    margin-bottom: 10px;
}


#accueil .guides .infos
{
    padding: 2px;
    background-color: #238C7C;
    border-radius: 5px;
}
/* Guides */

/* Avancée */
#accueil .avancee 
{
    text-align: left;
}
/* Avancée */

#accueil .worldbuff img
{
    max-width: 25px;
}

#accueil .presentation .image, #accueil .presentation .texte
{
    display: block;
    width: 100%;
    vertical-align: top;
}

#accueil .presentation .image
{
    padding-top: 15px;
}

#accueil .presentation .image img
{
    width: 100%;
    object-fit: cover;
    border-radius: 5px;
    
}

#accueil .presentation .texte
{
    padding: 15px;
    text-align: left;
}


/* Nos besoins */
#accueil .besoins
{
    text-align: left;
}

#accueil .besoins .icone
{
    display: table-cell;
    width: 5%;
    min-width: 30px;
    vertical-align: middle;
}

#accueil .besoins .composant
{
    display: table-cell;
    width: 95%;
    vertical-align: middle;
}

#accueil .besoins img
{
    width: 25px;
    height: 25px;
}
/* Nos besoins */

/* Raids */
#accueil .raids
{
    text-align: left;
}

#accueil .raids .raid
{
    margin-bottom: 10px;
}

#accueil .raids .infos
{
    padding: 2px;
    background-color: #238C7C;
    border-radius: 5px;
}
/* Raids */

/* Tombola */
#accueil #tombola-infos
{
    display: none;
    width: 80%;
    max-height: 350px;
    overflow: auto;
    padding: 30px;
    position: absolute;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: left;
    border: 1px solid white;
    border-radius: 5px;
}


@media screen and (max-width: 765px)
{
#accueil
{
    display: block;
    flex-wrap: nowrap;
    gap: none;
    margin-top: 15px;
}

#accueil .gauche
{
    width: 100%;
    display: block;
}

#accueil .milieu
{
    width: 100%;
    display: block;
}

#accueil .droite
{
    width: 100%;
    display: block;
}


#accueil .presentation .texte
{
    padding: 0px;
    text-align: left;
}
}

/* Accueil */



/* guides */
/* Categories */
#guides .categories
{
    width: 15%;
    display: inline-block;
    vertical-align: top;
    position: sticky;
    top: 50px;
    z-index: 5;
}

#guides .categories .block
{
    width: 100%;
    display: table;
}

#guides .categories .block .icone
{
    display: table-cell;
    width: 30%;
    vertical-align: middle;
}

#guides .categories .block .icone img
{
    max-width: 100%;
    max-width: 50px;
}

#guides .categories .block .categorie
{
    display: table-cell;
    width: 70%;
    vertical-align: middle;
    text-align: left;
}

#guides .categories .block .categorie.active
{
    background-color: #004d41;
    border-radius: 5px;
}

/* Categories */

/* Sommaire */
#guides .sommaire
{
    width: 78%;
    display: inline-block;
    vertical-align: top;
    text-align: left;
}

#guides .sommaire .articles
{
    text-align: left;
}

#guides .sommaire .image
{
    width: 20%;
    display: inline-block;
    vertical-align: top;
    text-align: center;
}

#guides .sommaire .image img
{
    max-width: 100%;
    max-width: 150px;
}

#guides .sommaire .contenu
{
    width: 78%;
    padding-left: 1%;
    display: inline-block;
    vertical-align: top;
}

#guides .sommaire .infos
{
    margin-top: 1%;
    padding-left: 1%;
    background-color: #238C7C;
    border-radius: 5px;
}

#guides .sommaire .infos a:hover
{
    color: white;
    text-decoration: underline;
}

/* Sommaire */

/* Détails */
#guides .details
{
    width: 80%;
    margin: auto;
}

#guides .details .infos
{
    margin-top: 1%;
    margin-bottom: 1%;
    padding-left: 1%;
    background-color: #238C7C;
    border-radius: 5px;
}

#guides .details .image img
{
    max-width: 100%;
    max-height: 300px;
}

#guides .details .contenu
{
    text-align: justify;
}

#guides .details .contenu a
{
    color: #238C7C;
    font-weight: bold;
    transition: 400ms;
}

#guides .details .contenu a:hover
{
    text-decoration: underline;
    transition: 400ms;
}

#guides .details .contenu img
{
    margin: 5px;
    max-width: 100%;
    max-height: auto;
}

/* Détails */

@media screen and (max-width: 765px)
{
#guides .categories
{
    width: 100%;
    position: sticky;
    top: 50px;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    z-index: 5;
}

#guides .categories .block
{
    width: 14%;
    display: inline-block;
    text-align: center;
}

#guides .categories .block .icone
{
    display: block;
    width: 100%;
}

#guides .categories .block .icone img
{
    max-width: 100%;
    max-width: 35px;
}

#guides .categories .block .categorie
{
    display: none;
}

#craft .block-droite
{
    width: 100%;
}

/* Sommaire */
#guides .sommaire
{
    width: 100%;
}

#guides .sommaire .articles
{
    text-align: left;
}

#guides .sommaire .image
{
    width: 100%;
    text-align: center;
}

#guides .sommaire .image img
{
    max-width: 100%;
    max-height: 175px; 
}

#guides .sommaire .contenu
{
    width: 100%;
    padding-left: 0%;
    display: inline-block;
    vertical-align: top;
}

#guides .sommaire .infos
{
    margin-top: 1%;
    padding-left: 1%;
    background-color: #238C7C;
    border-radius: 5px;
}

#guides .sommaire .infos a:hover
{
    color: white;
    text-decoration: underline;
}

/* Sommaire */

/* Détails */
#guides .details
{
    width: 80%;
    margin: auto;
}

#guides .details .infos
{
    margin-top: 1%;
    margin-bottom: 1%;
    padding-left: 1%;
    background-color: #238C7C;
    border-radius: 5px;
}

#guides .details .contenu
{
    text-align: justify;
}

#guides .details .contenu img
{
    margin: 5px;
}

/* Détails */
}


/* Proposition des articles  */
#gestion-articles .infos, #gestion-articles .photos
{
    width: 45%;
    min-height: 200px;
    display: inline-block;
    vertical-align: top;
}


#gestion-articles .photos img
{
    max-height: 100px;
}

#gestion-articles .contenu
{
    width: 80%;
    margin: auto;
}


/* Proposition des articles  */

/* guides */

/* Attribution des loots */
#attribution_loot .recherche .block
{
    width: 40%;
    display: inline-block;
    vertical-align: top;
}


#attribution_loot .choix-raid,  #attribution_loot .choix-boss, #attribution_loot .choix-joueur, #attribution_loot .apercu
{
    width: 48.5%;
    display: inline-block;
    vertical-align: top;
}


@media screen and (max-width: 765px)
{
#attribution_loot .recherche .block
{
    width: 100%;
}    
    
#attribution_loot .choix-raid,  #attribution_loot .choix-boss, #attribution_loot .choix-joueur, #attribution_loot .apercu
{
    width: 100%;
}


#attribution_loot .historique table thead {
display: none;
}

#attribution_loot .historique table tr{
display: block;
margin-bottom: 40px;
}

#attribution_loot .historique table td {
display: block;
text-align: right;
}

#attribution_loot .historique table td:before {
content: attr(data-label);
float: left;
font-weight: bold;
}

}

/* Attribution des loots */

/* WorldBuff */
table
{
    width: 100%;
    border-collapse: collapse;
    overflow-x: auto;
}

table tr
{
    line-height: 20px;
    border-bottom: 1px solid rgb(255,255,255,0.3);
}


/* World-buff */
#worldbuff .wb-contenu
{
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
}

#worldbuff .gauche
{
    width: 67%;
}

#worldbuff .droite
{
    width: 33%;
}

/* Ajout */
#worldbuff .ajout-wb
{
    width: 50%;
    display: table-cell;
    vertical-align: top;
}

#site 
{
  display: none !important;
}
/* Ajout */

#worldbuff .recompense-wb
{
    width: 50%;
    display: table-cell;
    vertical-align: top;
}


#worldbuff .recompense-wb .recompenses .block
{
    width: 100%;
    padding-top: 5px;
    padding-bottom: 5px;
}

#worldbuff .recompense-wb .recompenses .icone
{
    display: table-cell;
    width: 10%;
    vertical-align: middle;
}

#worldbuff .recompense-wb .recompenses .icone .wb-info
{
    visibility: hidden;
    position: absolute;
    z-index: -1;
}

#worldbuff .recompense-wb .recompenses .icone:hover .wb-info
{
    visibility: visible;
    position: absolute;
    z-index: 1;
}

#worldbuff .recompense-wb .recompenses .recompense
{
    display: table-cell;
    width: 80%;
    padding-left: 15px;
    vertical-align: middle;
    text-align: left;
}

#worldbuff .recompense-wb .recompenses .disponible
{
    display: table-cell;
    width: 10%;
    vertical-align: middle;
    text-align: center;
}

#worldbuff .recompense-wb .recompenses .recompense img
{
    visibility: hidden;
    position: absolute;
    z-index: -1;
}

#worldbuff .recompense-wb .recompenses .recompense li:hover img
{
    visibility: visible;
    position: absolute;
    z-index: 1;
}
/* Récompenses */

/* Prochaines poses */
#worldbuff .prochaines-poses
{
    width: 100%;
}
/* Prochaines poses */

/* Calendrier des poses */
#worldbuff  .calendrier-discord
{
    width: 100%;
    display: table;
}

#worldbuff  .calendrier-discord .block
{
    width: 50%;
    display: table-cell;
    vertical-align: middle;
}

#worldbuff  .calendrier-discord .block img
{
    max-width: 35px;
}

.calendrier-affichage
{
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.calendrier-affichage .sur-block
{
    width: 80%;
    max-height: 700px;
    overflow: auto;
    padding: 30px;
    position: absolute;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    top: 25%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: center;
    border: 1px solid white;
    border-radius: 5px;
}
/* Calendrier des poses */

/* Informations sur les poses */
#worldbuff .info-pose
{
    width: 100%;
    display: block;
    text-align: justify;
    text-align-last: left;
    position: sticky;
    top: 35px;
    z-index: 5;
}

#worldbuff .info-pose li
{
    color: #238C7C;
    font-weight: bold;
}
/* Informations sur les poses */

/* Liste */
#worldbuff .liste-wb
{
    width: 100%;
}
/* Liste */

/* Fiche */
#worldbuff .fiche
{
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

#worldbuff .fiche .sur-block
{
    width: 50%;
    min-width: 300px;
    max-width: 380px;
    min-height: 250px;
    padding: 30px;
    position: absolute;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    top: 15%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: center;
    border: 1px solid white;
    border-radius: 5px;
}

#worldbuff .fiche .sur-block input[type='date']
{
    max-width: 100px;
}
/* Fiche */

@media screen and (max-width: 1366px)
{
#worldbuff .info-pose fieldset
{
    max-height: 550px;
    overflow: auto;
}
}

@media screen and (max-width: 765px)
{
#worldbuff .wb-contenu
{
    display: block;
    flex-wrap: nowrap;
    gap: 0;
}

#worldbuff .gauche
{
    width: 100%;
}

#worldbuff .droite
{
    width: 100%;
}

/* Ajout */
#worldbuff .ajout-wb
{
    width: 100%;
    display: block;
    vertical-align: top;
}

#site 
{
  display: none !important;
}
/* Ajout */

#worldbuff .recompense-wb
{
    width: 100%;
    display: block;
    vertical-align: top;
}

#worldbuff .recompense-wb .information
{
    display: none;
}

#worldbuff .recompense-wb .recompenses .recompense
{
    padding-left: 5px;
    font-size: 85%;
}
/* Récompenses */

/* Prochaines poses */
#worldbuff .prochaines-poses
{
    width: 100%;
    display: block;
}
/* Prochaines poses */

/* Calendrier des poses */
.calendrier
{
    width: 100%;
    display: block;
    vertical-align: middle;
}

.calendrier-affichage .sur-block
{
    top: 10%;
}
/* Calendrier des poses */

/* Informations sur les poses */
#worldbuff .info-pose
{
    width: 100%;
    display: block;
    text-align: justify;
    text-align-last: left;
}

#worldbuff .info-pose fieldset
{
    max-height: none;
    overflow: none;
}

/* Informations sur les poses */

/* Liste */
#worldbuff .liste-wb
{
    width: 100%;
}

#worldbuff .liste-wb thead
{
    display: none;
}

#worldbuff .liste-wb tbody,#worldbuff .liste-wb th, #worldbuff .liste-wb td, #worldbuff .liste-wb tr
{
    display: block;
    width: 100%;
}

#worldbuff .liste-wb td
{
    position: relative;
    border: none;
}


#worldbuff .liste-wb fieldset
{
    max-height: 300px;
    overflow: auto;
}
/* Liste */

/* Fiche */
#worldbuff .fiche .sur-block
{
    top: 12%;
}
/* Fiche */
}

/* WorldBuff */


/* Craft */
.alchimie
{
    color: #f48cba;
}

.couture
{
    color: #ffffff;
}

.enchantement
{
    color: #3fc7eb;
}

.forge
{
    color: #c69b6d;
    font-weight: bold;
}

.tdc
{
    color: #ff7c0a;
    font-weight: bold;
}

.ombre
{
    color: #66276e;
    font-weight: bold;
}

.feu
{
    color: #721414;
    font-weight: bold;
}

.givre
{
    color: #6365ba;
    font-weight: bold;
}

.nature
{
    color: #0e5200;
    font-weight: bold;
}


.inhabituel, .Inhabituel
{
    color: #1eff00 !important;
    font-weight: bold;
}

.rare, .Rare
{
    color: #0070dd !important;
    font-weight: bold;
}

.epique, .Epique
{
    color: #a335ee !important;
    font-weight: bold;
}

.artefact, .Legendaire
{
    color: #ff8000 !important;
    font-weight: bold;
}

.Eralliance
{
    color: #238C7C;
}

.Dissidence
{
    color: #933d55;
}


/* Qui craft quoi */
#craft .metiers
{
    width: 15%;
    display: inline-block;
    vertical-align: top;
    position: sticky;
    top: 50px;
    z-index: 5;
}

#craft .metiers .block
{
    width: 100%;
    display: table;
}

#craft .metiers .block .icone
{
    display: table-cell;
    width: 30%;
    vertical-align: middle;
}

#craft .metiers .block .icone img
{
    max-width: 100%;
    max-width: 50px;
}

#craft .metiers .block .metier
{
    display: table-cell;
    width: 70%;
    vertical-align: middle;
    text-align: left;
}

#craft .metiers .block .metier.active
{
    background-color: #004d41;
    border-radius: 5px;
}

#craft .block-droite
{
    width: 75%;
    display: inline-block;
    vertical-align: top;
}

#craft .block-droite .manquant
{
    width: 70%;
    display: table-cell;
    vertical-align: top;
}


#craft .liste li:nth-child(odd)
{
    background-color: rgb(42,41,41,0.8);
}

@media screen and (max-width: 765px)
{
    #craft .metiers
{
    width: 100%;
    position: sticky;
    top: 50px;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    z-index: 5;
}

#craft .metiers .block
{
    width: 14%;
    display: inline-block;
    text-align: center;
}

#craft .metiers .block .icone
{
    display: block;
    width: 100%;
}

#craft .metiers .block .icone img
{
    max-width: 100%;
    max-width: 35px;
}

#craft .metiers .block .metier
{
    display: none;
}

#craft .block-droite
{
    width: 100%;
}

#craft .block-droite .manquant
{
    width: 100%;
    display: block;
    vertical-align: top;
}

#craft .block-droite .table-responsive, #craft .block-droite .table-responsive thead, #craft .block-droite .table-responsive tbody, #craft .block-droite .table-responsive th, #craft .block-droite .table-responsive td, .table-responsive tr
{
    display: block;
    width: 100%;
}

#craft .block-droite .table-responsive td
{
    position: relative;
    border: none;
}

#craft .liste li:nth-child(odd)
{
    background-color: rgb(42,41,41,0.8);
}

#craft .block-droite .liste-objet-ajout
{
    font-size: 80%;
}

#craft .block-droite .liste-objet
{
    max-width: 350px;
    border: 1px solid red;
    font-size: 75%;
}

#craft .block-droite .liste th:nth-child(3), #craft .block-droite .liste td:nth-child(3)
{
    display: none;
}

}
/* Qui craft quoi */



/* Nos besoins */
#nos-besoins .ajout table
{
    width: 48%;
    display: inline-block;
    vertical-align: top;
}


#nos-besoins .block
{
    width: 30%;
    display: inline-block;
    vertical-align: top;
}

#nos-besoins .block .icone
{
    width: 15%;
    display: inline-block;
    vertical-align: top;
}

#nos-besoins .block .info
{
    width: 83%;
    min-height: 200px;
    display: inline-block;
    vertical-align: top;
    text-align: left;
}

#nos-besoins .block .icone img
{
    max-width: 50px;
    max-height: 50px;
}



@media screen and (max-width: 765px)
{
#nos-besoins .ajout table
{
    width: 100%;
    display: inline-block;
    vertical-align: top;
    font-size: 70%;
}


#nos-besoins .block
{
    width: 95%;
    margin: auto;
}

#nos-besoins .block .icone
{
    width: 15%;
    display: inline-block;
    vertical-align: top;
}

#nos-besoins .block .info
{
    width: 83%;
    min-height: 200px;
    display: inline-block;
    vertical-align: top;
    text-align: left;
}

}
/* Nos besoins */

/* Compte */
/* Menu */
#compte .compte-menu
{
    width: 255px;
    display: inline-block;
    vertical-align: top;
    text-align: left;
}

#compte .compte-menu div
{
    margin-bottom: 5px;
}

#compte .compte-menu .active
{
    background-color: #004d41;
    border-radius: 5px;
}

/* Menu */

#compte .compte-contenu
{
    width: 78.5%;
    display: inline-block;
    vertical-align: top;
}

@media screen and (max-width: 765px)
{
#compte .compte-menu
{
    width: 100%;
}

#compte .compte-contenu
{
    width: 100%;
}

#compte .gestion-articles
{
    font-size: 70%;
}
}
/* Compte */

/* Liste des personnages */
#raideurs table td
{
    text-align: left;
}

#raideurs .qte table td
{
    text-align: center;
}

#raideurs .personnage
{
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

#raideurs .personnage .guilde
{
    display: table-cell;
    width: 5%;
    padding-left: 5px;
    padding-right: 5px;
    vertical-align: middle;
    text-align: center;
}

#raideurs .personnage .icone
{
    display: table-cell;
    width: 5%;
    vertical-align: middle;
    text-align: center;
}

#raideurs .personnage .pseudo
{
    display: table-cell;
    width: 30%;
    padding-left: 10px;
    vertical-align: middle;
}

#raideurs .personnage .role
{
    display: table-cell;
    width: 15%;
    vertical-align: middle;
}

#raideurs .personnage .participation
{
    display: table-cell;
    width: 15%;
    vertical-align: middle;
}


#raideurs .resistances
{
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

#raideurs .resistances div
{
    width: 24%;
    margin-top: 5px;
    margin-bottom: 5px;
    display: inline-block;
    vertical-align: top;
}

#raideurs .acces
{
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

#raideurs .acces div
{
    width: 24%;
    margin-top: 15px;
    margin-bottom: 15px;
    display: inline-block;
    vertical-align: top;
}


#raideurs .participation
{
    display: table-cell;
    width: 15%;
    vertical-align: middle;
    text-align: left;
}

#raideurs .objet
{
    display: table-cell;
    width: 15%;
    vertical-align: middle;
    text-align: left;
}
/* Liste des personnages */

/* Mes personnages */
#mes-personnages .liste .block
{
    width: 25%;
    min-width: 270px;
    min-height: 250px;
    display: inline-block;
    margin: 15px;
    padding: 5px;
    border: 1px solid white;
    border-radius: 5px;
}

#mes-personnages .liste .block .pseudo
{
    text-transform: uppercase;
}


#mes-personnages caption
{
    font-weight: bold;
    color: #238C7C;
}

#mes-personnages .liste .block .resistance img, #mes-personnages .fiche .sur-block .resistances img
{
    max-width: 25px;
}

#mes-personnages .liste .block .acces, #mes-personnages .fiche .acces
{
    padding-left: 15px;
    text-align: left;
}

#mes-personnages .fiche
{
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

#mes-personnages .fiche .sur-block
{
    width: 50%;
    min-width: 300px;
    max-width: 350px;
    height: 50%;
    min-height: 600px;
    padding: 15px;
    position: absolute;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: center;
    border: 1px solid white;
    border-radius: 5px;
}


#mes-personnages .fiche .sur-block .boutons
{
    display: table;
    width: 100%;
}

#mes-personnages .fiche .sur-block .boutons div
{
    width: 50%;
    padding-top: 15px;
    display: table-cell;
    text-align: center;
    vertical-align: bottom;
}


@media screen and (max-width: 765px)
{
#mes-personnages .fiche .sur-block
{
    width: 50%;
    min-width: 300px;
    max-width: 350px;
    height: 50%;
    min-height: 550px;
    padding: 15px;
    position: absolute;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    top: 50%;
    left: 45%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: center;
    border: 1px solid white;
    border-radius: 5px;
}
}
/* Mes personnages */


/* Demande de confirmation */
#confirmation-dialogue
{
    display: none;
    position: fixed;
    padding: 15px;
    min-width: 300px;
    min-height: 100px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    text-align: center;
    border: 1px solid white;
    border-radius: 5px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}


#confirmation-dialogue #confirmation-message
{
    width: 100%;
    margin-bottom: 15px;
}

#confirmation-dialogue .boutons button
{
    padding: 15px;
    cursor: pointer;
    margin-left: 15px;
    margin-right: 15px;
}

#confirmation-dialogue .boutons button:hover
{
    opacity: 0.9;
    transform: scale(1.05)
}

#btn-confirmer {
    background-color: #238C7C;
    color: white;
}

#btn-annuler {
    background-color: #f44336;
    color: white;
}
/* Demande de confirmation */


/* Règlements */
.reglements
{
    width: 80%;
    margin: auto;
    text-align: justify;
    text-align-last: left;
}

.reglements img
{
    max-width: 100%;
}
/* Règlements */

/* Footer */
#footer
{
    min-height: 55px;
    margin-top: 1%;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
    border-top: 1px solid rgb(255,255,255,0.3);
    background-color: rgb(42,41,41,0.7);
}

#footer img
{
    max-width: 50px;
}

#footer .block
{
    width: 30%;
    display: inline-block;
    vertical-align: top;
}

#footer .gauche
{
    padding-top: 10px;
}

#footer .milieu
{
    padding-top: 25px;
}

.gestion-cookies
{
    text-align: right;
}


@media screen and (max-width: 765px)
{
    #footer .block
    {
    width: 95%;
    display: inline-block;
}
}

/* Footer */

/* Captcha */
.grecaptcha-badge
{
    top: 90%;
}
/* Captcha */

/* Calendrier */
.fc-unthemed td.fc-today
{
    background-color: rgb(35,140,124,0.8)!important;
}

/* Calendrier */


/* Gestion des guildes */
#gestion-guildes .menu .block
{
    width: 15%;
    min-width: 150px;
    display: inline-block;
    vertical-align: top;
}

/* Banque */
#banques
{
    display: block;
}

/* Haut */
#banques .haut
{
    text-align: right;
}

#banques .options
{
    width: 33%;
    margin: 0;
    display: inline-block;
    vertical-align: bottom;
}
/* Haut */

/* Filtre */
#banques .filtre .option div
{
    display: inline-block;
    vertical-align: top;
}


#banques .filtre 
{
    width: 10%;
    min-width: 150px;
    display: inline-block;
    vertical-align: top;
    position: sticky;
    top: 50px;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    z-index: 5;
}

#banques .filtre .block
{
    width: 100%;
    display: table;
}

#banques .filtre .block .icone
{
    width: 20%;
    display: table-cell;
    vertical-align: middle;
}

#banques .filtre .block .type-objet
{
    width: 80%;
    display: table-cell;
    vertical-align: middle;
    text-align: left;
    padding-left: 10px;
}

#banques .filtre .active
{
    background-color: #238C7C;
    border-radius: 5px;
    transition: 400ms;    
}
/* Filtre */

/* Liste */
#banques .bas img
{
    max-width: 30px;
}

#banques .liste
{
    width: 89%;
    margin-left: 0.5%;
    display: inline-block;
    vertical-align: top;
}

#banques .liste table
{
    font-size: 85%;
}

#banques .liste .commentaire
{
    width: 230px;
}
/* Liste */

/* Panier */
#panier .panier-liste
{
    width: 100%!important;
    max-height: 100px;
    overflow: auto;
    font-size: 80%;
    text-align: left;
}

#panier .panier-liste img
{
    max-height: 15px;
}
/* Panier */

/* Infos banques */
#infos-banque
{
    display: none;
    width: 80%;
    max-height: 400px;
    overflow: auto;
    padding: 30px;
    position: absolute;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: left;
    border: 1px solid white;
    border-radius: 5px;
}

/* Ajout nouvel objet */
#banques .ajout
{
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

#banques .ajout .sur-block
{
    width: 80%;
    min-width: 300px;
    max-width: 380px;
    min-height: 250px;
    padding: 30px;
    position: absolute;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: center;
    border: 1px solid white;
    border-radius: 5px;
}
/* Ajout nouvel objet */

#banques .liste-icone fieldset
{
    max-height: 150px;
    overflow: auto;
}
#banques .liste-icone .icone {
    width: 32px;
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
}
#banques .liste-icone [type=radio]:checked + img {
  border: 2px solid #f00;
}

@media screen and (max-width: 1650px)
{
#banques .filtre 
{
    width: 10%;
    min-width: 80px;
    font-size: 80%;
}

#banques .liste
{
    width: 90%;
    margin-left: 0%;
    font-size: 80%;
}
}


@media screen and (max-width: 1536px)
{
#banques .filtre 
{
    width: 10%;
    min-width: 80px;
    font-size: 80%;
}

#banques .liste
{
    width: 90%;
    margin-left: 0%;
    font-size: 80%;
}
}


@media screen and (max-width: 1366px)
{
#banques .liste
{
    width: 86%;
    margin-left: 1%;
}

#banques .liste .commentaire
{
    width: 150px;
}
}

@media screen and (max-width: 765px)
{
/* Haut */
#banques .options
{
    width: 100%;
}
/* Haut */

/* Filtre */
#banques .filtre 
{
    width: 100%;
    top: 50px;
}

#banques .filtre .block
{
    width: 35px;
    display: inline-block;
    vertical-align: top;
}

#banques .filtre .block .icone
{
    width: 100%;
    display: block;
}

#banques .filtre .block .type-objet
{
    display: none;
}

/* Filtre */

/* Liste */
#banques .liste
{
    width: 100%;
    margin-left: 0.5%;
    display: inline-block;
    vertical-align: top;
}

#banques .liste table thead
{
    display: none;
}

#banques .liste table,#banques .liste table tbody, #banques .liste table th, #banques .liste table td, #banques .liste table tr
{
    display: block;
    width: 100%;
    text-align: left;
}

#banques .liste table td
{
    position: relative;
    border: none;
}

#banques .liste table
{
    font-size: 85%;
}

#banques .liste .commentaire
{
    width: 230px;
}
/* Liste */

/* Ajout nouvel objet */
#banques .ajout
{
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

#banques .ajout .sur-block
{
    width: 80%;
    min-width: 300px;
    max-width: 380px;
    min-height: 250px;
    padding: 30px;
    position: absolute;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: center;
    border: 1px solid white;
    border-radius: 5px;
}
/* Ajout nouvel objet */

#banques .liste-icone fieldset
{
    max-height: 150px;
    overflow: auto;
}
#banques .liste-icone .icone {
    width: 32px;
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
}
#banques .liste-icone [type=radio]:checked + img {
  border: 2px solid #f00;
}
}
/* Banque */

/* Gestion des guildes */

/* Starterpack */
#starterpack .ajout, #starterpack .historique
{
    width: 48%;
    display: inline-block;
    vertical-align: top;
}
/* Starterpack */

/* Gestion des raids */
#debuff .block
{
    width: 48.5%;
    display: inline-block;
    vertical-align: top;
}

@media screen and (max-width: 765px)
{
#debuff .block
{
    width: 100%;
    display: inline-block;
    vertical-align: top;
}
}

#debuff .discord
{
    max-width: 1024px;
    margin: auto;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-attachment: fixed;
    overflow-x: hidden;
}

#debuff .discord .table
{
    width: 48.5%;
    display: inline-block;
    vertical-align: top;
    font-size: 100%;
}

#debuff .discord img
{
    width: 20px;
}

/* Gestion des raids */

/* Besoin loot */

#besoin_loot .gauche, #besoin_loot .droite
{
    width: 48%;
    display: inline-block;
    vertical-align: top;
}

/* Besoin loot */

/*  Liste des raids*/
#raid .liste
{
    text-align: left;
}

#raid .raid-block
{
    width: 25%;
    min-width: 395px;
    display: inline-block;
    margin: 0;
    text-align: center;
    vertical-align: top;
}

#raid .raid-block select
{
    width: 150px;
}

#raid .raid-block table
{
    width: 100%;
    text-align: left;
}

#raid .raid-block .raid-infos
{
    display: inline-block;
    width: 48%;
    vertical-align: top;
}

#raid .raid-block .raid-infos .icone-bouton
{
    position: absolute;
}

#raid .raid-block .raid-infos .icone-bouton div
{
    margin-bottom: 15px;
}

#raid .raid-block .raid-infos .icone-bouton img
{
    max-width: 25px;
}

#raid .raid-block .raid-effectifs
{
    display: inline-block;
    width: 48%;
    vertical-align: top;
}

#raid .raid-block .joueurs
{
    width: 100%;
    text-align: left;
    margin: 0;
    padding: 0;
}

#raid .raid-block .joueurs .ligne-joueurs
{
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
}

#raid .raid-block .joueurs .block-joueurs
{
    width: 33%;
    font-size: 80%;
    border: 1px solid rgba(255,255,255,0.3);
}

#raid .raid-block .joueurs .block-joueurs .logo-reroll
{
    width: 10px;
    height: 10px;
}

#raid .raid-block .joueurs .block-joueurs .icone
{
    text-align: center;
}

#raid .raid-block .joueurs .block-joueurs .icone img
{
    max-width: 20px;
}

#raid .raid-block .raid-effectifs .block-joueurs .joueur
{
    text-align: left;
}

@media screen and (max-width: 765px)
{
#raid .raid-block .raid-effectifs
{
    font-size: 90%;
}

#raid .raid-block .joueurs
{
    text-align: center;
}

#raid .raid-block .joueurs .block-joueurs
{
    width: 31%;
    margin: 2px;
    display: inline-block;
    vertical-align: top;
    font-size: 70%;
    border: 1px solid rgba(255,255,255,0.3);
}

#raid .raid-block .joueurs .block-joueurs .icone
{
    width: 18px!important;
    text-align: center;
}

#raid .raid-block .joueurs .block-joueurs .icone img
{
    max-width: 15px;
}

#raid .raid-block .block-joueurs .joueur
{
    text-align: left;
}
}

/*  Liste des raids*/

/* Inscription aux raids */
#raid .joueurs
{
    width: 15%;
    min-width: 250px;
    max-height: 600px;
    overflow: auto;
    display: inline-block;
    vertical-align: top;
    margin: 0;
}

#raid #joueurs-liste .joueur
{
    font-size: 80%;
}

#raid .joueurs .joueur
{
    display: table;
    width: 100%;
    vertical-align: middle;
}

#raid #joueurs-liste .icone, #raid .matrice .icone
{
    display: table-cell;
    width: 5%;
    min-width: 40px;
    vertical-align: middle;
}

#raid .icone img
{
    max-width: 25px;
}

#raid .pseudo
{
    display: table-cell;
    width: 90%;
    vertical-align: middle;
    text-align: left;
}

#raid .option
{
    display: table-cell;
    width: 25px;
    vertical-align: middle;
}

#raid .suppression
{
    display: table-cell;
    width: 5%;
    vertical-align: middle;
}

#raid .matrice
{
    width: 65%;
    display: inline-block;
    vertical-align: top;
    margin: 0;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-attachment: fixed;
}


#raid .matrice .groupe
{
    width: 20%;
    margin: 0.5%;
    display: inline-block;
    vertical-align: top;
}

#raid .matrice .groupe table td
{
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    height: 40px;
    border: 1px solid rgb(255, 255, 255, 0.3);
}

#raid .matrice .status_non_present
{
    background-color: rgba(255,153,153,0.3);
}


/* Inscrire un nouveau joueur */
#raid .inscrire
{
    width: 15%;
    display: inline-block;
    vertical-align: top;
    margin: 0;
}
/* Inscrire un nouveau joueur */


/* Menu statut */
.menu-statut {
  background-color: rgb(42,41,41,1);
  border: 1px solid #ccc;
  border-radius: 5px;
  padding-left: 15px;
  box-shadow: 2px 2px 8px rgba(0,0,0,0.2);
  width: 160px;
}
.menu-statut li {
  padding: 3px;
  cursor: pointer;
  text-align: left;
}
.menu-statut div:hover {
  background: #f0f0f0;
}
/* Menu statut */
/* Inscription aux raids */


/* Annonces */
/* Sommaire */
#annonces .sommaire
{
    width: 78%;
    display: inline-block;
    vertical-align: top;
}

#annonces .sommaire .articles
{
    text-align: left;
}

#annonces .sommaire .image
{
    width: 20%;
    display: inline-block;
    vertical-align: top;
    text-align: center;
}

#annonces .sommaire .image img
{
    max-width: 100%;
    max-width: 150px;
}

#annonces .sommaire .contenu
{
    width: 78%;
    padding-left: 1%;
    display: inline-block;
    vertical-align: top;
}

#annonces .sommaire .infos
{
    margin-top: 1%;
    padding-left: 1%;
    background-color: #238C7C;
    border-radius: 5px;
}

#annonces .sommaire .infos a:hover
{
    color: white;
    text-decoration: underline;
}

/* Sommaire */

/* Détails */
#annonces .details
{
    width: 80%;
    margin: auto;
}

#annonces .details .infos
{
    margin-top: 1%;
    margin-bottom: 1%;
    padding-left: 1%;
    background-color: #238C7C;
    border-radius: 5px;
}

#annonces .details .image img
{
    max-width: 100%;
    max-height: 300px;
}

#annonces .details .contenu
{
    text-align: justify;
}

#annonces .details .contenu a
{
    color: #238C7C;
    font-weight: bold;
    transition: 400ms;
}

#annonces .details .contenu a:hover
{
    text-decoration: underline;
    transition: 400ms;
}

#annonces .details .contenu img
{
    margin: 5px;
    max-width: 100%;
    max-height: auto;
}

/* Détails */



/* Gestion raids */
#gestion-raid .banc-remplacant, #gestion-raid .banc-absence
{
    width: 50%;
    height: 500px;
    overflow-y: auto;
    display: inline-block;
    vertical-align: top;
}

@media screen and (max-width: 765px)
{
#gestion-raid table thead {
display: none;
}

#gestion-raid table tr{
display: block;
margin-bottom: 40px;
}

#gestion-raid table td {
display: block;
text-align: right;
}

#gestion-raid table td:before {
content: attr(data-label);
float: left;
font-weight: bold;
}
    
    
#gestion-raid .banc-remplacant, #gestion-raid .banc-absence
{
    width: 95%;
    margin: auto;
    font-size: 80%;
}
}

/* Gestion des macros */

#gestion-raid .options .block
{
    width: 48%;
    display: inline-block;
    vertical-align: top;
}

#gestion-raid .macro input[type="text"], .macro #gestion-raid select
{
    max-width: 125px;
}

#gestion-raid .macro .creation
{
    width: 50%;
    display: inline-block;
    vertical-align: top;
}

#gestion-raid .macro .affichage
{
    width: 48%;
    display: inline-block;
    vertical-align: top;
}

#gestion-raid .macro .affichage img
{
    width: 100%;
    max-width: 600px;
}

#gestion-raid .macro .affichage div
{
    text-align: left;
}

#gestion-raid .macro .affichage .macro-affichage
{
    width: 48.5%;
    display: inline-block;
    vertical-align: top;
}

/* Affichage pour Dicord */
#discord
{
    max-width: 925px;
    padding: 15px;
    margin: auto;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-position: fixed;
    overflow: none;
}

#macro-discord .block
{
    width: 48.5%;
    max-width: 450px;
    display: inline-block;
    vertical-align: top;
    text-align: left;
}

#macro-discord .block
{
    width: 48.5%;
    max-width: 450px;
    display: inline-block;
    vertical-align: top;
    text-align: left;
}

#macro-discord .block4k
{
    width: 100%;
    max-width: 900px;
    display: inline-block;
    vertical-align: top;
    text-align: center;
}


/* Affichage pour Dicord */

@media screen and (max-width: 765px)
{
#gestion-raid .macro .creation
{
    width: 100%;
}

#gestion-raid .macro .affichage
{
    width: 100%;
}

#gestion-raid .macro .affichage .macro-affichage
{
    width: 100%;
}

}
/* Gestion des macros */

/* Gestion raids */


/* Tombola */

#tombola .ajout .block
{
    width: 45%;
    display: inline-block;
    margin: 0;
}

#tombola .liste-icone
{
    width: 100%;
    max-height: 150px;
    overflow: auto;
}


#tombola .liste-icone .icone {
    width: 32px;
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
}

#tombola .liste-icone .icone img
{
    max-width: 30px;
}

#tombola .liste-icone [type=radio]:checked + img {
  border: 2px solid #f00;
}

#tombola #participants
{
    display: block;
    width: 300px;
    max-height: 400px;
    overflow: auto;
    padding: 30px;
    position: absolute;
    background-image:  url(https://eralliance-auberdine.fr/uploads/_interface/images/fond.jpg);
    background-size: cover;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: left;
    border: 1px solid white;
    border-radius: 5px;
}
/* Tombola */