@import "pages/overlay/reminder.css";
@import "pages/overlay/search-client.css";
@import "pages/members/members.css";
@import "pages/coaches/coaches.css";
@import "pages/documents/documents.css";

.font-myriad {
	font-family: 'Myriad Pro';
}

@font-face {
	font-family: 'Ormont';
	src: url('../Fonts/Ormont_Light.otf') format("opentype");
}

:root{
	--color-grey:#515151;
	--color-grey-light:#849fbc;
	--color-theme:#061859;
	--color-theme-page:#f3f5f9;
	--color-theme-title-app: #152971;
	--color-hover-panel:#5bb8f3;
	--color-theme-hover:#5bb8f3;
	/* --color-theme-title-app: #074471; 3.4 */
	--mat-menu-container-color:#FFF;
	--mat-menu-container-shape:4px;
	--mat-menu-item-hover:#fafbfd;
	--mat-menu-item-color:#476388;
	--mat-menu-item-icon:#849fbc;
	--mat-menu-item-icon-hover:#88a0bf;
	/* dark */
	--color-dark-text:#FFF;
	--color-dark-component:#292929;
	--color-dark-component-layer1:#4d4d4d;
	--color-dark-component-layer2:#313131;
	--color-dark-component-layer3:#1f1f1f;
	--color-dark-component-layer4:#000;
	--color-dark-kpi:#0a0b17;

	--color-white:#FFF;
	--color-purple:rgb(125, 12, 108);
	--color-orange:rgb(192, 94, 24);
	--color-green:rgb(21, 149, 87);
	--color-brown:rgb(88, 36, 13);

	--color-tag-present-hv:#a8f5aa;
	--color-tag-late-hv:#f9d762;
	--color-tag-abs-hv:#ff9aac;
	--color-tag-present:#d1f7d2;
	--color-tag-late:#ffd19a;
	--color-tag-late-light:#FFF1A8;
	--color-tag-abs:#ffd6dd;
	--color-tag-abs-dark:#712330;
	--color-tag-cancel:#981611;
	--color-tag-txt-present:#0D603F;
	--color-tag-txt-late:#945A26;
	--color-tag-txt-abs:#851022;
}
.font-ormont {
	font-family: 'Ormont';
}
.header-logo{
	width: 175px;
	display: flex;
	align-items: center;
    justify-content: space-between;
	gap: 10px;
	padding: 0 15px;
}
.logiciel-name{
	display: flex;
	align-items: flex-start;
    justify-content: center;
    flex-direction: column;
	font-family: 'Ormont';
    font-size: 13px;
    letter-spacing: 5px;
}
.logiciel-name .up{
	color: var(--color-hover-panel);
    -webkit-text-stroke: 1.5px var(--color-hover-panel);
}
.logiciel-name .down{
	font-size: 11px;
	-webkit-text-stroke: 1px #ffffff;
}

.partLogo {
	padding-left: 10px;
	width: calc(100% - 50px);
	float: left;
	text-align: left;
	color: #FFF;
}
.restInfoHeader {
	height: 100%;
	width: calc(100% - 175px);
}
#corpus{
	float:left;
	position: relative;
	width:100%;
	min-height: -webkit-fill-available;
    padding-bottom: 80px;
	transition: 1s;
	background-color: var(--color-theme-page);
}
#cornerBox{
    position: fixed;
	left:0;
    margin-left: 60px;
    width: 100%;
    height: 100%;
    border-top-left-radius: 20px;
    overflow: scroll;
    margin-top: 57px;
    background-color: #1162ac;
}
.title_page {
	float: left;
	width: 100%;
	background-color: #074471;
	background: linear-gradient(90deg, var(--color-theme-title-app), #3995da);
	color: #FFF;
	padding: 20px 20px;
	font-size: 24px;
	border-bottom: solid 1px #e3e6e7;
}
.title_page .bt-pl{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.title_page .bt-pl.end{
	justify-content:flex-end;
}

.color_theme {
	color: #0d4267;
}

.info_help {
	position: absolute;
	top: -50px;
	color: #FFF;
	width: auto;
	padding: 10px;
	border-radius: 5px;
	background-color: #000;
	border: solid 1px #FFF;
	box-shadow: 0px 0px 5px #665;
	display: none;
	z-index: 900;
}

.bg_lineblue {
	/* background-color: #f7f7f7; */
}
table.dataTable{
	color: #486388;
	font-weight: 500;
}
table {
     border-spacing: 1;
     border-collapse: collapse;
     background:white;
     border-radius:6px;
     width:100%;
     margin:0 auto;
     position:relative;
     padding:10px;
   
     *               { position:relative }
   
     td,th           { padding-left:8px}
   
     #comptaTable thead tr        {
       height:60px;
       font-size:16px;
     }
   
     #comptaTable tbody tr        { height:48px; border-bottom:1px solid #E3F1D5 ;
       &:last-child  { border:0; }
     }
   
         td,th 					{ text-align:left;
             &.l 					{ text-align:right }
             &.c 					{ text-align:center }
             &.r 					{ text-align:center }
        }
        tfoot tr, tfoot th {
             border-bottom:none;
        }

     
}
table tr:last-child td:last-child {
     border-bottom-right-radius:10px;
 }
 
 table tr:last-child td:first-child {
     border-bottom-left-radius:10px;
 }
 
 table tr:first-child th:first-child,
 table tr:first-child td:first-child {
     border-top-left-radius:10px
 }
 
 table tr:first-child th:last-child,
 table tr:first-child td:last-child {
     border-top-right-radius:10px
 }
.bg_lineblue2 {
	background-color: #f1f6f7;
}

.area_theme {
	float: left;
	width: 100%;
	height: 200px;
	resize: none;
	border-radius: 5px;
	border: solid 1px #CCC;
	margin-top: 10px;
	outline: none;
	padding: 10px;
}

.input_style_excel {
	float: left;
	width: 100%;
	height: auto;
	font-size: 14px;
	background: none;
	color: #000;
	border-radius: 10px;
	border: none;
	padding-left: 15px;
	outline: none;
}

.input_theme {
	float: left;
	width: 100%;
	height: 44px;
	font-size: 14px;
	background: none;
	margin-bottom: 7px;
	color: #000;
	border-radius: 10px;
	border: solid 1px #CCCC;
	padding-left: 15px;
	background-color: #f6f5f6;
	outline: none;
}

.label_upload {
	background: none;
	background-repeat: no-repeat;
	background-position: center;
	border: none;
	float: left;
	width: 100%;
	padding: 10px 15px 10px 15px;
	border-radius: 5px;
	background-color: #2170a8;
	cursor: pointer;
	font-weight: inherit;
	color: #FFF;
	margin-left: 5px;
	margin: 0;
}
.label_upload:hover {
	background-color: #399be0;
}
.button_help, .button_green, a.button_green {
	float: left;
	font-size: 14px;
	width: auto;
	height: auto;
	padding: 5px 10px;
	border-radius: 18px;
	background-color: #348513;
	cursor: pointer;
	color: #FFF;
	margin-left: 5px;
 }
 .button_help:hover, .button_green:hover, a.button_green:hover {
	background-color: #49a325;
 }
 .button_green, a.button_green{
	padding: 10px 20px;
 }
.button_theme, .button_themeMin, .buttonPrimaryMin, .buttonAlertMin, .buttonValidMin {
	float: left;
	width: auto;
	height: auto;
	padding: 10px 15px;
	border-radius: 18px;
	background-color: #2170a8;
	cursor: pointer;
	color: #FFF;
	margin-left: 5px;
	border:none;
    transition: 0.5s;
}
.buttonPrimaryMin{
    font-size: 12px;
	padding: 2px 5px!important;
	color: #2e469c;
	background-color: #a6a4f9;
}
.buttonAlertMin{
    font-size: 12px;
	padding: 2px 5px!important;
	background-color: #df2b2b;
}
.buttonValidMin{
    font-size: 12px;
	padding: 2px 5px!important;
	background-color: #089c3e;
}
.button_themeMin, .button_backMin, .button_updateMin, .button_deleteMin{
	padding: 2px 15px !important;
	margin:5px 0px 0px 5px!important;
	min-height: initial!important;
}

.button_theme:hover, .button_themeMin:hover {
	background-color: #399be0;
}

.white_button {
	margin-left: auto;
	margin-right: auto;
	width: 150px;
	padding: 5px;
	border: solid 1px #CCC;
	font-size: 16px;
	text-align: center;
	transition: 0.8s;
}

.white_button:hover {
	background-color: #FFF;
	color: #000;
}

.contenerTabInfo {
	float: left;
	width: 100%;
	border-radius: 10px;
	border: solid 1px #CCC;
	background-color: #FFF;
	overflow: hidden;
}
.contenerTabInfo.ln-grt-bg {
	border-color: #ebebeb4a;
	background: linear-gradient(45deg, #ededed, #f9f9f9, #ffffff);
}
.contenerTabInfo.scroll-y{
	overflow-y: scroll;
}

.TabInfoline {
	float: left;
	width: 100%;
	border-top: solid 1px #CCC;
}

.TabInfoTh {
	border-right: solid 1px #CCC;
	padding: 0px 10px;
}

tbody.memberTbody {
	display: block;
	max-height: 200px;
	overflow: auto;
}

thead.memberThead, tbody.memberTbody tr {
	display: table;
	width: 100%;
	table-layout: fixed;
}

td.TabInfoTh {
	background: none;
}

.TabInfo, .TabInfoLineTbl {
	float: left;
	width: 24%;
	border-right: solid 1px #CCC;
	background-color: #f1f1f1;
	color: #000;
	padding: 5px 15px;
}
.TabInfo{
	position: relative;
}

.TabInfoLineTbl {
	background: none;
}

.TabInfo.TIResult {
	width: 76%;
	border: none;
	background-color: #FFF;
}
.TabInfo .badge-danger{
    padding: 0 6px;
    font-size: 12px;
	width: fit-content;
}

#loadPage {
	position: fixed;
    left:0;
	margin-left: 175px;
    top: 57px;
    width: calc(100% - 175px);
    height: calc(100% - 57px);
    background-color: #ffffffb5;
    backdrop-filter: blur(2px);
    z-index: 1399;
    border-radius: 20px 0px 0px 0px;
}

.loaderPage {
	position: fixed;
	left: 50%;
	top: 50%;
	width: 200px;
	height: 200px;
	margin-left: -100px;
	margin-top: -100px;
	opacity: 0;
}

.nbr_message {
	color: white;
	background: red;
	width: 15px;
	height: 15px;
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	border-radius: 50%;
	font-size: 10px;
	position: absolute;
	right: -12px;
	bottom: -2px;
}

.datatable-legend {
	width: 100%;
	height: auto;
	font-size: 12px;
	margin:8px 0;
	color: #616161;
    min-height: 20px;
}

/* label, input, form */

.switch {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
}

/* Hide default HTML checkbox */

.switch input {
	display: none;
}
.corpusDs{
	float:left;
	height:100%;
	overflow-y:scroll;
	position: relative;
}
/* The slider */

.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #30333f;
	-webkit-transition: .4s;
	transition: .4s;
}

.slider:before {
	position: absolute;
	content: "";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
}

input:checked+.slider {
	background-color: #30333f;
}

input:focus+.slider {
	box-shadow: 0 0 1px #2196F3;
}

input:checked+.slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
}

/* Rounded sliders */

.slider.round {
	border-radius: 34px;
}

.slider.round:before {
	border-radius: 50%;
}

.search_input {
	height: 60px;
	width: 80%;
	border: solid 0.5px #CCC;
	outline: none;
	position: absolute;
	transform: translateX(-50%);
	top: -117px;
	left: 50%;
	padding-left: 20px;
	padding-right: 40px;
	font-size: 15px;
	color: #665;
}

.search_input2 {
	height: 60px;
	width: 70%;
	border: none;
	outline: none;
	position: absolute;
	top: -110px;
	right: 0px;
	padding-left: 20px;
	padding-right: 40px;
	font-size: 18px;
	color: #665;
}

/* label, input, form */

/* switch page */

.button_pageList, a.button_pageList, .CButtonViewCss {
	float: left;
	width: auto;
	height: auto;
	padding: 10px 30px;
	background: linear-gradient(90deg, #306d9d, #4376a0);
	/* border-radius:10px 10px 0px 0px; */
	border-left: solid 1px #FFF;
	text-align: center;
	cursor: pointer;
	color: #FFF;
    transition: 0.5s;
}

.CButtonViewCss {
	padding: 10px;
}

.button_pageList, a.button_pageList {
	background: #074471;
}

.activeList, a.activeList, .button_pageList:hover, a.button_pageList:hover {
	background: #0969af;
	color: #FFF;
}

/* switch page */

/* table */

tfoot input {
	width: 100%;
	padding: 3px;
	box-sizing: border-box;
}

td {
	/*height:70px;*/
	border-bottom: solid 1px #f3f3f3!important;
}

tr th {
	border-bottom: solid 1px #f3f3f3!important;
}

/* table */

.window_table {
	width: 100%;
	float: left;
	position: absolute;
	height: auto;
	min-height: 200px;
	padding: 15px;
}

/* */

.bg-shadow {
	box-shadow: rgb(0, 0, 0) 0px 0px 22px -6px;
}

.bg-shadow2 {
	box-shadow: rgb(0, 0, 0) 9px 3px 36px -10px;
}

/* */

#header-font {
	width: 100%;
	height: 50px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 2000;
	background-color: var(--color-theme);
	color: #FFF;
	/* background-image: url('../Images/fonds/font-header.png'); */
	background-position: center;
	background-repeat: repeat-x;
	/* border-bottom:solid 1px #CCC; */
	display: flex;
	align-items: center;
	justify-content: center;
}

#champs_notif {
	position: fixed;
	top: 60px;
	right: 10px;
	max-width: 500px;
	min-width: 270px;
	height: auto;
	/* min-height:20px; */
	z-index: 900;
}
#champs_notif .standard-alert, #champs_notif .standard-notification, #champs_notif .standard-succes{
	float: right;
	width: auto;
	min-width: 270px;
	padding: 6px 10px;
	font-weight: normal;
	min-height: initial;
}

.champs_notif2 {
	position: fixed;
    top: 65px;
    left: 50%;
    transition: 0.3s;
    transform: translateX(-50%);
    z-index: 11000;
    min-width: 150px;
    width: auto;
    padding: 15px 20px;
    font-weight: normal;
    background: linear-gradient(#36393c, #0e3f6c);
    box-shadow: 0px 0px 6px #545454;
    border: solid 1px #5d5d5d;
    color: #FFF;
    border-radius: 6px;
}
.saveBox{
	position:fixed;top:8px;right:74px;width:auto;height:auto;z-index:9999999999999999;
}
.button_save{
	transition: 0.5s;
    background-color: rgb(255, 102, 0);
}
.button_save:hover{
	background: linear-gradient(90deg, rgb(255, 102, 0) 35%, #ffb000);
}
.alert-success {
	color: #155724;
	background-color: #d4edda;
	border-color: #c3e6cb;
}

.alert-primary {
	color: #004085;
    background-color: #f0f6fa;
    border: solid 1px #82a5ca;
    border-radius: 4px;
	padding:10px;
}

.standard-succes {
	min-height: 40px;
	min-width: 100%;
	float: left;
	height: auto;
	width: 100%;
	padding: 10px;
	background: linear-gradient(45deg, #142b0c, #3d682c, #57b734);
    border: solid 2px #236908;
	/* background-color: #2a9800; */
	border-radius: 7px;
	display: flex;
	color: #FFF;
	font-weight: 600;
	opacity: 0;
	flex-direction: column;
	justify-content: center;
	margin-top: -5px;
	margin-bottom: 5px;
	box-shadow: rgb(0, 0, 0) 9px 3px 36px -10px;
}

.standard-notification {
	min-height: 40px;
	min-width: 100%;
	float: left;
	height: auto;
	width: 100%;
	padding: 10px;
	background: linear-gradient(45deg, #05232d, #00a5db);
	/* background-color: #00a5db; */
	border-radius: 7px;
	border: solid 1px #1284b9;
	display: flex;
	color: #FFF;
	font-weight: 600;
	opacity: 0;
	font-size: 14px;
	flex-direction: column;
	justify-content: center;
	margin-top: -5px;
	margin-bottom: 5px;
	box-shadow: rgb(0, 0, 0) 9px 3px 36px -10px;
}

.standard-alert {
	min-height: 40px;
	float: left;
	height: auto;
	width: 100%;
	padding: 10px;
	background: linear-gradient(45deg, #320505, #e2484f);
    border-radius: 7px;
    border: solid 1px #d40f0f;
	display: flex;
	color: #fff;
	flex-direction: column;
	justify-content: center;
	margin-top: -5px;
	margin-bottom: 5px;
	box-shadow: rgb(0, 0, 0) 9px 3px 36px -10px;
}

#SBgPoppup {
	position: fixed;
	left: 0;
	top: 50px;
	z-index: 708;
	display: none;
	cursor: pointer;
	margin-left: 80px;
	width: calc(100% - 160px);
	height: 100%;
	min-height: 100%;
}

#BgPoppup {
	position: fixed;
    top: 56px;
    z-index: 808;
    display: none;
    cursor: pointer;
    width: 100%;
    min-width: 100%;
    height: 100%;
    border-top-left-radius: 23px;
    min-height: 100%;
    background-color: rgba(0, 0, 0, 0.424);
	backdrop-filter: blur(2px);
}
#waitBgPop{
	position: fixed;
	top:50%;
	left:50%;
	padding:40px;
	transform: translate(-50%, -50%);
	text-align:center;
	border-radius:10px;
}

.circle_menu {
	float: right;
	width: 40px;
	height: 40px;
	background-color: #FFF;
	margin-top: 5px;
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	border-radius: 50%;
	cursor: pointer;
}

.circle_choix {
	float: left;
	width: 70px;
	height: 70px;
	margin-left: 10px;
	margin-right: 10px;
	margin-top: 5px;
	text-align: center;
	color: #FFF;
	display: flex;
	flex-direction: column;
	justify-content: center;
	border-radius: 50%;
	cursor: pointer;
}

.rapide_link {
	position: fixed;
	height: auto;
	z-index: 1000;
	top: 60px;
	right: 10px;
	width: 315px;
	max-width: 315px;
	min-width: 315px;
	display: none;
	background-color: #FFF;
	border-radius: 0px;
	box-shadow: 0 0 80px rgba(0, 0, 0, 0.61);
	z-index: 807;
}

.divTitleBloc {
	float: left;
	width: 100%;
	height: 60px;
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	font-size: 16px;
	padding-left: 20px;
	padding-right: 20px;
}

.divTitleMiniBloc {
	float: left;
    width: 100%;
    min-height: 35px;
    text-align: center;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 15px;
    font-size: 14px;
    padding: 7px 15px;
    font-weight: 600;
    font-size: 16px;
    color: var(--color-theme);
}

.poppup {
	position: fixed;
	max-height: 90%;
	height: auto;
	left: calc(50% - 30px);
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	width: 70%;
	min-width: 800px;
	overflow: hidden;
	border-radius: 12px;
	box-shadow: 0 0 80px rgba(0, 0, 0, 0.07);
	background: linear-gradient(325deg, #FFF 0%, #EDF3F9 60%, #FFF 100%);
	z-index: 812;
	line-height: normal;
}
.poppup .item-circle {
    background-color: #c8dbef;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    color: var(--overlay-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.conteneurPoppup {
	position: relative;
	float: left;
	width: 100%;
	height: auto;
	overflow-y: scroll;
	font-size: 14px;
	padding: 20px;
}

.conteneurRapide {
	position: relative;
	float: left;
	width: 100%;
	height: auto;
	font-size: 14px;
	padding: 20px;
}

.cadrePoppup {
	position: relative;
	float: left;
	width: 100%;
	height: auto;
	font-size: 14px;
}

.closePoppup, .closeRapide {
	position: absolute;
	top: -37px;
	font-size: 18px;
	right: 10px;
	width: 30px;
	height: 35px;
	text-align: center;
	display: flex;
	cursor: pointer;
	flex-direction: column;
	justify-content: center;
}

.title_poppup {
	float: left;
	width: 100%;
	text-align: center;
	height: 60px;
	font-size: 18px;
	color: #000;
	margin-bottom: 15px;
}

/* accueil */

.title_home {
	float: left;
	width: 100%;
	height: auto;
	font-size: 30px;
	color: #FFF;
}

.rectangle_home {
	float: left;
	width: 100%;
	height: 180px;
	background-color: rgba(255, 255, 255, 0.68);
	padding: 20px;
	margin-top: 20px;
}

.case_home {
	float: left;
	width: calc(100% / 2);
	height: auto;
	min-height: 40px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	font-size: 18px;
}

.home1 {
	color: #586ada;
}

.home2 {
	color: #1ea672;
}

.home3 {
	color: #00a5db;
}

.view_analyticsHome {
	width: 450px;
}

/* accueil */
.item-cat-title{
	color: var(--color-theme);
	font-weight: 600;
	padding-bottom:5px;
}
.item-cleMin{
	border-radius: 50%;
    height: 30px;
    width: 30px;
    background: #efefef;
    color: #665;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    cursor: pointer;
    transition: 0.5s;
    margin-top: 5px;
}
.item-cleMin.active_delete{
	color:#FFF;
}
.flex-spaceBtw{
	display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px 15px;
}
.flex-spaceBtwMin{
	display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 5px 5px;
}
.item-cleMin:hover{
	color:#FFF;
    background: var(--color-theme);
}
/* button */

.button_article, .button_back, .button_backMin, .button_update, .button_updateMin, .button_update2, .button_delete, .button_deleteMin {
	float: left;
	width: auto;
	padding: 0px 15px 0px 15px;
	height: auto;
	min-height: 40px;
	border-radius: 18px;
	background-color: #6b6b6b;
	color: #FFF;
	display: flex;
	font-size: 14px;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	cursor: pointer;
	margin-left: 10px;
	margin-right: 10px;
}

.button_delete, .button_deleteMin {
	background-color: #ff0000;
	outline: none;
	border: none;
}

.button_delete:hover, .button_deleteMin:hover {
	background-color: #e73617;
}

.button_update, .button_updateMin, .button_update2 {
	background-color: #F60;
	outline: none;
	border: none;
}
.button_update{
	padding: 7px 15px;
	min-height: initial;
}

.button_article {
	background-color: #30635e;
}

.button_article:hover, .button_update:hover, .button_updateMin:hover, .button_update2:hover {
	background-color: #ffa700;
}

.button_back:hover, .button_backMin:hover {
	background-color: #2170a8;
}

/* button */

.option_mail {
	position: fixed;
	bottom: 40px;
	left: 50%;
	transform: translateX(-50%);
	width: 50%;
	height: auto;
	display: none;
	border-radius: 10px;
	background-color: #114471;
	box-shadow: 0px 0px 5px #000;
	overflow: hidden;
}

.option_ftab {
	float: left;
	width: 100%;
	height: 40px;
	justify-content: center;
    align-items: center;
    gap: 15px;
	display: flex;
	text-align: center;
	color: #FFF;
	cursor: pointer;
}

.option_ftab:hover {
	background-color: #225f94;
}

.bg_linegrey {
	background-color: #363a4c;
	color: #FFF;
}

.Addline_userGroup:hover {
	cursor: pointer;
	background-color: #363a4c;
	color: #FFF;
}

/* select auto-complete */
.button_content{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
}
.button_content.bc_left{
	justify-content: flex-start;
}
.button_content.bc_right{
	justify-content: flex-end;
}
.custom-combobox {
	position: relative;
	display: inline-block;
	width:100%
}

.custom-combobox-toggle {
	position: absolute;
	top: 0;
	right: -2px;
	bottom: 0;
	margin-left: -1px;
	padding: 0;
	background: #f7f9ff!important;
	border: solid 1px #d7e0ff;
	border-radius:4px;
}

.custom-combobox-input {
	margin: 0;
	height: 38px;
	width: 100%;
	padding: 5px 10px;
	border-radius: 4px;
	background: #f7f9ff!important;
	border: 1px solid #d7e0ff!important;
	outline: none;
}

.ui-button .ui-icon {
	background-image: url('images/ui-icons_777777_256x240.png')!important;
}

.ui-menu {
	position: absolute;
	border-radius: 5px;
	margin-top: 5px;
	max-height: 200px;
	overflow-y: scroll;
	z-index: 3000;
}

.ui-menu-item {
	border-top: solid 1px #CCC;
}

.ui-menu-item:hover {
	background-color: #0769af;
	color: #FFF;
}

/* select auto-complete */

/* page style design BD */

.savoir_page {
	float: left;
	width: 100%;
	height: auto;
	padding: 20px;
	margin: 20px 0px;
	border-radius: 15px;
	background-color: #FFF;
}

.interne_page {
	float: left;
	width: 100%;
	height: auto;
	min-height: 400px;
	max-height: 100%;
	background-color: #dfdfdf;
	color: #181a41;
	/* border-radius:10px 10px 0px 0px; */
	overflow: hidden;
}

.interne_header {
	float: left;
	width: 100%;
	background: linear-gradient(75deg, #2272aa, #0e3764);
	color: #fff;
	padding: 2rem 10px 0px 3rem;
	position: relative;
}

.content_page {
	float: left;
	width: 100%;
	height: auto;
}

/* page style design BD */

/* tableau */

.bgcolor_bcd_hover:hover, .bgcolor_bcd_hover:hover td {
	background-color: #f3f5f9;
	box-shadow: none;
	color: #486388;
}

/* tableau */

/* right click */

.title_rightClick {
	float: left;
	width: 100%;
	background: rgba(75, 150, 204, 1);
	background: -moz-linear-gradient(top, rgba(75, 150, 204, 1) 0%, rgba(101, 184, 245, 1) 84%, rgba(183, 222, 237, 1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(75, 150, 204, 1)), color-stop(84%, rgba(101, 184, 245, 1)), color-stop(100%, rgba(183, 222, 237, 1)));
	background: -webkit-linear-gradient(top, rgba(75, 150, 204, 1) 0%, rgba(101, 184, 245, 1) 84%, rgba(183, 222, 237, 1) 100%);
	background: -o-linear-gradient(top, rgba(75, 150, 204, 1) 0%, rgba(101, 184, 245, 1) 84%, rgba(183, 222, 237, 1) 100%);
	background: -ms-linear-gradient(top, rgba(75, 150, 204, 1) 0%, rgba(101, 184, 245, 1) 84%, rgba(183, 222, 237, 1) 100%);
	background: linear-gradient(to bottom, rgba(75, 150, 204, 1) 0%, rgba(101, 184, 245, 1) 84%, rgba(183, 222, 237, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4b96cc', endColorstr='#b7deed', GradientType=0);
}

.window_option {
	position: absolute;
	width: 150px;
	top: 10px;
	display: none;
	border: solid 1px #CCC;
	box-shadow: 0px 0px 5px #CCC;
	background-color: #ececec;
	z-index: 900;
}

.window1_option {
	float: left;
	width: 100%;
}

.mymenu_option {
	float: left;
	width: 100%;
	height: auto;
	border-top: solid 1px #CCC;
	padding: 15px 10px;
	color: #000;
	cursor: pointer;
}

.mymenu_option:hover {
	background: rgba(226, 226, 226, 1);
	background: -moz-linear-gradient(top, rgba(226, 226, 226, 1) 0%, rgba(254, 254, 254, 1) 6%, rgba(235, 232, 235, 1) 80%, rgba(254, 254, 254, 1) 91%, rgba(226, 226, 226, 1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(226, 226, 226, 1)), color-stop(6%, rgba(254, 254, 254, 1)), color-stop(80%, rgba(235, 232, 235, 1)), color-stop(91%, rgba(254, 254, 254, 1)), color-stop(100%, rgba(226, 226, 226, 1)));
	background: -webkit-linear-gradient(top, rgba(226, 226, 226, 1) 0%, rgba(254, 254, 254, 1) 6%, rgba(235, 232, 235, 1) 80%, rgba(254, 254, 254, 1) 91%, rgba(226, 226, 226, 1) 100%);
	background: -o-linear-gradient(top, rgba(226, 226, 226, 1) 0%, rgba(254, 254, 254, 1) 6%, rgba(235, 232, 235, 1) 80%, rgba(254, 254, 254, 1) 91%, rgba(226, 226, 226, 1) 100%);
	background: -ms-linear-gradient(top, rgba(226, 226, 226, 1) 0%, rgba(254, 254, 254, 1) 6%, rgba(235, 232, 235, 1) 80%, rgba(254, 254, 254, 1) 91%, rgba(226, 226, 226, 1) 100%);
	background: linear-gradient(to bottom, rgba(226, 226, 226, 1) 0%, rgba(254, 254, 254, 1) 6%, rgba(235, 232, 235, 1) 80%, rgba(254, 254, 254, 1) 91%, rgba(226, 226, 226, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#e2e2e2', GradientType=0);
}

/* right click */

/* compta */
.encart-content{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;
}
.encart_payment {
	float: left;
	width: calc(100% / 4);
	padding: 5px;
	cursor: pointer;
	text-align: center;
	background: linear-gradient(45deg, #e9e9e9, #ffffff);
    border-radius: 10px;
	padding:10px;
	transition: 0.5s;
	box-shadow: 0 0 4px #CCC;
	border: solid 1px #ffffff;
}
.encart-text{
	margin-top: 10px;
	font-size: 14px;
	line-height: 11px;
}

.encart_payment:hover {
	box-shadow: 0 0 6px #CCC;
	background: linear-gradient(45deg, #dcdcdc, #f4f4f4);
}
.encart_payment.choice_payBack:hover, .encart_payment.active{
	color: #e71010;
}

/* compta */

/* rappel */

.boxRappel {
	position: absolute;
	left: 10px;
	bottom: 20px;
	overflow-y: scroll;
	height: 200px;
	width: 400px;
	padding: 5px;
}
.alertBox{
	float:left;
	margin-top: 5px;
	width:100%;
	color: #d86161;
    border: solid 1px #d86161;
    background-color: #f6eded;
    padding: 10px;
    border-radius: 4px;
	text-align: left;
}
.rpSelector{
	border-radius: 4px;
	overflow: hidden;
	border: solid 1px #1e68af;
}
.rappel_home {
	float: left;
	width: 100%;
	position: relative;
	color: #000;
	font-size: 14px;
	text-align: left;
	font-weight: normal;
	overflow: hidden;
	margin-bottom: 5px;
	height: auto;
	min-height: 30px;
	background: linear-gradient(45deg, white 12%, #FBFBFB);
	border:solid 1px #cccccc69;
	border-radius:10px;
}
.callBackText{
	float:left;
	width:calc(100% - 50px);
	height:100%;
	color: #134e83;
	margin-bottom:5px;
}
.callBackStatut{
	float:left;
	width:50px;
	min-height:60px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align:center;
}
.callBackCls{
	margin-left: auto;
    margin-right: auto;
	height:25px;
	width:25px;
	cursor:pointer;
	border:solid 1px #CCC;
	border-radius:5px;
	text-align:center;
	background-color:#FFF;
	padding:4px 0px;
}
.callBackBtn{
	float:left;
	min-width:30px;
	height:26px;
	padding:5px 7px;
	text-align:center;
	font-size:12px;
	color:#FFF;
}
.callBackPhone{
	width:30px;
	background-color:#348513;
}
.callBackPhone:hover{
	color:#FFF;
	background-color:#43aa1a;
}
.callBackFc{
	width:75px;
	background:linear-gradient(53deg, #022a79, #3fa2cd);
}
.callBackFc:hover{
	color:#FFF;
	background:linear-gradient(53deg, #0e45b4, #3fa2cd);
}
.callBackName{
	text-align: center;
	color:#000;
	font-size:11px;
	width: calc(100% - 105px);
}
/* rappel */

/* compte */

.box_EspParametres {
	float: left;
	width: 100%;
	padding: 30px;
	height: auto;
	border-radius: 4px;
	border: solid 1px #CCC;
}

.square_auto_modification, .square_modification {
	position: fixed;
	z-index: 1000;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 455px;
	height: auto;
	border: solid 1px #CCC;
	box-shadow: 0px 0px 5px #665;
	padding: 20px;
	background-color: #FFF;
	display: none;
}

.poppin_bouton_article, .bouton_articleGreen, .bouton_violet {
	float: left;
	width: 100%;
	text-align: center;
	font-weight: normal;
	font-size: 16px;
	color: #FFF;
	background-color: #7fc309;
	height: 50px;
	border: none;
	cursor: pointer;
	outline: none;
}

.bouton_articleGreen {
	background-color: #529009;
}

.bouton_articleGreen:hover {
	background-color: #6ebb13;
}

.rang_modifSpace {
	float: left;
	width: 100%;
	height: auto;
	min-height: 60px;
	border-top: solid 1px #CCC;
}

.mark_line_space {
	height: auto;
	min-height: 60px!important;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.value_titre {
	float: left;
	width: calc(100% - 40px);
	font-weight: 600;
	font-size: 26px;
}

.retour_modificationSpace {
	float: left;
	width: 40px;
	height: auto;
	font-size: 30px;
	color: #CCC;
	cursor: pointer;
}

.retour_modificationSpace:hover {
	color: #0d4c10;
}

.value_titre {
	float: left;
	width: calc(100% - 40px);
	font-weight: 600;
	font-size: 26px;
}

.champs_style {
	float: left;
	width: 100%;
	height: 39px;
	background: none;
	border-top: none;
	border-left: none;
	border-right: none;
	border-bottom: solid 1px #CCC;
	outline: none;
	font-size: 15px;
	color: #000;
}

.explain_squareSpace {
	float: left;
	width: 100%;
	height: auto;
	margin: 20px 0px;
}

/* compte */

/* stripe */

.StripeElement, .boxElemInput {
	box-sizing: border-box;
	height: 40px;
	padding: 10px 12px;
	border: 1px solid #0969af;
	border-radius: 6px;
	background-color: white;
	box-shadow: 0 1px 3px 0 #e6ebf1;
	-webkit-transition: box-shadow 150ms ease;
	transition: box-shadow 150ms ease;
}

.StripeElement--focus {
	box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
	border-color: #fa755a;
}

.StripeElement--webkit-autofill {
	background-color: #fefde5 !important;
}

/* stripe */

/* cadre_paiement */

.cadre_paiementTH1 {
	float: left;
	width: 100%;
	height: auto;
	background-color: #97bc3a;
	color: #FFF;
}

.line_descriptionPaiementTH1 {
	float: left;
	width: 100%;
	height: auto;
	min-height: 40px;
	padding: 10px 15px;
}

.line_leftPaiementTH1 {
	float: left;
	width: 100%;
	height: auto;
	min-height: 40px;
	display: flex;
	font-weight: 600;
	flex-direction: column;
	justify-content: center;
}

.line_rightPaiementTH1 {
	float: right;
	text-align: right;
	width: auto;
	height: auto;
	min-height: 40px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.cadre_prixPaiementTH1 {
	float: left;
	width: 100%;
	height: 40px;
	background-color: #87a636;
	padding-left: 15px;
	padding-right: 15px;
}

.cadre_paiementTH2 {
	float: left;
	width: 100%;
	height: auto;
	border-radius: 10px;
	background: linear-gradient(0deg, #014ad2, #0b2aa0);
	color: #FFF;
}

.cadre_prixPaiementTH2 {
	float: left;
	width: 100%;
	height: 40px;
	background-color: #0949a4;
	border-radius: 0px 0px 10px 10px;
	padding-left: 15px;
	padding-right: 15px;
}

.bandeau_paiementTH2 {
	float: left;
	width: 100%;
	height: 50px;
	background:linear-gradient(17deg, #0e2e5c, #0949a4);
	padding: 10px 0px 10px 0px;
}

.lock_bandeauPaiementTH1 {
	float: left;
	width: 30%;
	max-width: 100px;
	font-size: 16px;
	height: 100%;
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	border-right: solid 1px #FFF;
	color: #FFF;
}

.text_bandeauPaiementTH1, .valid_bandeauPaiementTH1 {
	float: left;
	width: auto;
	padding-left: 15px;
	padding-right: 15px;
	height: 100%;
	display: flex;
	font-size: 18px;
	flex-direction: column;
	justify-content: center;
	color: #FFF;
}

/* cadre_paiement */

.goToUser {
	position: absolute;
	top: 0;
	right: 0;
	height: 30px;
	width: 100%;
}

.generalCategory, .generalLineList {
	float: left;
	width: 100%;
	padding: 10px;
	position: relative;
	background-color: rgb(22, 151, 113);
	text-align: center;
	color: #FFF;
}

.generalCategory:hover {
	background-color: #0eb180;
}

.generalLineList {
	text-align: left;
	color: #000;
	padding:0;
	background: none;
	border-top: solid 1px #CCC;
}
.generalLineList.active{
	background: #deefff;
}
.lineAccounting{
	float: left;
	padding: 10px 15px;
	width: calc(100% - 100px);
	cursor:pointer;
}

.generalLineList:first {
	border: none;
}

.generalLineList:hover {
	background-color: rgb(223, 223, 223);
}

/* export */

.ExpRsltContent {
	float: left;
	width: auto;
	padding: 10px;
	border-radius: 10px;
	background-color: #FFF;
	color: #000;
	box-shadow: 0px 0px 3px #ccc;
}

.ExpRsltTitle {
	float: left;
	width: auto;
	padding: 10px;
}

.ExpNwOrder {
	float: left;
	width: 100%;
	font-size: 18px;
	color: #2e7b11;
}

/* export */

/*stepper */

.bs-stepper .step-trigger {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	padding: 20px;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.5;
	color: #6c757d;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
	vertical-align: middle;
	user-select: none;
	background-color: transparent;
	border: none;
	border-radius: .25rem;
	transition: background-color .15s ease-out, color .15s ease-out;
}

.bs-stepper .step-trigger:not(:disabled):not(.disabled) {
	cursor: pointer;
}

.bs-stepper .step-trigger:disabled, .bs-stepper .step-trigger.disabled {
	pointer-events: none;
	opacity: .65;
}

.bs-stepper .step-trigger:focus {
	color: #007bff;
	outline: none;
}

.bs-stepper .step-trigger:hover {
	text-decoration: none;
	background-color: rgba(0, 0, 0, .06);
}

@media (max-width: 520px) {
	.bs-stepper .step-trigger {
		flex-direction: column;
		padding: 10px;
	}
}

.bs-stepper-label {
	display: inline-block;
	margin: .25rem;
}

.bs-stepper-header {
	display: flex;
	align-items: center;
}

@media (max-width: 520px) {
	.bs-stepper-header {
		margin: 0 -10px;
		text-align: center;
	}
}

.bs-stepper-line, .bs-stepper .line {
	flex: 1 0 32px;
	min-width: 1px;
	min-height: 1px;
	margin: auto;
	background-color: rgba(0, 0, 0, .12);
}

@media (max-width: 400px) {
	.bs-stepper-line, .bs-stepper .line {
		flex-basis: 20px;
	}
}

.bs-stepper-circle {
	display: inline-flex;
	align-content: center;
	justify-content: center;
	width: 2em;
	height: 2em;
	padding: .5em 0;
	margin: .25rem;
	line-height: 1em;
	color: #fff;
	background-color: #6c757d;
	border-radius: 1em;
}

.active .bs-stepper-circle {
	background-color: #007bff;
}

.bs-stepper-content {
	padding: 0 20px 20px;
}

@media (max-width: 520px) {
	.bs-stepper-content {
		padding: 0;
	}
}

.bs-stepper.vertical {
	display: flex;
}

.bs-stepper.vertical .bs-stepper-header {
	flex-direction: column;
	align-items: stretch;
	margin: 0;
}

.bs-stepper.vertical .bs-stepper-pane, .bs-stepper.vertical .content {
	display: block;
}

.bs-stepper.vertical .bs-stepper-pane:not(.fade), .bs-stepper.vertical .content:not(.fade) {
	display: block;
	visibility: hidden;
}

.bs-stepper-pane:not(.fade), .bs-stepper .content:not(.fade) {
	display: none;
}

.bs-stepper .content.fade, .bs-stepper-pane.fade {
	visibility: hidden;
	transition-duration: .3s;
	transition-property: opacity;
}

.bs-stepper-pane.fade.active, .bs-stepper .content.fade.active {
	visibility: visible;
	opacity: 1;
}

.bs-stepper-pane.active:not(.fade), .bs-stepper .content.active:not(.fade) {
	display: block;
	visibility: visible;
}

.bs-stepper-pane.dstepper-block, .bs-stepper .content.dstepper-block {
	display: block;
}

.bs-stepper:not(.vertical) .bs-stepper-pane.dstepper-none, .bs-stepper:not(.vertical) .content.dstepper-none {
	display: none;
}

.vertical .bs-stepper-pane.fade.dstepper-none, .vertical .content.fade.dstepper-none {
	visibility: hidden;
}
/* stepper */

/* help */
.helper{
	position: relative;
	color:#348513;
	cursor: pointer;
}
.cadreHelp{
	display: none;
	cursor: initial;
	position: absolute;
	top:30px;
	min-width: 350px;
	color:#FFF;
	left:-18px;
	z-index:900;
	font-family: 'Myriad pro';
}
.arrowHelp {
	width: 0;
	border-top: 10px solid #004842;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	transform: translateX(20px) rotate(180deg);
}
.help{
	padding:15px;
	float: left;
	background-color:#004842;
	border-radius:6px;
	font-size: 16px;
	font-weight: initial;
	line-height: initial;
	box-shadow: 0px 0px 7px #7b7b7b;
}
.infoHelp{
	display: none;
}
/* help */
.namePreview{
	float: left;
    font-size: 14px;
}
.menuQckPrev{
	float:left;
	text-align: left;
	width: 100%;
	padding:8px 15px;
	color:#1162ac;
	transition: 0.5s;
	font-size:14px;
	cursor:pointer;
	border-top: solid 1px #CCC;
}
.menuQckPrev:hover{
	color:#FFF!important;
	background-color:#1162ac;
}
.listInfoPrev{
	float:left;
	font-size:12px;
	margin-top: 30px;
	width:100%;
	padding:0px 15px;
	color:#000;
}
.circleAvatar{
	float: left;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: #45789e;
    background-color: #FFF;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	border:solid 2px #CCC;
    box-sizing: initial;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    font-size: 18px;
    margin-right: 10px;
	transition:1s;
}
.circleMail{
	float: right;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: #45789e;
    box-sizing: initial;
    background-color: #c9e3e5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    font-size: 18px;
    margin-right: 10px;
	transition:0.5s;
}
.circlePhone{
	float: right;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    color: #2e5f13;
    border: solid 5px #99ff9cbf;
    background-color: #55b61e;
    box-sizing: initial;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    font-size: 18px;
	transition:0.5s;
}
.circlePhone:hover{
	background-color: #64df1f;
}
.circleMail:hover{
	background-color: #e8fbfc;
}
.PopDesign{
	text-align: left;
	position: fixed;
    display: none;
    height: auto;
    width: 300px;
	max-width: 300px;
    min-width: 300px;
	box-sizing:border-box;
    z-index: 900;
    background-color: rgb(255 255 255);
    top: 50%;
    left: 50%;
	line-height: normal;
	cursor: initial;
	transform: translate(-50%, -50%);
    border: 1px solid #CCC;
    border-radius: 8px;
    padding: 15px 0;
    font-size: 20px;
    color: #064471 !important;
    box-shadow: 0px 0px 4px #665;
}
.cadreInfo_theme{
     float:left;
	width:100%;
	background-color: #cfcfcf;
	border-radius: 8px;
	color: #0b3b7e;
	padding: 15px;
}
.cadrePaiementBlanc{
	float:left;
	width:100%;
	padding: 20px 5px;
	border-radius: 8px;
	background-color: #FFF;
	box-shadow: 0px 0px 3px #adada9;
}
/** resize part forbidden */
#Resize{
	display: none;
	position:fixed;
	left: 0;
    top: 0;
	width:100%;
	height:100%;
	background-color: #FFF;
	z-index: 2000;
}
.oopsy{
	width: 400px;
	font-size:16px;
	padding: 350px 15px 0px 15px;
	margin:20% auto;
	background-size: contain;
	background-repeat: no-repeat;
	background-image:url('../Images/fonds/mobile-download-screen.png');
}
/** end resize part forbidden */
.addStepStage{
	float:left;
	padding: 4px 10px;
    color: #FFF;
    background: linear-gradient(90deg, #5c2698, #a15ced);
    font-size: 12px;
    border-radius: 4px;
    margin: 4px 0;
	cursor:pointer;
}
.addStepStage:hover{
    background: linear-gradient(90deg, #823dd1, #a15ced);
}
.removeStepStage{
	color: #ff5b5b;
	padding-left:10px;
	cursor:pointer;
}
.momemtumDuree{
	float:left;
	padding:0 5px;
	width:auto;
	max-width:260px;
	display: flex;
    gap: 7.5px;
}
.break{
	max-width:130px;
}
.titleMomentum{
	float:left;
	color: #000;
	width:100%;
	margin-bottom:4px;
	font-weight:600;
}
label.titlePhase{
	color: #5c2698;
	font-size: 11px;
}
.selectMultiple > div{
	padding:2px 20px 2px 4px;
	min-width: 100%;
	max-height:120px;
	max-width: 318px;
	width: fit-content;
	overflow-x: hidden;
}
.selectMultiple > ul{
	max-height: 200px;
    overflow: scroll;
}
.scrollDisplay::-webkit-scrollbar, .scroll-y::-webkit-scrollbar {
	display: none;
}
.scrollDisplay, .scroll-y {
	-ms-overflow-style: none; 
	overflow: -moz-scrollbars-none;
}
/** user **/
.circleUserDv{
	float:left;
	width:100%;
	position: relative;
	padding:5px;
    display: flex;
	justify-content: center;
}
.circleUser{
	width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #65b8f5;
    color: #FFF;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    cursor: pointer;
    border: solid 2px #FFF;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.circleUsPl{
	width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #65b8f5;
    color: #FFF;
	padding: 2px;
    cursor: pointer;
	font-size: 10px;
	float: left;
	margin: 0 10px;
}
.userRgBx{
	position: absolute;
	left:50%;
	display: none;
	top:30px;
	transform:translateX(-50%);
	width:360px;
	background-color: #FFF;
	border-radius:10px;
	box-shadow: 0px 0px 5px #CCC;
	z-index: 700;
	padding:15px;
}
.userRgBx > .multiple-items-box-component{
	position: relative;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 2px 2px 0;
    z-index: 1;
}

.multiple-items-box-component .item-tokens-line {
    display: flex;
    max-width: 100%;
    overflow: hidden;
    position: relative;
}
.multiple-items-box-component .item-token {
    margin: 4px;
    min-width: 0;
    max-width: calc(100% - 8px);
    background: #f7f7f7;
    border: 1px solid #f7f7f7;
    color: #333;
    border-radius: 24px;
    font-size: 12px;
    font-weight: 400;
    height: 22px;
    box-sizing: content-box;
    max-width: calc(100% - 8px);
}
.single-box-item-component {
    display: flex;
    align-items: center;
    transition: flex-shrink .15s ease-in;
    margin: 4px;
    min-width: 0;
    background: #e5f4ff !important;
    border: 1px solid #f7f7f7;
    color: #333;
    border-radius: 24px;
    font-size: 12px;
    font-weight: 400;
    height: 22px;
    box-sizing: content-box;
}
.single-box-item-component .item-wrapper {
    flex-shrink: 1;
    min-width: 0;
}
.single-box-item-component .clear-button {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 16px;
    width: 16px;
    font-size: 8px;
    border-radius: 100%;
    cursor: pointer;
    margin-left: 4px;
    margin-right: 2px;
    flex-shrink: 0;
}
.person-token-component {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.person-token-component .person-bullet-component {
    float:left;
	background-color:#FFF;
	flex-shrink: 0;
    margin-right: 4px;
    width: 22px;
    height: 22px;
}
.person-bullet-component {
    position: relative;
    display: flex;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    flex-shrink: 0;
}
.person-token-component .person-token-name {
    flex-shrink: 1;
    min-width: 0;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.bxTitlSgx{
	color:#665;
	text-align:left;
	margin:5px;
}
.userRgBx .horizontal-separator{
	box-shadow: 0px 1px 3px #ccc;
}
.userRgBx .userPersSug{
	float:left;
	min-height:100px;
	min-height:150px;
	width:100%;
	overflow: scroll;
}
.userRgBx .textInfo{
	width: 100%;
	position: relative;
    border-radius: 8px;
    padding: 8px 15px;
    margin-top: 8px;
	text-align: left;
	background-color:#cce5ff;
}
.userRgBx .bxPersonnal{
	padding: 8px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    overflow: hidden;
    cursor: pointer;
	color:#000;
	margin-top: 8px;
	background-color: #FFF;
}
.userRgBx .bxPersonnal:hover{
	background-color: #e7e7e7;
}
.userRgBx .bxPersonnal .usernameInfo{
	padding:2px 15px;
}
/** user **/

/** releases **/
.poppRelease{
    width: 100%;
    height: calc(100vh - 56px);
    color: #FFF;
    background-color: #1a1a1a;
    border-radius: 13px 0 0 0;
    z-index: 1000;
}
.imageRelease{
	float:left;
	position:relative;
	width:100%;
	height:140px;
	border-radius: 13px 0 0 0;
	background-repeat: no-repeat;
	background-size:cover;
	background-position: center;
}
.infoVersion{
	position: absolute;
	left:0;
	bottom:10px;
	width:100%;
}
.updateRead{
	overflow-y: scroll;
    padding: 20px 20px 60px 20px;
    height: calc(100vh - 300px);
}
.titleRelease{
	float:left;
	width:calc(100% - 100px);
	font-size:28px;
	padding-left:15px;
	font-weight: 600;
    letter-spacing: 1px;
    background: linear-gradient(90deg, #0CAAD2 6.28%, #8c9fff 35%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
}
.versionRelease{
	float:left;
	width:100px;
	font-size:12px;
	text-align: right;
	padding:10px 15px;
	color:#FFF;
}
.categoryRelease{
	width:100%;
	display: flex;
	font-weight: 600;
	font-size:24px;
	margin-top: 50px;
	font-weight: 600;
}
.categoryTitleRelease{
    letter-spacing: 1px;
	background: linear-gradient(90deg, #0CAAD2 6.28%, #8ca0ff 80%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
}
.categoryRelease.catRight{
	justify-content: flex-end;
}
.validateRelease{
	position: absolute;
	left:0;
	bottom: 0px;
    width: 100%;
    padding: 0px 15px 15px 15px;
	background: #1a1a1a;
}
.lineRelease{
	width:100%;
	margin-top: 10px;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 30px 30px;
	font-size: 15px;
}
.rowDescRelease{
	text-align: justify;
}
.imgRelease{
	background: #292929;
	border-radius: 20px;
	min-width: 50%;
	height: 300px;
	background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
}
.sepRelease{
	background: linear-gradient(45deg, transparent, #FFF, transparent);
}
.color_catRel{
	color:#ffa201;
}
.dshMinusTxt{
	font-size:10px;
}
.cta-button, .cta-button1, .cta-button2, .cta-button3 {
    color: #fff;
    width: auto;
    background: linear-gradient(45deg, #f5b500, #ff5200);
    border: none;
    border-radius: 3px;
    font-weight: 500;
    padding: 5px 30px;
    font-size: 16px;
    -webkit-transition: .3s;
    transition: .3s;
    text-decoration: none;
    -webkit-box-shadow: 0 2px 5px rgb(0 0 0 / 30%);
    box-shadow: 0 2px 5px rgb(0 0 0 / 30%);
}
.cta-button:hover, .cta-button2:hover {
    background: linear-gradient(45deg, #f5bc00, #f07910);
    text-decoration: none;
    color: #FFF;
}
.pushDownRelease{
	width: 50px;
    height: 50px;
    margin: 0 auto;
	color: #e91;
}
/** releases **/

/** tabs **/
.tabs-menu{
	display: flex;
	align-items: center;
	justify-content: start;
	gap: 10px;
	border-radius: 16px;
	padding: 4px;
	color: var(--color-theme);
	background-color: #F6F6F6;
	font-size: 12px;
	width: -webkit-fill-available;
}
.tabs-menu .menu{
	border-radius: 11px;
    padding: 8px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-weight: 600;
    text-align: center;
	transition: 0.5s;
	cursor: pointer;
	width: -webkit-fill-available;
}

.tabs-menu .menu.activeList, .tabs-menu .menu:hover{
	color: var(--color-hover-panel);
	background-color: #FFF;
}
/** tabs **/

#rightPart{
	position: fixed;
	top: 57px;
    height: calc(100% - 57px);
    right: 0;
    background-color: #FFF;
    width: 0px;
    z-index: 899;
    padding: 20px 15px;
    overflow: scroll;
	box-shadow: 0px 0px 5px #665;
	display:none;
	font-size:12px;
	border-radius: 21px 0px 0px 21px;
}
.closeRightPart {
    float: right;
    width: 50px;
    text-align: right;
    font-size: 16px;
    cursor: pointer;
    color: #000;
}
.renderTitle{
	float: left;
    width: calc(100% - 60px);
	display:none;
}
.renderDay{
	float:left;
	width:100%;
	margin-top:18px;
	height: calc(100% - 80px);
	overflow-y:scroll;
	display:none;
}
.contener_hours {
    float: left;
    width: 100%;
    height: 100%;
    background-color: #FFF;
}
.show_hours {
    float: left;
    width: 100%;
    height: 58px;
    max-height: 58px;
    text-align: center;
    border: none;
    font-size: 14px;
    font-weight: lighter;
    color: #665;
    cursor: pointer;
}
.windowUnconct{
	position: fixed;
	width:320px;
	min-height:200px;
	padding:20px;
	top:50%;
	left:50%;
	margin-left:-160px;
	margin-top:-250px;
	font-size:18px;
	z-index:1200;
	border-radius: 20px;
	text-align:center;
	background-color:#FFF;
	box-shadow:0px 0px 5px #665;
	display: none;
}
.raccTheme{
	float:left;
	padding:4px 8px;
	position:relative;
	border-radius:4px;
	margin-left:4px;
	cursor:pointer;
	transition: 0.5s;
	color: #ffffff;
    background: linear-gradient(45deg, #4ea2ddb3, transparent);
}
.raccTheme:hover{
	color: #ffffff;
    background: linear-gradient(45deg, #61b2ecb3, #ffffff58);
}

/* color title page */
#corpus.green .title_page{
	background: linear-gradient(90deg, #6eb100, rgb(206 216 152));
}
#corpus.memberPage .title_page{
	background: linear-gradient(90deg, #008562, #3995da);
}
#corpus.comptabilityPage .title_page{
	background: linear-gradient(90deg, #9b971c, #3b3700);
}
/* color title page */

/* list view */
.avatarView, .avatarViewMin{
	float:left;
	height:60px;
	width:60px;
	border-radius: 50%;
	border:solid 2px #CCC;
}
.avatarViewMin{
	height:40px;
	width:40px;
}
.iconAvatar{
	float:left;
	margin-left:5px;
	margin-top:10px;
}
/* list view */

/* badge */
.badge-success {
    color: #fff;
    background-color: #28a745;
	border-radius: 3px;
}
.badge-warning {
    color: #212529;
    background-color: #ffc107;
	border-radius: 3px;
}
.badge-primary {
    color: #fff;
    background-color: #007bff;
	border-radius: 3px;
}
.badge-secondary {
    color: #fff;
    background-color: #6c757d;
	border-radius: 3px;
}
.badge-warning {
    color: #fff;
    background-color: #e09a19;
	border-radius: 3px;
}
.badge-danger {
    color: #fff;
    background-color: #dc3545;
	border-radius: 3px;
}
.badge.curve{
	border-radius: 10px;
	padding: 5px 12px;
	font-weight: normal;
}
/* badge */

.item-statement{
	position: absolute;
	left:10px;
	top:50px;
	background-color:#FFF;
	border-radius: 4px;
	box-shadow: 0px 0px 5px #665;
	cursor:pointer;
	overflow: hidden;
	display: none;
	z-index:800;
	padding:4px;
}
.item-statement > .menu-statement{
	padding:4px 10px;
	text-align: center;
	transition: 0.5s;
	font-size:12px;
	border-radius: 4px;
	border:solid 1px #FFF;
}
.item-statement > .blueState{
	color:#017bff;
}
.item-statement > .blueState:hover{
	border:solid 1px #017bff;
	background-color:#e1f0ff;
}
.item-statement > .redState{
	color:#dc3545;
}
.item-statement > .redState:hover{
	border:solid 1px #dc3545;
	background-color:#ffd6da;
}
.item-statement > .orangeState{
	color:#e09a19;
}
.item-statement > .orangeState:hover{
	border:solid 1px #e09a19;
	background-color:#ffedca;
}
.item-statement > .greenState{
	color:#28a745;
}
.item-statement > .greenState:hover{
	border:solid 1px #28a745;
	background-color:#e4ffea;
}

.item-bill-statement{
	position: absolute;
	left:30%;
	top:5%;
	transform: translateX(-50%);
	font-size:22px;
	color:#28a745;
	background-color: #FFF;
	border:solid 2px #28a745;
	text-align: center;
	border-radius: 4px;
	padding:8px 15px;
	z-index: 600;
}
.carter-bill{
	float:left;
	margin-left:15px;
	margin-top:8px;
	position: relative;
}
.carter-bill > .item-statement{
	top:20px;
	left:0;
}
.item-bill-statement.greenState{
	color:#28a745;
	border: solid 2px #28a745;	
}
.item-bill-statement.redState{
	color:#dc3545;
	border: solid 2px #dc3545;	
}

/* add **/

.rang-title-add {
    color: #7a7a7a;
    font-size: 14px;
    float: left;
    width: 100%;
    height: 14px;
    font-size: 13px;
}
.input-type-normal {
	float:left;
	width:100%;
	height: 38px;
	border:none;
	background:none;
	border-radius:5px;
	box-shadow: none;
	border:solid 1px #d7e0ff;
	font-size: 14px;
	font-style: normal;
	font-stretch: normal;
	line-height: normal;
	letter-spacing: normal;
	color: var(--color-theme);
	padding: 6px 14px;
	max-width: 380px;
	background-color: #f7f9ff;
}
.separator-add-champs {
    float: left;
    width: 100%;
    height: 1px;
    background-color: #cecece;
}
.select-design {
    float: left;
    width: 100%;
    height: 38px;
    font-size: 14px;
    margin-top: 14px;
    background: none;
    margin-bottom: 7px;
	color: var(--color-theme);
    border-radius: 5px;
	border: solid 1px #d7e0ff;
    padding-left: 5px;
    background-color: #f7f9ff;
}
.select-design2 {
    float: left;
    width: 100%;
    height: 26px;
    font-size: 14px;
    background: none;
    padding-left: 4px;
    margin-bottom: 7px;
    color: #000;
    border-radius: 4px;
    border: solid 1px #CCCC;
    background-color: #f6f5f6;
    outline:none;
}
.photo_cadre{
	width: 200px;
	height: 200px;
	margin-top: 20px;
	border: solid 1px #CCC;
	border-radius: 50%;
	color:#CCC;
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.cadre_rec{
	float:left;
	position:relative;
	width:240px;
	height:190px;
}
.arrow_user{
	position:absolute;
	height:190px;
	top:0;
	width:50px;
	display:flex;
	justify-content:center;
	flex-direction:column;
	cursor:pointer;
	color:#242121;
}
.right_arrow{
	right:0;
	text-align:right;
}
.left_arrow{
	left:0;
}
.cote_form{
	float:left;
	width:100%;
	height:auto;
}
.cote_form_right{
	position:fixed;
	top:0;
	right:0;
	width:350px;
	height:100%;
	border-left:solid 1px #CCC;
}
/* rang 1 */

/* rang 2 */
.left_menu_import{
	float:left;
	width:200px;
	height:100%;
	border-right:solid 1px #CCC;
}
.bouton_import_choice{
	float:left;
	width:100%;
	height:200px;
	border-bottom:solid 1px #CCC;
	display:flex;
	flex-direction:column;
	justify-content:center;
	text-align:center;
	cursor:pointer;
}
.right_menu_import{
	float:left;
	width:calc(100% - 200px);
	height:100%;
	/* padding-right:45px;
	padding-top:10px; */
}
.placement_bouton_envoie{
	position: fixed;
	right: 75px;
	top: 3px;
	z-index: 10000000000;
	width: auto;
	height: auto;
}
/* rang 2 */
.bouton_capture{
	float:left;
	width:49%;
	margin-left:2%;
	height:40px;
	display:flex;
	text-align:center;
	background-color:#00a5db;
	border:none;
	color:#FFF;
	flex-direction:column;
	justify-content:center;
}
.renderClientLink{
	float:left;
	width:100%;
	height: auto;
	max-height: 250px;
	overflow-y: scroll;
	margin:10px 0px;
	border:solid 1px #CCC;
	border-radius:8px;
}
/* old add **/

/* poppin option menu */
.circleGear, .circleGearMin{
	position:absolute;
	right:10px;
	top:10px;
	cursor:pointer;
	background-color: #000000d5;
	color:#FFF;
	padding:2px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	transition: 0.5s;
	z-index: 700;
}
.circleGearMin{
	width: 26px;
	height: 26px;
	color: var(--color-theme);
}
.circleGear.grey, .circleGearMin.grey{
	background-color: #dfdfdfd5;
}
.circleGear:hover{
	background-color: var(--color-hover-panel);
}

.mdc-menu-panel{
    position: absolute;
    display: none;
    top:10px;
    box-shadow: 0 2px 14px #4763884d !important;
    border-radius: var(--mat-menu-container-shape);
    background-color: var(--mat-menu-container-color);
    will-change: transform, opacity;
    transition:0.5s;
    border-radius:5px;
    overflow: hidden;
    right:10px;
    min-width: 205px;
    z-index: 900;
}
.mdc-menu-panel.active{
    display: block;
}
.mdc-menu-content{
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.mdc-menu-pos-center{
    left:50%;
    transform: translateX(-50%);
}
.mdc-menu-pos-left{
    left:10px;
}
.mdc-menu-pos-relative{
	position: relative;
    top: inherit;
    right: inherit;
    float: right;
	z-index: initial;
}
.mdc-menu-item{
    width:100%;
    padding:4px 10px;
    cursor:pointer;
    transition:0.8s;
    display: flex;
    justify-content: flex-start;
    gap: 15px 15px;
    align-items: center;
    font-size:12px;
    color: var(--mat-menu-item-color);
    font-weight: 500;
    border-top:solid 1px #f8f8f8;
}
.mdc-menu-item:first-of-type{
    border:none;
}
a.mdc-menu-item{
    color: var(--mat-menu-item-color);
}
.mdc-menu-item:hover{
    background-color:var(--mat-menu-item-hover);
}
.circle-icn-mdc-menu{
    border-radius: 50%;
    width:25px;
    height:25px;
    color:#174f84;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: var(--mat-menu-item-icon);
}
.mdc-menu-item:hover .circle-icn-mdc-menu{
    color:#FFF;
    background-color:var(--mat-menu-item-icon-hover);
}
.mdc-menu-item.active_delete{
	color:#FFF;
}
/* poppin option menu */

.tag{
	background-color: #fff;
    box-shadow: 0 0 6px #47638840;
    color: #476388;
	padding:2px 10px;
	border-radius: 10px;
	text-align: center;
	text-overflow: ellipsis;
	margin-top: 5px;
	white-space: nowrap;
}
.tag.sport{
	background-color: var(--color-theme);
	color: #FFF;
	margin-left:4px;
	margin-top: 0;
	overflow: hidden;
	white-space: nowrap;
	font-size: 8px;
}
.tag.sport:first{
	margin-left:0;
}
.tag.tennis, .tag.pickleball{
	color: var(--color-theme);
	background-color: #f0f064;
}
.tag.padel{
	color: var(--color-theme);
	background-color: #f0b664;
}
.tag.basketball, .tag.basket, .tag.red{
	color: #FFF;
	background-color: #902a05;
}
.tag.football{
	background-color: #6469f0;
}
.tag.blue{
	color: #FFF;
	background-color: #3a99c2;
}
.tag.golf, .tag.green{
	color: #FFF;
	background-color: #0e7524;
}
.tag-ct-tbl{
	max-width: 150px;
	overflow-wrap: break-word;
}
.asFilter{
	padding: 8px 15px;
	padding: 4px 10px;
    background: #FFF;
    color:var(--color-theme);
    border-radius: 5px;
	cursor: pointer;
	transition: 0.5s;
	margin-left: 5px;
	border: solid 1px grey;
}
.asFilter:first{
	margin-left: 0;
}
.asFilter:hover, .asFilter.active{
	color: #FFF;
	background: var(--color-theme);
}
/* datatable search */
.inp-datatable-sk,.inp-datatable-sk.hasFilter{
	background-color: #FFF;
	border-radius: 10px;
	width: 100%;
	min-height: 60px;
	padding: 0 10px 0 10px;
	margin-bottom: 10px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap:15px 15px;
	box-shadow: 0 0 6px #4763881a;
    transition: box-shadow .15s cubic-bezier(0,0,.2,.1);
}
.inp-datatable-sk.hasFilter{
	padding: 0;
	justify-content: center;
	flex-direction: column;
	gap:0px;
}
.inp-datatable-sch-sk{
	background-color: #e5ecf4;
    font-weight: normal;
    font-size: 12px;
    min-width: 200px;
    border-radius: 10px;
    margin: 0;
    border: none;
	height: 40px;
	padding-left:15px;
	font-style: italic;
}
.inp-datatable-filters{
	width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 15px 15px;
    padding:0 15px;
    border-bottom: solid 1px #e9e9e9;
    font-size: 12px;
    color: var(--color-theme);
}
.inp-datatable-filters-sch{
	display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px 15px;
    width: -webkit-fill-available;
    padding-bottom: 10px;
    padding: 10px 15px;
}
.inp-datatable-filter-slc{
	margin: 2px 0;
    padding: 2px 10px;
    cursor: pointer;
	transition: 0.5s;
	border-radius: 10px;
	color: #FFF;
	background-color: var(--color-grey-light);
}
.inp-datatable-filter-slc:first{
	border-left:0;
}
.inp-datatable-filter-slc:hover, .inp-datatable-filter-slc.active{
	color: #FFF;
	background-color: var(--color-theme);
}
.wn-op-filter{
	cursor: pointer;
	color:var(--color-grey);
	transition: 0.5s;
}
.wn-op-filter:hover, .wn-op-filter.active{
	color: var(--color-theme);
}
.menu-content-filter{
	position: fixed;
	right: 8px;
    top: 64px;
    height: calc(100% - 72px);
    background-color: #FFF;
    border: solid 2px #e7e7e7;
    border-radius: 12px;
    width: 350px;
    z-index: 701;
    box-shadow: 0 0 9px #848484;
	display: none;
	flex-direction: column;
	padding: 15px 15px 60px 15px;
	transition: 0.3s;
	opacity: 0;
}
.menu-content-filter.active{
	display: flex;
}
.wn-op-close-filter{
	font-size: 14px;
	cursor: pointer;
}
.mn-ct-fl-title{
	font-size: 18px;
	font-weight: bold;
	color: var(--color-theme);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
}
.mn-ct-fl-dsc{
	font-size: 14px;
	margin: 0px 0 10px 0;
	color: var(--color-grey);
}
.mn-ct-fl-cat{
	display: flex;
	flex-direction: column;
	gap: 5px;
}
.mn-ct-fl-cat-title{
	font-weight: 600;
	font-size: 16px;
	color: var(--color-theme);
	margin-top: 10px;
}
.mn-ct-fl-content{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 15px;
	font-size: 12px;
	padding: 0px 0 0 15px;
}
.label-check-mn-ct{
	margin: 0;
	border-radius: 20px;
	padding:2px 10px;
	color: var(--color-theme);
	border: solid 1px var(--color-theme);
	user-select: none;
	display: flex;
    align-items: center;
    gap: 5px;
}
.label-check-mn-ct.c1{
	color: var(--color-purple);
	border: solid 1px var(--color-purple);
}
.label-check-mn-ct.c2{
	color: var(--color-orange);
	border: solid 1px var(--color-orange);
}
.label-check-mn-ct.c3{
	color: var(--color-green);
	border: solid 1px var(--color-green);
}
.label-check-mn-ct.c4{
	color: var(--color-brown);
	border: solid 1px var(--color-brown);
}
.mn-ct-fl-content .form-control{
	outline:none;
	box-shadow: none;
	border: none;
	margin: 0;
	height: auto;
}
.mn-ct-fl-fluid{
	overflow-y: scroll;
	padding-bottom: 80px;
	border-top: solid 1px #d1d1d1;
	border-bottom: solid 1px #d1d1d1;
}
.mn-ct-ruby{
	display:ruby;
}
.mn-ct-ruby > .mn-ct-fl-content{
	min-height: 30px;
}
.mn-ct-ruby .form-control, .min.form-control{
	height: auto;
}
.menu-content-filter button, .button_theme_filter{
	position: absolute;
    left: 8px;
    bottom: 8px;
    color: #FFF;
    background-color: var(--color-theme);
    width: calc(100% - 16px);
    border-radius: 8px;
    transition: 0.5s;
    border: none;
    outline: none;
    padding: 8px 15px;
}
.button_theme_filter{
	position: initial;
    left: initial;
    bottom: initial;
	width: -webkit-fill-available;
}
.ct-sports-filter .label-check-mn-ct{
	text-overflow: ellipsis;
    max-width: 130px;
    white-space: nowrap;
    overflow: hidden;
	display: block;
	margin-left: 5px;
	text-transform:capitalize;
	position: relative;
	padding: 2px 20px 2px 10px;
}
.menu-content-filter button:hover{
	background-color:#F60;
}
.select-sport{
	cursor:pointer;
	padding: 2px 15px;
	transition: 0.5s;
	border-bottom: solid 1px #e6e6e6;
}
.select-sport:hover{
	color:#FFF;
	background-color: var(--color-theme);
}
.ct-sl-sp-search{
	background-color: #f1f1f1;
    border-radius: 4px 4px 10px 10px;
    margin-top: 2px;
    overflow-y: scroll;
	max-height: 100px;
}
.rm-fl-lab{
	position: absolute;
    right: 2px;
    top: 3px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: #000;
    color: #FFF;
    font-size: 10px;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
	cursor: pointer;
}
.rm-int-val{
	position: absolute;
	top: 10px;
	right: 10px;
	border:solid 1px black;
	cursor: pointer;
	color: #000;
	width:20px;
	height:20px;
	border-radius: 50%;
	font-size: 12px;
	display: none;
	align-items: center;
	justify-content: center;
}
.rm-int-val.active{
	display: flex;
}
.inp-action{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
	padding: 0 5px;
}
.inp-button-sep{
	padding-right: 10px;
	border-right: solid 1px #dddddd;
}
.button_back_arrow{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	padding: 5px;
	cursor: pointer;
	transition: 0.5s;
	color:  var(--color-grey-light);
	border: solid 1px var(--color-white);
}
.button_back_arrow:hover{
	color: black;
	border-color: var(--color-grey-light);
	box-shadow: 0 0 4px #ededed;
}
/* datatable search */

/* switcher dark mode */
.sw-mod-light-content{
	float:left;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap:15px 15px;
	white-space: nowrap;
}
.sw-mod-light-content label.switch{
	margin: 0;
	height: 20px;
	width: 33px;
}
.sw-mod-light-content .slider:before{
	height: 12px;
    width: 12px;
}
.sw-mod-light-content .slider {
	background-color: #30333f;
}
.sw-mod-light-content input:checked+.slider:before{
	-webkit-transform: translateX(12px);
	-ms-transform: translateX(12px);
	transform: translateX(12px);
}
.sw-mod-light{
	height:34px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	float:left;
	font-size:14px;
	gap:15px 15px;
	color: #FFF;
	font-weight: 500;
}
.sw-mod-color-dark .sw-mod-light{
	color: #000;
}
.sw-mod-light.active{
	color:#ffc032;
	font-weight: 600;
}
/* switcher dark mode */

.tag-mail{
	background-color: #85c66e;
    box-shadow: 0 0 6px #47638840;
    color: #ffffff;
    padding: 2px 10px;
    border-radius: 10px;
    text-align: center;
    text-overflow: ellipsis;
	white-space : nowrap;
	margin-top: 5px;
}