body {
    font-family: Tahoma, sans-serif;
    font-size: 1rem; /* Use rem for scalable fonts */
    margin: 0;
    padding: 0;
}


.centered {
    text-align: center;
}


 input[type="text"]:focus {
        border: 1.5px solid #FE9F10;
        outline: none;
    }


input[type="password"]:focus {
        border: 1.5px solid #FE9F10;
        outline: none;
    }


img {
    max-width: 100%;
    height: auto;
}


td				
	{
		font-family: Tahoma, sans-serif;
		font-size: 0.92rem;
	}
	
	
td.heading		{
		background-color: #000000;
		color: #FFFFFF;
		font-size: 0.75rem;
		vertical-align: middle;
}
	

h1, h2, h3, h4, h5, h6, dt {
    font-family: Tahoma, sans-serif;
    font-style: normal;
    font-weight: 700; /* Default weight, override as needed */
    letter-spacing: normal;
    text-decoration: none;
    text-transform: none;
    word-spacing: normal;
}

h1 { font-size: 2em; }
h2 { font-size: 1.75em; }
h3 { font-size: 1.58em; font-weight: 500; }
h4 { font-size: 1.33em; font-weight: 500; }
h5, dt { font-size: 1em; }
h6 { font-size: 0.8em; }


TFOOT, THEAD, TH {
    font-family: Tahoma, sans-serif;
    font-size: 1em;
    letter-spacing: normal;
    text-transform: none;
    word-spacing: normal;
}

TH {
    font-weight: bold;
    vertical-align: baseline;
}

A:link
{
    COLOR: #0099CC;
    TEXT-DECORATION: none
}
A:visited
{
    COLOR: #0099CC;
    TEXT-DECORATION: none
}
A:active
{
    COLOR: #0099CC;
    TEXT-DECORATION: none
}
A:hover
{
    COLOR: #FF9900;
    TEXT-DECORATION: none
}
A.a1:link
{
    COLOR: #006699;
    TEXT-DECORATION: none
}
A.a1:visited
{
    COLOR: #006699;
    TEXT-DECORATION: none
}
A.a1:active
{
    COLOR: #006699;
    TEXT-DECORATION: none
}
A.a1:hover
{
    COLOR: #006699;
    TEXT-DECORATION: none
}

A.T-Link:link{
    color: #959898;
    text-decoration: none;
}

A.T-Link:visited{
    color: #959898;
    text-decoration: none
}
A.T-Link:active{
    color: #959898;
    text-decoration: none
}
A.T-Link:hover{
    color: #959898;
    text-decoration: none
}

.T-Link-Bar{
	padding:2px 3px 0px 3px;
	font-family:Verdana, Helvetica, sans-serif;
	font-size: 0.625rem;
	color:#959898;
	font-weight:bold;
	text-align:center;
}

.text
{
    FONT-FAMILY: Tahoma, sans-serif;
    font-size: 0.75rem;
    FONT-WEIGHT: normal    
}



.dist-text
{
    FONT: 0.75rem/0.83rem Tahoma, sans-serif;
}
.text-b-small
{
    COLOR: black;
    font-size: 0.6875rem;
    FONT-WEIGHT: bold
}
.err
{
    COLOR: red;
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: .75rem
}
.stext
{
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 0.6875rem;
}
.text-b
{
    COLOR: black;
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 0.92rem;
    FONT-WEIGHT: bold
}
.text12-b
{
    COLOR: black;
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 1.0rem;
    FONT-WEIGHT: bold
}
.text12-b-blue,.page-heading
{ 
    color:#fe9f10;
    FONT-FAMILY:Arial, Helvetica, sans-serif;
    FONT-SIZE: 1.0rem;
    FONT-WEIGHT: bold;
	height:25px;
	padding-left:5px
}
.page-heading{ 
    font-size: 0.92rem;
	background-color:#f5f5f5;
	padding-top:3px;
}

.text10-b-blue
{
    COLOR: #006699;
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 0.92rem;
    FONT-WEIGHT: bold
}
.text9-b-blue
{
    COLOR: #006699;
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 0.92rem;
    FONT-WEIGHT: bold
}

.white-b
{
    COLOR: white;
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 0.92rem;
    FONT-WEIGHT: bold
}
.text-blue
{
    COLOR: #0a5c88;
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 0.92rem;
    FONT-WEIGHT: bold
}
.white-b-results
{
    COLOR: white;
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 0.92rem;
    FONT-WEIGHT: bold
}
.white
{
    COLOR: white;
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 0.92rem
}
.swhite
{
    COLOR: white;
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 0.83rem
}
.page-head
{
    COLOR: black;
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 1.0rem;
    FONT-WEIGHT: bold
}
.nstextbox
{
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 0.92rem
}
.textbox, .textbox_new, .textbox_tiny {
    border: 1px solid #0099CC; /* Shorthand for setting all borders */
    font-family: Tahoma, sans-serif;
    font-size: 0.92rem;
}

.textbox {
    width: 200px;
}

.textbox_new {
    width: 195px;
}

.textbox_tiny {
    width: 28px;
}
.textarea, .textboxlarge, .textboxextralarge {
    border: 1px solid #0099CC; /* Shorthand for all borders */
    font-family: Tahoma, sans-serif;
    padding: 10px; /* Larger touch targets */
}

.textarea {
    font-size: 0.75rem;
    height: 50px;
    width: 500px;
}

.textboxlarge, .textboxextralarge {
    font-size: 0.92rem; /* Same font size for both, so it's grouped */
}

.textboxlarge {
    width: 450px;
}

.textboxextralarge {
    width: 650px;
}



.dropdown
{
    BORDER-BOTTOM: #0099CC 1px solid;
    BORDER-LEFT: #0099CC 1px solid;
    BORDER-RIGHT: #0099CC 1px solid;
    BORDER-TOP: #0099CC 1px solid;
    FONT-FAMILY: Tahoma, sans-serif;
    FONT-SIZE: 0.75rem;
    WIDTH: 450px;
    border-padding: 0;
}
.textboxsmall, .textboxsmallest, .textboxmedium, .textbox-big, .textbox450, .stextbox2, .stextbox {
    border: 1px solid #0099CC;
    font-family: Tahoma, sans-serif;
    font-size: 0.92rem;
}
.textboxsmall {
    width: 100px;
}
.textboxsmallest {
    width: 60px;
}
.textboxmedium {
    width: 150px;
}
.textbox-big {
    width: 640px;
}
.textbox450 {
    width: 450px;
}
.stextbox2 {
    width: 55px;
}
.stextbox {
    width: 35px;
}


.button, .textbox, .dropdown {
    padding:.6em; /* Larger touch targets */
    font-size: 1em; /* Scalable font size */
    width: auto; /* Full width on small screens */
    max-width: 100%; /* Prevent overflow */
}

@media (max-width: 768px) {
    .button, .textbox, .dropdown {
        width: 100%; /* Use full width for smaller screens */
    }
}




.button {
    font-family: 'Tahoma', sans-serif; /* Keep the font family */
    background-color: #E5E5E5; /* Updated to a more vibrant color */
    color: black; /* Light text color for better contrast */
    border: none; /* Remove the border for a cleaner look */
    border-radius: 2px; /* Rounded corners for a modern look */
    cursor: pointer; /* Keep the cursor as pointer */
    transition: all 0.3s ease; /* Smooth transition for interactions */
}

.button:hover {
    background-color:  #fff2e6;; /* Slightly darker shade on hover for feedback */
    border-color: orange !important;
}






@media (max-width: 1600px){
        .cssbutton{
                WIDTH:220px;
                BORDER-BOTTOM: #006699 0px solid;
                BORDER-LEFT: #006699 0px solid;
                BORDER-RIGHT: #006699 0px solid;
                BORDER-TOP: #006699 0px solid;
                FONT-FAMILY: Tahoma, sans-serif;
                BACKGROUND-COLOR: #E5E5E5;
                COLOR: #000000;
                FONT-SIZE: 0.92rem;
                border-padding: 0
                 border-radius: 2px; /* Rounded corners for a modern look */
        }
       .cssbutton:hover {
         background-color: orange; /* Slightly darker shade on hover for feedback */
        }

        .inventory_button_row, .sku_column{
                display:compact;
        }
        .inventory_dropdown_row{
                display:none;
        }
        .search_table{
                width:100%;
        }
}


@media (max-width: 1200px){
	.cssbutton{
		WIDTH:195px;
   font-family: 'Tahoma', sans-serif; /* Keep the font family */
    background-color: #E5E5E5; /* Updated to a more vibrant color */
    color: black; /* Light text color for better contrast */
    font-size: 0.92rem; /* Slightly larger font size for better readability */
    padding: 3px 6px; /* More padding for a larger, easier-to-click button */
    border: none; /* Remove the border for a cleaner look */
    border-radius: 2px; /* Rounded corners for a modern look */
    cursor: pointer; /* Keep the cursor as pointer */
    transition: all 0.3s ease; /* Smooth transition for interactions */	
   }
      .cssbutton:hover {
         background-color: orange; /* Slightly darker shade on hover for feedback */
        }

	.inventory_button_row, .sku_column{
		display:compact;
	}
	.inventory_dropdown_row{
		display:none;
	}
	.search_table{
		width:100%;
	}
}
@media (max-width: 900px){
	.cssbutton{
		WIDTH:125px;
   font-family: 'Tahoma', sans-serif; /* Keep the font family */
    background-color: #E5E5E5; /* Updated to a more vibrant color */
    color: black; /* Light text color for better contrast */
    font-size: 0.92rem; /* Slightly larger font size for better readability */
    padding: 3px 6px; /* More padding for a larger, easier-to-click button */
    border: none; /* Remove the border for a cleaner look */
    border-radius: 2px; /* Rounded corners for a modern look */
    cursor: pointer; /* Keep the cursor as pointer */
    transition: all 0.3s ease; /* Smooth transition for interactions */	}
      .cssbutton:hover {
         background-color: orange; /* Slightly darker shade on hover for feedback */
        }

	.inventory_button_row, .sku_column{
		display:none;
	}
	.inventory_dropdown_row{
		display:inline;
	}
	.search_table{
		width:68%;
	}
}

@media (max-width: 768px) {
    body, td, th {
        font-size: 0.9rem; /* Smaller font size for small devices */
    }
    h1, .text12-b-blue, .page-heading {
        font-size: 1.5rem; /* Adjust heading sizes for readability */
    }
}



SMALL
{
    FONT-SIZE: 0.7em
}
BIG
{
    FONT-SIZE: 1.17em
}
BLOCKQUOTE
{
    FONT-FAMILY: Courier New, monospace
}
PRE
{
    FONT-FAMILY: Courier New, monospace
}
.bullet
{
    LINE-HEIGHT: 135%;
    LIST-STYLE: square;
    MARGIN-BOTTOM: 10px;
    MARGIN-LEFT: 50px;
    MARGIN-TOP: 5px;
    PADDING-BOTTOM: 0px;
    PADDING-LEFT: 0px;
    PADDING-RIGHT: 0px;
    PADDING-TOP: 0px
}
.greentext
{
    COLOR: black;
    font-size: 0.6875rem;
    FONT-WEIGHT: bold
}


.hidden
{
	Z-INDEX: -1;
    visibility:hidden;
	top:0;
	left:0;
	position:absolute;
}
.textboxsmalldrp
{
	position:static;    
    visibility:visible;
    BORDER-BOTTOM: #0099CC 1px solid;
    BORDER-LEFT: #0099CC 1px solid;
    BORDER-RIGHT: #0099CC 1px solid;
    BORDER-TOP: #0099CC 1px solid;
    FONT-FAMILY: Tahoma, sans-serif;
    WIDTH: 100px;
    border-padding: 0;
}  

.trHover
{ 	
	/* background-color:#f5f5f5; */
	background-color:#eaeaea;
}

.tdRightAligner
{

text-align:		right;
padding-right:	3px;

}

.Box {
	padding:		6px 0px;
	margin-bottom:	0px;
	border:			1px solid #dae0e4;
}

.BoxTitle {
	padding:		4px 5px;
	font-size: 0.75rem;
	font-weight:	bold;
	color:			#006699
}
.divHelpInformationContent{
	padding:10px 5px 8px 25px;
}
.spanHelpInformationTitle{
	font-weight:bold;
	padding:5px 0px 3px 5px;
}
.mainHelpInformation{

	border:1px #f5f5f5 solid; 
	display:none; 
	margin:3px 30px 3px 30px; 
	background-color:#f5f5f5;
}
.table_td_border{
		border-style: solid;
		border-width: 1px;
		border-color: #F5F5F5;
	}



/* General Table Styles */
.table-category {
    width: 100%; 
    border-collapse: collapse;
    background-color: #FFFFFF; /* Setting the background color */
}

.table-category th, .table-category td {
    padding: 0.5em 2em; /* Consistent padding in headers and cells */
    border: .5px solid #eaeaea; /* Consistent border styling */
    font-size: 1.1em; /* Slightly larger font for headers */
    text-align: left; /* Aligning text to the left (or center if preferred) */
}

.table-category th {
    background-color: #eaeaea; /* Background color for table headers */
    font-weight: bold; /* Making header text bold */
}

/* Specific Styles for Interaction */
.table-category tr:hover {
    background-color: #f5f5f5; /* Light grey background on hover */
}

.table-category td.highlight, .table-category th.highlight {
    background-color: #fe9f10; /* Highlight color for specific cells */
    color: #FFFFFF; /* White text color when highlighted */
}




/* Style for the modal background */
.modal-background {
  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: rgba(0,0,0,0.4); /* Black w/ opacity */
  display: flex; /* Use flexbox to center */
  align-items: center; /* Vertical center */
  justify-content: center; /* Horizontal center */
}

/* Modal Content */
.modal-content {
  background-color: #fefefe;
  margin: auto; /* Auto margins for flexbox centering */
  padding: 20px;
  border: 1px solid #888;
  /* width: 80%;  Could be more or less, depending on screen size */
  max-width: 800px; /* Maximum width */
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19); /* Optional: Adds some shadow to the modal */
}

/* The Close Button */
.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

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

/* Style the link */
.view-image-link {
  cursor: pointer;
  color: #0099CC;
  text-decoration: none;
}


.inventory_border{
    border-style: solid;
    border-width: 1px;
    border-color: #F5F5F5;
 }