/* General Page Styling */
body {margin: 0;padding: 0;font-family: Arial,Gulim;color:#606060;display: flex;justify-content: center;align-items: flex-start;min-height: 100vh; padding-top: 10px;}
h3 {font-weight:bold;font-size:1.5em;}
.Insects {background-image:url(../Thumbs/BG-Images/BG-Insects.jpg);background-position:center top; background-attachment:fixed; }
.Miscellaneous {background-image:url(../Thumbs/BG-Images/BG-Miscellaneous.jpg);background-position:center top; background-attachment:fixed; }
.Miscanim {background-image:url(../Thumbs/BG-Images/BG-Miscanim.jpg);background-position:center top; background-attachment:fixed; }
.Plants {background-image:url(../Thumbs/BG-Images/BG-Plants.jpg);background-position:center top; background-attachment:fixed; }
.Spiders {background-image:url(../Thumbs/BG-Images/BG-Spider.jpg);background-position:center top; background-attachment:fixed; }
.b-Outside {background-image:url(../Thumbs/BG-Images/BG-b-Outside.jpg);background-position:center bottom; background-size:980px; }
.b-Compilations {background-image:url(../Thumbs/BG-Images/BG-b-Compilations.jpg);background-position:center bottom; background-size:980px; }
.b-All-Plants {background-image:url(../Thumbs/BG-Images/BG-b-All-Plants.jpg);background-position:center bottom; background-size:980px; }
.b-Plants-Misc {background-image:url(../Thumbs/BG-Images/BG-b-Plants-Misc.jpg);background-position:center bottom; background-size:980px; }
.M-Plants {background-image:url(../Thumbs/BG-Images/BG-M-Plants.jpg);background-position:center top; background-attachment:fixed; }
.M-Insects {background-image:url(../Thumbs/BG-Images/BG-M-Insects.jpg);background-position:center top; background-attachment:fixed; }
.M-Shells {background-image:url(../Thumbs/BG-Images/BG-M-Shells.jpg);background-position:center top; background-attachment:fixed; }
.M-Fossiles {background-image:url(../Thumbs/BG-Images/BG-M-Fossiles.jpg);background-position:center top; background-attachment:fixed; }
/* Container to constrain width and center content */
.main-container {width: 95%;max-width: 1000px;display: flex;flex-direction: column;gap: 0px;}
.thbox {margin-bottom:10px;padding:10px;border:1px solid #a0a0a0;border-radius: 5px;background:#efefef;text-align:center;}
/* Header Box */
.txboxm {background-color: #fcfcfc;border: 1px solid #a0a0a0;border-radius: 5px;padding: 5px;display: flex;justify-content: space-between;align-items: center;}
h1 {margin: 0;font-size: 1.1rem;font-weight: bold;text-align: center;flex-grow: 1;}
.fs092 {font-size:88%;}
/* Menu */
.menbut {width:32px;height:42px;background-color: #fcfcfc;color: #606060; background-image:url(../Thumbs/But-Images/BG-menu.png);text-align: left; font-size: .82em; font-weight:bold; border: 1px solid #a0a0a0; border-radius:5px; display: inline-block;cursor: pointer;text-decoration:none;}
button:hover {color: #e05454;border-box:2px solid #e05454;}
.marbut {height:50px;background-color: #fcfcfc;color: #606060; text-align: left; font-size: .7em; font-weight:bold; border: 1px solid #a0a0a0; border-radius:5px; display: inline-block;cursor: pointer;text-decoration:none;}
.active {background-color:#ddf4d5;}
.mb {margin:0px 0px 5px 0px;}
.dpd {position: relative;display: inline-block;}
.dpd-numlist {display: none;position: absolute;top:10px; left:-182px;background-color:#ffffff;font-weight:bold; z-index: 55;padding:5px 5px 0px 5px;border:solid 2px #a0a0a0; border-radius:5px;} 
.dpd:hover .dpd-numlist {display: block;}
.imenu {position: relative;display: inline-block;}
.imenu-numlist {display: none;position: absolute;top:10px; left:-182px;background-color:#ffffff;font-weight:bold; z-index: 65;padding:5px 5px 0px 5px;border:solid 2px #a0a0a0; border-radius:5px;} 
.imenu:hover .imenu-numlist {display: block;}
.mmenu {position: relative;display: inline-block;}
.mmenu-numlist {display: none;position: absolute;top:10px; left:-82px;background-color:#ffffff;font-weight:bold; z-index: 65;padding:5px 5px 0px 5px;border:solid 2px #a0a0a0; border-radius:5px;} 
.mmenu:hover .mmenu-numlist {display: block;}
.butIbees {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Bees.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butIbeetles {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Beetles.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butIbugs {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Bugs.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butIbutterflies {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Butterflies.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butIcaterpillar {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Caterpillar.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butIcicadas {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Cicadas.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butIdragonflies {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Dragonflies.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butIflies {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Flies.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butIgrashoppers {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Grashoppers.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butIlice {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Lice.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butImoth {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Moths.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butImisc {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Miscellaneous.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butIhome {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-Insects.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butIexcebition {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-I-Excebitions.jpg); background-position:0px 0px; background-repeat:no-repeat;}

.butil {width:190px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-Insects.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butsl {width:190px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-Spiders.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butpl {width:190px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-Plants.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butman {width:190px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-Miscanimals.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butfun {width:190px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-Fungi.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butmul {width:190px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-Museum.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butnp {width:190px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-nphoto.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.buthl {width:190px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-home-n.jpg); background-position:0px 0px; background-repeat:no-repeat;}

.butMshells {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-M-shells.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butMplants {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-M-plants.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butMfossile {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-M-fossile.jpg); background-position:0px 0px; background-repeat:no-repeat;}
.butMinsect {width:170px; padding-left:65px; padding-right:5px; background-image:url(../Thumbs/But-Images/but-M-insect.jpg); background-position:0px 0px; background-repeat:no-repeat;}
/* links */
a:link { text-decoration:none; font-weight:bold; color:#606060; }
a:active { text-decoration: none; font-weight:bold;color: #606060; }
a:visited { text-decoration: none; font-weight:bold;color: #606060; }
a:hover { text-decoration: none; font-weight:bold;color: #e05454; }

/* Content Box */
.content-box {background-color: #efefef;border: 1px solid #a0a0a0;border-radius: 5px;padding: 10px;}
.flby {border:1px solid #a0a0a0;text-align:center;padding:10px 10px 10px 10px;border-radius: 5px 5px 5px 5px;background-color:#fcfcfc;}
.flbe {border:1px solid #a0a0a0;text-align:center;padding:5px 10px 5px 10px;border-radius: 5px;background-color:#fafafa;}
.flbe h1 {margin: 5px;font-size: 0.9rem;font-weight: bold;text-align: center;flex-grow: 1;}
.flbe img {border:1px solid #a0a0a0;border-radius: 5px;}
.flbm {border:1px solid #a0a0a0;text-align:center;padding:5px 5px 5px 5px;font-weight:bold;font-family:Arial; border-radius: 5px;background-color:#fafafa;}
.flbm img {border:1px solid #a0a0a0;border-radius: 5px;}
.xthb {width:96%;border:1px solid #a0a0a0;border-radius: 5px;}
/* 5 Column Grid */
colX {display: grid;grid-template-columns: repeat(5, 1fr);gap: 10px;}
col3 {display: grid;grid-template-columns: repeat(3, 1fr);gap: 10px;}
col4 {display: grid;grid-template-columns: repeat(4, 1fr);gap: 10px;}
col7 {display: grid;grid-template-columns: repeat(7, 1fr);gap: 10px;}
col14 {display: grid;grid-template-columns: repeat(14, 1fr);gap: 5px;}

/* Individual Card 3-Grid*/
.cnty3 {line-height:120%;background-color: #fcfcfc;border: 1px solid #a0a0a0;border-radius: 5px;padding:10px 5px 5px 5px;text-align: center;font-size: 0.75rem;display: flex;flex-direction: column;align-items: center;}
.cnty3 img {width:100%;border:1px solid #a0a0a0;border-radius: 5px;}
/* Individual Card 4-Grid*/
.box4 {text-align:center;margin:5px;padding:10px;margin-bottom:10px;line-height:120%;background-color:#ffffff;border:1px solid #a0a0a0;border-radius: 5px;font-size: 0.85rem;display: flex;flex-direction: column;align-items: center;}
.box4 img {width:100%;}

/* Individual Card 5-Grid*/
.cnty {line-height:120%;background-color: #fcfcfc;border: 1px solid #a0a0a0;border-radius: 5px;padding:10px 5px 5px 5px;text-align: center;font-size: 0.75rem;display: flex;flex-direction: column;align-items: center;}
.cnty img {width:90%;border:1px solid #a0a0a0;border-radius: 5px;}

 
.b-Bees {background-image:url(../Thumbs/BG-Images/BG-b-Bees.jpg);background-position:center bottom; background-size:980px; }
.b-Beetles {background-image:url(../Thumbs/BG-Images/BG-b-Beetles.jpg);background-position:center bottom; background-size:980px; }
.b-Bugs {background-image:url(../Thumbs/BG-Images/BG-b-Bugs.jpg);background-position:center bottom; background-size:980px; }
.b-Butterflies {background-image:url(../Thumbs/BG-Images/BG-b-Butterflies.jpg);background-position:center bottom; background-size:980px; }
.b-Caterpillar {background-image:url(../Thumbs/BG-Images/BG-b-Caterpillar.jpg);background-position:center bottom; background-size:980px; }
.b-Cicadas {background-image:url(../Thumbs/BG-Images/BG-b-Cicadas.jpg);background-position:center bottom; background-size:980px; }
.b-Dragonflies {background-image:url(../Thumbs/BG-Images/BG-b-Dragonflies.jpg);background-position:center bottom; background-size:980px; }
.b-Flies {background-image:url(../Thumbs/BG-Images/BG-b-Flies.jpg);background-position:center bottom; background-size:980px; }
.b-Grashoppers {background-image:url(../Thumbs/BG-Images/BG-b-Grashoppers.jpg);background-position:center bottom; background-size:980px; }
.b-Lice {background-image:url(../Thumbs/BG-Images/BG-b-Lice.jpg);background-position:center bottom; background-size:980px; }
.b-Moths {background-image:url(../Thumbs/BG-Images/BG-b-Moths.jpg);background-position:center bottom; background-size:980px; }
.b-Structures {background-image:url(../Thumbs/BG-Images/BG-b-Structures.jpg);background-position:center bottom; background-size:980px; }
.b-Exhibitions {background-image:url(../Thumbs/BG-Images/BG-b-Exhibitions.jpg);background-position:center bottom; background-size:980px; }
.b-Frogs {background-image:url(../Thumbs/BG-Images/BG-b-Frogs.jpg);background-position:center bottom; background-size:980px; }
.b-Reptiles {background-image:url(../Thumbs/BG-Images/BG-b-Reptiles.jpg);background-position:center bottom; background-size:980px; }
.b-Crabs {background-image:url(../Thumbs/BG-Images/BG-b-Crabs.jpg);background-position:center bottom; background-size:980px; }
.b-Snails {background-image:url(../Thumbs/BG-Images/BG-b-Snails.jpg);background-position:center bottom; background-size:980px; }
.b-Jelly {background-image:url(../Thumbs/BG-Images/BG-b-Jelly.jpg);background-position:center bottom; background-size:980px; }
.b-Squirrel {background-image:url(../Thumbs/BG-Images/BG-b-Squirrel.jpg);background-position:center bottom; background-size:980px; }
.b-Fungi {background-image:url(../Thumbs/BG-Images/BG-b-Fungi.jpg);background-position:center bottom; background-size:980px; }
.b-TFungi {background-image:url(../Thumbs/BG-Images/BG-b-TFungi.jpg);background-position:center bottom; background-size:980px; }
.b-Spider {background-image:url(../Thumbs/BG-Images/BG-b-Spider.jpg);background-position:center bottom; background-size:980px; }
.b-Spider-m {background-image:url(../Thumbs/BG-Images/BG-b-Spider-m.jpg);background-position:center bottom; background-size:980px; }
.b-M-Insects {background-image:url(../Thumbs/BG-Images/BG-b-M-Insects.jpg);background-position:center bottom; background-size:980px; }
.b-M-Shells {background-image:url(../Thumbs/BG-Images/BG-b-M-Shells.jpg);background-position:center bottom; background-size:980px; }
.b-M-Fossiles {background-image:url(../Thumbs/BG-Images/BG-b-M-Fossiles.jpg);background-position:center bottom; background-size:980px; }
.b-Macros {background-image:url(../Thumbs/BG-Images/BG-b-Macros.jpg);background-position:center bottom; background-size:980px; }
.b-Lauraceae {background-image:url(../Thumbs/BG-Images/BG-b-Lauraceae.jpg);background-position:center bottom; background-size:980px; }
.b-Ranunculaceae {background-image:url(../Thumbs/BG-Images/BG-b-Ranunculaceae.jpg);background-position:center bottom; background-size:980px; }
.b-Rosaceae {background-image:url(../Thumbs/BG-Images/BG-b-Rosaceae.jpg);background-position:center bottom; background-size:980px; }
.mb10 {margin-bottom:10px;}
.mb20 {margin-bottom:20px;}
.mr3 {margin-right:3px;}
.mc {margin-left:auto;margin-right:auto;}
.tc {text-align:center;}
.fs10 {font-size:.8em;}

#TopBtn {display: none;position: fixed; width:60px;height:60px;background-image:url(../Thumbs/But-Images/Top-Arrow.gif);bottom: 20px; right: 30px; z-index: 99; font-size: 18px; border: 1px solid #a0a0a0;box-shadow:3px 3px 3px grey; background-color: #e0e0e0; color: #606060; cursor: pointer;border-radius: 30px;}
#TopBtn:hover {color: #e05454;}


/* Responsive adjustments */
@media (max-width: 800px) {
	colX {grid-template-columns: repeat(4, 1fr);} 
	col7 {grid-template-columns: repeat(5, 1fr);} 
	col4 {grid-template-columns: repeat(3, 1fr);} 
	col3 {grid-template-columns: repeat(2, 1fr);} 
	h1 {margin: 0;font-size: 1rem;font-weight: bold;text-align: center;flex-grow: 1;}
	h3 {font-weight:bold;font-size:1.3em;}
	#TopBtn {display: none;position: fixed; width:40px;height:40px;background-image:url(../Thumbs/But-Images/Top-Arrow-40.gif);bottom: 20px; right: 30px; z-index: 99; font-size: 18px; border: 1px solid #a0a0a0;box-shadow:2px 2px 2px grey; background-color: #e0e0e0; color: #606060; cursor: pointer;border-radius: 20px;}
}
@media (max-width: 570px) {
	colX {grid-template-columns: repeat(3, 1fr);}
	col7 {grid-template-columns: repeat(3, 1fr);} 
	h1 {margin: 0;font-size: .9rem;font-weight: bold;text-align: center;flex-grow: 1;}
}
@media (max-width: 490px) {
	colX {grid-template-columns: repeat(2, 1fr);}
	col3 {grid-template-columns: repeat(1, 1fr);}
	h3 {font-weight:bold;font-size:1.1em;}
}
@media (max-width: 560px) {col4 {grid-template-columns: repeat(2, 1fr);}}
@media (max-width: 370px) {col7 {grid-template-columns: repeat(2, 1fr);}}
@media (max-width: 200px) {col7 {grid-template-columns: repeat(1, 1fr);}}