/* CSS Document for Screens */
@font-face { 
  font-family: News Cycle; 
    src: url('../../fonts/NewsCycle-Regular.eot'); 
    src: local("News Cycle"), url('../../fonts/NewsCycle-Regular.ttf'); 
} 

{ font: normal 90% Arial, Helvetica, sans-serif;
  color: black;
  background: #FFF;
}

#page {
    margin: 0;
    min-width: 600px;
    max-width: 1420px;
    background: #fff;
    font: normal 90% Arial, Helvtica, sans-serif;
    color: black;
 }
 
/* Text */ 

/* tell the browser to render HTML 5 elements as block */
article, aside, figure, footer, header, hgroup, nav, section { 
  display:block;
}

.para
{ padding: 0 2em 0 0;
  line-height: 1.3em;
  font-size: 100%;
  text-align: justify;
  margin 0px; }

img 
{ border: 0; margin: .5em 0 0 0; }

h1, h2, h3, h4, h5, h6 
{ font: bold 150% 'News Cycle', Arial, sans-serif;
  text-shadow: 1px 1px #AAA;
  color: #E25506;
  margin: 10px 0 0 0;}

h2
{ font: bold 150% 'News Cycle', Arial, sans-serif; color: black; }

h3
{ font: bold 120% 'News Cycle', Arial, sans-serif;}

h4
{ margin: 0 0 0 80px;
  
  font: bold 90% 'News Cycle', Arial, sans-serif;
  text-shadow:none;
  color: black;
}

h5, h6
{ margin: 0;
  padding: 0 0 0 0;
  font: normal 120% 'News Cycle', Arial, sans-serif;
  line-height: 1.5em;}

h5, h6
{ font: normal 95% 'News Cycle', Arial, sans-serif;
  padding-bottom: 15px; }

.cap { font-size: 80%; } 

ul {
    list-style-position:outside;
    margin-top: 0;
    padding-left: 1em;
}
 
li {line-height: 1.3em; 
   }

/* Link Attributes */
a:link {
    color: #005E80;
    text-decoration: none;
 }
a:visited {
    color: #005E80;
 }
a:hover {
    color: #FF5F5F;
 }
a:active {
    color: red;
    position: relative;
    top: 1px;
 }
/** Header **/
header {
       height: 190px; width: 100%;
       background-color: #fff; position: relative;
       display: block;
}
header a.image1 { z-index: 1;  
                position: absolute; display: block; 
                background: url("../images/butterflybanner.JPG"); 
                background-color: transparent;
                max-width:100%; 
                max-height:100%;
}

header a.logo { z-index: 1; float: right;
                position: absolute; display: block; width: 120px; height: 120px; 
                background: url(LOGO.gif) no-repeat 0 0; 
                background-size: contain; top: 10px; right: 20px;  
                             
}

/** header div.headerContent h1 { color: #fff;  margin: 20px 0 20px 0; } **/

#headerContent h1
{
	position: absolute;
    left: 24%;
    width: 51%;
	padding: 6px 30px 6px 30px;
	margin: 10px 10px 10px 20px;
	/* color: #555; */
    color: #75FFBA;
    font-size: 200%;
    font-weight:800;
    /* background-color: #ff7563; */
    
    background: #008040;
	text-shadow: 0px 1px 2px white;
	-webkit-box-shadow: 0px 2px 4px #888;
	-moz-box-shadow: 0px 2px 4px #888;
	box-shadow: 0px 2px 4px #888;
}

#headerContent h1:before
{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
	left: 0px;
	top: 100%;
	border-width: .33em .66em;
	border-style: solid;
	/* border-color: #666 #666 transparent transparent; */
    border-color: #666 #666 transparent transparent;
}

#headerContent h1:after
{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
	right: 0px;
	top: 100%;
    border-width: .33em .66em;
	/* border-width: 5px 10px; */
	border-style: solid;
	border-color: #666  transparent transparent #666;
}

#headerContent h2 { position: absolute; left: 30%; top: 35%; color: #E25506; text-shadow: 1px 1px #666; }

/* Columns */     
#outer {
    width: 70%;
    padding-top: 1.5em;
    margin: 0 auto;
 /*  background: DimGray; */
 } 
#outer::after,
#outer::before { 
    content:"";
    display: table;
}
#outer::after {
  clear:bodth;
}
#outer {
  zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

.col1 {
    padding-left: 2%;
    float: left;
    width: 30%;
  
   /* background-color: #FFFF80; */
}

.col1_item {
    margin: 0 0 0 0;
    line-height: 1.3em;
 }

.col2 {
    float: right;
    width: 63%;
    padding-left: 3%;
    padding-right: 2%;
  /*  background-color: #E2E2EE; */
 }

.floatLeft {
    float: left; 
    margin-right: 1em;
}
 
.col1 .col2 {
    padding-bottom: 1000em;
    margin-bottom: -1000em;
 }

#outer {
   overflow: hidden;
 }

.docList_container { 
    margin: 2% auto; 
    border-top: 1px solid black;
    width: 98%; }

.docList_item
{
  /* background: rgb(237,226,197); */
  float: left; 
  width: 44.5%;
  padding: 0 1% 1% 1%;
  margin-right: 4%; }
  
.docList_item + .docList_item { margin-right: 0; }
  
#col1 blockquote { 
    margin: 0 15px 0 0;
    padding: 5px;
    color: #00A876; 
    background: #CCCCCC; 
    background: #B8F5BD;
    border: 1px solid black;
    border-radius: 30px/5px; 
}

#col1 blockquote h3 { 
    font-style:italic; 
}

#col1 blockquote p { margin: 10px; text-indent; }
#col1 blockquote p.quote { font-style: italic; font-size: 1.2em; text-indent: -.3em; }
#col1 blockquote p.credit { 
    color: #777; font-size: .9em;
    margin-top: 0; padding-left: 20px;
    line-height: 1.3em;
}
#col1 blockquote p.quote::before { content:'\201c'; }
#col1 blockquote p.quote::after { content:'\201d'; }
#col1 blockquote p.credit::before { content:'\2014'; }               
 



/* Footer */
 
footer { 
    color: #75FFBA;
    font-size: 1.2em;
    height: 30px; 
    background-color: #008040;
    margin-top: 2em;
    padding-left: 10px;
    width: 100%;
}
 
 /* Navigation */
 
nav {
     /* background-color: #FFA171; */
     /* background-color: #ff7563; */
     background: #008040; 
     position: absolute;
     top: 140px; left: 0px;
     padding: 0 0 0 0;
     width: 100%;
     font-size: 1em;
	/* text-shadow: 0px 1px 2px #bbb; */
	-webkit-box-shadow: 0px 2px 4px #888;
	-moz-box-shadow: 0px 2px 4px #888;
	box-shadow: 0px 2px 4px #75FFBA;
     	
}

nav a:link {
    color: #75FFBA;
    font-weight: bold;
 }
nav::after { content:''; display: block; clear: both; }
 
nav ul { list-style: none; margin: 0; padding: 0px; }

nav ul li:hover { background-color: #2b0306;}
nav ul li:hover > ul {display: block; }
nav ul li a {
    display: inline-block;
    color: #555;
    padding: 10px 20px;
    text-decoration: none;
    width: 125px;
    position: relative;
}

/* nav ul li a:visited { color: #fff; } */
 nav ul li a:visited { color: #75FFBA; }


nav ul li a:hover { background-color: #6d0911; }

nav ul ul { position: absolute; top: 100%; background-color: #2b0306; display: none;}

nav ul ul li { position: relative; }

nav ul ul ul {left: 100%; top: 0px; }
/* top-level */

nav > ul { padding-left: 24%; }
nav > ul > li { float: left; }
nav > ul > li > a { width: auto; padding: 10px 20px 15px 20 px; }