@font-face   { font-family: Humanist; src: url(humanist_bt.woff); font-display:swap }
body         { background-color:lightyellow  }

div.gallery1 { margin:0; padding:0; border:1px solid white;
               background-color:white;
	       float:left; width:26.3% }
div.gallery  { margin:0; padding:0; border:1px solid white;
               background-color:white;
	       float:left; width:17.6% }
div.gallery1 img, div.gallery img { width:100%; height:auto }
div.gallery1:hover, div.gallery1:active, div.gallery:hover, div.gallery:active
             { border:1px solid palevioletred }

/* Dropdown button */
.dropbtn     { background-color:green; color:white; margin:0% 2% 1% 0%;
	       font:large Humanist, "Gill Sans", Optima, sans-serif;
               padding:3%; border:none; border-radius:6px;
	       cursor:pointer }

/* Div container to position the dropdown content */
.dropdown    { position:relative; display:inline-block }
/* Dropdown content hidden by default */
.dropdown-content { display:none; position:absolute;
	       min-width:95%; z-index:1; overflow:auto;
	       background-color:honeydew;
	       box-shadow:5px 10px 10px rgba(0,0,0,0.5) }
/* Links inside the dropdown */
.dropdown-content a { display:block; text-decoration:none;
	       text-align:left; font-family:Humanist, "Gill Sans", Optima, sans-serif;
	       color:green; border:1px solid darkseagreen; padding:2% 0% 2% 8% }
/* Change color of dropdown links on hover */
.dropdown-content a:hover, .dropdown-content a:active { background-color:white; border:1px solid palevioletred }
/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content, .dropdown:active .dropdown-content { display:block }
/* Change the background color of the dropdown button on hover */
.dropdown:hover .dropbtn, .dropdown:active .dropbtn { background-color:palevioletred }

.img-link    { border:1px solid green }
div.affiliate { margin:1%; float:left;
	       width:30%; border:1px solid green }
div.affiliate:hover, div.affiliate:active, .img-link:hover, .img-link:active { border:1px solid palevioletred; background-color:white }
div.affiliate img { width:100%; height:auto }
div.desc     { font-family:smaller Arial, Helvetica, Arimo, sans-serif;
	       padding:3px; text-align: center }
.clear       { clear:both }

h1           { font-family:Humanist, "Gill Sans", Optima, Cabin, sans-serif; text-align:center; padding:3%; color:green }
h2           { font-family:Humanist, "Gill Sans", Optima, Cabin, sans-serif; text-align:center; color:darkgreen }
.event       { margin:0 }
.value       { font-style:italic; font-weight:bolder; font-size:larger; margin:3% 0% 0% }
h3, h4, h5   { font-family:Humanist, "Gill Sans", Optima, Cabin, sans-serif }

hr           { background:darkseagreen; color:darkseagreen; border:2px solid darkseagreen; border-radius:2px }

p            { color:black; font-family:Arial, Helvetica, Arimo, sans-serif; text-align:justify }
p.disclaim   { color:darkred; font:smaller Arial, Helvetica, Arimo, sans-serif; text-align:justify; margin-bottom:2% }
.soda-ash    { clear:both; font:smaller Arial, Helvetica, Arimo, sans-serif; text-align:center; color:darkgreen }
.tab         { margin-left:4% }
.subtab      { margin-left:9% }
.darkgreen   { color:green }
.organic     { color:darkred }
span.small   { font-size:smaller }
q            { font-style:italic; font-size:smaller }

dl           { font-family:Arial, Helvetica, Arimo, sans-serif }
dd           { font-family:Arial, Helvetica, Arimo, sans-serif; text-align:justify }
ul           { list-style-type:none; margin-left:0% }
ul.box       { list-style-type:square }
ul.dot       { list-style-type:disc }
li           { font-family:Arial, Helvetica, Arimo, sans-serif; text-align:justify }

table        { background-color:white; border-collapse:collapse; border:none; caption-side:top }
caption      { font:smaller Arial, Helvetica, Arimo, sans-serif; text-align:center; color:olivedrab }
.lather      { background-color:darksalmon; border:solid darkred; text-align:center; font:medium Arial, Helvetica, Arimo, sans-serif; color:black;
               margin-right:auto; margin-left:auto }
.header      { background-color:white; border:none; margin:0%; padding:0% }
td           { text-align:center; background-color:lightyellow }
td.soap      { background-color:white; border:thin dotted black }
td.soap2     { background-color:honeydew; border:thin dotted black }
td.soap3     { background-color:bisque; border:thin dotted black }

dt           { font-weight:bold }
dd           { padding-bottom:2% }

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

.soapcert    { text-align:center; margin:0%; padding:0% }
.center      { text-align:center; padding-top:1% }
.top         { vertical-align:top }
.wide        { width:100% }

a.make-soap:link, a.make-soap:visited { display:inline-block; background-color:green; color:white; 
               border:none; border-radius:6px;
	       font:normal normal normal large Humanist, "Gill Sans", Optima, Cabin, sans-serif;
	       text-align:center; text-decoration:none; padding:2% }
a.make-soap:hover, a.make-soap:active { background-color:palevioletred }

address      { clear:both; font:smaller Arial, Helvetica, Arimo, sans-serif; text-align:center; color:darkgreen; float:none }
.acutesoap   { font-size:smaller }