﻿body,h1,h2,h3,h4,h5 {font-family:sans-serif}

body {font-size:16px}

body, html {
  height: 100%;
  line-height: 1.8;
}

/* Dropdown Menu Large
/* Navbar container */
.navbar {
  overflow: hidden;
  background-color: white;
  font-family: Arial;
}

/* Links inside the navbar */
.navbar a {
  float: left;
  font-size: 16px;
  color: black;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

/* The dropdown container */
.dropdown {
  float: left;
  overflow: hidden;
}

/* Dropdown button */
.dropdown .dropbtn {
  font-size: 16px;
  border: none;
  outline: none;
  color: black;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit; /* Important for vertical align on mobile phones */
  margin: 0; /* Important for vertical align on mobile phones */
}

/* Add a red background color to navbar links on hover */
.navbar a:hover, .dropdown:hover .dropbtn {
  color: white;
  background-color: red;
}

/* Dropdown content (hidden by default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: white;
  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 {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

/* Add a grey background color to dropdown links on hover */
.dropdown-content a:hover {
  background-color: red;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block;
}

/* Large Full height image header */
.bgimg-lg {
  background-position: top;
  background-size: cover;
  background-image: url("background-lg.jpg");
  min-height: 100%;
  margin-top:130px;
}

/* Samll Full height image header */
.bgimg-sm {
  background-position: top;
  background-size: cover;
  background-image: url("background-sm.jpg");
  min-height: 100%;
  margin-top:130px;
}

.topBar {
    color: #ffffff;
	background-color: #FF0000;
}

a {text-decoration: none}

h1 {font-size: 48px}
    
h2 {font-size: 40px}

h3 {font-size: 32px}

h4 {font-size: 24px}

.w3-bar .w3-button {padding: 10px}

table {
    width: 100%;
    border-collapse: collapse;
  }

.imgHalf{
    padding-top:10px;
	padding-bottom:10px;
	display: block;
	margin: 0 auto;
	border: 0px solid #ccc; /* Optional: for visualization */
}

.txtHalf{
    font-size: 18px;
	padding-top:10px;
	padding-bottom:10px;
	margin: 0 auto; /* Centers the row horizontally */
	text-align: left; /* Centers the text within the row */
	border: 0px solid #ccc; /* Optional: for visualization */
}

.imgHalf-Small{
    width:100%;
	padding-top:10px;
	padding-bottom:10px;
	display: block;
	margin: 0 auto;	
	border: 0px solid #ccc; /* Optional: for visualization */
}

.txtHalf-Small{
    width:100%;
	font-size: 18px;
	padding-top:10px;
	padding-bottom:10px;
	margin: 0 auto; /* Centers the row horizontally */
	text-align: left; /* Centers the text within the row */
	border: 0px solid #ccc; /* Optional: for visualization */
}

.sds-btn{font-size: 18px}	

#about{background-color: #E8E8E8}

#products {background-color: #F5F5F5}

#sds {background-color: #E8E8E8}
	
#locations {background-color: #F5F5F5}

#contact {background-color: #E8E8E8}

#sds-list{
	width: 40%;
	display: block;
	margin: 0 auto;	
}  

#sds-list-small{
	width: 100%;
	display: block;
	margin: 0 auto;	
}

.corners {
  border-radius: 25px;
}

/* clickable Dropdown*/
.navbar-sm {
  background-color: inherit;
  font-family: Arial;
}

/* Links inside the navbar */
.navbar-sm a {
  font-size: 16px;
  color: white;
}

.dropbtn-sm {
  background-color: inherit;
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
}

.dropbtn-sm:hover, .dropbtn-sm:focus {
  background-color: inherit;
}

.dropdown-sm {
  position: relative;
  display: inline-block;
}

.dropdown-content-sm {
  display: none;
  position: absolute;
  background-color: inherit;
  min-width: 160px;
  overflow: auto;
  z-index: 1;
}

.dropdown-content-sm a {
  color: white;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-sm a:hover {
  background-color: inherit;
}

.show {display: block;}