body 		{background-color: #aaa8a4; font-family: arial light, arial, sans-serif; font-size: 1em; font-weight: normal;
				text-align: center; /* Needed for IE 5 to center the wrapper on the screen */}
*			{margin: 0; padding: 0;}
#wrapper	{width: 925px; margin: 0 auto 0 auto; background: black url("column_bg.jpg") repeat-y scroll left top; text-align: left;}
#contentwhite 	{background-color: white;}

  html,body{
      height:100%;
      border:none
   }

#eBirdBody {margin-top: 10px; 
			margin-left: 10px;
			margin-right: 10px;
			margin-bottom: 10px;}

.sidebar 	{width: 120px; clear: both; float: left; background-color: white;}
#logo 		{width: 105px; height: 100px; text-align: left; padding: 10px 0px 0px 10px;} /* Logo */
#banner 	{height: 70px; text-align: left; padding: 40px 0px 0px 20px; padding-left: 140px; background-color: black;} /* Title */
#bannertext	{color: #ff000c; font-size: 19pt; line-height: 36pt; font-weight: bold; letter-spacing: .1em;}/* Ontario Field Ornithologists */
#bannertitle {float: left;}
#bannersearch {float: right; padding-right: 30px;  width: 250px;}
#caption 	{width: 110px; padding: 0px 5px 0px 5px;}
#caption table {border-collapse: collapse;}
#caption td {height: 232px; text-align: right; vertical-align: bottom; margin-bottom: 10px;}
#caption p {color: black; font-weight: bold; font-size: 8pt; line-height: 9pt;}
.photocredit {font-size: 7pt; font-style: italic; font-weight: bold;}
#mainphoto 	{width: 445px; height: 242px; 	float: left;} 
.mainphoto 	{width: 445px; height: 242px;}
#navbar 	{width: 360px; height: 242px; 	float: right; background-color: black;}

/* Used in the Previous Ontario Birds page */
.article {font-weight: bold; font-style: normal;}

/* For use in JAlbum pages - Black photo pages */
#photowrapper {width: 925px; margin: 0 auto 0 auto; background-color: black; text-align: left;}
.photogallerycomment {color: white;}
#photopagetop {width: 925px; height: 115px; background: black url("column_bg.jpg") no-repeat left top; text-align: left;}
#photobanner {float: left; text-align: left; height: 70px; text-align: left; padding: 40px 0px 0px 20px;} /* Title */
#photologo 	{clear: both; float: left; width: 105px; height: 100px; text-align: left; padding: 10px 0px 0px 15px;} /* Logo */
#photogallery {clear: both; margin: 0px 10px 0px 10px;}
#photogallery td {vertical-align: top; text-align: left; border-bottom: 0px solid #d9d2bb;}
#photogallery caption {text-align: left; border-bottom: 0px solid #d9d2bb;}

.section 	{width: 805px; clear: both; margin-left: 120px; } 
.sectionindex {width: 805px; clear: both; float: right; background-color: white; } 
.bop	 	{width: 805px; clear: both; margin-left: 120px;} 
.leftside 	{clear: both; float: left; width: 565px;}
.rightside 	{float: left; width: 240px;}

_#index {background-color: white;}
.indexleft 	{float: left; width: 425px; padding-left: 20px; background-color: white;}
.indexright	{float: left; width: 334px; padding-left: 13px; padding-right: 13px; background-color: white;}

.indexwide 	{clear: both; float: left; width: 565px;}
.column1 	{clear: both; float: left; width: 400px;} 
.column2 	{float: left; width: 400px;}
.BCheader {font-size: 12.5pt; font-style: italic; font-weight: bold; text-decoration: underline;}
.BCtitles {font-size: 9.5pt; font-style: italic; font-weight: bold;}
.BCcontent {font-size: 9.5pt;}
.BCtext {font-size: 9.5pt; font-style: italic; }
.columnA 	{clear: both; float: left; width: 150px;} 
.columnB 	{float: left; width: 415px;}
.columnAB 	{clear: both; float: left; width: 565px;}
.ABphoto	{width: 565px;}
.columnC 	{float: left; width: 240px; text-align: center;} 
.thumbnailphoto {width: 150px; margin: 0px 0px 10px 0px;}
.dropthumbnailphoto {width: 150px; margin: 70px 0px 10px 0px;}
.articletext {clear: both; float: left; width: 455px;}
.articlepicture {float: left; width: 250px; padding: 0px 0px 0px 40px;} /* was 60px on the right */
.abstract 		{width: 455px;}
.sidephoto 		{margin-top: 30px;} 
.bigsidephoto 	{width: 250px; margin-top: 30px;} 
.smallsidephoto {width: 200px; margin-top: 30px;} 
.nodropsmallsidephoto {width: 200px;} 
.nodroptinysidephoto {width: 100px;} 
.nodropbigsidephoto {width: 250px;} 
.dropsidephoto 	{margin-top: 70px;} 
.bigdropsidephoto 	{margin-top: 150px;} /* Special case for southboundshorebirds */
.dropbigsidephoto {width: 250px; margin-top: 70px;} 
.dropsmallsidephoto {width: 200px; margin-top: 70px;}
.dropsideicon {margin-top: 70px; text-align: center;} 
.acknowledgements {/*width: 455px; clear: both; margin-left: 120px; margin-right: 40px;*/} 
.bibliography {/*width: 455px; clear: both; margin-left: 120px; margin-right: 40px;*/}
.articletextsinglecolumn {clear: both; float: left; width: 765px; padding: 0px 40px 0px 0px;}
.photosinglecolumn {width: 445px;} 
.photocaption {text-align: left; color: black; font-size: 10pt; line-height: 13pt; font-style: normal; padding-bottom: 6.5pt;}
.title {color: #617bad; font-weight: bold;}
.inlinephoto {clear: both; float: left; padding: 5px 10px 10px 0px; width: 250px;}
/*.inlinemap {clear: both; padding: 6.5px 0px 0px 6.5px; height: 330px; }*/
.inlinemap {clear: both; height: 330px; width: 445px;}
.fullmap {clear: both; height: 600px; width: 750px;}
td {padding-left: 10px; padding-right: 10px;}
p, address, indent,
ol, 
ul,	td.p {color: black; font-size: 10pt; line-height: 13pt; font-style: normal; padding-bottom: 6.5pt;} /* was bottom 5px*/
.small {font-size: 8pt;}
.nospace {padding-bottom: 0px;}
#index p, 
#index ol, 
#index ul {color: black;}
.blackbackground {background-color: black !important;}
h1 	{color: black;  font-weight: bold;	background-color: #c4c6c8; 	font-variant: small-caps; font-size: 13pt; line-height: 14pt;
			padding: 12px 0px 12px 20px; 
			margin-top: 0px; margin-bottom: 20px; 
			letter-spacing: .2em; position: relative; } /* page header */
.photoh1 {color: black;  font-weight: bold;	background-color: #c4c6c8; 	font-variant: small-caps; font-size: 13pt; line-height: 14pt;
			padding: 3px 0px 3px 20px; 
			letter-spacing: .2em; position: relative; } /* page header */
h2 	{color: black;  font-weight: bold;	background-color: #c4c6c8; 	font-variant: small-caps; font-size: 11pt; line-height: 14pt;
			padding: 6px 0px 6px 20px; 
			margin-bottom: 10.5pt; 
			margin-top: 20px;
			letter-spacing: .2em; position: relative; } /* page header */
.bop h2 {margin-bottom: 0px; }
#index h2 {background-color: #aeb0b2;} /* Section header */
.familyname {color: black;  background-color: #c4c6c8; font-weight: bold;	font-variant: small-caps; font-size: 12pt; line-height: 14pt;
			padding: 6px 0px 6px 0px; margin: 15px 0px 0px 0px !important; letter-spacing: .05em;}
h3 	{color: #ff000c; font-size: 11pt; line-height: 13pt; font-weight: bold; letter-spacing: .05em; margin: 6.5pt 0px 6.5pt 0px; } /* Provincial Bird */
#index h3 {color: #cbcbcb;} /* Provincial Bird */
h4, a 	{color: black; font-size: 9pt; line-height: 13pt;  font-weight: bold; padding: 0px 0px 6.5pt 0px;} 
h5 		{color: black; font-size: 12pt; line-height: 14pt; font-weight: bold; padding: 10px 0px 7pt 0px;}
h6 		{text-align: center; color: #ff000c; font-size: 10pt; line-height: 14pt; font-weight: bold; letter-spacing: .1em; padding: 10px 0px 5px 0px;}
.italic {font-style: italic;}
.bigcap {font-weight: bold; font-size: 1.5em; color: black;}
#index .bigcap {font-weight: bold; font-size: 1.5em; color: #black;}

/* News box settings ------------------------------------------------------------------------- */
.news 		{background-color: #f0f7f7; padding: 6.5pt 4px 0px 14px; margin-top: 10px;margin-bottom: 10px;}
.dropline 	{margin-top: 20px;}
.blurb		{margin-top: 20px; font-style: italic;}
.nobottompadding	{margin-bottom: 0px;}
#index .news 	{border: white solid 0px; padding: 6.5pt 15px 0px 15px; margin-bottom: 20px;}
.news p {color: black; font-weight: normal; font-size: 10pt; line-height: 13pt; padding-bottom: 6.5pt;}
#index .news p {color: black;}
.news h3, #index .news h3 {color: #ff000c; font-weight: bolder; font-size: 13pt; line-height: 15.6pt; letter-spacing: 0em; margin: 0px 0px 0px 0px; }/* Baillie Birdathon */
.news h4 {color: black; font-weight: bold; font-style: italic; font-size: 8pt; line-height: 11pt; padding-bottom: 7.5pt;} /* Mother & Son */
ul 		{color: black; font-size: 11pt; line-height: 13pt; list-style: disc outside;}
li 		{margin-left: 30px; color: black; font-size: 10pt; line-height: 13pt; font-style: normal;}
a:hover {color: white;}
strong 	{font-weight: bold;}
em 		{font-style: italic;}
.name 	{font-weight: bold;}
.top 	{position: absolute; right: 10px;}
.author {text-align: right; font-style: italic; font-weight: bold;}
.booktitle 	{font-weight: normal; font-style: italic;}
.biblioauthor {font-weight: bold;}
.bibliotitle {font-weight: normal; font-style: italic;}
.birdlatin {font-style: italic;}
.indent {margin-left: 20px;}
.pdf 	{width: 30px; height: 30px;}
.icon 	{width: 30px; height: 30px;}
/* Table settings --------------------------------------------------------------------------------- */
table 	{border-collapse: collapse;}
th,TH	 	{text-align: left; padding: 0px 10px 5px 10px; border-bottom: 3px solid #c4c6c8; color: #694a2d; font-size: 11pt; line-height: 13pt; 
		font-weight: bold; text-transform: capitalize;}
td,TD 		{vertical-align: top; text-align: left; padding: 5px 10px 0px 10px; border-bottom: 1px solid #c4c6c8;}
table.numeric td, 
table.numeric th {vertical-align: top; text-align: center; padding: 0px 5px 0px 0px; border-bottom: 1px solid #c4c6c8;}
.left 	{text-align: left !important;}
.centre {text-align: center !important;}
.right  {text-align: right !important;}
.quotation {padding-left: 40px !important; padding-right: 40px !important;}
table.nounderline td, 
table.nounderline th {border-bottom: 0px solid #d9d2bb;}
table.nounderlinelist td, 
table.nounderlinelist th {border-bottom: 0px solid #d9d2bb; height: 12px;}
table.nounderlinelist p {color: black; font-size: 10pt; line-height: 13pt; font-style: normal; padding-bottom: 0pt;} /* was bottom 6.55px*/

table.nounderlineOBRC td, 
table.nounderlineOBRC th {border-bottom: 0px solid #d9d2bb; height: 70px;}
col.name, 
col.sgtitle {width: 350px;}
col.sgdate 	{width: 150px;}
col.sgprice {width: 25px;}
col.publication {width: 250px;}
col.icon {width: 100px;}
col.indent {width: 40px;}

.salesitemtotalwidth {width: 150px;}
.salesitem {vertical-align: top; width: 140px; padding-left: 10px; }
.salesiconwidth {width: 90px;}

.productitemtotalwidth {width: 190px;}
.productitem {vertical-align: top; width: 180px; padding-left: 10px; }
.producticonwidth {width: 180px;}
.productimagewidth {width: 360px;}

.photographer {width: 150px;}
.email {width: 90px;}
.website {width: 400px;}
.photoindexletter{width: 765px};

/* Map markup */
#mapstart {float:left; width: 698px; height: 500px; border: 1px solid black; font-weight: normal; font-variant: normal; font-style: normal; text-align: left;}
.mapstart {float:left; width: 698px; height: 500px; border: 1px solid black; font-weight: normal; font-variant: normal; font-style: normal; text-align: left;}
.bottompanel {clear: all; float: left; width: 698px; height: 36px; font-weight: normal; font-variant: normal; font-style: normal; text-align: center;}

/* Colours *************************************/
.blue		{color: blue !important;}
.red		{color: red !important;}
a:link 		{color: #006699;} /* Blue*/
a:visited 	{color: #006699;} /* Blue*/
a:hover 	{color: #a2885d;} /* Tan */
a:active 	{color: #006699;} /* Blue*/
#index a:link 	{color: #006699;} /* Blue */
#index a:visited {color: #006699;} /* Blue */
#index a:hover 	{color: #a2885d;} /* Tan */
#index a:active {color: #006699;} /* Blue */

/******** Menu markup ************/
/*
#udm ul 		{width:252px ;  margin-left:0 important;	margin-top:1px;}
#udm ul ul 		{width:152px !important;}
#udm ul ul ul 	{width:152px !important;}
#udm ul ul ul ul {width:152px !important;}
#udm a 			{cursor:pointer !important;}
*/
/************************************** WHITE wrapper **************************************/

/*#wrapper #udm a 			{color: #aeb0b2; background-color: black; border-bottom: 1px solid #57585a;}*/
#wrapper #udm a 			{color: #aeb0b2; background-color: black;}
#wrapper #udm a.toplevel 	{font-weight: bold !important; letter-spacing: .15em;}

#wrapper #udm ul a 			{color: black; background-color: #f5f2df;}
#wrapper #udm ul ul a 		{color: #191970; background-color: white;}
#wrapper #udm ul ul ul a 	{color: black; background-color: #f5f2df;}
#wrapper #udm a:hover		{color: #a00; background-color: #c4c6c8;}

/*#wrapper #udm a.firstmenu 	{border-top: 3px solid #57585a;}*/
/* was set to 1px but does not appear on MSIE was 3.*/
/*
#wrapper #udm ul a 			{margin-left: 20px; color: black; background-color: #f5f2df;}
#wrapper #udm ul ul a 		{margin-left: 40px; color: #191970; background-color: white;}
#wrapper #udm ul ul ul a 	{margin-left: 60px; color: black; background-color: #f5f2df;}
#wrapper #udm a:hover		{color: #a00; background-color: #c4c6c8;}
*/

/* PRINT ******************************************/

@media print {
	body 	{background: white;}
	* 		{color: black !important;} 
	#wrapper {background: white; margin: 0; padding: 0; width: auto; height: auto;}
	#mainphoto, #navbar, #logo, 
	#banner {display: none;} 
	h1 		{margin-left: 0;}
}

/* Debugging --------------------------------------------------------------*/
/*
#banner 	{background-color: red !important;}
#logo 	 	{background-color: green !important;}
#mainphoto 	{background-color: blue !important;}
#caption td {background-color: blue !important;}
#navbar 	{background-color: green !important;}
#caption {background-color: red !important;}
#sidebar {background-color: green !important;}
.columnA {background-color: red !important;}
.columnB {background-color: blue !important;}
.columnC {background-color: yellow !important;}
.columnAB {background-color: green !important;}
.leftside {background-color: red !important;}
.rightside {background-color: blue !important;}
.abstract {background-color: red !important;}
.acknowledgements {background-color: blue !important;}
.bibliography {background-color: green !important;}
.articletextsinglecolumn {background-color: blue !important;}
.photosinglecolumn {background-color: yellow !important;}
.articletext {background-color: green !important;}
.articlepicture {background-color: red !important;}
.sidephoto 	{background-color: blue !important;}
.thumbnailphoto {background-color: blue !important;}
.bigsidephoto 	{background-color: yellow !important;}
.photocaption {background-color: green !important;}
.indexleft {background-color: yellow !important;}
.indexright {background-color: green !important;}
.indexwide {background-color: red !important;}
*/

dl {
	font-size: 10pt;
}
dt {
	float: left;
	clear: left;
	width: 105px;
	text-align: left;
	font-weight: bold;
}

dd {
	margin: 0 0 0 115px;
	padding: 0 0 0.5em 0;
}

.content {
	margin-top: 32px;
	padding: 8px;
}

/*
 * Standard photo captions
 */
 .photo--species-name {
	font-size: 10pt;
}
.photo--photographer {
	display: block;
	font-size: 7pt;
	font-style: italic;
	font-weight: bold;
}
.photo--photographer::before {
	content: 'Photo: ';
}

.articletext table {
  margin-top: 16px;
}
.articletext table,
.articletext th {
  font-size: 10pt;
}

.toc {
	margin: 2em 0;
}
.toc > ul {
	list-style: none;
}
.toc > ul > li {
	margin-left: 0;
	padding: 0.25em;
}

/*
 * Support numbered lists (primarily for our Markdown content), but useful more
 * broadly, too.
 */
ol {
	list-style-type:decimal;
}

/*
 * Styling for upcoming trips.
 */
.trips .form-group {
	display: flex;
	align-items: baseline;
	gap: 1em;
}

.trips .form-group label {
	font-weight: bold;
}

.trips .trip-component {
	padding-top: 1.0em;
	padding-bottom: 1.0em;
}

.trip-photos img {
	margin-bottom: 1em;
	border: 1px solid lightgray;
}

/*
 * Filter settings
 */
 .filterable-element-initial {
    display: initial;
}
.filterable-element-hidden {
    display: none;
}