@charset "utf-8";
/* CSS Document */
@font-face {
    font-family: 'centurygothic';
    src: url('../fonts/century-gothic.woff2') format('woff2');
    font-style: normal;
}
@font-face {
    font-family: 'overlock';
    src: url('../fonts/overlock-regular-webfont.woff2') format('woff2'),
         url('../fonts/overlock-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'overlock-black';
    src: url('../fonts/overlock-black-webfont.woff2') format('woff2'),
         url('../fonts/overlock-black-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@media (min-width : 1201px ){
}

a.black{
	color:black;
	text-decoration:none;	
}
a.black:hover{
	font-weight:bold;
}
a.black:visited{
	color:black;	
}
a.green:link{
	color:#00954D;
	text-decoration:underline;	
}
a.green:hover{
	font-weight:bold;
	text-decoration: underline;
}
a.green:visited{
	color:#00954D;	
}
a.H2{
	color: black;
	text-decoration:none;	
}
.AssociatesModal{
    /*display: none;*/
	/*z-index:1;*/
	position: relative;
	float: left;
	width:60%;
	height: auto;
	border-radius:5px;
	background-color:black;
	color:white;
	padding-left:1%;
	padding-right:1%;
	padding-bottom:3%;
	margin-left: 0%;
	margin-right: 2%;
	-webkit-text-size-adjust: 100%;
}
.AssociatesClass {
	text-align:center;
	column-span:all;
	background-color:#00954d;
	color: black;
	/*border: thin solid #000000;*/
	font-family:"centurygothic";
	font-size:12pt;
	font-weight: bold;
	padding:20px;
	-webkit-text-size-adjust: 100%;
	border-top: 8px solid #000000;
	
}
.AssociatesOrder{
	text-align:center;
	column-span:all;
	background-color:#559bab;
	color: black;
	/*border: thin solid #000000;*/
	font-family:"centurygothic";
	font-size:12pt;
	font-weight: bold;
	padding:20px;
	-webkit-text-size-adjust: 100%;
}
.AssociatesTable {
	width: 59%;
	background-color: #FFFFFF;
	border-collapse: collapse;
	color: black;
	/*border: thin solid #000000;*/
	-webkit-text-size-adjust: 100%;
}
.AssociatesTable td{
	padding:3px;
	padding-left:5px;
	text-align: top;
	font-family: "centurygothic";
	font-size: 12pt;
	-webkit-text-size-adjust: 100%;
}
.AssociatesTable th{
	background-color: rgb(0,149,77);
	color:black;
	font-family:"centurygothic";
	font-size:12pt;	
	font-weight:normal;
	padding:5px;
	text-align:center;
	-webkit-text-size-adjust: 100%;
	/*border: thin solid #000000;*/
}
.AssociatesTableContainer {
	background-color: black; 
	width: 59%;
	float: left;
	padding: .5%;
	padding-top: 0%;
}
.AssociatesTitle{
	text-align:center;
	column-span:all;
	background-color:black;
	font-family:"centurygothic";
	color: white;
	font-size:12pt;
	font-weight: bold;
	padding:20px;
	height: 30px;
	-webkit-text-size-adjust: 100%;
}
.AssociatesTable tr:nth-child(even) {
	background:#ddd;
}
.AssociatesTriggerImageHolder {
	width: 60%;
}
body, html{
	background-color: rgb(0,149,77);
	margin:0px;
	height:100%;
}
.Bibliography{
	padding-left: 22px ;
	text-indent: -22px ;
	word-break: break-all;
}

.BodyContainer{
	width: 93%;
	margin-left: 2%;
	margin-right: 21%;
	margin-top: 20px;
	-webkit-box-shadow: -13px 0px 22px rgba(6,51,14,1.00);
	box-shadow: -13px 0px 22px rgba(6,51,14,1.00);
	background-color: rgba(243,243,243,1.00);
	padding-left: 2%;
	padding-right: 1.5%;
	padding-bottom:20px;
	padding-top:5px;
	display: table;		
}
.BookPreview{
	width: 60%;
	height: 80vh;
}
.Btn {
 	 -webkit-border-radius: 6;
 	 -moz-border-radius: 6;
  	 border-radius: 6px;
 	 font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
 	 color: #ffffff;
 	 font-size: 12pt;
 	 background: #519daa;
 	 padding: 5px 10px 5px 10px;
 	 text-decoration: none;
}
.BtnContainer {
	width: 60%;
	margin-top: 1%; 
	padding-left: 2%;
}
.BtnContainerMobile {
	display: none;
}
.Btn:hover {
 	 background: #009454;
 	 text-decoration: none;
}
.CarouselContainer {
	background-color: rgb(0,149,77);
	height: 28vw;
	width: 50%;
	margin-top: .5%;
	margin-right: 1%;
	margin-bottom: 3%;
	margin-left: 4%;
	padding:0;
	float:right;
}
.CarouselSlider {
	width:100%;
	height:auto;
	overflow:hidden;
	background-color:green;
}
.CloseAssociatesModal{
	/*this style is for modals with black background */
	color: white;
    float: right;
	margin-right:0%;
	margin-top: 0%;
    font-size: 28px;
    font-weight: normal;	
}
.CloseAssociatesModal:hover{
    color: white;
    font-weight:bold;
	cursor: pointer;
}
.CloseModal2{
	/*This style is for modals with light backgrounds*/
	color: black;
    float: right;
	margin-right:3%;
    font-size: 28px;
    font-weight: bold;
	cursor: pointer;
}
.CloseModal2:hover{
    color: black;
    font-weight:bold;
    cursor: pointer;
}
.ColumnContainer{
	display: table; /* Make the container element behave like a table */
	width: 93%; /* Set full-width to expand the whole page */
	margin-left: 2%;
	margin-right: 2%;
	-webkit-box-shadow: -13px 0px 22px rgba(6,51,14,1.00);
	box-shadow: -13px 0px 22px rgba(6,51,14,1.00);
	background-color: rgba(243,243,243,1.00);
	padding-left: 3%;
	padding-right: 5%;
	padding-bottom:10px;
	padding-top:20px;
}
.ColumnLeft{
	/*display: table-cell;*/
	width: 53%;
	padding-bottom: 1%;
	padding-top:0%;
	padding-left:2%;
	padding-right: 5%;
	margin-bottom: 2%;
	display: inline-block;
	margin-left: .25%;
	margin-top: 0%;
	background-color: rgba(243,243,243,1.00);
}
.ColumnRight {
	/*display: table-cell;*/
	width: 35%;
	padding-left: .75%;
	padding-right: .75%;
	padding-bottom: 10px;
	margin-top: 3%;
	margin-left: 3%;
	margin-right: .25%;
	margin-bottom: 20px;
	background-color: black;
	/*vertical-align: top;*/
	-webkit-box-shadow: 0px x;
	box-shadow: 0px x;
	float: right;
	display: inline-block;
}
.ColumnRightFigure {
	width:100%;
}
.ColumnRightIndex {
	width: 30%;
	padding-left: .5%;
	padding-right: .5%;
	margin-right: 2%;
	margin-top: 4%;
	background-color: black;
	float: right;
}
.ColumnSingle {
	padding-right: 2%;	
}
.ConservationStatus {
	width: 60%;
}
.dot2image {
	width: 47%;
	margin: 1%; 
	margin-top:1%;
	float: left;
}
.dot2imageLargeClear {
	width: 47%;
	margin: 1%; 
	margin-top:1%;
	float: left;
	clear: left;
}
.dot2imageMobileClear {
	width: 47%;
	margin: 1%; 
	margin-top:1%;
	float: left;
	clear: none;
}
.dot2imageTabletClear {
	width: 47%;
	margin: 1%; 
	float: left;
	clear: none;
	}
.FaunalAssociatesModal{
    display: none;
	/*z-index:1;*/
	position: relative;
	float: left;
	width:50%;
	height: auto;
	border-radius:5px;
	background-color:black;
	color:white;
	padding-left:1%;
	padding-right:1%;
	padding-bottom:3%;
	margin-left: 0%;
	margin-right: 2%;
	-webkit-text-size-adjust: 100%;
}
.FaunalAssociatesOrder{
	text-align:center;
	column-span:all;
	background-color:#559bab;
	font-family:Segoe, 'Segoe UI', 'DejaVu Sans', 'Trebuchet MS', Verdana, 'sans-serif';
	font-size:12pt;
	font-weight:bold;
	padding:20px;
	-webkit-text-size-adjust: 100%;
}
.FaunalAssociatesTable {
	width: 100%;
	background-color: #FFFFFF;
	border-collapse:collapse;
	color:black;
	-webkit-text-size-adjust: 100%;
}
.FaunalAssociatesTable td{
	padding:3px;
	padding-left:5px;
	text-align: top;
	-webkit-text-size-adjust: 100%;
}
.FaunalAssociatesTable th{
	background-color: rgb(0,149,77);
	color:black;
	font-family:Segoe, 'Segoe UI', 'DejaVu Sans', 'Trebuchet MS', Verdana, 'sans-serif';
	font-size:12pt;	
	padding:5px;
	text-align:left;
	font-weight:normal;
	-webkit-text-size-adjust: 100%;
}
.FaunalAssociatesModal tr:nth-child(even) {
	background:#ddd;
}
figcaption {
	text-align:center;
	font-family:"centurygothic";
	font-size:12pt;
	color: #DFDFDF;
	margin-bottom: 1%;
	margin-left: 5%;
	margin-right: 5%;
}
.figtitle {
	text-align:center;
	font-family:"centurygothic";
	font-size:20pt;
	color: #DFDFDF;
	margin-top: 25px;
	margin-bottom: 25px;
}
figure{
	margin-left:0;
	margin-right:0;
	width: 100%;
	height:auto;
	font-family: "centurygothic";
	font-size: 22pt;
	text-align: center;
	color: #DFDFDF;
}
.FlagContainer {
	float: right;
	width: 8%;
	margin-top:3%;
	margin-right:.5%;
	margin-left: 3%;
	font-family:"centurygothic";
	font-size:12pt;
	padding: 1% .5% .5% .5%;
	text-align:center;
}
.GainNavTable {
	width: 59%;
	background-color: #FFFFFF;
	border-collapse: collapse;
	color: black;
	border: thin solid #000000;	
	margin-right: -2%;
}
.GainNavTable td{
	padding:3px;
	padding-left:5px;
	text-align: top;
	font-family: "centurygothic";
	font-size: 11pt;
}
.GainNavTable th{
	background-color: rgb(0,149,77);
	color:black;
	font-family:"centurygothic";
	font-size:11pt;	
	padding:5px;
	text-align:left;
	height: 30px;
}
.GainNavTable tr:nth-child(even) {
	background:#ddd;
}
.GainNavTableMobile {
	display: none;
}
.GlossaryImageDiv {
	height: auto;
	width: 30%;
}
.GlossaryImageDivx2 {
	height:auto;
	width: 60%;
}
.GlossaryModal {
	display: none;
	z-index:3;
	position: relative;
	float: right;
	width: 35%;
	height: auto;
	background-color: #9A9FA0;
	border-radius:10px;
	border: 2px solid black;
	color:black;
	padding-left:2%;
	padding-right:2%;
	padding-bottom:3%;
	margin-left: 3%;
}
.GlossaryModal H4 {
	color: black;
}
.GlossaryModal p {
	color: black;
}
.Glossary H3 {
	text-align:center;
}
.cse .gsc-control-cse,
        .gsc-control-cse {
     padding: 0px;
	 margin: -10%;
	 margin-right: 5%;
}
H1 {
	font-family:"overlock" ;
	font-size: 33pt;
}
H2 {
	font-family: "overlock";
	font-size: 28pt;
	color:black;
}
H3 {
	font-size:19pt;
	font-family: "overlock";
	color: #242424;
}
H4 {
	font-family: "overlock";
	font-size: 14pt;
	color: black;
}
.Image1 {
	width: 40%;
	height: auto;
	float: right;
	margin: 2%;
}
.Image2 {
	width: 30%;
	height: auto;
	float: right;
	margin: 2%;	
}
.Image3 {
	width: 20%;
	height: auto;
	float: right;
	margin: 2%;
}
.Image4 {
	width: 10%;
	height: auto;
	float: right;
	margin: 2%;
}
.Image5 {
	width: 5%;
	height: auto;
	float: right;
	margin-right: 5%;
	margin-top: 0%;
}
img{
	
	height:auto;
	max-width:100%;
}
.IndexContainer{
    height: auto;
	background-color:black;
	color:#DEDEDE;
	font-family: "centurygothic";
	font-size: 18pt;
	text-align: center;
}
.IndexContainerHorizontal {
	padding-top: .5%;
	Padding-left: .75%;
	padding-bottom: 1%;
	Height:auto;
	width: 40%;
	float: right;	
	background-color: black;
	color: white;
	margin-left: 2%;
	margin-top: 3%;
	margin-bottom: 3%;
	font: "centurygothic";
	font-size: 22pt;
	text-align: center;
}
.IndexContainer tr:nth-child(even) {
	background:#ddd;
}
li {
	font-family: "centurygothic";
	font-style: normal;
	font-size: 12pt;
}
.modalbackground {
	display:none;
	position:fixed;
	z-index:3;
	left: 0;
	top: 0;
	width:100%;
	height:100%;
	overflow:auto;
	background-color:rgba(0,0,0,0.8);
}
.MobileBottomColumn {
	display: none;
}
.MobileNote {
	display:none;
}
.ModalImage {
	width: auto;
	max-height: 85vh;
	max-width: 90vw;
	padding-top: 1%;
	height: 80vh;
	z-index: 4;
}
.ModalTitle {
	text-align:center;
	font-family:"centurygothic";
	font-size:16pt;
	color: #DFDFDF;
	z-index: 4;
}
.NativeIconContainer {
	float: right;
	height: auto;
	width: 8%;
	margin-top:3%;
	margin-right:.5%;
	margin-left: 3%;
	font-family:"centurygothic";
	font-size:12pt;
	font-weight:bold;
	text-align:center;
}
nav a {
	display:block;
}
.NavContainer {
	background-color: rgba(85,155,171,1);
	height: 35px;
	width: 100%;
	float: left;
	-webkit-box-shadow: 0px 5px 22px rgba(54,54,54,1.00);
	box-shadow: 0px 5px 22px rgba(54,54,54,1.00);
	margin-bottom: 30px;
	margin-top: 0px;
}
nav ul {
	margin: 0;
	padding:0;
}
nav ul li a {
	text-decoration:none;
	color:#333;
}
nav ul li:Hover {
	background-color: rgba(85,155,171,1.00);
	font-weight:bold;	
}
nav ul li {
	list-style-type: none;
	float: left;
	display: block;
	width: 140px;
	text-align: center;
	line-height: 35px;
	font-family: "centurygothic";
	font-size: 13pt;
}
nav ul li ul li {
	display: none;	
	font-weight: 100;
	width: 100%;
}
nav ul li:hover ul li{
	display: block;
	/*-webkit-box-shadow: 0px 5px 22px rgba(54,54,54,1.00);
	box-shadow: 0px 9px 22px rgba(54,54,54,1.00);*/
}
p {
	font-family:  "centurygothic";
	font-style: normal;
	font-size: 12pt;
	color: 	#0E0E0E;
}
.pagination_controls {
		font-family: "CenturyGothic";
		margin: 20px;
	   }
.rangemapcontainer {
	height: auto;
	width: 45%;
	margin-left: 8%;
	margin-top:4%;
	margin-bottom:4%;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"
}
.rangemapcontainerextended {
	background-color: black;
	border: thin;
	border-style: solid;
	border-color: black;
	width: 59%;
	margin-top:2%;
	margin-bottom:2%;
}
.rangemaplegend {
	float: right;
	width: 5%;
	margin-right: 50%;
	margin-top:10%;
}
.rangemapmap {
	height: auto;
	width: 30%;
}
.rangemaplegend44 {
	height: auto;
	margin-left: 30%;
	margin-top: 5%;
	font-family: centurygothic;
}
.RecipeContainer{
	width: 100%;
	height: 160px;
	margin-left: 2%;
	margin-bottom: 10px;
	padding-top: 0;
	padding-bottom: 0;
}
.RecipeImage{
	width: 150px;
	height: auto;
	float: left;
}
.RecipeText{
	width: 30%;
	height: auto;
	float: left;
	margin-top: 1%;
	margin-bottom: 1%;
	padding-bottom: 2%;
    padding-top: 2%;
}
.SightingsGraph {
	width: 59%;
	background-color: #FFFFFF;
	margin-right: -2%;
}
.SightingsTable {
	width: 59%;
	background-color: #FFFFFF;
	border-collapse: collapse;
	color: black;
	border: thin solid #000000;	
	margin-right: -2%;
}
.SightingsTable td{
	padding:3px;
	padding-left:5px;
	text-align: top;
	font-family: "centurygothic";
	font-size: 11pt;
}
.SightingsTable th{
	background-color: rgb(0,149,77);
	color:black;
	font-family:"centurygothic";
	font-size:11pt;	
	padding:5px;
	text-align:left;
	height: 30px;
}
.SightingsTable tr:nth-child(even) {
	background:#ddd;
}
.SightingsTableMobile {
	display: none;
}
.SocialMediaContainer {
	float: right;
	height: 45px;
	width: 100%;
}
.slicknav_menu {
	display:none;	
}
.SpeciesModal{
	align-content: center;
	background-color: black; 
	color: white;
	display: none;
	font-family: "centurygothic";
	vertical-align: middle;
	z-index: 4; 
	position: fixed; 
	top: 51%;
	left: 50%;
	transform: translate(-48%, -48%);
	text-align:center;
	padding-top: 1%;
	padding-left: 1%;
	padding-right: 1%;
	padding-bottom: 1%;
}
.SpeciesModal figcaption{
	margin-bottom: 10%;
}
.tab {
	margin-left:15px;
	word-wrap: break-word;
}
.tabx2 {
	margin-left: 30px;
	font-family: "centurygothic";
}
.TaxNav4 {
	display: block;
	height: auto;
	margin-left: -1%;
	width: 600px;
}
.TaxNav3 {
	display: none;
}
.tooltip {
    position: relative;
    display: inline-block;
    /*border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}
.tooltip .tooltiptext {
	visibility: hidden;
	width: 250px;
	padding:5px;
	background-color: black;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	font-family: "overlock";
	font-size: 12pt;
	/* Position the tooltip text - see examples below! */
	position: absolute;
	z-index: 1;
}
/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
    visibility: visible;
}

@media (min-width : 901px ) and ( max-width : 1200px ){
.cse .gsc-control-cse,
        .gsc-control-cse {
    padding: 0px;
	margin: -15%;
	margin-right: 5%;
}
.FlagContainer {
	width: 10%;	
}
.GlossaryImageDiv {
	height: auto;
	width: 40%;
}
.GlossaryImageDivx2 {
	height:auto;
	width: 70%;
}
H1 {
	font-family: "overlock";
	font-size: 26pt;
	text-align:center;
}
H2 {font-family:"overlock";
	font-weight:bold;
	font-size:23pt;
}	
H3 {
	font-size:17pt;
	font-family:"overlock";
}
.Image1 {
	width: 50%;
	height: auto;
	float: right;
	margin: 2%;
}
.Image2 {
	width: 40%;
	height: auto;
	float: right;
	margin: 2%;	
}
.Image3 {
	width: 30%;
	height: auto;
	float: right;
	margin: 2%;
}
.Image4 {
	width: 20%;
	height: auto;
	float: right;
	margin: 2%;
}
.Image5 {
	width: 10%;
	height: auto;
	float: right;
	margin-right: 5%;
	margin-top: 0%;
}
.NavContainer {
	background-color: rgba(85,155,171,1);
	height: 30px;
	width: 100%;
	float: left;
	margin-bottom: 20px;
	-webkit-box-shadow: 0px 5px 22px rgba(54,54,54,1.00);
	box-shadow: 0px 5px 22px rgba(54,54,54,1.00);
}
.NativeIconContainer {
	float: right;
	height: auto;
	width: 10%;
	margin-top:3%;
	margin-right:.5%;
	margin-left: 3%;
	font-family:"centurygothic";
	font-size:12pt;
	font-weight:bold;
	text-align:center;
}
nav ul li {
	list-style-type: none;
	float: left;
	display: block;
	width: 14%;
	text-align: center;
	line-height: 30px;
	font-family: "centurygothic";
	font-size: 12pt;
}
.rangemaplegend44 {
	font-family: centurygothic;
	height: auto;
	margin-left: 25%;
	margin-top: 5%;
}
.SightingsTableMobile {
	display: none;
}
.TaxNav4{
	display: none;
}
.TaxNav3{
	display: block;
	height: auto;
	margin-left: -1%;
	width: 450px;
}
}
@media (min-width: 601px) and (max-width: 900px){
.AssociatesModal{
    display: none;
	/*z-index:1;*/
	position: relative;
	float: left;
	width:65%;
	height: auto;
	border-radius:5px;
	background-color:black;
	color:white;
	padding-left:1%;
	padding-right:1%;
	padding-bottom:3%;
	margin-left: 0%;
	margin-right: 2%;
	-webkit-text-size-adjust: 100%;
}
.AssociatesTable {
	font-size: 12pt;
	width: 100%;
	-webkit-text-size-adjust: 100%;
}
.AssociatesTitle  {
	font-size: 12pt;
	width: 100%;
	-webkit-text-size-adjust: 100%;
}
.BtnContainerMobile {
	display: none;
}
.BtnContainer{
	display: inline;
	width: 100%;
	margin-top: 5%; 
	margin-bottom: 5%;
	padding-left: 2%;
	float: left;
}
.CarouselContainer {
	background-color: black;
	width: 99%;
	height:55vw;
	margin-top: .5%;
	margin-left: -1%;
	margin-bottom: 3%;
	float:left;
	clear:both;
}
.ColumnRight {
	display: none;
}
.ColumnRightFigure {
	display: none;
}
.ConservationStatus {
	width: 100%;
}
.dot2image {
	width: 23%;
	margin: 1%; 
	float: left;
}
.dot2imageLargeClear {
	width: 23%;
	margin: 1%; 
	float: left;
	clear: none;
	}
.dot2imageMobileClear {
	width: 23%;
	margin: 1%; 
	margin-top:1%;
	float: left;
	clear: none;
}
.dot2imageTabletClear {
	width: 23%;
	margin: 1%; 
	float: left;
	clear: left;
	}
.FlagContainer {
	width: 20%;	
}
.GainNavTable {
	display:none;
}
.GainNavTableMobile {
	display:table;
	width: 100%;
	background-color: #FFFFFF;
	border-collapse: collapse;
	color: black;
	font-family: "centurygothic";
	border: none;	
	font-size: 12pt;
}
.GainNavTableMobile td{
	padding:1%;
	text-align: left;
	border: thin;
	border-color: black;
}
.GainNavTableMobile th{
	background-color: rgb(0,149,77);
	color:black;
	font-family:"centurygothic";
	font-size:12pt;	
	padding-left:1%;
	text-align:center;
	font-weight:bold;
	height: 30px;
}
.GainNavTableMobile tr {
	border: thin;
	border-color: black;
}
.GainNavTableMobile tr:nth-child(even) {background:#ddd;
}	
.GlossaryImageDiv {
	height: auto;
	width: 50%;
	}
.GlossaryImageDivx2 {
	height:auto;
	width: 80%;
}	
H1 {
	font-family: "overlock";
	font-size: 23pt;
}	
H2 {
	font-family:"overlock";
	font-weight:bold;
	font-size:22pt;
	}	
H3 {
	font-size:17pt;
	font-family:"overlock";
}
.Image1 {
	width: 60%;
	height: auto;
	float: right;
	margin: 2%;
}
.Image2 {
	width: 50%;
	height: auto;
	float: right;
	margin: 2%;	
}
.Image3 {
	width: 40%;
	height: auto;
	float: right;
	margin: 2%;
}
.Image4 {
	width: 30%;
	height: auto;
	float: right;
	margin: 2%;
}
.Image5 {
	width: 20%;
	height: auto;
	float: right;
	margin-right: 5%;
	margin-top: 0%;
}
.IndexContainerHorizontal{
	width: 100%;
	margin-left: .5%;
	margin-right: -0.5%;
	margin-top: 0%;
	margin-bottom: 3%;
	padding-top: 0%;
} 
.MobileBottomColumn {
	display: block;
	background-color: black;
	padding-top: 1%;
	padding-bottom: 1%;
	width: 96.5%;
	margin-left: 2%;
}	
.NativeIconContainer {
	height: auto;
	width: 12%;
	margin-top:3%;
	margin-right:.5%;
	margin-left: 3%;
	font-family:"centurygothic";
	font-size:12pt;
	font-weight:bold;
	text-align:center;
}	
.NavContainer {
	background-color: rgba(85,155,171,1);
	height: 30px;
	width: 100%;
	float: left;
	margin-bottom: 20px;
	-webkit-box-shadow: 0px 5px 22px rgba(54,54,54,1.00);
	box-shadow: 0px 5px 22px rgba(54,54,54,1.00);
}
nav ul li {
	list-style-type:none;
	float:left;
	display:block;
	width:14%;
	text-align:center;
	line-height:30px;
	font-family: "centurygothic";
	font-size:12pt;
}
.popover {
	width: 95%;
}
.rangemapcontainer {
	height: auto;
	width: 60%;
	margin-left: 8%;
	margin-top:4%;
	margin-bottom:4%;
}
.rangemaplegend {
	float: right;
	width: 5%;
	margin-right: 40%;
	margin-top:10%;
}
.rangemaplegend44 {
	height: auto;
	margin-left: 50%;
	margin-top: 5%
}
.rangemapmap {
	height: auto;
	width: 50%;
}
.rangemapcontainerextended {
	width: 100%;	
}
.SightingsTable {
	width: 100%;
}
.SightingsGraph {
	width: 96%;
	background-color: #FFFFFF;
	border-collapse: collapse;
	color: black;
	border: thin solid #000000;	
}
.TaxNav4{
	display: none;
}
.TaxNav3{
	display: block;
	height: auto;
	margin-left: -1%;
	width: 400px;
	}
}
@media (max-width: 600px){
.AssociatesOrder{
	text-align:center;
	column-span:all;
	background-color:#559bab;
	font-family:"centurygothic";
	font-size:10pt;
	font-weight:bold;
	padding:20px;
	-webkit-text-size-adjust: 100%;
}
.AssociatesTable {
	width: 100%;
	background-color: #FFFFFF;
	border-collapse:collapse;
	color:black;
	-webkit-text-size-adjust: 100%;
}
.AssociatesTable td{
	padding:3px;
	padding-left:5px;
	text-align: top;
	font-size: 10pt;
	-webkit-text-size-adjust: 100%;
}
.AssociatesTable th{
	background-color: rgb(0,149,77);
	color:black;
	font-family:"centurygothic";
	font-size:10pt;	
	padding:1%;
	text-align:left;
	font-weight:normal;
	-webkit-text-size-adjust: 100%;
}	
.AssociatesTable tr{
	font-size: 10pt;
	-webkit-text-size-adjust: 100%;
}
.AssociatesTableContainer {
	background-color: black; 
	width: 98%;
	float: left;
	padding: .5%;
	padding-top: 0%;
}
.AssociatesTriggerImageHolder {
	width: 98%;
}

.BodyContainer  {
	width: 97%; /* Set full-width to expand the whole page */
	margin-left: 0%;
	margin-right:0%;
	margin-top: 20px;
	-webkit-box-shadow: 0px 0px 0px rgba(6,51,14,1.00);
	box-shadow: 0px 0px 0px rgba(6,51,14,1.00);
	background-color: rgba(243,243,243,1.00);
	padding-left: 2%;
	padding-right: 2%;
	padding-bottom:5%;
	padding-top:5px;
	display: table;		
}
.BookPreview {
		width: 90%;
		margin-left: 2%;
}
.break-word {
  word-wrap: break-word;
}
.BtnContainer {
	display: none;
}
.BtnContainerMobile {
	display: block;
	width: 100%;
	margin-top: 5%; 
	padding-left: 2%;	
}
.CarouselContainer {
	background-color: black;
	width: 99%;
	height:55vw;
	margin-top: .5%;
	margin-left: -1%;
	margin-bottom: 3%;
	float:left;
	clear:both;
}
.ColumnContainer {
	/*display: table; /* Make the container element behave like a table */
	display: table;
	width: 100%; 
	margin-left: 0%;
	margin-right: 0%;
	-webkit-box-shadow: 0px 0px 0px rgba(6,51,14,1.00);
	box-shadow: 0px 0px 0px rgba(6,51,14,1.00);
	background-color: rgba(243,243,243,1.00);
	padding-left: 0%;
	padding-right: 0%;
	padding-bottom:0px;
	padding-top:20px;
}
.ColumnContainerNonTable  {
	width: 93%; /* Set full-width to expand the whole page */
	margin-left: 0%;
	margin-right:0%;
	margin-top: 20px;
	-webkit-box-shadow: 0px 0px 0px rgba(6,51,14,1.00);
	box-shadow: 0px 0px 0px rgba(6,51,14,1.00);
	background-color: rgba(243,243,243,1.00);
	padding-left: 2%;
	padding-right: 1%;
	padding-bottom:5%;
	padding-top:5px;
	display: table;		
}
.ColumnLeft {
	/*display: table-cell;*/
	width: 94%;
	padding-top:0px;
	padding-left:3%;
	padding-right:3%;
	float:left;
	margin-left:0%;
	margin-right:0%;
}
.ColumnRight {
	display: none;
}
.ColumnRightFigure {
	display: none;
}
.ColumnSingle {
	padding-right: 3%;
	padding-left: 3%;
}
.ConservationStatus {
	width: 100%;
}
.dot2image {
	width: 47%;
	margin: 1%; 
	float: left;
}
.dot2imageMobileClear {
	width: 47%;
	margin: 1%; 
	margin-top:1%;
	float: left;
	clear: left;
}
.FaunalAssociatesModal{
    display: none;
	/*z-index:1;*/
	position: relative;
	float: left;
	width:95%;
	height: auto;
	border-radius:5px;
	background-color:black;
	color:white;
	padding-left:1%;
	padding-right:1%;
	padding-bottom:3%;
	margin-left: 0%;
	margin-right: 0%;
}
.FaunalAssociatesOrder{
	text-align:center;
	column-span:all;
	background-color:#559bab;
	font-family:"centurygothic";
	font-size:12pt;
	font-weight:bold;
	padding:20px;
	-webkit-text-size-adjust: 100%;
}
.FaunalAssociatesTable {
	width: 100%;
	background-color: #FFFFFF;
	border-collapse:collapse;
	color:black;
	-webkit-text-size-adjust: 100%;
}
.FaunalAssociatesTable td{
	padding:3px;
	padding-left:5px;
	text-align: top;
	-webkit-text-size-adjust: 100%;
}
.FaunalAssociatesTable tr{
	font-family: "centurygothic";
	font-size: 12pt;
	-webkit-text-size-adjust: 100%;
}
.FaunalAssociatesTable th{
	background-color: rgb(0,149,77);
	color:black;
	font-family:"centurygothic";
	font-size:12pt;	
	padding:5px;
	text-align:left;
	font-weight:normal;
	-webkit-text-size-adjust: 100%;
}	
.figtitle {
	font-size: 16pt;
}
.FlagContainer {
	font-size: 10pt;
	width: 20%;	
}
.GainNavTable {
	display:none;
}
.GainNavTableMobile {
	display:table;
	width: 100%;
	background-color: #FFFFFF;
	border-collapse: collapse;
	color: black;
	font-family: "centurygothic";
	border: none;	
	font-size: 12pt;
}
.GainNavTableMobile td{
	padding:1%;
	text-align: left;
	border: none;
	border-color: black;
}
.GainNavTableMobile th{
	background-color: rgb(0,149,77);
	color:black;
	font-family:"centurygothic";
	font-size:12pt;	
	padding-left:1%;
	text-align:center;
	font-weight:bold;
	height: 30px;
}
.GainNavTableMobile tr {
	border: thin;
	border-color: black;
}
.GainNavTableMobile tr:nth-child(even) {background:#ddd;
}	
.GlossaryImageDiv {
	height: auto;
	width: 100%;
}	
.GlossaryImageDivx2 {
	height:auto;
	width: 100%;
}	
.GlossaryModal {
	display: none;
	z-index:2;
	position: relative;
	float: right;
	width: 90%;
	height: auto;
	background-color: #9A9FA0;
	border-radius:10px;
	border: 2px solid #000000;
	color:black;
	padding-left:2%;
	padding-right:2%;
	padding-bottom:3%;
	margin-left: -3%;
	margin-bottom: 5px;
	margin-top: 5px;
}
H1 {
	font-family: "overlock";
	font-size: 23pt;
}	
H2 {font-family: "overlock";
	font-weight:bold;
	font-size:21pt;
	text-align: center;
}	
H3 {
	font-size:16pt;
	font-family:"overlock";
	text-align: center;
}
H4 {
	font-size:14pt;
}
.Image1 {
	width:98%;
	height: auto;
	margin-right: 0;
	margin-left: 0;
	margin-top: 5px;
	margin-bottom: 10px;
}
.Image2 {
	width: 98%;
	height: auto;
	float: right;
	margin: 2%;	
}
.Image3 {
	width: 98%;
	height: auto;
	float: right;
	margin: 2%;
}	
.Image5 {
	width: 98%;
	margin: 2%;
	}
.IndexContainerHorizontal{
	width: 100%;
	margin-left: .5%;
	margin-right: -0.5%;
	margin-top: 0%;
	margin-bottom: 3%;
	padding-top: 0%;
} 
.MobileBottomColumn {
	display: block;
	background-color: black;
	padding-top: 1%;
	padding-bottom: 1%;
	width: 100%;
}	
.MobileNote {
	display: block;
	font-family: "cenurygothic";
	font-size: 12pt;
}
.NativeIconContainer {
	float: right;
	height: auto;
	width: 15%;
	margin-top:7%;
	margin-right:2%;
	font-family:"overlock";
	font-size:12px;
	font-weight: bold;
	text-align:center;
}
.NavContainer {
	background-color: rgba(85,155,171,1);
	height: 58px;
	width: 100%;
	float: left;
	margin-bottom: 20px;
	margin-left:0px;
	margin-right:0px;
	-webkit-box-shadow: 0px 0px 0px rgba(54,54,54,1.00);
	box-shadow: 0px 0px 0px rgba(54,54,54,1.00);
}
nav ul li {
	display: none;
}	

.rangemapcontainer {
	height: auto;
	width: 60%;
	margin-left: 8%;
	margin-top:4%;
	margin-bottom:4%;
}
.rangemapcontainerextended {
	width: 97%;
	margin-left: 1%;
	margin-top:4%;
	margin-bottom:4%;
}	
.rangemaplegend {
	float: right;
	width: 5%;
	margin-right: 40%;
	margin-top:10%;
}
.rangemaplegend44 {
	height: auto;
	margin-left: 45%;
	margin-top: 5%;
}
.rangemapmap {
	height: auto;
	width: 50%;
}
.RecipeText{
	width: 40%;
	height: auto;
	float: left;
	margin-top: 1%;
	margin-bottom:1%;
	padding-bottom: 2%;
    padding-top: 2%;
}	
.SightingsGraph {
	width: 98%;
	background-color: #FFFFFF;
	border-collapse: collapse;
	color: black;
	border: thin solid #000000;	
}
.SightingsTable {
	display:none;
}
.SightingsTableMobile {
	display:table-row;
	width: 95%;
	background-color: #FFFFFF;
	border-collapse: collapse;
	color: black;
	font-family: "centurygothic";
	border: thin solid #000000;	
	font-size: 12pt;
}
.SightingsTableMobile td{
	padding:1%;
	text-align: left;
	border: thin;
	border-color: black;
	empty-cells: hide;
}
.SightingsTableMobile th{
	background-color: rgb(0,149,77);
	color:black;
	font-family:"centurygothic";
	font-size:12pt;	
	padding-left:1%;
	text-align:center;
	font-weight:bold;
	height: 30px;
}
.SightingsTableMobile tr {
	border: thin;
	border-color: black;
}
.SightingsTableMobile tr:nth-child(even) {background:#ddd;
}
.slicknav_menu {
	display:inline-block;
	position:absolute;
	background:none;	
	z-index:1000;
	left: 0;
	margin-top:204.5px;
}
.TaxNav4{
	display: none;
}
.TaxNav3{
	display: block;
	height: auto;
	margin-left: -1%;
	width: 350px;
}
}
