/* MnDragonfly.info CSS Stylesheet */

/* Color Legend */

/* =============================================================================================================
Reset 
============================================================================================================= */
html, body { margin: 0; padding: 0; border: 0;  
				background: transparent; font-size:10px; }

div, span, article, aside, footer, header, hgroup, nav, section,
h1, h2, h3, h4, h5, h6, p, blockquote, a, ol, ul, li, 
table, tr, th, td, tbody, tfoot, thead {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	background: transparent;
	}

img 	{ margin:0; padding:0; border:0; }

table, tr, th, td, tbody, tfoot, thead {
	margin: 0; padding: 0; border: 0;
	vertical-align: baseline;
	background: transparent;
	}
	
table { border-collapse: collapse; border-spacing: 0; }
	
input, select, textarea, form, fieldset {
	margin: 0; padding: 0; border: 0;
	}

article, aside, dialog, figure, footer, header, hgroup, nav, section { 
	display:block; }

h1, h2, h3, h4, h5, h6, p, li, blockquote, td, th, a, caption, em, strong, strike { 
	font-family: Arial, Helvetica, sans-serif;
	font-size:100%;
	font-weight: normal;
	font-style: normal;
	line-height: 100%; 
	text-indent: 0;
	text-decoration: none;
	text-align: left;
	color: #000;
	}

ol, ul { list-style: none; }


/* =============================================================================================================
global
============================================================================================================= */

html 	{height:100%; background-image:url('../images/backgrounds/black_paper_@2X.png')	}
body	{background-color:#fff; width:600px;margin:0 auto;height:auto; border:2px solid red;border-radius:17px	}



/* =============================================================================================================
headings
============================================================================================================= */

h1, h2, h3, h4, h5, h6 { font-weight: bold; color: #000; }

h1 { font-size:18px; }
h2 { font-size:14px; }
h3 { font-size:14px; }
h4 { font-size:14px; }
h5 { font-size:12px; }
h6 { font-size:8px; }

h1 img, h2 img, h3 img, h4 img, h5 img, h6 img { margin: 0; }



/* =============================================================================================================
  Text Elements
============================================================================================================= */

p           	{ color:#000; font-size:12px; line-height:150%;  }
p .left			{ margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p .right 		{ margin: 1.5em 0 1.5em 1.5em; padding: 0; }

a           	{   }
a:link			{ color: #00f;  }
a:visited		{ color: #006400;  }
a:active		{ color: #000;  }
a:focus			{ color: #666;  }
a:hover     	{ color: #f00;  }

blockquote  	{ color:#000; font-size:12px; }

strong      	{ font-weight: bold; }
em		      	{ font-style: italic; }

/* =============================================================================================================
  Images
============================================================================================================= */



/* =============================================================================================================
  Lists
============================================================================================================= */

ul          	{  }
ol          	{ list-style-type:decimal; }

ul li		    { color:#000; font-size:12px; }
ol li	     	{ color:#000; font-size:12px; }

dl          	{  	}
dt       		{  	}
dd          	{ 	}



/* =============================================================================================================
   Tables
============================================================================================================= */

table       	{ width:100%; }

tr				{	}
.odd			{ background-color:#eee; }
.even			{ background-color:#fff; }

th          	{ font-weight: bold; }
thead, th    	{ background: #ff0000; }

tbody			{   }

th,td,caption 	{ 	}
caption 		{ 	}

tfoot       	{	}
.tfooter		{ background-color:#ff0000; text-align:center; font-style:italic; }

caption     	{ background: #efefef; }



/* =============================================================================================================
  Misc
============================================================================================================= */

sup, sub    	{ line-height: 0; }

abbr, acronym   { border-bottom: 1px dotted #666; }
address     	{ 	 }
del         	{ background:#FFCECE; color:#f00; }

code, pre		{ background-color:#FF9; padding:2px 0px; margin:4px 25px;
					font-family:"Courier New", Courier, monospace; font-size:12px; font-weight:normal; line-height:150%;	}


/* =============================================================================================================
	Containers
============================================================================================================= */

.mnd-top-species	 		{ height:120px; background-color:#fff; border-bottom: 35px solid red;border-top: 5px solid red;
								width:600px; margin:0 auto;overflow:; border-radius:15px 15px 0 0  }

.mnd-top-species h1  		 {font-size:30px; font-weight:800; padding:50px 0 20px 30px; overflow:hidden; float: left; } 

.mnd-top-species img 		 {padding:15px 0 20px 20px; overflow:hidden; float: left;max-width:125px } 


.mnd-footer-species   		{ height:25px; background-color:#fff; position:relative; bottom:0; left:0; width:600px; 
							margin:0 auto; overflow:hidden; margin-top:20px; border-radius:0 0 15px 15px    }
							
.mnd-footer-species h3  {text-align:center; color:#555;font-size:9px; padding: 6.5px 0; font-weight:300  }


/* =============================================================================================================
   Topnav
============================================================================================================= */

.topnav a:link      { color:#000; outline:none   }
.topnav a:visited   { color:#000; outline:none  }
.topnav a:active    { color:#000; outline:none  }
.topnav a:hover     { color:#000; text-decoration: underline; outline:none  }
.topnav a:focus     { color:#000; outline:none  }

.topnav 			{background-color:red; clear:both;overflow:hidden; }
.topnav a      		 {display:inline;}
.topnav		         {float:left; margin:0px 0px 0px 10px;}
.topnav a    		 {float:left; padding:10px 15px;}

.dropdown .dropbtn	{float:left; padding:0px 15px; font-size:9px;margin:10px 0 0 0; background-color:#ff0000; outline:none; border:none;color:#fff }
.dropdown			{float:left; overflow:hidden; }
.dropdown:hover .dropbtn	 { color:#000000; text-decoration: underline; outline:none;}

.home-content 		{display:none;position:absolute;background-color:#fff;min-width:10px;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2); z-index:1; margin-top:10px }
.home-content a {float:none;color:#000;padding:6px 15px;text-decoration:none;display:block;text-align:left; font-size:9px }
.home-content a:hover {color:#ff0000; text-decoration: underline; outline:none }
.dropdown:hover .home-content	{display:block}

.species-content 		{display:none;position:absolute;background-color:#fff;min-width:0px;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2); z-index:1; margin-top:10px;  }
.species-content a {float:none;color:#000;padding:6px 15px;text-decoration:none;display:block;text-align:left; font-size:9px}
.species-content a:hover {color:#ff0000; text-decoration: underline; outline:none }
.dropdown:hover .species-content	{display:block}


.id-content 		{display:none;position:absolute;background-color:#fff;min-width:0px;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2); z-index:1; margin:10px 0 0 10px }
.id-content a {float:none;color:#000;padding:6px 15px;text-decoration:none;display:block;text-align:left;font-size:9px }
.id-content a:hover {color:#ff0000; text-decoration: underline; outline:none }
.dropdown:hover .id-content	{display:block}

.learn-content 		{display:none;position:absolute;background-color:#fff;min-width:10px;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2); z-index:1;margin:10px 0 0 5px}
.learn-content a {float:none;color:#000;padding:6px 10px;text-decoration:none;display:block;text-align:left;background-color:#fff;font-size:9px }
.learn-content a:hover {color:#ff0000; text-decoration: underline; outline:none }
.dropdown:hover .learn-content	{display:block}

.cs-content 		{display:none;position:absolute;background-color:#fff;min-width:10px;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2); z-index:1; margin:10px 0 0 20px }
.cs-content a {float:none;color:#000;padding:6px 15px;text-decoration:none;display:block;text-align:left;background-color:#fff; font-size:9px }
.cs-content a:hover {color:#ff0000; text-decoration: underline; outline:none }
.dropdown:hover .cs-content	{display:block}

.resources-content 		{display:none;position:absolute;background-color:#fff;min-width:10px;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2); z-index:1; margin:10px 0 0 15px }
.resources-content a {float:none;color:#000;padding:6px 15px;text-decoration:none;display:block;text-align:left;background-color:#fff;font-size:9px }
.resources-content a:hover {color:#ff0000; text-decoration: underline; outline:none }
.dropdown:hover .resources-content	{display:block}

.contact-content 		{display:none;position:absolute;background-color:#fff;min-width:10px;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2); z-index:1;margin:10px 0 0 15px }
.contact-content a {float:none;color:#000;padding:6px 15px;text-decoration:none;display:block;text-align:left;background-color:#fff;font-size:9px }
.contact-content a:hover {color:#ff0000; text-decoration: underline; outline:none }
.dropdown:hover .contact-content	{display:block}

.cd-content 		{display:none;position:absolute;background-color:#fff;min-width:10px;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2); z-index:1;margin:10px 0 0 20px }
.cd-content a {float:none;color:#000;padding:6px 15px;text-decoration:none;display:block;text-align:left;background-color:#fff; font-size:9px}
.cd-content a:hover {color:#ff0000; text-decoration: underline; outline:none }
.dropdown:hover .cd-content	{display:block}



/* =============================================================================================================
   Index Page - Home
==========================================================================================================



/* =============================================================================================================
   Species
============================================================================================================= */

.mnd-species-left      		{float: left; width:50%;min-height:250px }

.mnd-species-right      	{float:right; width: 50%;min-height:250px}

.mnd-species-title h1  		{font-size: 20px; font-weight:bolder; padding: 40px 10px 10px 50px; }

.mnd-species-title h3   	{font-size: 16px; font-weight:200; padding:0 0 20px 50px; color:#888 }

.mnd-species-title p        {padding:0 0 0px 50px }

.mnd-top-species-image a	{ float:right; margin:40px 50px 10px 20px;overflow:hidden; }

.mnd-top-species-image a  	{ padding:2px;border:2px solid red; border-radius: 15px  }

.mnd-species-description 	{ padding: 10px 10px 10px 50px;  }

.mnd-species-description p	 {margin-bottom:20px;font-size:10px }

.mnd-female-species-image img  {margin:20px 0 10px 20px }



/*----- Tabs -----*/

.etabs { margin: 0 0 0 50px; padding: 0; }
.tab { display: inline-block; zoom:1; *display:inline; background: #fff; border: solid 1px #999; border-bottom: none; -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0;
		width:15.15%;  }
.tab a { font-size: 8px; line-height: 2em; display: block; padding: 0 10px; outline: none; }
.tab a:link      { color:#ff0000;    }
.tab a:visited   { color:#ff0000;outline:none    }
.tab a:active    { color:#ff0000;outline:none   }
.tab a:focus     { color:#ff0000;outline:none   }
.tab a:hover { text-decoration: underline;color:#ff0000;outline:none }
.tab.active { background: #eee; padding-top:6px; position: relative; top: 1px; border-color:#ff0000 }
.tab a.active { font-weight: bold; }
.tab-container	{margin:0 0 0 20px}
.tab-container .pannel-container { background: #fff; border: solid #666 1px; padding: 10px; -moz-border-radius: 0 4px 4px 4px; -webkit-border-radius: 0 4px 4px 4px; }

#tabs1-id    {width:550px;min-height:420px;background-color:#eee;margin: 0 auto;border:2px red solid; border-radius: 15px }

#tabs1-ss    {width:550px;min-height:420px;background-color:#eee;margin: 0 auto; border:2px red solid; border-radius: 15px }

#tabs1-nh    {width:550px;min-height:420px;background-color:#eee;margin: 0 auto;border:2px red solid; border-radius: 15px }

#tabs1-female    {width:550px;min-height:420px;background-color:#eee;margin: 0 auto;border:2px red solid; border-radius: 15px }

#tabs1-lc      {width:550px;min-height:420px;background-color:#eee;margin: 0 auto;border:2px red solid; border-radius: 15px }

#tabs1-mp    {width:550px;min-height:420px;background-color:#eee;margin: 0 auto;border:2px red solid; border-radius: 15px }



#tabs1-id h3 {padding:20px 0 10px 20px; } 

#tabs1-ss h3 {padding:20px 0 10px 20px; }

#tabs1-nh h3 {padding:20px 0 10px 20px; }

#tabs1-female h3 {padding:20px 0 10px 20px; }

#tabs1-lc h3 {padding:20px 0 10px 20px; }

#tabs1-mp h3 {padding:20px 0 10px 20px; }



 

.tabs-left   {width:70%; float:left}

.tabs-right  {width:28%; float:right }

.tabs-left p {font-size:10px;     float:left}

.tabs-ss-intro p {margin: 10px 20px 10px 20px;font-size:10px;      float:left}

.tabs-compare-1  {min-height:100px;width:98%; }

.tabs-compare-1 p {float:left;margin: 10px 0 10px 20px;  }

.tabs-compare-1 h6 {padding:0px 0 5px 40px; color:#ff0000;     float:left  }

.tabs-compare-2  {min-height:140px;width:98%; }

.tabs-compare-2 p {float:left;margin: 10px 0 10px 20px;  }

.tabs-compare-2 h6 {padding:0px 0 5% 40px; color:#ff0000;    float:left  }

.tabs-compare-full p {font-size:10px;padding:20px 0 10px 0px;       float:left}

.tabs-compare-3 p {float:left;margin: 10px 0 10px 20px;font-size:10px  }

.tabs-compare-3  {margin:20px 10px 20px 10px}

.tabs-compare-3 ul li {float:left; margin-left:60px}

.tabs-compare-3 ul li img {float left; padding:5px 10px 5px 10px; }

.tabs-compare-4 p {float:left;margin: 10px 0 10px 20px;font-size:10px  }

.tabs-compare-4  {margin:20px 10px 20px 10px}

.tabs-compare-4 ul li {float:left; margin-left:11px}

.tabs-compare-4 ul li img {float left; padding:5px 10px 5px 10px; }

.ss-list ul			{margin:60px 0 20px 0}


.ss-list ul li 		{font-size:10px;padding:5px 20px 5px 20px}

#mnd-lightbox-fm ul li a{float:right;margin:10px 20px 0px 0}

.tabs-left2   {width:48%; float:left}

.tabs-right2  {width:48%; float:right }

.tabs-right2 p {font-size:8px; margin:0 0 0 40px }

.mnd-species-right p {font-size:8px; margin:0 0 0 40px }

.addpics img  {padding: 0 70px}

.tabs-left2 h5 {padding:20px 0 10px 20px;font-size:12px }

.tabs-left2 p  {padding:0px 0 5px 20px;font-size:10px }

.tabs-left2 li {padding:10px 0 8px 20px; font-size:10px }

/* ========.mnd-species-map img {float:right ; margin:10px 45px 10px 10px }===== */

.mnd-species-map p   {float:left ; margin:10px 20px 0 30px; font-size:9px  } 

.mnd-species-map h5  { margin: 20px 20px 20px 30px}

.mnd-species-map	{display:inline-block; }

.mnd-species-map li 	{ display:inline-block; padding:0 0 0 20px }

.occopyright p        { float:left ; margin:10px 20px 0 30px; font-size:7px; font-style:italic  }

.mnd-flight-season img	 {margin:30px 0px 20px 70px }

#mnd-lightbox-fm2 ul   {margin:30px 0 20px 20px }

#mnd-lightbox-fm2 ul li img {float:left;margin:5px 0px 5px 10px}

#mnd-lightbox-fm2 p {float:left; margin: 20px 0 10px 60px;color:#ff0000  }

.tn1 img     {max-width: }


/* ========== Similar Species ========== */


.tabs-ss-3  {height:120px;width:98%; }
.tabs-ss-3 li {float:left;margin: 3px 0 3px 20px;font-size:12px  }
.tabs-ss-3 h6 {padding:0px 0 10px 0px; color:#ff0000; font-size:9px }

#mnd-lightbox-ss-3 ul li a{float:right;margin:10px 20px 0px 0px}

.tabs-left-ss-3   {width:78%; float:left}
.tabs-left-ss-3 p {font-size:18px}
.tabs-right-ss-3  {width:18%; float:right }
.tabs-right-ss-3 li {margin:0 10% 0 0}

/* ======== Similar Species new ======== */

.tabs-compare-10  {min-height:px;width:98%; }

.tabs-compare-10 p {float:left;margin: 5px 0 5px 20px;font-size:9px  }

.tabs-compare-10 h6 {padding:0px 0 5px 40px; color:#ff0000;font-size:8px  }

.tabs-compare-10 h7 {float:left;padding:0px 0 5px 60px; color:#ff0000;font-size:6px  }






#mnd-lightbox-fm ul li h7 {padding:0px 0 10px 0px; color:#ff0000; font-size:6px; }

#mnd-lightbox-fm ul li h8 {padding:0px 0 10px 0px; color:#ff0000; font-size:4.5px; }

.tabs-right-ss  {width:40%; float:right; margin-top:0%;max-height:95% }

.tabs-left-ss   {width:56%; float:left;max-height:95%}

.tabs-left-ss h5 {padding:0px 0 0px 0px;font-size:10px;float:left }

.tabs-left-ss p  {padding:0px 0 10px 40px;font-size:11px;float:left }

.tabs-left-ss li {padding:4px 0 4px 60px; font-size:8px;float:left }

.tabs-left-ss ul {margin: 0 0 6px 0}

.tabs-right-ss h5 {margin-top:10px}


.tabs-right-ss-2  {width:40%;max-height:95%; float:right; margin-top:7% }

.tabs-right-ss-2 li  {margin-top:2% }

.tabs-right-ss-2 ul	 {margin-top: 30px}



/* =========================== Similar Species compare 3 =========== */


.tabs-right-3-ss	 {width:38%; max-height:95%; float:right; margin-top:4%  }

.tabs-right-3-ss li {font-size:8px}

.tabs-right-3-ss ul  {float: left;margin: 10px 0 0 0}


.tabs-left-ss3   {width:56%; float:left}

.tabs-left-ss3 h5 {padding:20px 0 10px 60px;font-size:20px }

.tabs-left-ss3 p  {padding:0px 0 5px 60px;font-size:18px }

.tabs-left-ss3 li {padding:5px 0 4px 20px; font-size:10px }





/* =============================================================================================================
   Life Cycle
============================================================================================================= */

.lc-column		{float:left; width:32.5%;min-height:100px;height:;margin:0px 0px 10px 0px; border: }
.lc-column2		{float:left; min-width:100%;min-height:100px;height:;margin:0px 0px 0px 0px; border:}


.lc-row1		{margin:0px 0px 0px 4px;border: 	}
.lc-row2		{margin:0 0 0 1%;border: 	}
.lc-1-1			{margin:0px 0 0 0; position:relative;border:}


.lc-1-2			{margin:0px 0px 0px 0; position:relative}
.lc-1-3			{margin:0px 0px 0 0px; position:relative}
.lc-2-2	img		{margin:0px 0px 0 0px;}

.lc-1-1	p		{text-align: center;font-size:10px}
.lc-1-2	p		{text-align: center;font-size:10px}
.lc-1-3	p		{text-align: center;font-size:10px}


#mnd-lightbox-lc img	 {float:left;margin:10px 0px 0px 45px; max-width:100px}
#mnd-lightbox-lc p		 {float:left;margin:20px 0px 0px 0px;text-align:center }
#mnd-lightbox-lc2 img	 {float:left;margin:5px 0px 0px 68px; max-width:200px}
#mnd-lightbox-lc2 p		 {float:left;margin:-25px 0px 0px 68px; }

.lc-arrow1 img 			 {float:right; margin: ; position: absolute; top: 55px; right:-30px; max-width:50px}
.lc-arrow2				 {width:100%; min-height:10px}
.lc-arrow2 img 			 {float:right; margin: ; position: absolute; top:-35px; right:120px; max-width:300px}
.lc-line img			{margin: 0 0 0 6px;max-width:530px }
.lc-row2				{width: 100%; min-height:20px; margin:130px 0 0 0;position: relative}
.lc-row2 p				{margin:10px 0px 10px 0px; color:#ff0000; text-align:center;font-size:10px}
.mnd-lc-textrow1		{width:92.7%; min-height:160px;margin:20px 15px 0 15px }
.mnd-lc-textrow1 h4		{float:left;margin:0px 0px 0px 0px;text-align:justify;font-size:10px;font-weight:400; padding:2px 0 2px 0}
.mnd-lc-textrow1 p		{float:left;margin:20px 0px 0px 0px;text-align:justify;font-size:10px;font-weight:400; padding:1px 0 1px 0} 




/* =============================================================================================================
   Anisoptera2
============================================================================================================= */

.overlay		{position:absolute; top:0;bottom:0;left:0;right:0; background: RGBA(0,0,0,0.7);transition:opacity 500ms; visibility:hidden; opacity:0; width: 100%; height: 210%; border-radius:15px}
.overlay:target {visibility:visible; opacity:1}

.broadwing-popup {margin:50px auto;padding:20px; background:#fff; border-radius:15px; max-width:80%; position:relative; transition: all .5s ease-in;}
.broadwing-popup .close	{position:absolute; top:20px; right:30px; transition:all 200ms; font-size:20px; font-weight:bold; font-decoration:none; color:#333}
.broadwing-popup .broadwing-popup-content	{max-height:0%; overflow: auto}
.broadwing-popup-content	{margin-top:30px}
.broadwing-popup-content a {float:none;color:#000;padding:12px 16px;text-decoration:none;display:block;text-align:left; font-size:14px}
.broadwing-popup-content a:hover {color:#000000; text-decoration: underline; outline:none }
.broadwing-popup h3		{font-size:16px; font-weight:bold;text-align:center;width:70%; margin:}
.broadwing-popup a		{font-size:11px}

.spreadwing-popup {margin:50px auto;padding:20px; background:#fff; border-radius:15px; max-width:80%; position:relative; transition: all .5s ease-in}
.spreadwing-popup .close	{position:absolute; top:20px; right:30px; transition:all 200ms; font-size:20px; font-weight:bold; font-decoration:none; color:#333}
.spreadwing-popup .spreadwing-popup-content	{max-height:0%; overflow: auto}
.spreadwing-popup-content	{margin-top:30px}
.spreadwing-popup-content a {float:none;color:#000;padding:12px 16px;text-decoration:none;display:block;text-align:left;  font-size:14px}
.spreadwing-popup-content a:hover {color:#000000; text-decoration: underline; outline:none }
.spreadwing-popup h3		{font-size:16px; font-weight:bold;text-align:center;width:70%; margin:}
.spreadwing-popup a			{font-size:11px}

.pond-popup {margin:50px auto;padding:20px; background:#fff; border-radius:15px; max-width:80%; position:relative; transition: all .5s ease-in}
.pond-popup .close	{position:absolute; top:20px; right:30px; transition:all 200ms; font-size:20px; font-weight:bold; font-decoration:none; color:#333}
.pond-popup .pond-popup-content	{max-height:0%; overflow: auto}
.pond-popup-content	{margin-top:30px}
.pond-popup-content a {float:none;color:#000;padding:12px 16px;text-decoration:none;display:block;text-align:left; font-size:14px}
.pond-popup-content a:hover {color:#000000; text-decoration: underline; outline:none }
.pond-popup h3		{font-size:16px; font-weight:bold;text-align:center;width:70%; margin:}
.pond-popup a			{font-size:11px}
.pond-column 			{float:left; width:50%}
.pond-list:after			{content: " ";display:table;clear:both }


.darner-popup {margin:20px auto;padding:20px; background:#fff; border-radius:15px; max-width:90%; position:relative; transition: all .5s ease-in}
.darner-popup .close	{position:absolute; top:20px; right:30px; transition:all 200ms; font-size:20px; font-weight:bold; font-decoration:none; color:#333}
.darner-popup .darner-popup-content	{max-height:0%; overflow: auto}
.darner-popup-content	{margin-top:30px}
.darner-popup-content a {float:none;color:#000;padding:12px 16px;text-decoration:none;display:block;text-align:left; font-size:14px }
.darner-popup-content a:hover {color:#000000; text-decoration: underline; outline:none }
.darner-popup h3		{font-size:16px; font-weight:bold;text-align:center;width:70%; margin:}
.darner-popup a			{font-size:8px}
.darner-left		{float:left; width:49%}
.darner-right		{float:right; width:49%}

.clubtail-popup {margin:20px auto;padding:20px; background:#fff; border-radius:15px; max-width:90%; position:relative; transition: all .5s ease-in}
.clubtail-popup .close	{position:absolute; top:20px; right:30px; transition:all 200ms; font-size:20px; font-weight:bold; font-decoration:none; color:#333}
.clubtail-popup .clubtail-popup-content	{max-height:0%; overflow: auto}
.clubtail-popup-content	{margin-top:30px}
.clubtail-popup-content a {float:none;color:#000;padding:12px 16px;text-decoration:none;display:block;text-align:left;  font-size:14px}
.clubtail-popup-content a:hover {color:#000000; text-decoration: underline; outline:none }
.clubtail-popup h3			{font-size:16px; font-weight:bold;text-align:center;width:70%; margin:}
.clubtail-popup a			{font-size:8px}
.clubtail-column 		{float:left; width:50%}
.clubtail-list:after			{content: " ";display:table;clear:both }

.spiketail-popup {margin:20px auto;padding:20px; background:#fff; border-radius:15px; max-width:90%; position:relative; transition: all .5s ease-in}
.spiketail-popup .close	{position:absolute; top:20px; right:30px; transition:all 200ms; font-size:20px; font-weight:bold; font-decoration:none; color:#333}
.spiketail-popup .spiketail-popup-content	{max-height:0%; overflow: auto}
.spiketail-popup-content	{margin-top:30px}
.spiketail-popup-content a {float:none;color:#000;padding:12px 16px;text-decoration:none;display:block;text-align:left; font-size:14px }
.spiketail-popup-content a:hover {color:#000000; text-decoration: underline; outline:none }
.spiketail-popup h3			{font-size:16px; font-weight:bold;text-align:center;width:70%; margin:}
.spiketail-popup a			{font-size:8px}

.cruiser-popup {margin:20px auto;padding:20px; background:#fff; border-radius:15px; max-width:90%; position:relative; transition: all .5s ease-in}
.cruiser-popup .close	{position:absolute; top:20px; right:30px; transition:all 200ms; font-size:20px; font-weight:bold; font-decoration:none; color:#333}
.cruiser-popup .cruiser-popup-content	{max-height:0%; overflow: auto}
.cruiser-popup-content	{margin-top:30px}
.cruiser-popup-content a {float:none;color:#000;padding:12px 16px;text-decoration:none;display:block;text-align:left; font-size:14px }
.cruiser-popup-content a:hover {color:#000000; text-decoration: underline; outline:none }
.cruiser-popup h3			{font-size:16px; font-weight:bold;text-align:center;width:70%; margin:}
.cruiser-popup a			{font-size:8px}

.emerald-popup {margin:20px auto;padding:20px; background:#fff; border-radius:15px; max-width:90%; position:relative; transition: all .5s ease-in;}
.emerald-popup .close	{position:absolute; top:20px; right:30px; transition:all 200ms; font-size:20px; font-weight:bold; font-decoration:none; color:#333}
.emerald-popup .emerald-popup-content	{max-height:0%; overflow: auto}
.emerald-popup-content	{margin-top:30px}
.emerald-popup-content a {float:none;color:#000;padding:12px 16px;text-decoration:none;display:block;text-align:left;  font-size:14px}
.emerald-popup-content a:hover {color:#000000; text-decoration: underline; outline:none }
.emerald-popup h3		{font-size:16px; font-weight:bold;text-align:center;width:70%; margin:}
.emerald-popup a			{font-size:8px}
.emerald-left		{float:left; width:49%}
.emerald-right		{float:right; width:49%}

.skimmer-popup {margin:20px auto;padding:20px; background:#fff; border-radius:15px; max-width:90%; position:relative; transition: all .5s ease-in}
.skimmer-popup .close	{position:absolute; top:20px; right:30px; transition:all 200ms; font-size:20px; font-weight:bold; font-decoration:none; color:#333}
.skimmer-popup .skimmer-popup-content	{max-height:0%; overflow: auto}
.skimmer-popup-content	{margin-top:30px}
.skimmer-popup-content a {float:none;color:#000;padding:12px 16px;text-decoration:none;display:block;text-align:left; font-size:14px }
.skimmer-popup-content a:hover {color:#000000; text-decoration: underline; outline:none }
.skimmer-popup h3		{font-size:16px; font-weight:bold;text-align:center;width:70%; margin:}
.skimmer-popup a			{font-size:8px}
.skimmer-column 			{float:left; width:50%}
.skimmer-list:after			{content: " ";display:table;clear:both }


.body-species			{width:600px;margin:0 auto; min-height:100%; position:relative;}
.species-body			{ margin: 0px 0px 0px 0px }
.species-body img		{ margin: 5px 45px 0px 45px;  }
#row3					{padding:40px 0 20px 0;margin-bottom:40px }
mark.blue				{ color:#0084ff;background:none}
mark.orange				{ color:#ff9e00;background:none}


.species-column 			{float:left; width:33%; }
.species-row1:after			{content: " ";display:table;clear:both }
.species-column img			{margin:5% 0 0 13%}

.species-row1				{margin:10% 0 5% 0}
.species-row2				{margin:0 0 50% 0}

.body-species h1			{font-size:30px; margin: 100px 0 10px 0;width:100%; text-align: center}
.body-species h2			{font-size:30px; margin: 5% 10% 10px 10%;width:80%;padding:10px 0; text-align:center; }
.species-instructions p	 	{ font-size:10px;  margin: 10px 0px 40px 0; width:100%; text-align: center}

.broadwing-damselfly     	{  margin:0 0 0 0px;width:  }
.spreadwing-damselfly		{  margin:0 0 0 0px;width: }
.pond-damselfly				{  margin:0 0 0 0px;width: }
.broadwing-damselfly  h3	{text-align:center; margin:0 0 10px 0;font-size:12px}     			
.spreadwing-damselfly h3	{text-align:center; margin:0 0 10px 10px;font-size:12px}				
.pond-damselfly h3			{text-align:center; margin:0 0 10px 10px;font-size:12px}


.darner     			{  margin:0 0 0 0px;width:  }
.clubtail				{  margin:0 0 0 0px;width: }
.spiketail				{  margin:0 0 0 0px;width: }
.darner h3				{text-align:center; margin:0 0 10px 0;font-size:10px}     			
.clubtail h3			{text-align:center; margin:0 0 10px 0;font-size:10px}				
.spiketail h3			{text-align:center; margin:0 0 10px 0;font-size:10px}
	

.cruiser     			{margin:80px 0 80px 0px;width:  }
.emerald				{margin:80px 0 80px 0px;width:  }
.skimmer				{margin:80px 0 80px 0px;width:  }
.cruiser h3				{text-align:center; margin:0 0 10px 0;font-size:13px}    			
.emerald h3				{text-align:center; margin:0 0 10px 0;font-size:13px}				
.skimmer h3				{text-align:center; margin:0 0 10px 0;font-size:13px}	

.popup-color-key	 	{ margin: 50px 0 40px 0 }
.popup-color-key p 		{ font-size:10px; padding:0 0 0px 0 }

.species-row1 h3 {}


.species-color-key	 { margin: 0px 10px 0px 10px }
.species-color-key p { font-size:10px; padding:0;margin-top:10px }

			
.img300	img			{max-width:150px}




/* =============================================================================================================
   Dichotomous Key
============================================================================================================= */


.id-dichotomouskey		{margin:50px 30px}
.id-dichotomouskey h1	{text-align:center;font-size:18px; margin:0 0 40px 0}
.id-dichotomouskey p	{text-align:center;font-size:}
.id-dichotomouskey h2	{font-size:; margin:0px 0 40px 0}
.id-continue			{width: 100%}
.id-continue h2			{margin:0px 0 20px 0;text-align :center;}
.id-dk-example img		{width:100%; margin:40px 0 0 0}



.idtop				{width:100%; min-height:0px; }
.idtop-none			{width:100%; min-height:30px}
.idtop-4			{width:100%; min-height:70px; }
.idtop-5			{width:100%; min-height:70px; }


.id-banner h1	{text-align:center; font-size:22px; margin:20px 0 }	

.id-body 		{width:96%;min-height:310px; margin: 20px 1.5% 0 1.25%; border:4px solid #ff0000;  border-radius:15px}
.id-body-4 		{width:96%; min-height:550px; margin: 20px 2% 0 2%; border:4px solid #ff0000; border-radius:15px}
.id-body-5 		{width:96%; min-height:420px; margin: 20px 2% 0 2%; border:4px solid #ff0000; border-radius:15px}
.id-body-6 		{width:96%; min-height:920px; margin: 20px 2% 0 2%; border:4px solid #ff0000; border-radius:15px}

.id-title		{margin: 20px 0 20px 10px}
.id-title	h1	{font-size:14px; margin: 20px 0 0 20px }
.id-subtitle	{float:; margin: 20px 20px 10px 0}
.id-body p	 	{text-align:center; font-size:8px; max-width:94%; margin:0 3%  }

.id-body a:link      { color:#000000;    }
.id-body a:visited   { color:#000000;outline:none    }
.id-body a:active    { color:#000000;outline:none   }
.id-body a:focus     { color:#000000;outline:none   }
.id-body a:hover 	 { text-decoration: underline;color:#ff0000;outline:none }

.id-body-4 a:link      { color:#000000;    }
.id-body-4 a:visited   { color:#000000;outline:none    }
.id-body-4 a:active    { color:#000000;outline:none   }
.id-body-4 a:focus     { color:#000000;outline:none   }
.id-body-4 a:hover 	 { text-decoration: underline;color:#ff0000;outline:none }

.id-body-5 a:link      { color:#000000;    }
.id-body-5 a:visited   { color:#000000;outline:none    }
.id-body-5 a:active    { color:#000000;outline:none   }
.id-body-5 a:focus     { color:#000000;outline:none   }
.id-body-5 a:hover 	 { text-decoration: underline;color:#ff0000;outline:none }

.id-body-6 a:link      { color:#000000;    }
.id-body-6 a:visited   { color:#000000;outline:none    }
.id-body-6 a:active    { color:#000000;outline:none   }
.id-body-6 a:focus     { color:#000000;outline:none   }
.id-body-6 a:hover 	 { text-decoration: underline;color:#ff0000;outline:none }


.id-row2		{margin:0 0 0 2%;}
.id-columnt		{float:left; width:48%;min-height:;height:;margin:10px 0px 10px 0px; border:}
.id-column3t	{float:left; width:32%;min-height:50px;height:;margin:0px 0px 10px 0px; border:}
.id-column3t p	{text-align:center; font-size:9px;max-width:80%; margin:0 10% }
.id-column3t h4	{text-align:center; font-size:11px;max-width:80%; margin:5% 10% }

.id-row1		{margin:0 0 0 4%	}
.id-row1a		{margin:0 0 0 4%	}

.id-column		{float:left; width:48%;min-height:150px;height:100%;margin:10px 0px 0px 0px; border:}
.id-column3		{float:left; width:32%;min-height:112px;height:;margin:20px 0px 0px 0px; border:}

.id-row3		{margin:0 0 0 2%;	}
.id-column1		{float:left; width:90%;min-height:0px;height:100%;margin:10px 5%; border:}

.idbottom		{width:100%; min-height:200px; }

.id-pic img		{max-width: 56%; margin:2% 22%  }
.id-pic2 img	{max-width: 72%; margin:0 14%  }
.id-pic5 img	{max-width: 48%; margin:2% 26%  }

.id-left-pic h4		{font-size:8px; color: #ff0000; text-align: center; }
.id-mid-pic h4		{font-size:8px; color: #ff0000; text-align: center; }
.id-right-pic h4	{font-size:8px; color: #ff0000; text-align: center; }

.id-lower-text		{margin:5% 0 4% 0 }
.id-lower-text p	{text-align:center; font-size:10px; margin:20px 10%; max-width:80%; margin: 0 10%}
.id-lower-text h4	{text-align:center; font-size:12px; margin:20px 10%; max-width:80%; margin: 2% 10%}
.id-yes-no-pic h4	{font-size:8px; color: #ff0000; text-align: center; }
.id-yes-no-pic img	{}
.id-yes-no-pic  	{display:inline-block; width:85%; margin:0 7.5%}
.id-yes-no-pic li 	{display:inline-block; padding: 0 0 0 0; max-width:16.6% }


/* ============= Dichotomous key multi species  ============================= */

.idtop-d			{width:100%; min-height:70px; }
.idtop-e			{width:100%; min-height:30px; }
.idtop-c			{width:100%; min-height:30px; }
.idtop-s			{width:100%; min-height:30px; }


.id-body-d 				{width:96%; min-height:700px; margin: 20px 2% 0 2%; border:4px solid #ff0000; border-radius:15px}
.id-body-d p	 		{text-align:center; font-size:8px;max-width:90%; margin:0 5%  }
.id-body-e 				{width:96%; min-height:620px; margin: 20px 2% 0 2%; border:4px solid #ff0000; border-radius:15px}
.id-body-e p	 		{text-align:center; font-size:8px;max-width:90%; margin:0 5%  }
.id-body-c 				{width:96%; min-height:800px; margin: 20px 2% 0 2%; border:4px solid #ff0000; border-radius:15px}
.id-body-c p	 		{text-align:center; font-size:8px;max-width:90%; margin:0 5%  }
.id-body-s 				{width:96%; min-height:950px; margin: 20px 2% 0 2%; border:4px solid #ff0000; border-radius:15px}
.id-body-s p	 		{text-align:center; font-size:8px;max-width:90%; margin:0 5%  }


.id-body-d a:link        { color:#000000;    }
.id-body-d a:visited  	 { color:#000000;outline:none    }
.id-body-d a:active   	 { color:#000000;outline:none   }
.id-body-d a:focus    	 { color:#000000;outline:none   }
.id-body-d a:hover 		 { text-decoration: underline;color:#ff0000;outline:none }
.id-body-e a:link        { color:#000000;    }
.id-body-e a:visited  	 { color:#000000;outline:none    }
.id-body-e a:active   	 { color:#000000;outline:none   }
.id-body-e a:focus    	 { color:#000000;outline:none   }
.id-body-e a:hover 		 { text-decoration: underline;color:#ff0000;outline:none }
.id-body-c a:link        { color:#000000;    }
.id-body-c a:visited  	 { color:#000000;outline:none    }
.id-body-c a:active   	 { color:#000000;outline:none   }
.id-body-c a:focus    	 { color:#000000;outline:none   }
.id-body-c a:hover 		 { text-decoration: underline;color:#ff0000;outline:none }
.id-body-s a:link        { color:#000000;    }
.id-body-s a:visited  	 { color:#000000;outline:none    }
.id-body-s a:active   	 { color:#000000;outline:none   }
.id-body-s a:focus    	 { color:#000000;outline:none   }
.id-body-s a:hover 		 { text-decoration: underline;color:#ff0000;outline:none }


.id-enlarge h4			{font-size:6px; color: #ff0000; text-align: center;margin:1px 0 }

.id-column3-d			{float:left; width:32%;min-height:82px;height:;margin:10px 0px 0px 0px; border:}
.id-column3t-d			{float:left; width:32%;min-height:42px;height:;margin:0px 0px 10px 0px; border:}
.id-column3t-d p		{text-align:center; font-size:8px;max-width:80%; margin:0 10% }
.id-column3t-d h4		{text-align:center; font-size:10px;max-width:80%; margin:2% 10% }

/* ==============================================================================================================
 		Resources
 ================================================================================================================= */
 
.resources-title			{margin:40px 0 0px 0;}
.resources-title h1			{margin: 0 0 0 0px; font-size: 34px; text-align:center}



/* ==============================================================================================================
   Books
==============================================================================================================*/

.body-books			{width:600px;margin:0 auto; min-height:auto; position:relative; }

.books-row1				{margin:0 0 0 0px;}
.books1-column 			{float:left; width:28%;min-height:150px;height:100%;margin:40px 10px 20px 10px}
.books1-column a		{float:left; margin:0 5px 0 5px}
.books1-column img		{margin-top:20px}
.books1-column img:hover {outline:4px solid #ff0000; }
.books-row1:after		{content: " ";display:table;clear:both }
.book-text				{float:right; width:110px;margin:-100px 5px 0 0px}
.book-text h5           {float: left;font-size:9px;color:#ff0000; padding:5px 0 3px 5px;font-style:normal;  }
.book-text h6			{float:left;font-size:8px; padding: 3px 0 0 5px;color:#111111;font-style:italic;   } 
.book-text p			{float:left;font-size:7px;padding: 0 0 0 5px;  }
.dragofwi a				{margin: 10px 0px 0 -10px}

.books-row2				{margin:0 0 0 10px;}
.books2-column 			{float:left; width:28%;min-height:120px;height:100%;margin:40px 10px 20px 10px}
.books2-column a		{float:left; margin:0 5px 0 5px}
.books2-column img:hover     {outline:4px solid #ff0000; }
.books-row2:after		{content: " ";display:table;clear:both }
.books2-column img		{margin:0 0px 0 0 }

.books-row3				{margin:0 0 0 10px;}
.books3-column 			{float:left; width:29%; min-height:80px;height:100%;margin:40px 0 0px 15px}
.books3-column a		{float:left; margin:0 5px 0 5px}
.books3-column img:hover     {outline:4px solid #ff0000; }
.books-row3:after		{content: " ";display:table;clear:both }
.stokesbg a				{margin:20px 0 20px 0px}


.stokesbg				{margin:-20px 0px 0 0}
.stokesbg img			{max-width:50%;height:auto;margin: 0 0 0 0px}
.imgbook				{width:50%}
.imgbook img			{max-width:80%;height:auto}

.book-other				{margin-top:-40px}
.book-other h5           {float: left;font-size:12px;color:#ff0000; padding:10px 0px 20px 0px;font-style:normal;text-align:center;width:75%  }
.book-other h6			{float:left;font-size:9px; padding: 3px 0 10px 10px;color:#111111;font-style:italic;   } 


/* =============================================================================================================
   Links
============================================================================================================= */

.body-links					{width:600px;margin:0 auto; min-height:100%; position:relative; }
 
.links-column 				{float:left; width:33%;min-height:100px;height:100%;margin:40px 0 10px 0px; }
.links-column				{display:table-cell; vertical-align:middle}
.links-column a				{text-align:center;vertical-align:middle}
.links-column img:hover     {outline:4px solid #ff0000; }
.links-row1:after			{content: " ";display:table;clear:both }
.links-column img			{display:inline-block;vertical-align:middle}
.imglink img				{max-width:60%}
.imglink2 img				{max-width:60%}




		
/* =============================================================================================================
   Styles-small Image sizes
============================================================================================================= */

.species-species-top img 	{max-width:200px}
.species-species-top2 img 	{max-width:200px}
.species-female-top	img		{max-width:200px}
.tn1 img					{max-width:100px}
.tn2 img					{max-width:100px}
.tn3 img					{max-width:100px}
.tn4 img					{width:90%}
.tn4a img					{width:90%}
.tn5 img					{max-width:140px}
.tn6 img					{width:70% }
.tn7 img					{width:100%}
.tn-ss-3 img				{width:120% }
.tn10 img					{width:90% }

.map-icon img				{max-width:50px}
.mnd-flight-season img		{max-width:150px}

/* =============================================================================================================
   Anatomy
============================================================================================================= */

.anatomy-body				{min-height:460px}
.learn-column 			{float:left; width:50%}
.learn-column h3			{text-align: center; margin: 40px 0 -10px 0;font-size:10px }
.anatomy-list:after			{content: " ";display:table;clear:both }
.learn-column p		 	{text-align:center; margin: 10px 0 10px 0px;color:#ff0000;font-size:8px  }
.learn-row-a h1			{text-align:center; margin: 40px 0 0px 0px; font-size:20px}
.tn4a img					{outline:2px solid #ff0000}

#mnd-lightbox-fm3 ul   {margin:30px 0 20px 20px }
#mnd-lightbox-fm3 ul li img {float:left;margin:5px 0px 5px 10px}
#mnd-lightbox-fm3 p {float:left; margin: 20px 0 10px 70px;color:#ff0000  }




/* =============================================================================================================
   Phenology
============================================================================================================= */

.phenology h3				{text-align:center; margin: 0 0 10px 0}
.phenology h4				{float:left; margin: 10px 0 10px 92px;color:#ff0000;text-align:center; font-size:8px}

.phenolgy-pdf 			    {min-width:100%; margin:40px 0 20px 0;display:inline-block}
.phenolgy-pdf h4			{text-align:center; margin: 0px 0 20px 0; font-size:9px}

.phenolgy-pdf a:link      { color:#000000;    }
.phenolgy-pdf a:visited   { color:#000000;outline:none    }
.phenolgy-pdf a:active    { color:#000000;outline:none   }
.phenolgy-pdf a:focus     { color:#000000;outline:none   }
.phenolgy-pdf a:hover 	  { text-decoration: underline;color:#ff0000;outline:none }


/* =============================================================================================================
   Additional Pics
============================================================================================================= */

.plus-column 				{float:left; width:20%;min-height:50px;height:100%;margin:20px 0 0px 0px; }
.plus-column				{display:table-cell; vertical-align:middle;}
.plus-column a				{text-align:center;vertical-align:middle}
.plus-column img:hover     {outline:4px solid #ff0000; }
.plus-row1:after			{content: " ";display:table;clear:both }
.plus-column img			{display:inline-block;vertical-align:middle}
.plus-row1					{max-width:94%; margin: 0 auto; }
.plus-row1 h2				{text-align: center; margin:40px 0 10px 0; font-size:36px }
.plus-row1 p 				{text-align: center; margin: 20px 0 10px 0px;color:#ff0000; font-size:9px  }

.id-row 					{width:94%; margin: 0 auto;display:inline-block;text-align:center; margin:10px 0 0px 20px  }
.id-row a					{text-align: center; margin:0px 0 10px 0; font-size:10px }

.id-row a:link      { color:#000000;    }
.id-row a:visited   { color:#000000;outline:none    }
.id-row a:active    { color:#000000;outline:none   }
.id-row a:focus     { color:#000000;outline:none   }
.id-row a:hover 	  { text-decoration: underline;color:#ff0000;outline:none }

/* =============================================================================================================
 Publications
============================================================================================================= */

.publications-body				{min-height:100%}
.publications-body h2			{text-align:center; margin:40px 0 0 0; font-size:16px}

.pub-pdf 			    {min-width:100%; margin:40px 0 20px 0;display:inline-block}
.pub-pdf h4			{text-align:center; margin: 0px 0 30px 0; font-size:9px}

.pub-pdf a
.pub-pdf a:link      { color:#000000;    }
.pub-pdf a:visited   { color:#000000;outline:none    }
.pub-pdf a:active    { color:#000000;outline:none   }
.pub-pdf a:focus     { color:#000000;outline:none   }
.pub-pdf a:hover 	  { text-decoration: underline;color:#ff0000;outline:none }





/* =============================================================================================================
   Contact Us
============================================================================================================= */


.contact-body				{min-height:100%}
.contact-body h2			{text-align:center; margin:20px 0 30px 0; font-size:16px; color:#ff0000}
.contact-body h3			{text-align:center; margin:20px 0 0px 0; font-size:12px}


/* =============================================================================================================
 References
============================================================================================================= */

.ref-body				{min-height:100%}
.ref-body h2			{text-align:center; margin:40px 0 20px 0; font-size:30px; color:#000}
.ref-body h3			{text-align:center; margin:40px 0 0 0; font-size:14px}
.ref-body ul			{margin:20px auto; max-width:70%}
.ref-body li			{text-align:left; margin:20px 0 0 0px; font-size:10px}

.ref-column 				{float:left; width:50%;min-height:0px;height:100%;margin:10px 0 10px 0px; }
.ref-column3 				{float:left; width:33%;min-height:0px;height:100%;margin:10px 0 10px 0px; }


.ref-row1:after				{content: " ";display:table;clear:both }
.ref-row1					{width:100%; margin: 20px auto