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;}
h2 {margin: 0;font-size: 1.3em;font-weight: bold;text-align: center;flex-grow: 1;}
h3 {font-weight:bold;font-size:1.5em;}
.birds {background-image:url(../flagrecords/Gallery-bg.jpg);background-position:center top; background-attachment:fixed;background-repeat: repeat-y;}
.edu {background-image:url(../Education/images/Education.jpg);background-position:center top; background-attachment:fixed;background-repeat: repeat-y;}
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; }
button:hover {color: #e05454;border-box:2px solid #e05454;}
/* 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: 10px;background:#efefef;text-align:center;}
/* Header Box */
.hxboxm {background-color: #fcfcfc;border: 1px solid #a0a0a0;border-radius: 8px;padding: 5px;display: flex;justify-content: space-between;align-items: center;}
.txboxm {background-color: #fcfcfc;border: 1px solid #a0a0a0;border-radius: 5px;padding: 10px;display: flex;justify-content: space-between;align-items: center;}
.txboxm h1 {margin: 0;font-size: 1rem;font-weight: bold;text-align: center;flex-grow: 1;}
.fs092 {font-size:88%;}
/* Content Box */
.content-box {background-color: #efefef;border: 1px solid #a0a0a0;border-radius: 10px;padding: 10px;}
.b-Birds {background-image:url(../res/BG-Images/Birds.jpg);background-position:center bottom; background-size:980px; }
.b-Videos {background-image:url(../res/BG-Images/Videos.jpg);background-position:center bottom; background-size:980px; }
.b-Hybrids {background-image:url(../res/BG-Images/Hybrids.jpg);background-position:center bottom; background-size:980px; }
.b-Sick {background-image:url(../res/BG-Images/Sick.jpg);background-position:center bottom; background-size:980px; }
.b-Dead {background-image:url(../res/BG-Images/Dead.jpg);background-position:center bottom; background-size:980px; }

.b-edu  {background-image: linear-gradient(to bottom, #deebf8, #e2e9d9, #e4d7d4); }
colX {display: grid;grid-template-columns: repeat(5, 1fr);gap: 10px;font-size:.7rem;}
.flby {border:1px solid #a0a0a0;text-align:center;padding:10px 10px 10px 10px;border-radius: 8px;background-color:#fcfcfc;}
.mb10 {margin-bottom:10px;}
/* Individual Card 5-Grid*/
.cnty {line-height:120%;font-size:.85em;background-color: #fcfcfc;border: 1px solid #a0a0a0;border-radius: 5px;padding:10px 5px 5px 5px;text-align: center;display: flex;flex-direction: column;align-items: center;}
.cnty img {width:95%;border:1px solid #a0a0a0;border-radius: 5px;}
.cnty:hover { border:1px solid #e05454;outline:2px solid #e05454; }

.f16 {font-size:1rem;}
.mtb5 {margin:5px 0px 5px 0px;}
/* infobox */
.htboxtl {padding:10px 30px 10px 10px;border:1px solid #a0a0a0;border-radius: 5px;background:#fcfcfc;text-align:left;font-size:11px;line-height:130%;}
.imgbox {text-align:center;padding-top:5px;padding-bottom:5px;line-height:120%;background-color:#f0f0f0;border:1px solid #a0a0a0;border-radius: 5px;}

.fr {float:right;}
.fl {float:left;}
.clr0 {clear:both;}
.bgi {font-size:10px; margin-right:20px; text-align:right;}

#TopBtn {display: none;position: fixed; width:60px;height:60px;background-image:url(../res/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);} 
	.txboxm h1 {margin: 0;font-size: 1rem;font-weight: bold;text-align: center;flex-grow: 1;}
	h3 {font-weight:bold;font-size:1.3em;}
	.f16 {font-size:.9rem;}
	#TopBtn {display: none;position: fixed; width:40px;height:40px;background-image:url(../res/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);}
	.txboxm h1 {margin: 0;font-size: .5em;font-weight: bold;text-align: center;flex-grow: 1;}
	.f16 {font-size:.8rem;}
}
@media (max-width: 490px) {
	colX {grid-template-columns: repeat(2, 1fr);}
	h3 {font-weight:bold;font-size:1.1em;}
}