html,body {
    margin: 0;
    padding: 0;
    height: 100%;
}
nav {
    background-color: #353A3F;
    color: #fff;

    padding: 30px 4%;
    display: flex;
    justify-content: space-between;

    border-bottom: 0.5px solid rgb(155, 155, 155);
}

nav ul {
    display: flex;
    justify-content: space-around;
    align-items: center;
}

nav li {
    list-style: none;
}

nav li a {
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    padding: 5px 8px;
}

nav li a:hover {
    color: green;
    text-decoration: none;
}

nav li button {
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    padding: 5px 8px;
    border: none;
    background: none;
}

nav li button:hover {
    color: #EE0000;
    text-decoration: none;
}

.addproduct {
    color:#00D890;
}

.addproduct:hover {
    color:#FF9933;
}

.fabric_stock {
    color:#fff;
}
.fabric_stock:hover {
    color:#FF9933;
}

.addphotobutton {
    background-image: url('/camera.jpeg');
    width: 100%;
    height: 100%;
    background-size: 300px 300px;
    font-size: 2rem;
}

.productpagetable {
    color: #fff;
    border: 1px solid;
    border-color: #474D54;
    width: 65%;
    margin-bottom: 15px;
}
.productpagetable tr {
    height: 45px;
    transition: background-color 0.2s;
}
.productpagetable thead tr {
    color: #F6C344;
    text-align: center;
}
.productpagetable tbody tr:nth-child(odd) {background-color: #353A3F;}
.productpagetable tbody tr:nth-child(odd):hover {background-color: #1f1f1f;}
.productpagetable tbody tr:nth-child(even) {background-color: #3F4449;}
.productpagetable tbody tr:nth-child(even):hover {background-color: #1f1f1f;}
.productpagetable th {
    width: 25%;
    border: 1px solid #474D54;
    padding: 10px;
}
.productpagetable td {
    width: 25%;
    border: 1px solid #474D54;
    padding: 10px;
}
.productpagetable td input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
    font: 19px Arial;
}

.productpageeditbutton {
    border-radius: 10px;
    border: none;
    background-color: #f27a1b;
    transition: background-color 0.5s;
    font: bold 19px "Trebuchet MS";
}
.productpageeditbutton:hover {
    background-color: #b84f0b;
}

/*productpage-accessorytable*/
.productpage-accessorytable {
    color: #fff;
    border: 1px solid;
    border-color: #474D54;
    width: 65%;
    margin-bottom: 15px;
}
.productpage-accessorytable tr {
    height: 45px;
    transition: background-color 0.2s;
}
.productpage-accessorytable thead tr {
    color: #F6C344;
    text-align: center;
}
.productpage-accessorytable tbody tr:nth-child(odd) {background-color: #353A3F;}
.productpage-accessorytable tbody tr:nth-child(odd):hover {background-color: #007951; font-size: larger;}
.productpage-accessorytable tbody tr:nth-child(even) {background-color: #3F4449;}
.productpage-accessorytable tbody tr:nth-child(even):hover {background-color: #9c5e20; font-size: larger;}
.productpage-accessorytable th {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.productpage-accessorytable td {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
/*productpage-accessorytable-nolarger*/
.productpage-accessorytable-nolarger {
    color: #fff;
    border: 1px solid;
    border-color: #474D54;
    width: 65%;
    margin-bottom: 15px;
}
.productpage-accessorytable-nolarger tr {
    height: 45px;
    transition: background-color 0.2s;
}
.productpage-accessorytable-nolarger thead tr {
    color: #F6C344;
    text-align: center;
}
.productpage-accessorytable-nolarger tbody tr:nth-child(odd) {background-color: #353A3F;}
.productpage-accessorytable-nolarger tbody tr:nth-child(odd):hover {background-color: #007951;}
.productpage-accessorytable-nolarger tbody tr:nth-child(even) {background-color: #3F4449;}
.productpage-accessorytable-nolarger tbody tr:nth-child(even):hover {background-color: #9c5e20;}
.productpage-accessorytable-nolarger th {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.productpage-accessorytable-nolarger td {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}

/*pieceworktable*/
.pieceworktable {
    color: #fff;
    border: 1px solid;
    border-color: #474D54;
    width: 100%;
    margin-bottom: 15px;
}
.pieceworktable tr {
    height: 45px;
    transition: background-color 0.2s;
}
.pieceworktable thead tr {
    color: #F6C344;
    text-align: center;
}
.pieceworktable tbody tr:nth-child(odd) {background-color: #353A3F;}
.pieceworktable tbody tr:nth-child(odd):hover {background-color: #007951; font-size: larger;}
.pieceworktable tbody tr:nth-child(even) {background-color: #3F4449;}
.pieceworktable tbody tr:nth-child(even):hover {background-color: #9c5e20; font-size: larger;}
.pieceworktable th[scope=col] {
    width: 9%;
    border: 1px solid #474D54;
    padding: 10px;
}
.pieceworktable th[scope=row] {
    width: 14%;
    border: 1px solid #474D54;
    padding: 10px;
}
.pieceworktable td {
    border: 1px solid #474D54;
    padding: 10px;
}
.pieceworktable tbody tr:nth-child(odd) td:hover {
    transition: background-color 0.4s;
    background-color:#9c5e20;
}
.pieceworktable tbody tr:nth-child(even) td:hover {
    transition: background-color 0.4s;
    background-color:#007951;
}
.pieceworktable th:nth-child(1),
.pieceworktable td:nth-child(7),
.pieceworktable td:nth-child(4) {
    border-right: 1px solid aliceblue;
}
.pieceworktable td input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
}

/*pieceworktable_2*/
.pieceworktable_2 {
    color: #fff;
    border: 1px solid;
    border-color: #474D54;
    width: 100%;
    margin-bottom: 15px;
}
.pieceworktable_2 tr {
    height: 45px;
    transition: background-color 0.2s;
}
.pieceworktable_2 thead tr {
    color: #F6C344;
    text-align: center;
}
.pieceworktable_2 tbody tr:nth-child(odd) {background-color: #353A3F;}
.pieceworktable_2 tbody tr:nth-child(odd):hover {background-color: #007951; font-size: larger;}
.pieceworktable_2 tbody tr:nth-child(even) {background-color: #3F4449;}
.pieceworktable_2 tbody tr:nth-child(even):hover {background-color: #9c5e20; font-size: larger;}
.pieceworktable_2 th[scope=col] {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.pieceworktable_2 th[scope=row] {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.pieceworktable_2 td {
    border: 1px solid #474D54;
    padding: 10px;
}
.pieceworktable_2 tbody tr:nth-child(odd) td:hover {
    transition: background-color 0.4s;
    background-color:#9c5e20;
}
.pieceworktable_2 tbody tr:nth-child(even) td:hover {
    transition: background-color 0.4s;
    background-color:#007951;
}
.pieceworktable_2 td input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
}
.pieceworktable_2 textarea {
    width: 100%;
    background-color: transparent;
    color: white;
    resize: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.productdeletebutton {
    color: rgb(0, 0, 0);
    border-radius: 10px;
    border: none;
    background-color: #ac141e;
    transition: background-color 0.5s;
    margin-bottom: 10px;
    font-weight: 500;
}
.productdeletebutton:hover {
    background-color: #6a0d13;
}
.tracked_product_button {
    color: black;
    border-radius: 10px;
    border:black 0px solid;
    background-color: #ffffff;
    transition: background-color 0.5s;
    margin-bottom: 10px;
}
.tracked_product_button:focus {
    outline: none;
    box-shadow: none;
  }

.pd_confirm {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.pd_confirm-content {
    background-color: #FFBC00;
    margin: 20% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid rgb(12, 11, 11);
    width: 80%; /* Could be more or less, depending on screen size */
  }
  
  /* The Close Button */
.pd_confirm-close {
    color: #62686E;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.pd_confirm-close:hover,
.pd_confirm-close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.planningtable {
    color: #fff;
    border: 1px solid;
    border-color: #474D54;
    width: 100%;
    margin-bottom: 15px;
}

.planningtable tr {
    height: 45px;
    transition: background-color 0.2s;
}
.planningtable tbody tr:nth-child(odd) {background-color: #353A3F;}
.planningtable tbody tr:nth-child(odd):hover {background-color: #007951; font-size: larger;}
.planningtable tbody tr:nth-child(even) {background-color: #3F4449;}
.planningtable tbody tr:nth-child(even):hover {background-color: #9c5e20; font-size: larger;}
.planningtable th[scope=col] {
    width: 80%;
    border: 1px solid #474D54;
    padding: 10px;
}
.planningtable th[scope=row] {
    width: 25%;
    border: 1px solid #474D54;
    padding: 10px;
}
.planningtable td {
    border: 1px solid #474D54;
    padding: 10px;
}
.planningtable td input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
}

.designertable {
    color: #fff;
    border: 1px solid;
    border-color: #474D54;
    width: 100%;
    margin-bottom: 15px;
}

.designertable tr {
    height: 45px;
    transition: background-color 0.2s;
}
.designertable tbody tr:nth-child(odd) {background-color: #353A3F;}
.designertable tbody tr:nth-child(odd) ::placeholder {color: transparent;}
.designertable tbody tr:nth-child(odd):hover {background-color: #007951;}
.designertable tbody tr:nth-child(odd):hover ::placeholder {color: rgb(171, 171, 171);}
.designertable tbody tr:nth-child(even) {background-color: #3F4449;}
.designertable tbody tr:nth-child(even) ::placeholder {color: transparent;}
.designertable tbody tr:nth-child(even):hover {background-color: #9c5e20;}
.designertable tbody tr:nth-child(even):hover ::placeholder {color: rgb(171, 171, 171);}
.designertable th[scope=col] {
    width: 80%;
    border: 1px solid #474D54;
    padding: 0px;
}
.designertable th[scope=row] {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.designertable td {
    border: 1px solid #474D54;
    padding: 10px;
    padding: 0;
}
.designertable th input {
    color: #fff;
    background-color: transparent;
    border: none;
    outline: none;
    width: 100%;
    height: 45px;
}
.designertable td input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
    padding-left: 8px;
}

.cuttingdepartmenttable {
    color: #fff;
    border: 1px solid;
    border-color: #474D54;
    width: 100%;
    margin-bottom: 15px;
}

.cuttingdepartmenttable tr {
    height: 45px;
    transition: background-color 0.2s;
}
.cuttingdepartmenttable tbody tr:nth-child(odd) {background-color: #353A3F;}
.cuttingdepartmenttable tbody tr:nth-child(odd):hover {background-color: #007951; font-size: larger;}
.cuttingdepartmenttable tbody tr:nth-child(even) {background-color: #3F4449;}
.cuttingdepartmenttable tbody tr:nth-child(even):hover {background-color: #9c5e20; font-size: larger;}
.cuttingdepartmenttable th[scope=col] {
    width: 80%;
    border: 1px solid #474D54;
    padding: 10px;
}
.cuttingdepartmenttable th[scope=row] {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.cuttingdepartmenttable td {
    border: 1px solid #474D54;
    padding: 10px;
}
.cuttingdepartmenttable td input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
}

.accessorytable {
    color: #fff;
    border: 1px solid;
    border-color: #474D54;
    width: 100%;
    margin-bottom: 15px;
}

.accessorytable tr {
    height: 45px;
    transition: background-color 0.2s;
}
.accessorytable tbody tr:nth-child(odd) {background-color: #353A3F;}
.accessorytable tbody tr:nth-child(odd):hover {background-color: #007951; font-size: larger;}
.accessorytable tbody tr:nth-child(even) {background-color: #3F4449;}
.accessorytable tbody tr:nth-child(even):hover {background-color: #9c5e20; font-size: larger;}
.accessorytable th[scope=col] {
    border: 1px solid #474D54;
    padding: 10px;
    color: #F6C344;
}
.accessorytable th[scope=row] {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.accessorytable td {
    border: 1px solid #474D54;
    padding: 10px;
}
.accessorytable td input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
}

/*maliyettable*/
.maliyettable {
    color: #fff;
    border: 1px solid;
    border-color: #474D54;
    width: 65%;
    margin-bottom: 15px;
}
.maliyettable tr {
    height: 35px;
    transition: background-color 0.2s;
}
.maliyettable thead tr {
    color: #F6C344;
    text-align: center;
}
.maliyettable tbody tr:nth-child(odd) {background-color: #353A3F;}
.maliyettable tbody tr:nth-child(odd):hover {background-color: #1f1f1f;}
.maliyettable tbody tr:nth-child(even) {background-color: #3F4449;}
.maliyettable tbody tr:nth-child(even):hover {background-color: #1f1f1f;}
.maliyettable th {
    width: 25%;
    border: 1px solid #474D54;
    padding-left: 10px;
    padding-right: 10px;
}
.maliyettable td {
    border: 1px solid #474D54;
    padding-left: 10px;
    padding-right: 10px;
}

/*maliyettable-report*/
.maliyettable-report {
    color: #000000;
    border: 1px solid;
    border-color: #474D54;
    width: 100%;
    margin-bottom: 15px;
    font: normal 15px Arial;
}
.maliyettable-report tr {
    height: 25px;
    transition: background-color 0.2s;
}
.maliyettable-report thead tr {
    color: #F6C344;
    text-align: center;
    background-color: #3F4449;
}
.maliyettable-report th {
    border: 1px solid #474D54;
    padding-left: 10px;
    padding-right: 10px;
    color: black;
    background-color: #b2b2b2;
}
.maliyettable-report td {
    border: 1px solid #474D54;
    padding-left: 10px;
    padding-right: 10px;
}
.maliyettable-report input {
    color: black;
    background-color: transparent;
    border: none;
    padding: 0;
}

.searchbox {
    width: 200px;
    height: 38px;
    border-radius: 3px;
    border: 1px solid #474D54;
    margin-right: 5px;
    margin-left: calc(50% - 100px);
}

/*production_tracking_listtable*/
.production_tracking_listtable {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 2px;
}
.production_tracking_listtable tr {
    border: 1px solid;
    border-color: #474D54;
    height: 45px;
    transition: background-color 0.1s;
}
.production_tracking_listtable th {
    position: sticky;
    top: 0;
    border: 0.5px solid #131415;
    padding-top: 2px;
    padding-left: 5px;
    padding-right: 5px;
    font: 15px Arial;
    background-color:#3F4449;
}
.production_tracking_listtable td {
    border: 0.5px solid #131415;
    padding-top: 2px;
    padding-left: 5px;
    padding-right: 5px;
    font: 15px Arial;
}
.production_tracking_listtable input {
    background-color: transparent;
    border: none;
    color: black;
    width: 110px;
}

/*production_tracking_pagetable*/
.production_tracking_pagetable {
    color: #fff;
    width: 100%;
    margin-bottom: 15px;
    font: bold 17px Arial;
    border-collapse: collapse
}
.production_tracking_pagetable tr {
    height: 45px;
    transition: background-color 0.2s;
}
.production_tracking_pagetable thead tr {
    color: #F6C344;
    text-align: center;
}
.production_tracking_pagetable tbody tr:nth-child(odd) {background-color: #353A3F;}
.production_tracking_pagetable tbody tr:nth-child(odd):hover {background-color: #1f1f1f;}
.production_tracking_pagetable tbody tr:nth-child(even) {background-color: #3F4449;}
.production_tracking_pagetable tbody tr:nth-child(even):hover {background-color: #1f1f1f;}
.production_tracking_pagetable th[scope=col] {
    width: 80%;
    border: 1px solid #474D54;
    padding: 10px;
}
.production_tracking_pagetable th[scope=row] {
    width: 25%;
    border: 1px solid #474D54;
    padding: 10px;
}
.production_tracking_pagetable td {
    border: 1px solid #474D54;
    padding: 10px;
}
.production_tracking_pagetable td input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
    font: 19px Arial;
}
.production_tracking_pagetable select {
    appearance: none;
}

.fabric_listtable {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 0px;
}
.fabric_listtable tr {
    height: 45px;
    transition: background-color 0.1s;
}
.fabric_listtable th {
    position: sticky;
    top: 0;
    border: 0.5px solid #131415;
    padding-top: 2px;
    padding-left: 10px;
    background-color:#3F4449;
}
.fabric_listtable td {
    border: 0.5px solid #131415;
    border-top: 1px solid #131415;
    border-bottom: 1px solid #131415;
    padding-top: 2px;
    padding-left: 10px;
}

/*fabricpagetable*/
.fabricpagetable {
    color: #fff;
    width: 100%;
    margin-bottom: 15px;
    font: bold 17px Arial;
    border-collapse: collapse
}
.fabricpagetable tr {
    height: 45px;
    transition: background-color 0.2s;
}
.fabricpagetable thead tr {
    color: #F6C344;
    text-align: center;
}
.fabricpagetable tbody tr:nth-child(odd) {background-color: #353A3F;}
.fabricpagetable tbody tr:nth-child(odd):hover {background-color: #007951; font-size: larger;}
.fabricpagetable tbody tr:nth-child(even) {background-color: #3F4449;}
.fabricpagetable tbody tr:nth-child(even):hover {background-color: #9c5e20; font-size: larger;}
.fabricpagetable th[scope=col] {
    width: 80%;
    border: 1px solid #474D54;
    padding: 10px;
}
.fabricpagetable th[scope=row] {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.fabricpagetable td {
    border: 1px solid #474D54;
    padding: 10px;
}
.fabricpagetable td input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
    font: 19px Arial;
}

.fabric_list_add_button {
    border-radius: 10px;
    border: none;
    background-color: #f27a1b;
    transition: background-color 0.5s;
    border: 1px solid #353A3F;
}
.fabric_list_add_button:hover {
    background-color: #b84f0b;
}

.add_fabric_button {
    border-radius: 10px;
    border: none;
    background-color: #66FF66;
    transition: background-color 0.5s;
    border: 1px solid #07210f;
}
.add_fabric_button:hover {
    background-color: #53A551;
}

.fabric_list_body {
    background:linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(/images/redbrickwall.jpeg);
}

.reportpagebody {
    background:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(/images/toolswp.jpg);
}

.homepagebody {
    
}
.productlistbody {
    background:linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), url(/images/greytrianglewp.jpeg);
}

/*fabric_report_table*/
.fabric_report_table {
    color: black;
    border: 1px solid;
    border-color: #474D54;
    width: 100%;
    margin-bottom: 15px;
}
.fabric_report_table tr {
    height: 45px;
}
.fabric_report_table tbody tr:nth-child(odd) {background-color: white;}
.fabric_report_table tbody tr:nth-child(even) {background-color: #b2b2b2;}
.fabric_report_table th[scope=col] {
    width: 80%;
    border: 1px solid #474D54;
    padding: 10px;
}
.fabric_report_table th[scope=row] {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.fabric_report_table td {
    border: 1px solid #474D54;
    padding: 10px;
}
.fabric_report_table input {
    background-color: transparent;
    border: none;
}

/*product_report_table*/
.product_report_table {
    color: black;
    border: 1px solid;
    border-color: #474D54;
    width: 100%;
    margin-bottom: 15px;
}
.product_report_table tr {
    height: 1px;
}
/*.product_report_table tbody tr:nth-child(odd) {background-color: white;}
.product_report_table tbody tr:nth-child(even) {background-color: #b2b2b2;}*/
.product_report_table th[scope=col] {
    width: 60%;
    border: 1px solid #474D54;
    padding-left: 10px;
    padding-right: 10px;
    background-color: #b2b2b2;
}
.product_report_table th[scope=row] {
    width: 40%;
    border: 1px solid #474D54;
    padding-left: 10px;
    background-color: #b2b2b2;
}
.product_report_table td {
    border: 1px solid #474D54;
    padding-left: 10px;
}
.product_report_table input {
    width: 100%;
    border: none;
    background-color: transparent;
}
.product_report_table input:disabled {
    color: black;
    width: 100%;
    border: none;
    background-color: transparent;
}

/*pieceworktable-report*/
.pieceworktable-report {
    color: black;
    border: 1px solid;
    border-color: #474D54;
    width: 100%;
    margin-bottom: 15px;
}
.pieceworktable-report tr {
    height: 30px;
}
.pieceworktable-report thead tr {
    color: black;
    text-align: center;
}
.pieceworktable-report tbody tr:nth-child(odd) {background-color: white;}
.pieceworktable-report tbody tr:nth-child(even) {background-color: #b2b2b2;}
.pieceworktable-report th[scope=col] {
    width: 9%;
    border: 1px solid #474D54;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0;
    padding-bottom: 0;
}
.pieceworktable-report th[scope=row] {
    width: 14%;
    border: 1px solid #474D54;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0;
    padding-bottom: 0;
}
.pieceworktable-report td {
    border: 1px solid #474D54;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0;
    padding-bottom: 0;
}

/*pieceworktable_2-report*/
.pieceworktable_2-report {
    color: black;
    border: 1px solid;
    border-color: #474D54;
    width: 100%;
    margin-bottom: 15px;
}
.pieceworktable_2-report tr {
    height: 30px;
}
.pieceworktable_2-report thead tr {
    color: black;
    text-align: center;
}
.pieceworktable_2-report tbody tr:nth-child(odd) {background-color: white;}
.pieceworktable_2-report tbody tr:nth-child(even) {background-color: #b2b2b2;}
.pieceworktable_2-report th[scope=col] {
    width: 9%;
    border: 1px solid #474D54;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0;
    padding-bottom: 0;
}
.pieceworktable_2-report th[scope=row] {
    width: 14%;
    border: 1px solid #474D54;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0;
    padding-bottom: 0;
}
.pieceworktable_2-report td {
    border: 1px solid #474D54;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0;
    padding-bottom: 0;
}

/*samplepagetable*/
.samplepagetable {
    color: #fff;
    width: 100%;
    margin-bottom: 15px;
    font: bold 17px Arial;
    border-collapse: collapse;
}
.samplepagetable tr {
    height: 45px;
    transition: background-color 0.2s;
}
.samplepagetable thead tr {
    color: #F6C344;
    text-align: center;
    background-color:#353A3F;
}
.samplepagetable tbody tr:nth-child(odd) {background-color: #353A3F;}
.samplepagetable tbody tr:nth-child(odd):hover {background-color: #007951; font-size: larger;}
.samplepagetable tbody tr:nth-child(even) {background-color: #3F4449;}
.samplepagetable tbody tr:nth-child(even):hover {background-color: #9c5e20; font-size: larger;}
.samplepagetable th[scope=col] {
    width: 80%;
    border: 1px solid #474D54;
    padding: 10px;
}
.samplepagetable th[scope=row] {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.samplepagetable th input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
    font: 19px Arial;
}
.samplepagetable td {
    border: 1px solid #474D54;
    padding: 10px;
    font: 15px Arial;
}
.samplepagetable td input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
    font: 15px Arial;
}
.samplepagetable td textarea {
    color: #fff;
    font: 18px Arial;
    background-color: transparent;
    resize: none;
    width: 100%;
}

/*samplepagetablecaution*/
.samplepagetablecaution {
    color: #fff;
    width: 100%;
    margin-bottom: 15px;
    font: bold 17px Arial;
    border-collapse: collapse
}
.samplepagetablecaution tr {
    height: 45px;
    transition: background-color 0.2s;
}
.samplepagetablecaution thead tr {
    color: #F6C344;
    text-align: center;
}
.samplepagetablecaution tbody tr {background-color: #353A3F;}
.samplepagetablecaution tbody tr:hover {background-color: #bca22a; font-size: larger;}
.samplepagetablecaution tbody tr:hover td input {color: black;}
.samplepagetablecaution tbody tr:hover td {color: black;}
.samplepagetablecaution tbody tr:hover td textarea {color: black;}

.samplepagetablecaution th[scope=col] {
    width: 80%;
    border: 1px solid #474D54;
    padding: 10px;
}
.samplepagetablecaution th[scope=row] {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.samplepagetablecaution td {
    border: 1px solid #474D54;
    padding: 10px;
}
.samplepagetablecaution td input {
    color: #FDD835;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
    font: 19px Arial;
}
.samplepagetablecaution td textarea {
    color: #FDD835;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
    font: 19px Arial;
}

/*samplepagetable-nohover*/
.samplepagetable-nohover {
    color: #fff;
    width: 100%;
    margin-bottom: 15px;
    font: bold 17px Arial;
    border-collapse: collapse;
    margin-bottom: 3px;
}
.samplepagetable-nohover tr {
    height: 30px;
    transition: background-color 0.2s;
}
.samplepagetable-nohover thead tr {
    color: #F6C344;
    text-align: center;
}
.samplepagetable-nohover tbody tr:nth-child(odd) {background-color: #353A3F;}
.samplepagetable-nohover tbody tr:nth-child(even) {background-color: #3F4449;}
.samplepagetable-nohover th[scope=col] {
    width: 80%;
    border: 1px solid #474D54;
    padding: 10px;
}
.samplepagetable-nohover th[scope=row] {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.samplepagetable-nohover td {
    border: 1px solid #474D54;
    padding: 10px;
}
.samplepagetable-nohover td input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
    font: 19px Arial;
}

/*sample_report_table*/
.sample_report_table {
    color: black;
    border: 1px solid;
    border-color: #474D54;
    width: 100%;
    margin-bottom: 15px;
}
.sample_report_table tr {
    height: 45px;
}
/*.sample_report_table tbody tr:nth-child(odd) {background-color: white;}
.sample_report_table tbody tr:nth-child(even) {background-color: #b2b2b2;}*/
.sample_report_table th[scope=col] {
    width: 80%;
    border: 1px solid #474D54;
    padding: 10px;
    background-color: #b2b2b2;
}
.sample_report_table th[scope=row] {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
    background-color: #b2b2b2;
}
.sample_report_table td {
    border: 1px solid #474D54;
    padding: 10px;
    font: 15px Arial;
    font-weight: 600;
}
.sample_report_table td textarea {
    color: black;
    background-color: transparent;
    resize: none;
    width: 100%;
    font-weight: 600;
}


/*checkbox-pill*/
.toggle-pill-color input[type="checkbox"] {
    display: none;
  }
  .toggle-pill-color input[type="checkbox"] + label {
    display: block;
    position: relative;
    width: 4em;
    height: 2.1em;
    /*margin-bottom: 20px;*/
    margin-bottom: 0;
    border-radius: 1.33em;
    background: #e84d4d;
    box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-transition: background 0.1s ease-in-out;
    transition: background 0.1s ease-in-out;
  }
  .toggle-pill-color input[type="checkbox"] + label:before {
    content: "";
    display: block;
    width: 1.6em;
    height: 1.6em;
    border-radius: 1.33em;
    background: #fff;
    box-shadow: 2px 0px 5px rgba(0, 0, 0, 0.2);
    position: absolute;
    left: 0.2em;
    top: 0.26em;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
  }
  .toggle-pill-color input[type="checkbox"]:checked + label {
    background: #47cf73;
  }
  .toggle-pill-color input[type="checkbox"]:checked + label:before {
    box-shadow: -2px 0px 5px rgba(0, 0, 0, 0.2);
    left: 2.1em;
  }

.note-textarea {
    background-color: transparent;
    resize: none;
    width: 100%;
    font: 18px "Trebuchet MS";
}
.note-textarea:focus {
    color: white;
}

.accessory_list_add_button {
    border-radius: 10px;
    border: none;
    background-color: #12bd95;
    transition: background-color 0.5s;
    border: 1px solid #353A3F;
}
.accessory_list_add_button:hover {
    background-color: #53A551;
}

/*add_accessory_table*/
.add_accessory_table {
    color: #fff;
    width: 100%;
    margin-bottom: 15px;
    font: bold 17px Arial;
    border-collapse: collapse
}
.add_accessory_table tr {
    height: 45px;
    transition: background-color 0.2s;
}
.add_accessory_table thead tr {
    color: #F6C344;
    text-align: center;
}
.add_accessory_table tbody tr:nth-child(odd) {background-color: #353A3F;}
.add_accessory_table tr:nth-child(odd):hover {background-color: #007951; font-size: larger;}
.add_accessory_table tbody tr:nth-child(even) {background-color: #3F4449;}
.add_accessory_table tbody tr:nth-child(even):hover {background-color: #9c5e20; font-size: larger;}
.add_accessory_table th[scope=col] {
    width: 80%;
    border: 1px solid #474D54;
    padding: 10px;
}
.add_accessory_table th[scope=row] {
    width: 20%;
    border: 1px solid #474D54;
    padding: 10px;
}
.add_accessory_table td {
    border: 1px solid #474D54;
    padding: 10px;
}
.add_accessory_table td input {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
    font: 19px Arial;
}
.add_accessory_table input::placeholder {
    color: rgb(185, 185, 185);
}

.add_accessory_button {
    border-radius: 10px;
    border: none;
    background-color: #66FF66;
    transition: background-color 0.5s;
    border: 1px solid #07210f;
}
.add_accessory_button:hover {
    background-color: #53A551;
}

.samplepage_pagenums {
    border: none;
    outline: none;
    background-color: #FF9933;
    font-size: 20px;
    padding:0;

    width: 30px;
    
    margin-top: -20px;
    text-align: center;
}
.samplepage_pagenums:hover {
    background-color:  #53A551;
}

.addproduct-accessory_panel {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.addproduct-accessory_panel-content {
    background-color: #e1e1e1;
    margin: 10% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid rgb(12, 11, 11);
    width: 90%; /* Could be more or less, depending on screen size */
}

/*warning_panel*/
.warning_panel_style {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.warning_panel-content {
    background-color: #ff4400;
    margin: 20% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid rgb(12, 11, 11);
    width: 60%; /* Could be more or less, depending on screen size */
}

/*pop-ups*/


.page_mask {
    display: none;
    position: fixed;

    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;

    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.admin_listtable {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 0px;
}
.admin_listtable tr {
    height: 45px;
    transition: background-color 0.1s;
}
.admin_listtable th {
    position: sticky;
    top: 0;
    border: 0.5px solid #131415;
    padding-top: 2px;
    padding-left: 10px;
    background-color:#3F4449;
}
.admin_listtable td {
    border: 0.5px solid #131415;
    border-top: 1px solid #131415;
    border-bottom: 1px solid #131415;
    padding-top: 2px;
    padding-left: 10px;
}

.sample_report_body {
    width: 95%;
}

@media only screen and (max-width: 600px) {
    
}

@media print {
    body {
        -webkit-print-color-adjust: exact;
    }
    textarea {overflow: hidden;}

    .sample_report_body {
        width: 100%;
    }
    .note-textarea {
        font: 14px Arial;
    }
}