input[type="text"],input[type="search"] {
  background-color: #f0f0f0; /* Styles the background of the text input fields */
  border: 1px solid #ccc;    /* Adds a border */
  font-size: 16px; 
  field-sizing: content;
  min-width: 200px; /* Sets the minimum width */
  /*max-width: 300px;*/ /* Optional: Sets a maximum width to prevent excessive growth */
}


div.treeview {direction: rtl;text-align: left;
   ul {
    padding: 0 0 0 1em;
  }
  ul li details {
    padding: 0;
    margin: 0;
  }
  ul li,
  ul li details summary {
    list-style-type: none;
    margin: 0;
    padding: 0;
  }
  ul li {
    padding: 0.5ex;
  }
  ul li a {
    text-decoration: none;
    padding: 2px;
  }
  ul li a.current {
    background-color: blue;
    color: white;
  }
  ul li a:hover {
    padding: 1px;
    border: 1px dotted black;
  }
  ul li:not(:has(details))::before,
  details > summary::before {
    content: '';
    text-align: left;
    vertical-align: top;
    padding: 0 24px 0 0;
    background-image: none;
    background-repeat: no-repeat;
    background-position: top right 4px;
    background-color: transparent;
  }
  ul li:not(:has(details))::before {
    background-image: url('images/leaf.png');
    content: url('images/empty.png');
  }
  details[open] > summary::before {
    background-image: url('images/folder-opened.png');
    content: url('images/minus.png');
  }
  details:not([open]) > summary::before {
    background-image: url('images/folder-closed.png');
    content: url('images/plus.png');
  }
/* Custom node icons */
  ul li.icon-warning::before {
    background-image: url('images/warning.png');
  }
  ul li.icon-warning details[open] > summary::before,
  ul li.icon-warning details:not([open]) > summary::before {
    background-image: url('images/warning.png');
  }
}

.link:hover{background-color:orange;}
.linksample:hover{background-color:yellow;}
.linksample:focus{background-color:orange;}
.freez
{

width:3000px;height:1000px;
top:0px;left:0px;
position:absolute;
display:none;
/*BACKGROUND-COLOR: #ccddcc;*/
/* BACKGROUND-IMAGE: url(h3.gif); */
BACKGROUND-position: 0% 100%;
BACKGROUND-repeat:no-repeat; 
background-color: #000;
 /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

  /* IE 5-7 */
  filter: alpha(opacity=50);

  /* Netscape */
  -moz-opacity: 0.5;

  /* Safari 1.x */
  -khtml-opacity: 0.5;

  /* Good browsers */
  opacity: 0.5;
-moz-opacity:0.55;
Z-index:101;
text-align: center;
}
.zone_du_travail 
{
	text-align: center;
Z-index:102;
display:none;
padding:0px;
/* background-image:url(../image/img0.gif); */
background-color: var(--main-bg-color);
width:auto;height:auto;
border:gray 3px dotted;
/* width:50%;height:50%; */
/* top:10%;left:10%; */
position:absolute;
/* cursor:hand; */
}

#fixedmenu {
    position: fixed;
    height: 80px;
    top: 0;
    width: 100%;
    z-index: 100;
	background: linear-gradient(to top, var(--main-bg-color), #f6f6f6);

}
#container{ 
    margin-top: 50px;
	overflow-y: scroll
}

.brandname{
    font-family:adobe arabic;
    font-size:2vw;
    color:#fb5e08;
    padding-top:0px;
    padding-bottom:0px;
    direction:rtl;
	
	
}

#myTable  tr:hover td {
background-color: Yellow;
color:#d02129;white-space: nowrap;
 cursor: pointer; cursor: hand; 
}

#myTable th {
    position: -webkit-sticky; // this is for all Safari (Desktop & iOS), not for Chrome
    position: sticky;
    top: 0;
    z-index: 1; // any positive value, layer order is global
    background: #fff; // any bg-color to overlap
}

#input1 {
/* background: linear-gradient(rgba(255, 255, 255, 0.2),
              rgba(255, 255, 255, 0.2),
              rgba(255, 255, 255, 0.2),
              rgba(255, 255, 255, 0.2)),
              url("ic_launcher.png");
			  background-size: 10% 100%;
			  background-position: left ;
background-repeat: no-repeat; */
	color: #d02129;
	font-size: 18px;
	text-align: center;
	    outline: none;

 border: 0px solid var(--main-bg-color);
 border-bottom: 1px solid var(--main-bg-color);
     box-shadow: 0 1px 0 0 var(--main-bg-color);
}

html {
    height: 90%;
	
}

body:fullscreen {
  overflow: scroll !important;
}
body:-ms-fullscreen {
  overflow: scroll !important;
}
body:-webkit-full-screen {
  overflow: scroll !important;
}
body:-moz-full-screen {
  overflow: scroll !important;
}

body {
    height: 100%;
    margin: 5px;

 /*background: linear-gradient(rgba(255, 255, 255, 0.8),
              rgba(255, 255, 255, 0.8),
              rgba(255, 255, 255, 0.8),
              rgba(255, 255, 255, 0.8)),
              url("IMG-20180301-WA0000.jpg");
	    background-position: center bottom;

    background-repeat: no-repeat;
    background-attachment: fixed;*/
}

table.servicesT td.servHd{ border-bottom: 1px solid #000000;background-color: var(--main-bg-color);text-align: center;font-family: Verdana;font-weight: bold;font-size: 14px;color: #FFFFFF;white-space: nowrap;}table.servicesT td{ border-bottom: 1px dotted #6699CC;font-family: Verdana, sans-serif, Arial;font-weight: normal;font-size: 14px;color: #404040;text-align: right;padding-left: 3px;} .servBodL { padding-left: 5px;padding-right: 5px; border-left: 1px dotted #CEDCEA;white-space: nowrap; }

.sortable{ border-bottom: 1px solid #000000;background-color: var(--main-bg-color);text-align: center;font-family: Verdana;font-weight: bold;font-size: 14px;color: #FFFFFF;white-space: nowrap;cursor: pointer;}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
.link{ width:150px;border-bottom: 2px solid #6699CC;background-color: var(--main-bg-color);text-align: center;font-family: Verdana;font-weight: bold;font-size: 14px;color: #404040;white-space: nowrap;color:#FFFFFF;}
.linknolength{ border-bottom: 2px solid #6699CC;background-color: var(--main-bg-color);text-align: center;font-family: Verdana;font-weight: bold;font-size: 14px;color: #404040;white-space: nowrap;color:#FFFFFF;}
.linksample{ border-bottom: 2px solid #6699CC;text-align: center;font-family: Verdana;white-space: nowrap;}

tr {
  

}
table { border-collapse: separate; border-spacing: 5px; } /* cellspacing="5" */
table { border-collapse: collapse; border-spacing: 0; }   /* cellspacing="0" */


dddxTD {
  font-family: "Comic Sans MS", cursive, sans-serif;
  border-bottom: 2px solid #d02129;
  border-right: 2px solid #d02129;
  border-top: 2px solid #d02129;
  padding: 20px ;

}
hr {
  border-top: 1px dashed #8c8b8b;
  width:80%;
}
.h {
  border-top: 1px dashed #8c8b8b;
  color:#fff;
  font-size:14px;
}

.isa_info, .isa_success, .isa_warning, .isa_error {
margin: 3px 0px;
padding:4px;
text-align:center;
 
}
.isa_info {
    color: #00529B;border: 1px solid;box-shadow:1px 1px 3px #888;
    background-color: #BDE5F8;
	border-radius:.5em;
	color:#000;
}
.isa_success {
    color: #4F8A10;border: 1px solid;box-shadow:1px 1px 3px #888;
    background-color: #DFF2BF;border-radius:.5em;
}
.isa_warning {
    color: #9F6000;border: 1px solid;box-shadow:1px 1px 3px #888;
    background-color: #FEEFB3;border-radius:.5em;
}
.isa_error {
    color: #D8000C;border: 1px solid;box-shadow:1px 1px 3px #888;
    background-color: #FFD2D2;border-radius:.5em;
}
.confirmation {
    color: #D8000C;border: 1px solid #111;box-shadow:1px 1px 3px #888;
    background-color: transparent;border-radius:.5em;
	padding-left:5px;padding-right:5px;
}

.isa_info i, .isa_success i, .isa_warning i, .isa_error i {
    margin:10px 22px;
    font-size:4em;
    vertical-align:middle;
}

#indexmenudiv{
    display: none1;
    background-color: transparent;
	background: linear-gradient(to top, var(--main-bg-color), #f6f6f6);
		height:480px;
	overflow:auto;

	/*text-align:left;
	    margin: auto;
	vertical-align:middle;
	
	 margin: 0;
    position: absolute;
	*/
    /*top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);*/
}
.dropbtn {
  background-color: #3498DB;
  color: white;
  padding: 6px;
  border: none;
  cursor: pointer;
}

/* Dropdown button on hover & focus */
.dropbtn:hover, .dropbtn:focus {
  background-color: #2980B9;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: fixed;
  background-color: #f1f1f1;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  /* background-color: var(--main-bg-color);
  color: white;
  font-weight: bold
  padding: 14px 25px;
  text-align: center;
  text-decoration: none;
  display: inline-block; */
  
  background-color: #3498DB;
  color: white;
  padding: 4px 15px;
  text-align: center;
  text-decoration: none;
  border-bottom:#ffffff 3px solid;
  display: inline-block;
  width:100%;
  text-align: right;
  font-weight: bold;
  
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: var(--main-bg-color);}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;}