/* use . for formatting a class and # for formatting by ID */

/* format text and number input fields */
input[type=text], input[type=number], input[type=password], input[type=date], input[type=time] {
  border: 1px solid silver;
  border-radius: 6px;
  background-color: #F5F5F5;
  font-size: 14px;
  box-sizing: border-box;
}

input[type=text]:focus, input[type=number]:focus, input[type=password]:focus {
    background-color: lightblue;
}

input[type=text].Reqd, input[type=number].Reqd, input[type=password].Reqd {
  background-color: #FFFFA6;
}
/* format text and number input fields - end  */


/* format select drop downs - start */
select {
  border: 1px solid silver;
  border-radius: 6px;
  background-color: #f5f5f5;     /* f5f5f5 */
  font-size: 13px;
}

select.menuoptions {
  border: 1px solid #f5f5f5;
  border-radius: 6px;
  background-color: #f5f5f5;
  color: #5B41FF;
  font-size: 18px;
  width: 300;
}

.selectfilter {
  border: None;
  background-color: white;
  color: navy;
  font-size: 12px;
  font-weight: bold;
}

/* format select drop downs - end */


/* format buttons - start */
input[type=button], input[type=submit], input[type=reset] {
  background-color: #D8ECFC;
  border: 1px solid silver;
  border-radius: 6px;
    padding: 8px 16px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
}

input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
  background-color: deepskyblue;
}

input[type=button].thin, input[type=submit].thin, input[type=reset].thin {
  background-color: #D8ECFC;
  border: 1px solid silver;
  border-radius: 6px;
    padding: 3px 16px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
}

input[type=button].positive, input[type=submit].positive, input[type=reset].positive {
  background-color: #C4FFC4;
  border: 1px solid green;
  border-radius: 6px;
    padding: 8px 16px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
 }

input[type=button].positive:hover, input[type=submit].positive:hover, input[type=reset].positive:hover {
  background-color: #A3E6A3; /* Slightly darker green */
}

input[type=button].negative, input[type=submit].negative, input[type=reset].negative {
  background-color: #FFB7B7;
  border: 1px solid red;
  border-radius: 6px;
    padding: 8px 16px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: no-drop;
 }
 
input[type=button].negative:hover, input[type=submit].negative:hover, input[type=reset].negative:hover {
  background-color: #E69999; /* Slightly darker red */
}
 
/* format button for an <a href record   */
.download-button {
   display: inline-block;
   padding: 10px 20px;
   font-size: 16px;
   color: black;
   background-color: #D8ECFC;
   text-align: center;
   text-decoration: none;
   border-radius: 6px;
   border: 1px solid silver;
   cursor: pointer;
}
.download-button:hover {
   background-color: deepskyblue;
}

/* format buttons - end */


/* editlabel formatting for almost all field labels - start */
.editlabel {
   color : navy;
   font-weight: bold;
}

.notelabel {
   color : gray;
   font-weight: normal;
}

.editlabelred {
   color : red;
   font-weight: normal;
}

.editlabelredbold {
   color : red;
   font-weight: bold;
}

.editlabelblue {
   color : blue;
   font-weight: normal;
}

.editlabelgreen {
   color : green;
   font-weight: normal;
}

/* editlabel formatting for almost all field labels - end */


/* fieldset formatting to group form fields together - start */
fieldset {
border: 1px solid rgb(204, 204, 204) !important;
padding: 0.4em !important;
margin: 0 0 0 0 !important;
-webkit-box-shadow: 10px #000;
box-shadow: 10px #000;
border-radius: 15px 15px 15px 15px;
display: inline-block;
}

legend {
font-size: 1.2em !important;
font-weight: bold !important;
text-align: left !important;
width:auto;
padding:0px 10px 0px 10px;
margin: 0;
border-bottom:none;
}

.top-right {
position: absolute;
top: 12px;
right: 16px;
}

/* fieldset formatting to group form fields together - end */


/* header menu and main body positioning... - start */
.header_topxxxxx {
   overflow: hidden;
   position: fixed; /* Setthe navbar to fixed position */
   top: 0; /* Position the navbar at the top of the page */
   width: 100%; /* Full width */
}

.main_menuxxxxx {
   margin-top: 1px; /* Add a topmargin to avoid content overlay */
}

#bodyxxxx {
   margin-top: 1px; /* Add a topmargin to avoid content overlay */
}

/* header menu and main body positioning... - end */


audio {
    width: 300px;
    height: 30px;
}

.Clickable {
  Cursor:Pointer;
}