body {  font-family: verdana, geneva, sans-serif; font-size: 11pt; }
  #toptitle { text-align:center; padding-top:20px;
             }	 
  #toptitle a {text-decoration: none;
      color: blue; 
              }
  #toptitle p { padding:10px; font-size:1.2em;  text-align:center;
/*---------------------------------------------------------------- */              }
.sortable th {
   cursor: pointer;
}
.sortable th.no-sort {
   pointer-events: none;
}
.sortable th::after, 
.sortable th::before {
 transition: color 0.2s ease-in-out;
 font-size: 1.2em;
 color: transparent;
}
.sortable th::after {
   margin-left: 3px;
   content: '\025B8';
}
.sortable th:hover::after {
   color: inherit;
}
.sortable th.dir-d::after {
   color: inherit;
   content: '\025BE';
}
.sortable th.dir-u::after {
   color: inherit;
   content: '\025B4';
}

 /* --------------------------------------------------------------- */
#notes { position:relative;width:100%; margin-top:20px;    }
.addnote {  font-size: 10pt; color: #ff0000; font-weight:normal; padding:20px; }
.p1titre { font-size:1.3em; padding: 10px 0px 10px 20px; }
.avantinput {font-size:larger; padding: 0px 0px 0px 10px; }
#topcadre { display:inline-block;  }
#vidcadre { display:none; }
#vidcadre img { display:none; }
#rtxt { display:none; }

#rtxtresp { display: inline-block; padding: 0px 10px 0px 10px; text-align: center;font-size:1.1em;font-style:italic;}
/*------------------------------------------------------------------------------------*/
#formbl1 {float:left;width:30%;}
#formblrr {float:right;width:30%;}

#dbcontent { margin-top:10px; }

#searches { position:relative; padding-left:30px; }
hr { margin: 20px 0px 20px 0px; height:5px;border-width:0;color:#BF3F08;background-color:#BF3F08; }
.row { float: left; }
.row1 { float: none; width:100%;font-size:1.1em;padding-bottom:10px; }
.row2 { float: none; width:100%;}
.row3 { float: none; width:100%;padding-bottom:10px; }

#spsearcharea { width:100%; font-size:16px; }
#spsearcharea h4 { padding: 10px 0px 10px 10px; }
#spsftitle { float:none;  width:100%;padding: 0px 0px 10px 10px; }
#spsf { float:none; width:90%;padding-left:30px;  }
#spretour { float:none; width:100%;margin-top:20px;  }
#spretour button { float:right;}


 /* --------------------------------------------------------------- */
#booklist {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}
#booklist th {
  cursor: pointer;
}
#booklist td, #booklist th {
  border: 1px solid #ddd;
  padding: 8px;
}

#booklist tr:nth-child(even){background-color: #f2f2f2;}

#booklist tr:hover {background-color: #ddd;}
#booklist th:hover {background-color: #ddd; color:black;}

#booklist th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #BF3F08;
  color: white;
}
#booklist a { color:white; text-decoration:none; display:block; }
#booklist a:hover { color:#000; }

/* form formatting for search box */
form { margin-top:0px; }
input[type=text] {   width: 50%;   padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: vertical;
}
select {   width: 60%;   padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: vertical;
}
label {
  padding: 12px 12px 12px 0;
  display: inline-block;
}

input[type=submit] {
  background-color: #BF3F08;
  color: white; 
  padding: 12px 20px; 
  border: none;
  border-radius: 4px;
  cursor: pointer;
  
}
input[type=reset] {
  background-color: #BF3F08; margin-left:20px;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  }
input[type=submit]:hover {
  background-color: blueviolet;
}
input[type=reset]:hover {
  background-color: black;
}
button {
  background-color: #BF3F08;
  color: white; 
  padding: 12px 20px; 
  border: none;
  border-radius: 4px;
  cursor: pointer;
  display:block;
}
button:hover {  background-color: blueviolet; }
button a { color:white; text-decoration:none; display:block; }
button a:hover { color:#000; }

.container { margin:20px;
  border-radius: 5px;
  /* background-color: #f2f2f2; */
  padding: 20px; padding-left:20px;border:5px solid #BF3F08;
}

/* Floating column for labels: 25% width */
.col-25 {
  float: left;   width: 25%;  margin-top: 6px; 
}

/* Floating column for inputs: 75% width */
.col-75 {
  float: left;  width: 75%;   margin-top: 6px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}