@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet"');

/****************************/
/*** Gestion de la police ***/
/****************************/

body *:not(.fa),
a.btn, button, button.btn, input[type="button"], input[type="submit"],
i.custom-tooltip .tooltiptext, div.controls.custom-tooltip .tooltiptext { font-family: "Poppins", sans-serif !important; }

body { font-size: 14px; line-height: 22px; }
.widget.bloc-blue .widget-header h3,
.quotas_content span:first-child,
.modal-header h4,
.modal-body .form31 .control-label,
div.dataTables_paginate.paging_simple_numbers a.paginate_button.previous,
div.dataTables_paginate.paging_simple_numbers a.paginate_button.next,
.flex-radio:not(.no-label) .container-radio:first-of-type:before,
span.add-on, .widget-content h3, form.form-table tr td:first-child,
.form-mutu label { font-weight: 500 !important; }
b, strong,
table.dataTable thead th, table.dataTable tfoot th, .table th { font-weight: 600 !important; }
h3.title-c { font-size: 18px; line-height: 28px; font-weight: 700 !important; text-align: center; }

i.custom-tooltip .tooltiptext, div.controls.custom-tooltip .tooltiptext { z-index: 10; }
.notif31-mutu, .notif31-mutu p, .label { line-height: 22px; }
.mt50 { margin-top: 50px; }
hr.m30 { margin: 30px 0; }

.widget-content h3 + form,
.widget-content h3 + .dataTables_wrapper { margin-top: 20px; }


.form-mutu input:not(.btn):not([type='file']):not([type='checkbox']) {
    width: calc(100% - 55px);
}

/**********************************/
/*** Gestion Maximum Résolution ***/
/**********************************/

/*** 1440p sans zoom ***/
@media only screen and (min-width: 1921px) and (max-width: 2560px) {
    body { zoom: 1; }
}



/*******************/
/*** Header 2k24 ***/
/*******************/

a.assistance { display: flex !important; flex-direction: row; gap: 10px; align-items: center; justify-content: center; }
svg.running--on { fill: #5BD47B; stroke: #5BD47B; }
svg.running--off { fill: #F84B4B; stroke: #F84B4B; }
svg[class^="running--"] .server-status-indicator__back { stroke-width: 30px; transform-origin: center center; will-change: transform,stroke-dasharray,stroke-dashoffset; }
.running--on .server-status-indicator__front { fill: inherit; stroke: inherit; transform: scale(1); animation: server-status-pulse 2s linear infinite; }
svg[class^="running--"] .server-status-indicator__front { fill: var(--color-server-status-indicator-base--fill); stroke: var(--color-server-status-indicator-base--stroke); transform: scale(0); transform-origin: center center; will-change: transform,opacity; }
svg[class^="running--"] { display: flex; width: auto; height: auto; max-width: 6px; max-height: 6px; overflow: visible; }

@keyframes server-status-pulse{
    0%{transform:scale(1);opacity:0}
    25%{opacity:.6}
    55%{opacity:.1}
    60%{transform:scale(4);opacity:0}
    to{transform:scale(4);opacity:0}
}

@keyframes server-status-shrink{
    0%{transform:scale(0)}
    to{transform:scale(1.05)}
}

@keyframes server-status-rotate{
    0%{transform:rotate(0)}
    to{transform:rotate(360deg)}
}

@keyframes server-status-dash{
    0%{stroke-dasharray:160;stroke-dashoffset:0}
    50%{stroke-dasharray:146;stroke-dashoffset:-156}
    to{stroke-dasharray:160;stroke-dashoffset:-320}
}


/*******************************/
/*** Image de fonds LWS 2k24 ***/
/*******************************/

body > #wrap { background-image: url(../img/panel2k24/fond.svg); background-size: 100% auto; background-repeat: repeat; }


/***********************************/
/*** Widget-content padding 2k24 ***/
/***********************************/

.widget-content.wid20 { padding: 20px; }
.widget-content.padlr0 { padding: 20px 0; }
.widget-content.padlr0 > * { padding-left: 20px; padding-right: 20px; }


/***********************/
/*** Bloc Boost 2k24 ***/
/***********************/

#bloc_boost { position: relative; display: flex; flex-direction: row; flex-wrap: nowrap; gap: 15px; align-items: flex-start; background: #fff; padding: 15px 40px 15px 15px; border: 1px solid #DFDFDF; border-radius: 4px; }
#bloc_boost .iboost { width: 60px; height: 60px; display: flex; justify-content: center; align-items: center; background: #F0EFF0; border-radius: 50%; }
#bloc_boost .iboost img { width: 35px; height: 35px; }
#bloc_boost .content { max-width: calc(100% - 75px); font-size: 14px; line-height: 20px; }
#bloc_boost .content p:first-of-type { font-weight: 600; }
#bloc_boost .content p:first-of-type span.label { margin-left: 8px; }
#bloc_boost .content p:not(:last-of-type) { margin-bottom: 8px; }
#bloc_boost .content p:last-of-type { margin-bottom: 0; }
#bloc_boost .content p.warning { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 0 8px; color: #f60; }
#bloc_boost .content ul { margin: 0 0 10px 20px; }
#bloc_boost .content ul li { margin-bottom: 5px; }
#bloc_boost .content .btn-list { display: flex; flex-direction: row; flex-wrap: nowrap; gap: 30px; margin-top: 18px; }
#bloc_boost .content .btn-list button { height: 40px; white-space:nowrap; }
#bloc_boost .content .btn-list a { height: 18px; white-space:nowrap; }
#bloc_boost .content .btn-list ul { list-style: none; display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px 20px; justify-content: flex-start; margin: 0 0 0 23px; }
#bloc_boost .content .btn-list ul li { position: relative; width: calc(50% - 10px); /*330*/ max-width: calc(50% - 10px); }
#bloc_boost .content .btn-list ul li:before { position: absolute; content: url(../img/panel2k24/check_vert.svg); width: 15px; height: 15px; left: -23px; top: 2px; }
#bloc_boost #close_boost { position: absolute; content: ''; width: 12px; height: 12px; top: 15px; right: 15px; opacity: 0.5; cursor: pointer; }

.boost2 #bloc_boost { justify-content: space-between; align-items: center; padding: 15px; border-radius: 5px; }
.boost2 #bloc_boost .content { max-width: 840px; }
.boost2 #bloc_boost .content.full-w { max-width: unset; }
.boost2 #bloc_boost .left-f { display: flex; flex-direction: row; align-items: center; gap: 15px; }
.boost2 #bloc_boost .left-f.atop { align-items: flex-start; }
.boost2 #bloc_boost a:hover { cursor: pointer; }
.boost2 #bloc_boost a,
.boost2 #bloc_boost button { min-width: max-content; }
.boost2 #bloc_boost .content p.big:first-of-type { font-size: 18px; line-height: 28px; font-weight: 700; }
.boost2 #bloc_boost .content p + ul { margin-top: 8px; }
.boost2 #bloc_boost .content .flex { display: flex; flex-direction: row; justify-content: flex-start; gap: 20px; align-items: center; margin-top: 15px; }
.boost2 #bloc_boost .content .flex ul { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; gap: 0 20px; align-items: center; list-style-image: none; list-style-type: none; }
.boost2 #bloc_boost .content .flex ul li { position: relative; width: calc((100% - 70px) /2); list-style-image: none; padding-left: 20px; }
.boost2 #bloc_boost .content .flex ul li:before { content: ""; position: absolute; width: 15px; height: 11px; left: 0px; top: 5px; background: url(../img/panel2k24/check_vert.svg) no-repeat 50% 50% / contain; }

@media(max-width: 1199px) {
    .sp9k24, .sp3k24 { width: 940px; }
    #bloc_boost .content .btn-list ul li { width: 306px; }
	.boost2 #bloc_boost .content { max-width: calc(100% - 75px); }
    .boost2 #bloc_boost .iboost { width: 60px; }
    .boost2 #bloc_boost .content.full-w { max-width: calc(100% - 75px); }
    .boost2 #bloc_boost .content .flex { flex-direction: column; align-items: flex-start; gap: 10px; }
    .boost2 #bloc_boost .content .flex form { order: 2; }
    .boost2 #bloc_boost .content .flex ul { order: 1; justify-content: flex-start; gap: 10px; margin: 0; }
    .boost2 #bloc_boost .content .flex ul li { width: 100%; }
}

@media(max-width: 979px) {
    .sp9k24, .sp3k24 { width: 724px; }

    #bloc_boost .content .btn-list { flex-direction: column; gap: 15px; }
    #bloc_boost .content .btn-list button { order: 2; width: max-content; }
    #bloc_boost .content .btn-list ul { order: 1; flex-direction: column; }
    #bloc_boost .content .btn-list ul li { width: 100%; max-width: 100%; }
}


@media(max-width: 979px) AND (min-width: 768px) {
    div.row.dashboard div.span9 { width: 724px; }
}

@media(max-width: 767px) {
    .sp9k24, .sp3k24 { width: 100%; }
    #bloc_boost .content p.warning { justify-content: center; }
    #bloc_boost .content ul { list-style: none; padding-left: 0; display: flex; flex-direction: column; align-items: center; }
    #bloc_boost .content ul li::before { position: relative; content: '•'; font-size: 18px; top: 2px; margin-right: 8px; }

    .boost2 #bloc_boost { flex-direction: column; }
    .boost2 #bloc_boost .left-f { flex-direction: column; }
    .boost2 #bloc_boost .content { max-width: 100%; text-align: center; }

    .flex-radio { flex-wrap: wrap; justify-content: center; }
    .container-radio input:checked + label { white-space: nowrap; }
    .boost2 #bloc_boost .left-f.atop { align-items: center; }

    .boost2 #bloc_boost .content .flex { align-items: center; margin-top: 30px; }
    .boost2 #bloc_boost .content .flex ul { flex-direction: column; flex-wrap: nowrap; }
    .boost2 #bloc_boost .content .flex ul li { width: max-content; }
}


/************************************/
/*** Dashboard Icone Rounded 2k24 ***/
/************************************/

div.row.dashboard div.widget-content.section-tools { padding: 15px !important; }
div.row.dashboard div.s-tools { display: flex; flex-direction: row; flex-wrap: wrap; gap: 15px 30px; align-items: center; justify-content: flex-start; margin: 0; padding: 0; }
div.row.dashboard div.s-tools > .s-item { position: relative; display: flex; flex-direction: row; flex-wrap: nowrap; gap: 10px; align-items: center; width: calc((100% - 120px) / 4) !important; text-decoration: none !important; margin: 0; }
div.row.dashboard div.s-tools > .s-item:hover { cursor: pointer; }
div.row.dashboard div.s-tools > .s-item .img-item { display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; background: #F0EFF0; border-radius: 50%; }
div.row.dashboard div.s-tools > .s-item .img-item > img { width: 30px; height: 30px; }
div.row.dashboard div.s-tools > .s-item .img-item + .shortcut-label { width: calc(100% - 60px); font-size: 14px; line-height: 20px; font-weight: 400; color: #464F57; margin: 0; }
div.row.dashboard div.s-tools > .s-item:hover .img-item + .shortcut-label { color: #08c; }

div.row.dashboard div.s-tools > .s-item:hover .img-item + .shortcut-label { text-decoration: underline; font-weight: 500; }

@media(max-width: 1199px) {
    div.row.dashboard div.s-tools > .s-item { width: calc((100% - 90px) / 3) !important; }
}

@media(max-width: 979px) {
    div.row.dashboard div.s-tools > .s-item { width: calc((100% - 60px) / 2) !important; }
}

@media(max-width: 767px) {
    div.row.dashboard div.s-tools > .s-item { min-width: max-content; width: calc((100% - 60px) / 2) !important; max-width: 100%; }
}

@media(max-width: 450px) {
    div.row.dashboard div.s-tools > .s-item { min-width: unset; width: 100% !important; max-width: 100%; }
}


/**************************************/
/*** Right grid - Infos Domain 2k24 ***/
/**************************************/

.widget-content div.info-domaine button { margin-top: 15px !important; }
.widget-content div.info-domaine button,
.guides-btn { display: flex; flex-direction: row; flex-wrap: nowrap; gap: 8px; align-items: center; justify-content: center; font-size: 14px; line-height: 24px; width: max-content; margin: 15px auto 0; }
.txtfieldmidhead4,
.txtfieldmidhead4 strong { font-weight: 600 !important; }
.w-custom { width: auto !important; }
.widget-parrain .widget-header { position: relative; }
.widget-parrain .widget-header img { position: absolute; width: 12px; height: 12px; right: 20px; top: 50%; transform: translateY(-50%); opacity: 0.6; }
.widget-parrain .widget-header img:hover { cursor: pointer; }

@media(max-width: 979px) {
    #screenshot_container { max-width: 330px; margin: auto; }
    .w-custom { width: max-content !important; max-width: 100%; margin: auto; }
}

@media(max-width: 979px) AND (min-width: 768px){
    div.row.dashboard div.span3 { width: 724px; }
    .span3 { display: flex; flex-direction: row; flex-wrap: wrap; gap: 0 20px; justify-content: center; }
    .span3 .widget { width: 100%; }
    .span3 .widget.widget.bloc-blue .widget-header { height: unset !important; }
    .span3 .widget50 { width: calc(50% - 10px); }
}


/*******************/
/*** Quotas 2k24 ***/
/*******************/

.bloc_quotas { border: 1px solid #ddd; border-radius: 5px; padding: 0; width: 570px; }
.quotas_header { background: #f7f7f7 !important; padding: 15px; }
.quotas_header i { display: inline-block; }
.quotas_header h3 { display: inline-block; margin: 0 !important; font-size: 16px; font-weight: 700; font-family: Arial; }
.quotas_header span { display: inline-block; margin: 0 !important; font-size: 14px; font-weight: 700; font-family: Arial; }
.quotas_content { background: white; font-size: 14px; line-height: 14px; font-family: Arial; border-bottom: 1px solid #ddd; padding: 15px 15px 3px; }
.quotas_content span:first-child { color: #1e499b; font-weight: 600 !important; }
.quotas_content p { margin: 10px 0 !important; }
.quotas_content p.only_txt { margin: 0 0 10px !important; }
.quotas_content a.copy_quota { margin-right: 4px; text-decoration: none !important; }
.quotas_content a.copy_quota img { width: 14px; height: 14px; }
progress { -webkit-appearance: none; }
::-webkit-progress-bar { background-color: #dfdfdf; border-radius: 5px; }
.quotas_content progress[value] { width: 100%; height: 10px; border: 0px; border-radius: 5px; }
.quotas_content progress::-webkit-progress-value { background: #393; border-radius: 5px; }
.quotas_content progress::-moz-progress-bar { background: #393; border-radius: 5px; }	
progress.warning::-webkit-progress-value { background: #FF6600; border-radius: 5px; }
progress.warning::-moz-progress-bar { background: #FF6600; border-radius: 5px; }	
progress.danger::-webkit-progress-value { background: #F14235; border-radius: 5px; }
progress.danger::-moz-progress-bar { background: #F14235; border-radius: 5px; }	
progress.success::-webkit-progress-value { background: #393; border-radius: 5px; }
progress.success::-moz-progress-bar { background: #393; border-radius: 5px; }	
.quota_number { display: flex; align-items: center; justify-content: space-between; }
.quota_number > div { display: flex; align-items: center; }
img.infinite { position: relative; top: -1px; width: 17px; height: 17px; display: inline-block; }
.quota_number .floatr { display: flex; flex-direction: row; gap: 5px; }
.quota_number .floatr img { width: 15px; height: 14px; }
.quotas_content p.warning img { position: relative; width: 15px; height: 14px; top: 2px; }
.quotas_content p.warning { display: flex; flex-direction: row; gap: 5px; align-items: baseline; font-size: 14px; line-height: 20px; margin: 7px 0 12px !important; }
.quotas_content p.warning span.txt_danger { color: #F14235; }
.quotas_content p.warning span.txt_warning { color: #F60; }
.quotas_content i.custom-tooltip.tooltip-lg { background: transparent; }
.quotas_content i.custom-tooltip.tooltip-lg img { top: -2px; left: 50%; transform: translateX(-50%); width: 14px; height: 14px; }
.quotas_content i.custom-tooltip.tooltip-lg:hover { cursor: pointer; }
.quotas_content.only_link { padding: 15px; }
.quotas_content.only_link a { color: #0088CC; text-decoration: underline !important; }
a.url_quota { text-decoration: none !important; color: inherit; }
.quotas_content.flex_quota { display: flex; flex-direction: row; flex-wrap: nowrap; gap: 0 8px; align-items: baseline; padding: 15px; }
.quotas_content.flex_quota div.left { width: 15px; }
.quotas_content.flex_quota div.right p { margin: 0 0 8px 0 !important; }


/********************/
/*** Tableau 2k24 ***/
/********************/

table.table2k24.w100 { width: 100%; }
table.table2k24:not(.datatable) thead tr th { text-align: left; background-color: #fff !important; font-weight: 600; }
table.table2k24:not(.datatable) tbody tr td { text-align: left; }
table.table2k24:not(.datatable) tbody tr:nth-child(2n+1) td { background: #F7F7F7; }
table.table2k24:not(.datatable) tbody tr:nth-child(2n) td { background: #FFF; }
table.table2k24.td-white:not(.datatable) tbody tr:nth-child(2n+1) td { background: #FFF; }

table.table2k24.dataTable tbody tr:nth-child(2n+1) td { background: #FFF; }
table.table2k24.dataTable thead tr th { font-weight: 600; }
table.table2k24.dataTable thead tr th,
table.table2k24.dataTable tbody tr td { text-align: left !important; }
table.table2k24.dataTable thead tr th.wauto,
table.table2k24.dataTable tbody tr td.wauto { width: auto !important; }
table.table2k24.dataTable thead tr th.wmax,
table.table2k24.dataTable tbody tr td.wmax { width: max-content !important; }
table.table2k24.last-bordered tbody tr:last-of-type td { border-bottom: 1px solid #ddd !important; }
table.table2k24.dataTable tbody tr td img.logo_mail { height: 14px; width: auto; margin-right: 4px; }
table.table2k24.dataTable tbody tr td img.icon_link { height: 14px; width: auto; }
table.table2k24.dataTable tbody tr td .label.dblock { display: block; width: max-content; max-width: 100%; margin-top: 4px !important; }
table.table2k24.dataTable tbody tr td .little_desc { font-size: 14px; display: block; width: max-content; max-width: 100%; margin-top: 4px !important; }
table.table2k24.dataTable tbody tr td div.redirect_mail { display: flex; flex-direction: row; flex-wrap: nowrap; gap: 0 8px; align-items: center; margin: 5px 0 0; }
table.table2k24.dataTable tbody tr td div.redirect_mail img { width: 15px; height: 9px; }
table.table2k24.dataTable tbody tr td .quota-info .quotas_content p.title { font-size: 14px; line-height: 20px; font-weight: 600; margin-bottom: 4px !important; }
table.table2k24.dataTable tbody tr td .quota-info .quotas_content .quota_number { justify-content: flex-start; gap: 8px; align-items: center; }
table.table2k24.dataTable tbody tr td .quota-info .quotas_content .quota_number.text-danger { color: #F14235; }
table.table2k24.dataTable tbody tr td .quota-info .quotas_content .quota_number.text-warning { color: #F60; }
table.table2k24.dataTable tbody tr td .quota-info .quotas_content .quota_number i,
table.table2k24.dataTable thead tr th i { position: relative; width: 14px; height: 14px; top: 0; border: 0; background: #fff; cursor: help; }
table.table2k24.dataTable thead tr th i { margin-left: 8px; }
table.table2k24.dataTable tbody tr td .quota-info .quotas_content .quota_number img.warning { width: 15px; height: 14px; }
table.table2k24.dataTable tbody tr td .quota-info .quotas_content .quota_number i img,
table.table2k24.dataTable thead tr th i img { width: 14px; height: 14px; }
table.table2k24.dataTable tbody tr td .quota-info .quotas_content .quota_number i .tooltiptext,
table.table2k24.dataTable thead tr th i .tooltiptext { max-width: 300px; }
table.table2k24.dataTable tbody tr td .quota-info .quotas_content p progress { margin: 4px 0; max-width: 120px; }
table.table2k24.dataTable tbody tr td .quota-info.quota-duo { display: flex; flex-direction: row; flex-wrap: wrap; gap: 20px 40px; }
table.table2k24.dataTable tbody tr td .quota-info.quota-duo .quotas_content { min-width: 130px; }
table.table2k24.dataTable tbody tr td .quota_v2 { display: flex; flex-direction: row; gap: 0 10px; align-items: center; }
table.table2k24.dataTable tbody tr td .quota_v2 .label_quota span { display: block; font-weight: 600; }
table.table2k24.dataTable tbody tr td .quota_v2 .label_quota span:first-of-type { margin-bottom: 8px; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar { position: relative; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar progress { display: block; max-width: 60px; height: 10px; cursor: pointer; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar progress:first-of-type { margin-bottom: 18px; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar progress:hover ~ .tooltip-quota { display: flex; }

table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar .tooltip-quota { display: none; flex-direction: row; position: absolute; content: ''; top: -100px; right: 0; width: max-content; border: 1px solid #DFDFDF; border-radius: 5px; padding: 15px; background: #fff; box-shadow: 5px 5px 20px #000D2926; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar .tooltip-quota .quota-nbr { padding-right: 15px; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar .tooltip-quota .quota-stock { padding-left: 15px; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar .tooltip-quota .quota-nbr { border-right: 1px solid #D5D5D5; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar .tooltip-quota p.title { margin: 0 0 2px; font-weight: 600; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar .tooltip-quota p.quota_number { margin: 0 0 5px; font-weight: 400; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar .tooltip-quota p.quota_number img.warning { width: 15px; height: auto; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar .tooltip-quota progress { max-width: 100%; margin: 0; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar .tooltip-quota::before { bottom: -13px; right: 15px; border: 1px solid transparent; border-top-color: transparent; border-top-width: 1px; border-right-color: transparent; border-right-width: 1px; border-bottom-color: transparent; border-bottom-width: 1px; border-left-color: transparent; border-left-width: 1px; border-top-width: medium; border-right-width: medium; border-bottom-width: medium; border-left-width: medium; border-top-color: #ccc; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-width: 7px; margin-left: -14px; }
table.table2k24.dataTable tbody tr td .quota_v2 .progress-bar .tooltip-quota::after { bottom: -12.5px; right: 15px; border: 1px solid transparent; border-top-color: transparent; border-top-width: 1px; border-right-color: transparent; border-right-width: 1px; border-bottom-color: transparent; border-bottom-width: 1px; border-left-color: transparent; border-left-width: 1px; border-top-width: medium; border-right-width: medium; border-bottom-width: medium; border-left-width: medium; border-top-color: #fff; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-width: 7px; margin-left: -13px; }

table.table2k24.dataTable tbody tr { position: relative; z-index: 1; }
table.table2k24.dataTable tbody tr:hover { box-shadow: inset 1px 0 0 #dadce0, inset -1px 0 0 #dadce0, 0 1px 2px 0 rgba(60,64,67,.3), 0 1px 3px 1px rgba(60,64,67,.15); z-index: 2; }
table.table2k24.dataTable tbody tr:hover td { position: relative; border-top: 1px solid #CCCCCC; border-bottom: 1px solid #CCCCCC; /*background: #F7F7F7;*/ }
/*table.table2k24.dataTable tbody tr:hover td:first-child { border-left: 1px solid #CCCCCC; }
table.table2k24.dataTable tbody tr:hover td:last-child { border-right: 1px solid #CCCCCC; }*/
table.table2k24.dataTable tbody tr td.action { position: relative; }
table.table2k24.dataTable tbody tr td.action img { cursor: pointer; }
table.table2k24.dataTable tbody tr td.action img:hover { filter: invert(0.05); }
table.table2k24.dataTable tbody tr td.action div.action-menu { display: none; position: absolute; z-index: 99; width: max-content; top: 0; right: 25px; flex-direction: column; gap: 0; align-items: flex-start; border: 1px solid #DFDFDF; border-radius: 5px; box-shadow: 5px 5px 20px #000D2926; background: #FFF; padding: 7.5px 0; }
table.table2k24.dataTable tbody tr td.action div.action-menu a.menu-elem { white-space: nowrap; width: calc(100% - 30px); color: #464F57; text-decoration: none; padding: 7.5px 15px; }
table.table2k24.dataTable tbody tr td.action div.action-menu a.menu-elem:hover { background-color: rgba(28, 70, 157, 0.1); text-shadow: 0 0 0.02px black; }
table.table2k24.dataTable tbody tr td.state img { width: 15px; height: 15px; }
table.table2k24.dataTable tbody tr td div.label-block { display: flex; flex-direction: row; align-items: center; margin-top: 5px; gap: 0 5px; }
table.table2k24.dataTable tbody tr td div.label-block i.custom-tooltip.tooltip-lg { background: transparent; cursor: pointer; border: 0; top: 2px; }
table.table2k24.dataTable tbody tr td div.label-block i.custom-tooltip.tooltip-lg img { top: -2px; left: 50%; transform: translateX(-50%); width: 14px; height: 14px; }

/*** Tableau Quota Mutu ***/
#Liste_quota.table2k24 { width: 100%; table-layout: fixed; }
#Liste_quota.table2k24 th:nth-child(2),
#Liste_quota.table2k24 td:nth-child(2) { width: 150px; }
#Liste_quota.table2k24 th:nth-child(3),
#Liste_quota.table2k24 td:nth-child(3) { width: 220px; }

/*** Datatable Visual ***/
table.table2k24.dataTable div.tips { position: relative; cursor: pointer; width: max-content; }
table.table2k24.dataTable div.tips.d-inline-block { display: inline-block; margin-right: 5px; }
table.table2k24.dataTable div.tips:hover:after { content: attr(data-tooltip); position: absolute; max-width: 400px; width: max-content; bottom: 20px; left: 50%; transform: translateX(-50%); display: block; padding: 10px; font-size: 14px; line-height: 20px; background: #fff; border: 1px solid #08c; border-radius: 5px; z-index: 99; }
table.table2k24.dataTable thead .sorting_asc,
table.table2k24.dataTable thead .sorting_desc,
table.table2k24.dataTable thead .sorting { padding: 20px !important; }
table.table2k24.dataTable thead tr th { padding: 20px !important; }
table.table2k24.dataTable tbody tr td { padding: 15px 20px !important; }

table.table2k24 { table-layout: auto; }
table.table2k24.dataTable thead tr th.state { width: 50px !important; }
table.table2k24.dataTable thead tr th.action,
table.table2k24.dataTable tbody tr td.action { width: 35px !important; }

@media (min-width: 1200px) {
    table.table2k24.dataTable thead tr th.quota_mail,
    table.table2k24.dataTable tbody tr td.quota_mail { width: 310px; }
}

@media (max-width: 1199px) AND (min-width: 768px) {
    table.table2k24.dataTable thead tr th.quota_mail,
    table.table2k24.dataTable tbody tr td.quota_mail { width: 197px; }
}

@media (max-width: 979px) {
    table.table2k24.dataTable tbody tr:hover { box-shadow: none; }
    table.table2k24.dataTable tbody tr:hover td { border-top: 1px solid #ddd; border-bottom: 0; }
}

@media (max-width: 767px) {
    table.table2k24.dataTable tbody tr td.action,
    table.table2k24.dataTable tbody tr td.quota_mail { width: auto !important; }
    table.table2k24.dataTable tbody tr:hover td { border-top: 0; }
}

table.table2k24.dataTable thead .sorting_asc:after,
table.table2k24.dataTable thead .sorting_desc:after,
table.table2k24.dataTable thead .sorting:after { margin-left: 10px; }

/*** Datatable Elements ***/
.widget-content.padlr0 .dataTables_length { margin-left: 20px; }
.widget-content.padlr0 .dataTables_filter,
.widget-content.padlr0 .dataTables_paginate { margin-right: 20px; }

@media(max-width: 1199px) {
    /*** Tableau Résumé Mail ***/
    #ListingMail.table2k24 tbody tr td .quota-info.quota-duo { flex-direction: column; gap: 20px 0; }
}

@media (max-width: 979px) and (min-width: 768px) {
    table.table2k24.dataTable tbody tr td .label.dblock { display: block !important; }
    table#Listing_mysql thead tr th:nth-child(1), table#Listing_mysql tbody tr td:nth-child(1) { word-break: unset !important;	}

    /*** Tableau Résumé Mail ***/
    #ListingMail.table2k24 thead tr th:nth-child(2),
    #ListingMail.table2k24 tbody tr td:nth-child(2),
    #ListingMail.table2k24 thead tr th:nth-child(4),
    #ListingMail.table2k24 tbody tr td:nth-child(4) { display: table-cell !important; }
    #ListingMail.table2k24 tbody tr td:nth-child(4):before { display: none !important; }
    #ListingMail.table2k24 thead tr th:nth-child(4),
    #ListingMail.table2k24 tbody tr td:nth-child(4) { min-width: 35px !important; width: 35px !important; padding: 0 20px !important; }
}

@media (max-width: 767px) {
    table.table2k24:not(.datatable) { table-layout: auto !important; }
    table.table2k24.dataTable thead { display: none; }
    table.table2k24.dataTable tbody tr { display: block; padding: 20px 0; border-bottom: 2px solid #1c469d ; }
    table.table2k24.dataTable tbody tr:first-child { padding-top: 0; }
    table.table2k24.dataTable tbody tr:last-child { padding-bottom: 0; border-bottom: none; }
    table.table2k24.dataTable tbody tr:hover td { background: #fff; }
    table.table2k24.dataTable tbody tr td,
    table.table2k24.dataTable tbody tr td:before { display: block; border: none; text-align: center !important; max-width: 100% !important; }
    table.table2k24.dataTable tbody tr td .label.dblock,
    table.table2k24.dataTable tbody tr td .little_desc { margin: 4px auto 0; }
    table.table2k24.dataTable tbody tr td .quota-info .quotas_content .quota_number { justify-content: center; margin: 4px 0 !important; }
    table.table2k24.dataTable tbody tr td.action div.action-menu { right: unset; left: 50%; transform: translateX(-50%); }
    table.table2k24.dataTable tbody tr td .quota-info .quotas_content .quota_number i .tooltiptext { max-width: 200px; z-index: 999; }

    /*** Table Listing MySQL ***/
    table#Listing_mysql.table2k24.dataTable tbody tr td:nth-child(1):before { content: 'Utilisateur'; font-weight: 600; }
    table#Listing_mysql.table2k24.dataTable tbody tr td:nth-child(2):before { content: 'Base'; font-weight: 600; }
    table#Listing_mysql.table2k24.dataTable tbody tr td:nth-child(3):before { content: 'IP serveur'; font-weight: 600; }
    table#Listing_mysql.table2k24.dataTable tbody tr td:nth-child(4) { display: block !important; }
    table#Listing_mysql.table2k24.dataTable tbody tr td:nth-child(4):before { content: 'Quota'; font-weight: 600; }
    table#Listing_mysql.table2k24.dataTable tbody tr td:nth-child(5):before { content: 'Actions' !important; font-weight: 600; }
    table#Listing_mysql.table2k24.dataTable tbody tr td:nth-child(5) a:before { content: '' !important; }

    /*** Table Listing Mail ***/
    table#ListingMail.table2k24.dataTable tbody tr td:nth-child(1):before { content: 'Boites mail & Redirections simples'; font-weight: 600; }
    table#ListingMail.table2k24.dataTable tbody tr td:nth-child(2) { display: block; text-align: center; }
    table#ListingMail.table2k24.dataTable tbody tr td:nth-child(2):before { display: inline-block; content: 'État :'; font-weight: 600; margin-right: 4px; }
    table#ListingMail.table2k24.dataTable tbody tr td:nth-child(2) img { position: relative; top: -2px; }
    table#ListingMail.table2k24.dataTable tbody tr td:nth-child(3),
    table#ListingMail.table2k24.dataTable tbody tr td:nth-child(4) { display: block !important; }
    table#ListingMail.table2k24.dataTable tbody tr td:nth-child(3):empty,
    table#ListingMail.table2k24.dataTable tbody tr td:nth-child(4):empty { display: none !important; }
    table#ListingMail.table2k24.dataTable tbody tr td:nth-child(4):before { display:block; content: 'Actions'; text-align: center; font-weight: 600; }
    table#ListingMail.table2k24.dataTable tbody tr td .quota-info.quota-duo { gap: 30px 0; }
    table#ListingMail.table2k24.dataTable tbody tr td div.redirect_mail { justify-content: center; margin: 5px 0 0; }
}

@media(max-width: 499px) {
    /*** Uniquement pour la table des paramètres mails ***/
    table.table2k24.param_mail_table { margin-top: 30px; }
    table.table2k24.param_mail_table thead { display: none; }
    table.table2k24.param_mail_table tbody tr td { display: block; text-align: center; padding: 7.5px 10px; }
    table.table2k24.param_mail_table tbody tr td:not(:first-of-type) { border-top: 0; }
    table.table2k24.param_mail_table tbody tr td:first-of-type { font-weight: 700; padding: 15px 10px 7.5px; }
    table.table2k24.param_mail_table tbody tr td:last-of-type { padding: 7.5px 10px 15px; }
    table.table2k24.param_mail_table tbody tr td:nth-child(2):before { display: inline-block; content: 'Hôte :'; text-decoration: underline; margin-right: 4px; }
    table.table2k24.param_mail_table tbody tr td:nth-child(3):before { display: inline-block; content: 'Port :'; text-decoration: underline; margin-right: 4px; }
    table.table2k24.param_mail_table tbody tr td:nth-child(4):before { display: inline-block; content: 'Chiffrement :'; text-decoration: underline; margin-right: 4px; }
}


/******************/
/*** Modal 2k24 ***/
/******************/

div.modal .modal-body .desc_code { font-size: 14px; line-height: 20px; margin-bottom: 20px; }
div.modal .modal-body .title_code { font-size: 14px; line-height: 20px; font-weight: 600; margin-bottom: 5px; }
div.modal .modal-body .share_code { background: #F7F7F7; padding: 12px 15px; border-radius: 5px; word-break: break-word; box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px; }


/*******************************/
/*** Table Price Widget 2k24 ***/
/*******************************/

.widget-content .flex_table { display: flex; flex-direction: row; gap: 20px; justify-content: center; align-items: baseline; }
.widget-content .flex_telem { width: 240px; max-width: 100%; border: 1px solid #DFDFDF; border-radius: 5px; padding: 30px 20px 20px; }
.widget-content .flex_telem div.title { font-size: 18px; line-height: 26px; font-weight: 700; text-align: center; margin-bottom: 10px; }
.widget-content .flex_telem .price { font-size: 14px; line-height: 20px; text-align: center; margin-bottom: 10px; }
.widget-content .flex_telem .price strong { font-size: 30px; line-height: 40px; font-weight: 600; }
.widget-content .flex_telem a.btn-crea,
.widget-content .flex_telem a.btn-cmde { width: calc(100% - 32px); text-align: center; margin-bottom: 30px; }
.widget-content .flex_telem a.btn-cmde { background: #f60; color: #fff; border-color: #f60; background-image: none; }
.widget-content .flex_telem a.btn-cmde:hover { opacity: 0.8; }
.widget-content .flex_telem a.btn-crea img { width: 15px; height: 15px; display: inline-block; position: relative; top: -2px; margin-right: 8px; }
.widget-content .flex_telem ul { list-style: none; margin: 0; }
.widget-content .flex_telem ul li { position: relative; font-size: 14px; line-height: 20px; margin-bottom: 10px; margin-left: 23px; }
.widget-content .flex_telem ul li:last-of-type { margin-bottom: 0; }
.widget-content .flex_telem ul li:before { content: url(../img/panel2k24/check_vert.svg); position: absolute; left: -23px; top: 2px; width: 15px; height: 11px; }
.widget-content .flex_telem ul li.nop:before { content: url(../img/connexion/croix_rouge.svg); }
.widget-content .flex_telem ul li strong { font-weight: 600; }

@media(max-width: 575px) {
    .widget-content .flex_table { flex-direction: column; align-items: center; }
}


/*********************/
/*** FAQ Mail 2k24 ***/
/*********************/

.widget-content ul.list-faq { margin: 0 0 30px 0; }
.widget-content ul.list-faq li { font-size: 14px; line-height: 20px; margin-bottom: 8px; margin-left: 18px; }
.widget-content ul.list-faq li:last-of-type { margin-bottom: 0; }
.widget-content .ask:not(:last-of-type) { margin-bottom: 30px; }
.widget-content .ask .title_ask { font-size: 14px; line-height: 20px; font-weight: 600; margin-bottom: 8px; }


/***********************/
/*** Formulaire 2k24 ***/
/***********************/

form.form2k24 { display: flex; flex-direction: column; width: 100%; align-items: flex-start; gap: 20px; }
form.form2k24.wauto { width: max-content; max-width: 100%; margin: 0 auto; }
form.form2k24.w60 { width: 60%; max-width: 100%; margin: 0 auto; }
form.form2k24.gap30 { gap: 30px !important; }
form.form2k24.gap15 { gap: 15px !important; }
#form_crea_cp { width: 663px; }

/*** Form Input 2k24 ***/
form.form2k24 .form-input { width: 100%; }
form.form2k24 .form-input .control-group,
form.form2k24 .form-input .control-group input { margin-bottom: 0; }
form.form2k24 .form-input .control-group label { font-size: 14px; line-height: 20px; font-weight: 600; }
form.form2k24 .form-input .control-group input:not([type="submit"]),
form.form2k24 .form-input .control-group select { width: -webkit-fill-available; margin-bottom: 0; }
form.form2k24 .form-input .control-group .input-append { width: 100%; margin-bottom: 0; }
form.form2k24 .form-input .btn-center { margin: 0 0 5px !important; }
form.form2k24 .form-input .btn-center.multiple { display: flex; flex-direction: row; flex-wrap: wrap; gap: 20px 10px; justify-content: center; align-items: center; }
form.form2k24 .form-input .btn-center input[type="submit"] { display:block; margin: auto; }
form.form2k24 .form-input .btn-center.multiple * { margin: 0 !important; }
form.form2k24 .form-input .btn-plus { position: relative; background-image: url(../img/panel2k24/plus_bouton.svg); background-size: 14px; background-position: 12px 50%; background-repeat: no-repeat; padding: 9px 12px 9px 30px !important; width: 94px !important; }
/*form.form2k24 .package_mode { display: none; }*/
/*form.form2k24 .form-input .btn-plus:before { position: absolute; content: url(../img/panel2k24/plus_bouton.svg); width: 14px; height: 14px; left: 15px; top: 50%; transform: translateY(-50%); }*/

/*** Form Select 2k24 ***/
form.form2k24 select { appearance: none; font-size: 14px; line-height: 20px; border: 1px solid #D5D5D5; border-radius: 5px; padding: 8px 15px; margin: 0; background-image: url(../img/panel2k24/chevron_select.svg); background-repeat: no-repeat; background-position: right 15px center; background-size: 12px 6px; }

/*** Form Inline 2k24 ***/
form.form2k24.inline-form { display: flex; flex-direction: row; gap: 0 10px; justify-content: flex-start; align-items: flex-end; width: 100%; }
form.form2k24.inline-form .form-input { width: auto; }
form.form2k24.inline-form .form-input .btn-center { margin: 0 !important; }

/*** Form ssdomaine 2k24 ***/
form#form_add_ssdomaine.form2k24 { width: 100%; align-items: end; }
form#form_add_ssdomaine.form2k24 .form-input:not(.form-btn) { width: calc((100% - 124px) / 2); }
form#form_add_ssdomaine.form2k24 .form-input.form-btn { width: 94px; }
form#form_add_ssdomaine.form2k24 .form-input.form-btn .btn-center { margin: 0 !important; }
form#form_add_ssdomaine.form2k24 .form-input.form-btn .btn-center input[type="submit"] { width: 100%; }

@media (max-width: 767px) {
    form#form_add_ssdomaine.form2k24 { flex-direction: column; align-items: center; gap: 20px; }
    form#form_add_ssdomaine.form2k24 .form-input { width: 95% !important; }
}


/*** Form Add Multidomaine ***/
@media (max-width: 1199px) {
    form#form_add_multidom { flex-direction: column; align-items: center; }
}

@media (max-width: 500px) {
    form#form_add_multidom .form-input { max-width: 100%; }
}


/*** Form Transform 2k24 ***/
form.form2k24 .transform { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 15px; }
form.form2k24 .transform .form-input { width: calc(50% - 18px); }
form.form2k24 .transform .separator { width: 6px; }
form.form2k24 .transform .separator img { position: relative; top: 10px; width: 100%; height: auto; }

/*** Select + Input ***/
select#protocole { display: inline-block; width: 100px; border-top-right-radius: 0; border-bottom-right-radius: 0; }
select#protocole + input { display: inline-block; width: calc(100% - 129px); border-left: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; }

/*** Radio 2k24 ***/
.flex-radio { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 30px; }
.flex-radio.no-label { margin-top: 0; }
.flex-radio:before,
.flex-radio:after { display: none; }
.container-radio { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: center; }
.container-radio input { position: absolute; opacity: 0.01; padding: 0 !important; margin: 0; }
.container-radio label { position: relative; width: 100%; font-size: 14px; line-height: 20px; font-weight: 400; white-space: nowrap; background: #F0EFF0; border: 1px solid #D5D5D5; border-radius: 5px; padding: 8px 14px 8px 41px !important; margin: 0; }
.container-radio label.disabled { color: rgba(70, 79, 87, 0.5); background: rgba(240, 239, 240, 0.55); border: 1px solid rgba(213, 213, 213, 0.55); cursor: not-allowed; }
.container-radio label:before { position: absolute; content: url(../img/panel2k24/radio_vide.svg); left: 15px !important; top: 9px !important; width: 18px; height: 18px; }
.container-radio input:checked + label { background: #fff; border: 2px solid #0088CC; padding: 7px 15px 7px 41px !important; }
.container-radio input:checked + label:before { content: url(../img/panel2k24/radio.svg); left: 15px; top: 8px; }
.flex-radio:not(.no-label) .container-radio:first-of-type:before { position: absolute; content: attr(data-label); top: -25px; left: 0; font-size: 14px; line-height: 20px; font-weight: 600; width: max-content; }
.flex-radio:not(.no-label) .container-radio.warning:first-of-type:before { color: #FF6600; font-weight: 400 !important; margin-left: 20px; }
.flex-radio:not(.no-label) .container-radio.warning:first-of-type:after { position: absolute; content: url(../img/connexion/warning_orange.svg); top: -25px; left: 0; width: 15px; height: 13.5px; }
.flex-radio:not(.no-label) .container-radio.danger:first-of-type:before { color: #F14235; font-weight: 400 !important; margin-left: 20px; }
.flex-radio:not(.no-label) .container-radio.danger:first-of-type:after { position: absolute; content: url(../img/connexion/warning_rouge.svg); top: -25px; left: 0; width: 15px; height: 13.5px; }
.flex-radio + #info_message { display: block; width: 100%; }

.flex-radio.flex5 { gap: 20px; }
.flex-radio.flex5 .container-radio { width: calc((100% - 80px) / 5); }
.flex-radio.flex-img .container-radio label { display: flex; flex-direction: column; gap: 10px; align-items: center; padding: 20px !important; }
.flex-radio.flex-img .container-radio label img { display: block; }

@media (max-width: 979px) {
    form.form2k24 { max-width: 100% !important; }
}

@media(max-width: 767px) {
    form.form2k24.w60 { width: 400px; }
    form.form2k24 .form-input .control-group input:not([type="submit"]) { height: 40px !important; line-height: 40px; }
    .flex-radio.flex5 { flex-wrap: wrap; }
    .flex-radio.flex5 .container-radio { min-width: 120px; }
    .flex-radio + #info_message { text-align: center; }
    form.form2k24 .transform { flex-direction: column; width: 100%; }
    form.form2k24 .transform .separator { display: none; }
    form.form2k24 .transform .form-input { width: 100%; }
    select#protocole + input { width: calc(100% - 102px); }
}


/***********************/
/*** Param Mail 2k24 ***/
/***********************/

.param_mail .title16 { font-size: 16px; line-height: 26px; font-weight: 600; }
.param_mail .option { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: flex-start; gap: 20px; }
.param_mail .option .content { width: 100%; }
.param_mail .option .qr_code { min-width: 110px; }
.param_mail .option .title_option { font-weight: 600; margin-bottom: 8px; }
.param_mail .option a.btn { margin-top: 20px; }
.param_mail .option ol { margin: 0 0 10px 15px; }
.param_mail .option ol li:not(:last-of-type) { margin-bottom: 10px; }
.param_mail .option ol li strong { font-weight: 600; }
.param_mail hr { border-top: 1px solid #D5D5D5; }


/***************************/
/*** Page Quota Progress ***/
/***************************/

progress.h20 { height: 20px; width: 200px; }
progress,
progress::-webkit-progress-value { border-radius: 5px; }
progress::-moz-progress-bar { border-radius: 5px; }


/*******************************************/
/*** Page Ressources Web, MySQL & Réseau ***/
/*******************************************/

.top_ressources { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; margin-bottom: 20px; }
.top_ressources .period { display: flex; flex-direction: row; flex-wrap: nowrap; gap: 0 8px; align-items: center; justify-content: flex-end; }
.top_ressources .period select { margin-bottom: 0; }

.graph_bloc { display: flex; flex-direction: row; gap: 0; align-items: center; padding: 15px; background: #F7F7F7; border-radius: 5px; max-height: 219px; margin-bottom: 30px; }
.graph_bloc:last-of-type { margin-bottom: 0; }
.graph_bloc .graph-left { position: relative; width: calc(100% - 200px); }
.graph_bloc .graph-left canvas { width: 100% !important; height: 200px !important; }
.graph_bloc .graph-left .tooltip_chart { position: absolute; top: 0; right: 0; width: 14px; height: 14px; }
.graph_bloc .graph-left .tooltip_chart i.custom-tooltip.tooltip-lg { background: transparent; cursor: pointer; }
.graph_bloc .graph-left .tooltip_chart i.custom-tooltip.tooltip-lg img { top: -2px; left: 50%; transform: translateX(-50%); width: 14px; height: 14px; }
.graph_bloc .graph-left .tooltip_chart i.custom-tooltip.tooltip-lg span.tooltiptext { max-width: 400px; }

.graph_bloc .graph-left .tooltip_chart i.custom-tooltip .tooltiptext.tooltip-bottom { top: 20px; right: -10px; left: unset; }
.graph_bloc .graph-left .tooltip_chart i.custom-tooltip .tooltiptext.tooltip-bottom::before { top: -14px; right: 8px; left: unset; border-top-color: transparent; border-right-color: transparent; border-bottom-color: #ccc; border-left-color: transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-width: 7px; margin-left: -14px; }
.graph_bloc .graph-left .tooltip_chart i.custom-tooltip .tooltiptext.tooltip-bottom::after { top: -13px; right: 8px; left: unset; border-top-color: transparent; border-right-color: transparent; border-bottom-color:  #fff; border-left-color: transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-width: 7px; margin-left: -13px; }

.graph_bloc .graph-rounded { position: relative; width: 200px; text-align: center; }
.graph_bloc .graph-rounded strong { font-weight: 600; }
.graph_bloc .graph-rounded canvas { position: relative; width: 120px !important; height: 120px !important; margin: 0 auto 10px; }
.graph_bloc .graph-rounded .green_use { color: #339933; }
.graph_bloc .graph-rounded .orange_use { color: #ff6600; }
.graph_bloc .graph-rounded .red_use { color: #ff0000; }
.graph_bloc .graph-rounded .p_use { position: absolute; top: 40px; left: 50%; transform: translateX(-50%); color: #464F57; }
.graph_bloc .graph-rounded .p_use strong { display: block; font-size: 18px; }
.graph_bloc .graph-rounded div.content div:not(.p_use) { display: flex; flex-direction: row; flex-wrap: wrap; gap: 5px; align-items: center; justify-content: center; }

@media(max-width: 1199px) {
    .graph_bloc .graph-left { width: calc(100% - 170px); }
    .graph_bloc .graph-rounded { width: 170px; }
    .graph_bloc .graph-rounded canvas { width: 100px !important; height: 100px !important; }
    .graph_bloc .graph-rounded .p_use { top: 31px; }
}

@media(max-width: 767px) {
    .graph_bloc { flex-wrap: wrap; max-height: fit-content; gap: 30px; }
    .graph_bloc .graph-left { width: 100%; }
    .graph_bloc .graph-rounded { width: 100%; display:flex; flex-direction: row; flex-wrap: wrap; gap: 20px; justify-content: center; align-items: center; }
    .graph_bloc .graph-rounded canvas { margin: 0; }
    .graph_bloc .graph-rounded div.content { position: relative; height: 100px; display: flex; flex-direction: column; justify-content: center; }
    .graph_bloc .graph-rounded div.content * { text-align: left; }
    .graph_bloc .graph-rounded div.content .p_use { left: -70px; }
    .graph_bloc .graph-rounded div.content .p_use strong { text-align: center; }
    .graph_bloc .graph-rounded div.content div:not(.p_use) { justify-content: left; }
}

@media(max-width: 599px) {
    .top_ressources { flex-direction: column; align-items: center; }
    .top_ressources .period { flex-direction: column; align-items: center; gap: 5px; }
}


/*******************/
/*** Bouton 2k24 ***/
/*******************/

a.btn.btn-img { display: flex; width: max-content; max-width: 100%; flex-direction: row; gap: 8px; justify-content: center; align-items: center; margin: auto; }
a.active:not(.btn-danger, .btn-warning, .btn-success):hover, a.btn-info:hover { background-color: #3e72dd !important; }
a.btn[disabled], button.btn[disabled] { opacity: 0.5; cursor: not-allowed; }
a.btn-success[disabled], button.btn-success[disabled] { background-color: #339933; border-color: #339933; }


/*******************/
/*** Label Copy  ***/
/*******************/

span.label_copy { pointer-events: none; }


/******************/
/*** Quota Grey ***/
/******************/
.quota_grey { background: #F7F7F7; border-radius: 4px; margin-top: 15px; padding: 20px; }
.quota_grey .quotas_content { background: transparent; width: 220px; margin: auto; padding: 0; }
.quota_grey .quotas_content p.quota_progress { margin: 0 !important; }
.quota_grey + h3 { margin-top: 30px; }

.quota_grey.cols3 { display: flex; flex-direction: row; flex-wrap: nowrap; padding: 0; }
.quota_grey.cols3 .quotas_content { width: calc(100% / 3); border-right: 1px solid #DFDFDF; border-bottom: 0; padding: 20px; }
.quota_grey.cols3 .quotas_content * { max-width: 240px; margin: auto; display: block;  }
.quota_grey.cols3 .quotas_content p.quota_number { margin: 7px auto 5px !important; }
.quota_grey .quotas_content p.quota_progress { margin: 0 auto !important; }
.quota_grey.cols3 .label_content { width: calc(100% / 3); border-right: 1px solid #DFDFDF; border-bottom: 0; padding: 20px; font-size: 14px; line-height: 14px; background: transparent; margin: auto; }
.quota_grey.cols3 .label_content * { max-width: 240px; margin: auto; display: block;  }
.quota_grey.cols3 .label_content div.capsule { width: max-content; margin: auto; }
.quota_grey.cols3 .label_content span:first-child { color: #1e499b; font-weight: 600 !important; }
.quota_grey.cols3 .label_content span.label { width: max-content; max-width: 100%; margin: 7px 0 0; }
.quota_grey.cols3 .label_content div.capsule div.cols2 { display: flex; flex-direction: row; flex-wrap: wrap; gap: 12px 8px; }

@media (max-width: 979px) {
    .quota_grey.cols3 { flex-direction: column; }
    .quota_grey.cols3 .quotas_content, .quota_grey.cols3 .label_content { width: calc(100% - 40px); border-right: 0; border-bottom: 1px solid #DFDFDF; }
}


/******************/
/*** Modal 2k24 ***/
/******************/
.modal2k24.modalw75 { width: max-content; max-width: 960px; margin-left: 0; transform: translateX(-50%); }
.modal2k24 .container-modal { width: calc(100% - 40px); padding: 0 20px; }
.modal2k24 .modal-header h4 { font-size: 16px; line-height: 32px; font-weight: 600; margin: 0 20px; padding-right: 30px; }
.modal2k24 .modal-body p { padding: 5px 0; }
.modal2k24 { width: 922px; max-width: 95%; transform: translateX(-50%); left: 50%; margin: auto; }
.modal2k24 .modal-body .notif31-mutu { margin-top: 0; }
.modal2k24 .modal-header h4 a.cross2k24 { content: url(../img/panel2k24/fermer_white.svg); width: 15px; height: 15px; right: 20px; top: 14px; }
.modal2k24 .modal-body form.form2k24 { margin: 20px 0 0; }
.modal2k24 .modal-body form.form2k24.m0 { margin: 0; }
.modal2k24 .modal-body form.form2k24.form_center { display: flex; flex-direction: column; gap: 20px; align-items: center; }
.modal2k24 .modal-body form.form2k24 label { font-size: 14px; line-height: 20px; font-weight: 600; }
.modal2k24 .modal-body form.form2k24 select { appearance: none; font-size: 14px; line-height: 20px; width: 400px; height: 39px; border: 1px solid #D5D5D5; border-radius: 5px; padding: 8px 15px; margin: 0; background-image: url(../img/panel2k24/chevron_select.svg); background-repeat: no-repeat; background-position: right 15px center; background-size: 12px 6px; }
.modal2k24 .modal-body form.form2k24 input[type="submit"] { padding: 10px 15px !important; }
.modal2k24 .modal-body form.form2k24 input[type="submit"].btn-success { background: #339933; color: #fff; }
.modal2k24 .modal-body form.form2k24 input[type="checkbox"]:focus { outline: none; }
.modal2k24 .modal-body form.form2k24 .form_elem.c_box { display: flex; flex-direction: row; gap: 8px; align-items: center; }
.modal2k24 .modal-body form.form2k24 .form_elem input[type="radio"] + label::after { display: none; }
.modal2k24 .modal-body form.form2k24 .form_elem input[type="radio"] + label::before { width: 18px; height: 18px; content: url(../img/panel2k24/radio_vide.svg); background-color: unset; border: unset; }
.modal2k24 .modal-body form.form2k24 .form_elem input:checked + label:before { content: url(../img/panel2k24/radio.svg); }

/*** Form Full ***/
.modal2k24 .modal-body form.form2k24.ffull .form_elem { width: 663px; max-width: 100%; }
.modal2k24 .modal-body form.form2k24.ffull .form_elem select { width: 100%; }
.modal2k24 .modal-body form.form2k24.ffull .form_elem input[type="text"],
.modal2k24 .modal-body form.form2k24.ffull .form_elem input[type="email"] { width: calc(100% - 20px); margin: 0 !important; }
.modal2k24 .modal-body form.form2k24.ffull .form_elem .control-group { margin: 0 !important; }
.modal2k24 .modal-body form.form2k24.ffull .form_elem .input-append { width: 100%; margin: 0; }
.modal2k24 .modal-body form.form2k24.ffull .form_elem .input-append input { width: calc(100% - 135px) !important; }
.modal2k24 .modal-body form.form2k24.ffull .form_elem.btn-center { margin: 0 !important; }

/*** Form 2 cols ***/
.modal2k24 .modal-body form.form2k24.fflex { display: flex; flex-direction: row; flex-wrap: wrap; gap: 20px 30px; align-items: center; }
.modal2k24 .modal-body form.form2k24.fflex .form_elem { width: calc((100% - 30px) / 2); }
.modal2k24 .modal-body form.form2k24.fflex .form_elem.flex100 { width: 100%; }

/*** Tableau Package ***/
.modal2k24 .modal-body table.package_modal { display: flex; flex-direction: column; width: 100% !important; gap: 0; }
.modal2k24 .modal-body table.package_modal tbody { display: flex; flex-direction: column; gap: 0; width: 100%; max-height: 290px; overflow-y: scroll; border-bottom: 1px solid #1C469D; margin: 1px 0; }
.modal2k24 .modal-body table.package_modal thead tr, 
.modal2k24 .modal-body table.package_modal tbody tr { display: flex; flex-direction: row; gap: 0; width: 100%; flex-wrap: nowrap; }
.modal2k24 .modal-body table.package_modal tr th { font-size: 14px; line-height: 20px; font-weight: 600; text-align: center; padding: 0 2px 20px; border-bottom: 2px solid #1C469D; }
.modal2k24 .modal-body table.package_modal tr td { font-size: 14px; line-height: 21px; font-weight: 400; text-align: center; padding: 15px 5px; border-bottom: 1px solid #CCCCCC; }
.modal2k24 .modal-body table.package_modal tr td,
.modal2k24 .modal-body table.package_modal tr th  { width: calc(100% / 7); }
.modal2k24 .modal-body table.package_modal tr td select { width: 100%; }
.modal2k24 .modal-body table.package_modal thead tr th:last-of-type { padding-right: 18px; }

.modal2k24 .modal-body table.package_modal tbody::-webkit-scrollbar { width: 16px; box-shadow: 0 0 0 1px #D5D5D5; }
.modal2k24 .modal-body table.package_modal tbody::-webkit-scrollbar-track { background: #F7F7F7; background-clip: padding-box; }
.modal2k24 .modal-body table.package_modal tbody::-webkit-scrollbar-thumb { -webkit-border-radius: 10px; border-radius: 10px; background: #D5D5D5; border: 5px solid transparent; background-clip: padding-box; }

@media (max-width: 767px) {
    .modal2k24 .modal-body table.package_modal thead { display: none; }
    .modal2k24 .modal-body table.package_modal tbody tr { flex-direction: column; }
    .modal2k24 .modal-body table.package_modal tbody tr td { width: auto; border-bottom: none; padding: 0 0 15px; }
    .modal2k24 .modal-body table.package_modal tbody tr td:first-of-type { padding-top: 15px; }
    .modal2k24 .modal-body table.package_modal tbody tr td:last-of-type { border-bottom: 1px solid #CCCCCC; padding-bottom: 20px; }
    .modal2k24 .modal-body table.package_modal tbody tr td select { width: 300px; margin: auto; }
    .modal2k24 .modal-body table.package_modal tbody tr:first-of-type td:first-of-type { border-top: 2px solid #1C469D; }
    .modal2k24 .modal-body form.form2k24.fflex .form_elem { width: 100%; }
    .modal2k24 .modal-body form.form2k24 .form_elem.c_box { align-items: baseline; }
    .modal2k24 .modal-body form.form2k24 .form_elem.c_box input { flex-shrink: 0; position: relative; top: 2px; }
}

@media (max-width: 450px) {
    .modal2k24 .modal-body table.package_modal tbody tr td select { width: 200px; margin: auto; }
}



/***********************/
/*** Upper Info 2k24 ***/
/***********************/
.upper-info { display: flex; flex-direction: row; gap: 0; width: 100%; background: #FFFFFF; border: 1px solid #DFDFDF; border-radius: 4px; margin-bottom: 20px; }
.upper-info .col { display: flex; flex-direction: row; gap: 0 15px; align-items: center; padding: 20px; }
.upper-info.col2 .col { width: 50%; }
.upper-info .col:not(:last-of-type) { border-right: 1px solid #DFDFDF; }
.upper-info .col .logo { width: 60px; height: 60px; display: flex; justify-content: center; align-items: center; background: #F0EFF0; border-radius: 50%; }
.upper-info .col .logo img { width: 35px; height: 35px; }
.upper-info .col .content .title { font-size: 14px; line-height: 20px; font-weight: 600; color: #1C469D; margin-bottom: unset; }
.upper-info .col .content .txt-simple { display: flex; flex-direction: row; gap: 0 8px; align-items: center; margin-top: 1px; }
.upper-info .col .content .txt-simple span { font-size: 14px; line-height: 20px; font-weight: 400; color: #464F57; }
.upper-info .col .content .txt-simple i.custom-tooltip.tooltip-lg { background: transparent; cursor: pointer; }
.upper-info .col .content .txt-simple i.custom-tooltip.tooltip-lg img { width: 15px; height: 15px; }
.upper-info .col .content .bottom { display: flex; flex-direction: row; gap: 0 15px; margin-top: 7px; }
.upper-info .col .content .bottom span.label { font-size: 12px; line-height: 14px; padding: 3px 10px; }
.upper-info .col .content .txt-simple div.custom_tooltip { position: relative; display: inline-block; width: max-content; max-width: 100%; }
.upper-info .col .content .txt-simple div.custom_tooltip img.info_icon { width: 15px; height: 15px; display: inline-block; margin-left: 1px; position: relative; top: -1px; }


/* Fonctionnalité vérouillée */
.container-modal .f_close { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: flex-start; gap: 15px; }
.container-modal .f_close .img-item { display: flex; justify-content: center; align-items: center; width: 60px; height: 60px; background: #F0EFF0; border-radius: 50%; }
.container-modal .f_close .img-item img { width: 35px; height: 29px; }
.container-modal .f_close .contents { width: calc(100% - 75px); }
.container-modal .f_close .contents p.warning { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 0 8px; font-size: 14px; line-height: 20px; font-weight: 600; color: #f60; margin-bottom: 0; }
.container-modal .f_close .contents .texte { font-size: 14px; line-height: 20px; font-weight: 400; }
.container-modal .f_close .contents .texte p { margin: 0; }
.container-modal .f_close .contents .texte ul { margin: 0 0 15px 18px; }


/* Onglet 2k24 */
.widget-header.onglet2k24 { border: none !important; background-color: #eee !important; text-shadow: none; height: 38px; }
.widget-header.onglet2k24 ul { display: flex; flex-direction: row; gap: 10px; list-style: none; height: 38px; margin: 0; border-bottom: 1px solid #BACADB; }
.widget-header.onglet2k24 ul li { font-size: 14px; line-height: 20px; padding: 9px 15px; background: #fff; border: 1px solid #DFDFDF; border-bottom: 0; border-radius: 5px 5px 0 0; white-space: nowrap; cursor: pointer; }
.widget-header.onglet2k24 ul li.active { background: #1C469D; border: 1px solid #1C469D; border-bottom: 0; color: #fff; }
.widget-header.onglet2k24 ul li ul.dropdown { display: flex; flex-direction: column; gap: 0; height: auto; border: 1px solid #DFDFDF; border-radius: 5px; padding: 0; background: #fff; }
.widget-header.onglet2k24 ul li.more-tab { width: 125px; position: relative; padding: 9px 23px 9px 15px; }
.widget-header.onglet2k24 ul li.more-tab:after { position: absolute; content:url(../img/panel2k24/chevron_select.svg); right: 15px; top: 8px; width: 12px; height: 8px; transition: all 0.2s ease-in-out; }
.widget-header.onglet2k24 ul li ul.dropdown { display: none; position: absolute; top: 37px; left: -70px; width: max-content; border-radius: 5px; }
.widget-header.onglet2k24 ul li ul.dropdown li { border: 0; border-radius: 0; padding: 0; font-size: 14px; line-height: 20px; padding: 7.5px 15px; }
.widget-header.onglet2k24 ul li ul.dropdown li:hover { cursor: pointer; background: #ececec; }
.widget-header.onglet2k24 ul li.more-tab:hover .dropdown { display: block; z-index: 12; }
.widget-header.onglet2k24 ul li.more-tab:hover:after { transform: rotate(180deg); top: 22px; }


/* Quota Global & Quota Spe */
#quota_global thead tr th:first-of-type,
#quota_global tbody tr td:first-of-type,
#quota_spe thead tr th:first-of-type,
#quota_spe tbody tr td:first-of-type { width: auto; }

#quota_global thead tr th:not(:first-of-type),
#quota_global tbody tr td:not(:first-of-type),
#quota_spe thead tr th:not(:first-of-type),
#quota_spe tbody tr td:not(:first-of-type) { width: max-content; }



/* Bloc Actions - Page Antivirus */
.notif31-mutu-v2 { font-size: 14px; line-height: 22px; font-weight: 400px; color: #1C469D; background: #E6F0FF; padding: 15px; border-radius: 5px; margin-bottom: 20px; }
.notif31-mutu-v2 p:last-of-type { margin-bottom: 0; }
.bloc_action { padding: 20px; border: 1px solid #D5D5D5; border-radius: 5px; }
.bloc_action:not(:last-of-type) { margin-bottom: 20px; }
.bloc_action div.title { display: flex; flex-direction: row; gap: 8px; align-items: center; font-size: 16px; line-height: 26px; font-weight: 600; margin-bottom: 10px; }
.bloc_action div.title img { position: relative; display: block; top: 0; left: 0; }
.bloc_action div.title div.label { font-size: 12px; line-height: 18px; font-weight: 500; }
.bloc_action p.desc { margin-bottom: 15px; }
.bloc_action a.btn-action { display: flex; flex-direction: row; gap: 8px; width: max-content; max-width: 100%; font-size: 14px; line-height: 18px; font-weight: 400; }
.bloc_action a.btn-action img { width: 15px; height: auto; }

@media (max-width: 860px) {
    .bloc_action div.title { flex-direction: column; margin-bottom: 30px; }
    .bloc_action div.title img { width: 40px; height: auto; }
    .bloc_action div.title *,
    .bloc_action p.desc { text-align: center; }
    .bloc_action a.btn-action { margin: auto; }
}