@font-face {
  font-family: "paid";
  src: url("../paid-stamp/PaidStampDemoDisplay.ttf") format("truetype");
}
body {
  margin: 0;
  background-color: rgb(0, 0, 0) !important;
}
.paid {
  font-family: paid;
}
.difficulty {
  color: #c91212;
  font-size: 30px;
  transform: rotate(20deg);
  border: 2px solid #c91212;
}

.main_role {
  border: 4px solid gold;
  border-radius: 100%;
}

.btn-control-list {
	text-align: center;
	margin-bottom: 20px;
}

.btn-control-list .btn{
	border-radius: 0;
}

.war {
  background-color: #c69b6d !important;
  background: linear-gradient(180deg, #c69b6d 0%, #222 100%);
}
.paladin {
  background-color: #f48cba !important;
  background: linear-gradient(180deg, #f48cba 0%, #222 100%);
}
.hunter {
  background-color: #aad372 !important;
  background: linear-gradient(180deg, #aad372 0%, #222 100%);
}
.rogue {
  background-color: #fff468 !important;
  background: linear-gradient(180deg, #fff468 0%, #222 100%);
}
.priest {
  background-color: #fff !important;
  background: linear-gradient(180deg, #fff 0%, #222 100%);
}
.dk {
  background-color: #c41e3b !important;
  background: linear-gradient(180deg, #c41e3b 0%, #222 100%);
}
.shaman {
  background-color: #2359ff !important;
  background: linear-gradient(180deg, #2359ff 0%, #222 100%);
}
.mage {
  background-color: #68ccef !important;
  background: linear-gradient(180deg, #68ccef 0%, #222 100%);
}
.warlock {
  background-color: #9382c9 !important;
  background: linear-gradient(180deg, #9382c9 0%, #222 100%);
}
.monk {
  background-color: #00ffba !important;
  background: linear-gradient(180deg, #00ffba 0%, #222 100%);
}
.druid {
  background-color: #ff7c0a !important;
  background: linear-gradient(180deg, #ff7c0a 0%, #222 100%);
}
.dh {
  background-color: #aa23ff !important;
  background: linear-gradient(180deg, #aa23ff 0%, #222 100%);
}
.evoker {
  background-color: #33937f !important;
  background: linear-gradient(180deg, #33937f 0%, #222 100%);
}
#selects input,
#selects select {
  border: 1px solid black;
  background-color: lightgray;
}
.form-select {
  font-weight: 700;
  text-align: center;
}
.form-select option {
  font-weight: 700;
  height: 35px;
}
.form-select .all {
  font-weight: 700;
  background-color: #000;
  color: #fff;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  margin: 0 15px 10px 15px;
  height: 35px;
  font-size: 18px;
	border-radius: 0 5px 5px 0;
}
li img {
  width: 35px;
  height: 35px;
}

.hide_hm_player ul#roster_list li:not(.mm_player) {
	display: none;
}

.boss {
  background-color: #000;
  border-radius: 50%;
  margin-right: 5px;
  width: 60px;
  height: 60px;
  display: block;
  text-align: center;
  background-size: cover;
  background-position: center;
}
.boss:hover {
  cursor: pointer;
}
.bossa-1 {
  background-image: url(../raid/faille-reve/chimerax.png);
}
.bossa-2 {
  background-image: url(../raid/fleche-vide/imperator.webp);
}
.bossa-3 {
  background-image: url(../raid/fleche-vide/vorasius.png);
}
.bossa-4 {
  background-image: url(../raid/fleche-vide/salhadaar.webp);
}
.bossa-5 {
  background-image: url(../raid/fleche-vide/dragons-duo.png);
}
.bossa-6 {
  background-image: url(../raid/fleche-vide/paladins.webp);
}
.bossa-7 {
  background-image: url(../raid/fleche-vide/crown.png);
}
.bossa-8 {
  background-image: url(../raid/fleche-vide/phoenix.png);
}
.bossa-9 {
  background-image: url(../raid/fleche-vide/lura.png);
}

.bossb-1 {
  background-image: url(../raid/faille-reve/chimerax.png);
}

.bossc-1 {
  background-image: url(../raid/tww/manaforge/boss/arcanomatrixwarden.png);
}
.bossc-2 {
  background-image: url(../raid/tww/manaforge/boss/loombeast.png);
}
.bossc-3 {
  background-image: url(../raid/tww/manaforge/boss/soulbindernaazindhri.png);
}
.bossc-4 {
  background-image: url(../raid/tww/manaforge/boss/highmanaforgeraraz.png);
}
.bossc-5 {
  background-image: url(../raid/tww/manaforge/boss/thesoulhunters.png);
}
.bossc-6 {
  background-image: url(../raid/tww/manaforge/boss/fractillus.png);
}
.bossc-7 {
  background-image: url(../raid/tww/manaforge/boss/nexuskingsalhadaar.png);
}
.bossc-8 {
  background-image: url(../raid/tww/manaforge/boss/dimensius.png);
}

.boss.kill:after {
  content: url(../icons/croixrouge.png);
  width: 60px;
  height: 60px;
  margin-left: -30px;
  position: absolute;
}

.flexCenter {
  display: flex;
  justify-content: center;
  align-items: center;
}

#ajout {
  max-width: 1000px;
  margin: 20px auto;
}

.icon-tank {
  background-image: url("../icons/tank.jpg");
}

#roster {
  background-image: url("../fond/fleche-vide.png");
  background-color: lightblue;
  background-size: cover;
  border: 1px solid #000;
  max-width: 1000px;
  margin: auto;
  color: #fff;
}

#roster.fleche-vide {
  background-image: url("../fond/fleche-vide.png");
}

#roster.faille-reve {
  background-image: url("../fond/faille-reve.png");
}

#roster.custom {
  background-image: url("../fond/custom.jpg");
}

#roster input {
  color: #fff;
  font-size: 22px;
  width: 350px;
}
.roster-header {
  padding: 1rem;
}
.roster-body .background-opac {
  border-radius: 10px;
  padding: 1rem;
}
.roster-body .col {
  margin: 0 1rem;
}
.roster-body .col:nth-child(2) {
  margin: 0;
}
.roster-body ul {
  padding: 0;
  margin: 0;
}
.roster-body ul li img:hover {
  cursor: not-allowed;
  opacity: 0.5;
}
.roster-body ul li span {
  padding-left: 5px;
  width: 100%;
}
.roster-body ul li span.rl {
  background-image: url("../icons/icons-rl.png");
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  width: 50px;
}
.roster-body ul li span.among {
  background-image: url("../icons/amongus.png");
  height: 25px;
  background-size: contain;
  background-repeat: no-repeat;
  width: 50px;
}
.roster-body ul li span.horloge {
  background-image: url("../icons/horloge.png");
  height: 25px;
  background-size: contain;
  background-repeat: no-repeat;
  width: 50px;
}
.roster-body ul li span.new_player {
  background-image: url("../icons/new.png");
  height: 35px;
  background-size: contain;
  background-repeat: no-repeat;
	background-position: center;
  width: 50px;
	margin-right: 5px;
}
.roster-body ul li span.hm_player {
  width: 50px;
	margin-right: 5px;
	font-weight: bold;
  font-size: 15px;
}
#roster li {
	display: flex;
	align-items: center;
}

#roster li span:hover {
  opacity: 0.5;
  cursor: crosshair;
}
.background-opac {
  background-color: rgba(0, 0, 0, 0.6);
}
#export-btn,
#reset-btn,
#buttonajout {
  color: #fff;
}
.flexColumn {
  display: flex;
}
#listRoster {
  height: 100vh;
  overflow-y: scroll;
  flex: 1;
  border-right: 1px solid #fff;
}
#listRoster li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #fff;
}
#listRoster li .classnom i {
  padding-left: 10px;
}
#listRoster li.mm_player .classnom i:before {
  content: url(../icons/mythic_icon.png);
  vertical-align: middle;
}
#listRoster li span {
  display: flex;
  justify-content: space-between;
  align-items: center;
	line-height: 35px;
}
#listRoster li span i {
  padding-left: 5px;
}
#listRoster li.mm_player span i {
	line-height: 35px;
  height: 35px;
}
#listRoster span img {
  margin: 0;
  padding: 0;
}
#listRoster li .imgroles img:hover {
  opacity: 0.5;
  cursor: crosshair;
}
#compo {
  flex: 3;
}

.opacityli {
  opacity: 0.3;
}