.scrollToTop {
	background: #168BD2;
	color: white;
	position: fixed;
	z-index: 4000;
	bottom: 143px;
	right: 20px;
	border-radius: 2px;
	padding: 9px 10px;
	cursor: pointer;
	display: block;
	font-size: 18px;
}

.scrollToDown {
	background: #168BD2;
	color: white;
	position: fixed;
	z-index: 4000;
	bottom: 100px;
	right: 20px;
	border-radius: 2px;
	padding: 9px 10px;
	cursor: pointer;
	display: block;
	font-size: 18px;
}

#avatarheader {
	cursor: pointer;
	float: right;
	position: relative;
	border-radius: 50%;
	right: -10px;
	bottom: 11px;
}

#avatarheader:hover {
	opacity:0.6;
}

.haut {
	background: rgb(36,36,36);
	width: 100%;
	float: right;
	box-shadow: 0px 1px 1px 1px rgb(0,0,0,0.3);
	position: fixed;
	height: 70px;
	z-index: 1000;
	text-align: left;
}

.headerlist {
	width: 100%;
	text-align: left;
	border-bottom: 2px solid #168BD2;
	background: #FFF none repeat scroll 0% 0%;
	font-size: 15px;
}

.headerlist ul {
	display: inline;
	text-align: right;
	color: #168BD2;
	position: relative;
	text-decoration: none;
}

.headerlist ul li {
	display: inline-block;
	padding: 14px 13px;
}

#menu-deroulant, #menu-deroulant ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

#menu-deroulant {
/* on centre le menu dans la page */
    text-align: center;
}

#menu-deroulant li {
/* on place les liens du menu horizontalement */
    display: inline-block;
}

#menu-deroulant ul li {
/* on enlève ce comportement pour les liens du sous menu */
    display: inherit;
}

#menu-deroulant a {
    text-decoration: none;
    display: block;
	color:#000;
}

#menu-deroulant ul {
    position: absolute;
/* on cache les sous menus complètement sur la gauche */
    left: -999em;
    text-align: left;
    z-index: 1000;
}

#menu-deroulant li:hover ul {
/* Au survol des li du menu on replace les sous menus */
    left: auto;
}

#menu-deroulant li:hover ul li a {
    background-color:#242424;
	padding: 13px;
	width:100%
}

#menu-deroulant li a{
	color: rgb(230, 230, 230);
	padding: 25px 14px;
	transition: background-color 200ms, color 200ms;
	font-size: 14px;
}

#menu-deroulant li:hover {
	background: rgb(18,18,18);
	color: rgb(123,123,123);
	border-bottom: 2px solid #168BD2;
}

#menu-deroulant li:hover ul li:hover {
	color: #168BD2;
	border:none;
}

#menu-deroulant li:hover ul li:hover a {
	background: rgb(18,18,18);
}

#menu-deroulant {
	float: right;
	vertical-align: middle;
	position: relative;
	right: 35px;
	letter-spacing: 0.4px;
}

@media (max-width: 768px) {
.haut {
	text-align:center;
}

.scrollToDown, .scrollToTop {
 bottom: 14553px;
}


}

@media (max-width: 1280px) {
.scrollToDown, .scrollToTop {
 bottom: 14553px;
}


}

/* EM v37 - controles plegar/desplegar sin PNG externos */
img[src*="collapse.png"],
img[src*="collapse_collapsed.png"] {
    display: inline-block !important;
    width: 18px !important; height: 18px !important;
    min-width: 18px !important; min-height: 18px !important;
    margin: 0 !important; padding: 0 !important; border: 0 !important;
    vertical-align: middle !important; cursor: pointer !important;
}

img[src*="collapse.png"] {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='1' y='1' width='22' height='22' rx='6' fill='%23121a21' stroke='%23168bd2' stroke-width='1.5'/%3E%3Cpath d='M7 14.5 12 9.5l5 5' fill='none' stroke='%2367c4f8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

img[src*="collapse_collapsed.png"] {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='1' y='1' width='22' height='22' rx='6' fill='%23121a21' stroke='%23168bd2' stroke-width='1.5'/%3E%3Cpath d='m7 9.5 5 5 5-5' fill='none' stroke='%2367c4f8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

img[src*="collapse.png"]:hover, img[src*="collapse_collapsed.png"]:hover {
 filter: brightness(1.25);
}

/* EM v38 - Thank You final */

.postbit_buttons > a.add_tyl_button,
.postbit_buttons > a.del_tyl_button {
    color: #CCC !important;
    border: 0 !important;
    opacity: 1 !important;
    margin: 2px !important;
    padding: 7px !important;
    border-radius: 6px !important;
    background: transparent !important;
    text-decoration: none !important;
    font-size: 15px !important;
}

.postbit_buttons > a.add_tyl_button:hover,
.postbit_buttons > a.del_tyl_button:hover {
    color: #FFF !important;
    background: rgba(22,139,210,.10) !important;
}

.postbit_buttons > a.add_tyl_button span,
.postbit_buttons > a.del_tyl_button span {
    background: none !important;
    background-image: none !important;
    padding: 0 !important;
    font-weight: normal !important;
}

.tyllist,
.tyllist_classic {
    box-sizing: border-box;
    margin: 7px 12px !important;
    padding: 6px 10px !important;
    background: #121a21 !important;
    color: #98A4AE !important;
    border: 1px solid #263641 !important;
    border-radius: 6px !important;
}

.tyllist a,
.tyllist_classic a {
    color: #8fcdf4;
    text-decoration: none;
}

.tyllist a:hover,
.tyllist_classic a:hover {
    color: #168BD2;
}

/* EM - Botón Gracias con estado visual */
.postbit_buttons > a.add_tyl_button,
.postbit_buttons > a.del_tyl_button {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;

    margin: 2px 6px 2px 2px !important;
    padding: 6px 11px !important;

    border-radius: 6px !important;

    font-size: 14px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: .16s ease !important;
}


/* SIN DAR LAS GRACIAS — gris */
.postbit_buttons > a.add_tyl_button {
    color: #aeb8c0 !important;
    background: rgba(255,255,255,.035) !important;
    border: 1px solid #34424d !important;
}

.postbit_buttons > a.add_tyl_button::before {
    content: "\f004";
    font-family: FontAwesome;
    font-size: 13px;
    color: #89959e;
}


/* Hover antes de dar las gracias */
.postbit_buttons > a.add_tyl_button:hover {
    color: #dce8ef !important;
    background: rgba(255,255,255,.07) !important;
    border-color: #53636f !important;
}


/* GRACIAS DADAS — azul / activo */
.postbit_buttons > a.del_tyl_button {
    color: #9bd7fa !important;
    background: rgba(22,139,210,.13) !important;
    border: 1px solid rgba(22,139,210,.55) !important;
}

.postbit_buttons > a.del_tyl_button::before {
    content: "\f004";
    font-family: FontAwesome;
    font-size: 13px;
    color: #168BD2;
}


/* Hover para quitar las gracias */
.postbit_buttons > a.del_tyl_button:hover {
    color: #fff !important;
    background: rgba(22,139,210,.22) !important;
    border-color: #168BD2 !important;
}


/* Anular los iconos PNG originales del plugin */
.postbit_buttons > a.add_tyl_button span,
.postbit_buttons > a.del_tyl_button span {
    background: none !important;
    background-image: none !important;
    padding: 0 !important;
    height: auto !important;
}

/* EM v38 - Badge de grupo en perfil */
.em-profile-groupimage {
    display: block;
    margin: 6px 0 10px;
}

.em-profile-groupimage img {
    display: block;
    width: auto !important;
    height: auto !important;
    max-width: 170px !important;
    max-height: 55px !important;
    object-fit: contain;
}