@font-face {
    font-family: '72';
    src: url('../res/72-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body{	
	width: 100%;
}

#info {
	font-style: normal;
	font-size: 16px;
	font-family: "72", Arial, Helvetica, sans-serif;
	text-align: center;
	margin: 5px;
    border-radius: 3px;
}

.info_help {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid #fff;
  border-radius: 50%;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  cursor: help;
  position: absolute;
  right: 8px;
  top: 6px;
}

.info_help:hover {
  background: #fff;
  color: #346187
}

#content, .infoExp{
	font-style: normal;
	font-size: 14px;
	font-family: "72", Arial, Helvetica, sans-serif;
}
#content ul{
	padding-left: 20px;	
}

.infoExp ul{
	padding-left: 20px;	
}

#seletedSpan{
	padding-left: 20px;	
}

.refreshBtnList {
	left: 10px;
	font-size: 20px;
    top: -3px;
}

#options, #content, .infoExp {
	border-radius: 3px;
	padding: 5px;
	margin: 5px;
}

#options {
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	font-family: "72", Arial, Helvetica, sans-serif;	
}

#optionLib, #contentLib, .InfoLib, .optionLib {
	font-weight: bold;
    text-decoration: underline;
	line-height: 1.5rem;
}

#responsiveElmts {
	padding-bottom: 10px;
}

.accordion-header {
	font-family: "72", Arial, Helvetica, sans-serif;
}
.accordion-body {
	padding: 0;
}

div[id^="row-body"] {
	padding: 8px;
}

.accordion-button {
    padding-top: 8px;
    padding-bottom: 8px;
	font-weight: bold;
}

.accordion-button:focus {
	box-shadow: none;
}

.accordion-button:not(.collapsed) {
    color: #ffffff !important;
    background-color: #e58829;
	font-weight: normal;
}
.first_accordion{
	border-top-left-radius: var(--bs-accordion-inner-border-radius);
    border-top-right-radius: var(--bs-accordion-inner-border-radius);
}
.form-check{
	margin: 0 10px;
}

.customCheck {
	padding-left: 0px;
}

.input-group{
    padding: 0px 10px;
}
.input-group .input-group-text{
	font-style: normal;
	font-size: 14px !important;
	font-family: "72", Arial, Helvetica, sans-serif;
	padding: 0px 5px;
}
.input-group input{
	font-style: normal;
	font-size: 14px !important;
	font-family: "72", Arial, Helvetica, sans-serif;
	padding: 0px 5px !important;
}

.dynamicLi{
	font-style: normal;
	font-size: 14px;
	font-family: "72", Arial, Helvetica, sans-serif;
	margin-bottom: 5px;
}

.btnDwnlFile{
	width: 14px;
	margin-bottom: 5px;
    margin-left: 5px;
}

.btn_exp_full {
	text-align: center;
	margin: 5px;
}
	
#bouton {
	text-align: center;
	margin-top: 5px;
}

button.learn-more{
	width: 250px;
}

button.learn-more .button-text {
	font-style: normal;
	font-size: 14px;
	font-family: "72", Arial, Helvetica, sans-serif;
	padding-top: 3px;
}

.txt_result {
	text-align: center;
	font-size: 14px;
	font-family: "72", Arial, Helvetica, sans-serif;
}

.btn {
	padding: 5px;
	padding-top: 2px;
	padding-bottom: 2px;
	font-size: 14px;
}

input[type="range"] {
	margin-left: inherit;
	width: 89px;
}

input, select {
	border-radius: 0.2rem;
}

.input-size {
	display: flex;
	gap: 10px;
  }
  
.input-size input, #btn_nb_rows, input[id^="row"] {
	max-width: 40px;
}

div[data-column-id] {
	margin-top: 10px;
	border-top: 1px solid #dee2e6;
}

select[data-row-id], input[id^="row"] {
	margin: 4px;
}

.align-right {
	float: right;
}

#infoContent {
    display: none;
    padding: 10px;
    margin: 7px 0;
    border-radius: 4px;
}

#infoContent.show {
    display: block;
}

.button-group-container {
	display: flex;
	justify-content: flex-end;
}

.button-group {
	display: flex;
	border-radius: 5px;
	overflow: hidden;
}

.button-group button {
	flex: 1;
	border: none;
	padding: 2px 10px;
	font-size: 11px;
	font-weight: bold;
}

.custom-menu {
	position: absolute;
	display: none;
	background-color: #fff;
	border: 1px solid #ccc;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	z-index: 1000;
	list-style: none;
	padding: 0;
	margin: 0;
	width: 140px;
}

.custom-menu li {
	padding: 8px;
	cursor: pointer;
	border-bottom: 1px solid #eee;
	font-family: "72", Arial, Helvetica, sans-serif;
	font-size: 13px;
}

.custom-menu li:last-child {
	border-bottom: none;
}

.custom-menu li:hover {
	background-color: #f0f0f0;
}

.center-flex {
	display: flex;
	align-items: center;
}

.center-content {
	justify-content: center;
}

.gap5 {
	gap: 5px;
}

.margin-page {
	width: 51px;
	height: 70px;
	border: 1px solid black;
}

.mg-l-20 {
	margin-left: 20px;
}

.mg-l-3 {
	margin-left: 3px;
}

.mg-l-52 {
	margin-left: 52px;
}

.mg-t-b-5 {
	margin-top: 5px;
	margin-bottom: 5px;
}

.max-w-42 {
	max-width: 42px;
}

.grid1 {
	display: grid;
	grid-template-columns: 48px 75px 75px;
}

.grid2 {
	display: grid;
	grid-template-columns: 64px 66px 66px;
}

.grid3 {
	display: grid;
	grid-template-columns: 64px 74px 74px;
}

.grid-1_3-2 {
	grid-column: 1/4;
	grid-row: 2;
}

.grid-1_3-4 {
	grid-column: 1/4;
	grid-row: 4;
}

[class*="-1-"] { 
	grid-column: 1;
}

[class*="-2-"] {
	grid-column: 2;
}

[class*="-3-"] {
	grid-column: 3;
}

[class$="-1"] {
	grid-row: 1;
}

[class$="-2"] {
	grid-row: 2;
}

[class$="-3"] {
	grid-row: 3;
}