/*** Copyright 2014 C W Dee                                                 ***/

* html .HollyHack { height: 0.01%; }
	
body {
	margin: 0;
	padding: 10px 0;
	color: #000;
	font-family: 'Trebuchet MS', sans-serif;
	background: #F7F7F7;
}
a:link, a:visited {
	text-decoration: none;
	color: #8d2424;
}
a:hover {
	color: #474134;
 	font-weight: normal;
}
a:active {
	text-decoration: none;
	color: inherit; 
}
a img {
  border: none;
}
td {
  vertical-align: top;
}
ul {
  margin: 0 0 12px 0;
  padding: 2px 0 0 20px;
}
ul li ul {
  margin: 0;
  padding: 2px 0 0 12px;
}
#wrapper {
	width: 960px;
	margin: 0 auto;
}
#map #wrapper {
  min-height: 745px;
}
header {
  background: url(/img/header1.jpg) no-repeat #FFF; 
  height: 148px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  border: 1px solid #D3D3D3;
  border-bottom: none;
}
#header-left {
  width: 760px;
  margin: 103px 0 0 0;
  padding: 4px 0 4px 20px;
  background: none repeat scroll #C0C0C0;
  float: left;
}
#header-left h1 {
  margin: 0;
  padding: 0;
  color: #8D2424;
}
#header-right {
  float: right;
  height: 149px;
}
#header-right img {
  margin-right: 8px;
}
#header-right a {
  float: right;
  height: 150px;
} 
footer {
	width: 960px;
	margin: 0 auto;
}
footer p {
  font-size: 0.75em;
	text-align: center;
	height: 30px;
}	

#main {
  min-height: 410px;
}

div.hints,
div.hint2 {
	font-size: 0.75em; 
  line-height: 80%;
	margin: 0;
	position: absolute;
}
div.hints {
	left: 10px;
	top: 472px;
}
div.hint2 {
	left: 126px;
	top: 472px;
}
.hints span,
.hint2 span {
	border-bottom: 1px dashed #000;
}
h4.hints {
	height: 20px;
	font-weight: normal;
}
div.acknowledgement {
  font-size: 0.5em; 
	margin: 0;
	position: absolute;
	text-align: right;
	right: 26px;
	bottom: 10px;
	width: 260px;
}
#map #main {
  position: relative;
  clear: both;
  float: left;
  width: 100%;
  overflow: hidden;
}
/*** Fluid 3-column layout - CSS derived from http://matthewjamestaylor.com/blog/perfect-3-column.htm ***/
.threecol {
	background-color: #E9EAE5;
	border-bottom-right-radius: 6px;
	border-bottom-left-radius: 6px;
  border: 1px solid #D3D3D3;
  border-top: none;
}
#map .container3 {                 /*-- Wrapper for text pane within main body --*/
  position: relative;                   /* Fix the IE7 overflow hidden bug    */
  clear: both;
  float: left;
  width: 958px;                         /* Width of whole page                */
  overflow: hidden;                     /* Truncate any overhanging divs      */
	padding: 10px 0 0 0;
}
/* common column settings */
#map .container2,
#map .container1 {
  float: left;
  position: relative;
  width: 100%;
}
.threecol .col-left,
.threecol .col-centre,
.threecol .col-right {
  float: left;
  position: relative;
  padding: 0;                           /* no left and right padding on       */
                                        /* columns, we just make them         */
                                        /* narrower instead only padding top  */
                                        /* and bottom is included here, make  */
                                        /* it whatever value you need         */
}
.threecol .col-left,
.threecol .col-centre,
.threecol .col-right {
  overflow: hidden;
}  
/* 3 Column settings 180px:600px:180px for species maps */
.threecol.container3 {
  background-color: #E9EAE5;            /* Right column background colour     */
  color: #404040;
}
.threecol .container2 {
  right: 180px;                         /* Right column width                 */
  background-color: #E9EAE5;            /* Center column background colour    */
}
.threecol .container1 {
  right: 600px;                         /* Centre column width                */
}
.threecol .col-centre {
  width: 600px;                         /* Centre column content width        */
                                        /*  (column width minus padding)      */
  left: 960px;                          /* 100% plus left padding of center   */
                                        /*  column                            */
  }

#map .threecol .col-centre {
	height: 582px;
}
.threecol .col-left {
  width: 170px;                         /* Left column content width          */
                                        /*  (column width minus padding)      */
  left: 180px;                          /* width of (right column) plus       */
                                        /*  (center column left and right     */
                                        /*   padding) plus                    */
                                        /* (left column left padding)         */
}
.threecol .col-right {
  width: 170px;                         /* Right column content width         */
                                        /*  (column width minus padding)      */
  left: 800px;                          /* (100% - left column width) plus    */
                                        /*   (center column left and right    */
                                        /*    padding) plus                   */
                                        /*   (left column left and right      */
                                        /*    padding) plus                   */
                                        /*   (right column left padding)      */
}


/*** Element styles for species maps ******************************************/

#map .col-centre img {
	display: inline;
	border-width: 1px;
	border-style: solid;
}
#map .col-centre h2 {
	color: #E0E0E0;
  position: absolute;
  top: 0;
  left: 0; 
  font-size: 1.25em;
  font-weight: normal;
  margin: 0;
  padding: 4px 8px 3px 8px;
  width: 586px;
  z-index: 10;
}
#map .col-centre h3 {
	color: #E0E0E0;
  position: absolute;
  top: 30px;
  left: 0;
  padding: 0 8px 5px 8px;
  margin: 0;
  font-size: 0.9375em;
  font-style: oblique;
  width: 586px;
  z-index: 10;
}
#map .col-centre h2.winter,
#map .col-centre h3.winter {
	background: #165555;
}
#map .col-centre h2.breeding,
#map .col-centre h3.breeding {
	background: #8d2424;
}
#map .col-centre h2.change,
#map .col-centre h3.change {
	background: #1d711d;
}
#map .col-centre h2 span,
#map .col-centre h3 span {
  float: right;
  font-size: 13px;
	font-style: normal;
}
#map #map-pane {
  margin-top: 52px;
  height: 518px;
  border-left: 2px solid #C0C0C0;
  border-right: 2px solid #C0C0C0;
  border-bottom: 2px solid #C0C0C0;
}
#map .col-centre #dropDown {
  position: absolute;
  top: 60px;
  left: 0; 
  width: 210px;
}
#map .col-centre #dropDown h4 {
  font-size: 0.875em;
  font-weight: normal;
  margin: 0;
  padding: 4px 2px 4px 8px;
}
#map h4.thisAtlas.winter {
	color: #E0E0E0;
	background: #165555;
}
#map h4.thisAtlas.breeding {
	color: #E0E0E0;
	background: #8d2424;
}
#map h4.thisAtlas.change {
	color: #E0E0E0;
	background: #1D711D;
}
#map .col-centre h4.otherAtlas {
  display: none;
}
#map a:hover h4.otherAtlas {
  color: #202020;
  background: #D0D0D0; 
}
#map h4.otherAtlas.winter {
	color: #165555;
	background: #C0C0C0;
}
#map h4.otherAtlas.breeding {
	color: #8d2424;
	background: #C0C0C0;
}
#map h4.otherAtlas.change {
	color: #1D711D;
	background: #C0C0C0;
}
#map .col-centre h4 img {
  float: right;
  border: none;
  height: 10px;
  width: 10px;
  padding: 4px 8px 0 0;
}
#map .col-centre img#background {
  height: auto;
  width: auto;
  border: 0;
  position: relative;
}
.map2km img {
	width: 17px;
	height: 17px;
}  
.map10km img {
	width: 89px;
	height: 89px;
}  

/* column container */
#table #main {
	position: relative;		                /* This fixes the IE7 overflow hidden */
	                                      /* bug and stops the layout jumping   */
	                                      /* out of place                       */
  clear: both;
  float: left;
  width: 100%;
	overflow: hidden;
}
/* 2 column left menu settings */
.twocol {
	background-color: #E9EAE5;
	border-bottom-right-radius: 6px;
	border-bottom-left-radius: 6px;
  border: 1px solid #D3D3D3;
  border-top: none;
}
#general .container2,
#table .container2 {
  position: relative;
  clear: both;
  float: left;
  width: 958px;
  overflow: hidden;
  background-color: #E9EAE5;
  padding-top: 10px;
}
#general .container1,
#table .container1 {
  float: left;
	width: 100%;
	position: relative;
	right: 760px;
	}
.twocol .col-left,
.twocol .col-centre {
  float: left;
  position: relative;
  overflow: hidden;
}
.twocol .col-centre {
  width: 760px;
  left: 950px;
}
.twocol .col-left {
  width: 170px;
  left: 0;
}



/*** Paragraph styles for species table pages *********************************/

#table .col-centre {                                /*** Wrapper for species table ***/
  margin: 0;  
	xx-border: 1px solid #E8E8E8;            /** WARNING: removing causes problem with tabs */
	padding: 0;
}
#table .col-centre h2 {
	color: #E0E0E0;
  position: absolute;
  top: 0;
  left: 0; 
  font-size: 1.25em;
  font-weight: normal;
  margin: 0;
  padding: 4px 8px 3px 8px;
  width: 746px;
}
#table .col-centre h3 {
	color: #E0E0E0;
  position: absolute;
  top: 30px;
  left: 0;
  padding: 0 8px 5px 8px;
  margin: 0;
  font-size: 0.9375em;
  font-style: oblique;
  width: 746px;
}
#table .col-centre h2.winter,
#table .col-centre h3.winter {
	background: #165555;
}
#table .col-centre h2.breeding,
#table .col-centre h3.breeding {
	background: #8d2424;
}
#table .col-centre h2.change,
#table .col-centre h3.change {
	background: #1d711d;
}
#table .col-centre h2 span,
#table .col-centre h3 span {
  float: right;
  font-size: 13px;
}
#table .col-centre h2 span a,
#table .col-centre h3 span a {
	color: #E0E0E0;
	text-decoration: underline;
	font-style: normal;
	font-weight: normal;
}
#table .col-centre h2 span a:hover,
#table .col-centre h3 span a:hover {
	color: #808080;
	text-decoration: none;
}
#table #table-pane {
  margin: 54px 0 8px 0;
  padding-top: 1px;
  width: 756px;
  height: 504px;
  border-left: 2px solid #C0C0C0;
  border-right: 2px solid #C0C0C0;
  border-bottom: 2px solid #C0C0C0;
}

#table-pane {                        /*** Species table ***/
	width: 760px;
	height: 476px;
	margin: 4px 0 0 0;
	position: relative;
}
#table-pane table {
	border-collapse: collapse;
}
#table-pane td {
	font-size: 0.8em; 
	width: 190px;
	margin: 0; 
	padding: 0;
}
#table-pane a {
	display: inline-block;
	position: relative;
  height: 18px;
	width: 160px;
	padding: 0 4px;
	margin: 0;
	color: #8D2424;
	text-decoration: none;
	font-size: 1em;
} 
#table-pane.breeding a {
	color: #8D2424;
}
#table-pane.winter a {
	color: #165555;
}
#table-pane.change a {
  color: #1d711d;
}
#table-pane a:link, 
#table-pane a:visited {
	font-weight: normal;
}
#table-pane a:hover {
  color: #000;
  background: #C0C0C0;
 	font-weight: normal;
}
#table-pane a:active {
 	font-weight: normal;
}
#table-pane a.absent {
	color: #787878;
}
#table-pane a.sensitive {
	color: #404040;
	font-style: oblique;
}
#table-pane img {                           /*** Species table for tetrad ***/
  padding: 0 0 0 4px;
	float: left;
	border: none;
}

#table-pane1 a,
#table-pane1 span {                         /*** Species table with images */
	width: 142px;
	float: left;
}
#table-pane2 a,                             /*** Species table no images   */
#table-pane2 span {
	width: 156px;
}

#container {
	position: relative;
}

/*** Paragraph styles for left column navigation ***/
#nav-column-wrapper {
	position: absolute; 
	width: 160px;
	margin: 0;
	top: 0;
	left: 610px;
	left: 0;
}
#nav-column {
	margin: 0;
	padding: 0;
	font-size: 1em;
}
.col-left h3 {
	font-size: 0.875em;
	font-weight: bold;
	letter-spacing: 0.05em;
	background-color: #989898;
  color: #404040;
  margin: 4px 0 0 0;
  padding: 4px 7px 4px 7px; 
}
.col-left p {
  text-align: center; 
  font-size: 0.75em;
  margin: 4px 0 4px 0;
}
#nav-column img {
	display: inline-block; 
	width: 160px;
	border: none;
}
ul.navv {
  background: #C0C0C0;  
  list-style-type: none;
  margin: 0;
  padding: 0;
}
ul.navv li {
  margin: 0;
  padding: 0;
  height: auto;
  font-size: 0.875em;
}
ul.navv li a {
  color: #8D2424;
	display: block;
  margin: 0;
  padding: 2px 7px 4px 7px;
  height: auto;
}
ul.navv li a.breeding {
  color: #8D2424;
}
ul.navv li a.winter {
  color: #165555;
}
ul.navv li a.change {
  color: #1D711D;
}
ul.navv li a:hover {
  color: #202020;  
  background: #D0D0D0;
}
#nav-column ul ul {
  padding: 0 0 4px 8px;
  background-color: #AB9B7D;
}

/* tetrad table navigation */
.col-left div.adjacent table {
  border-collapse: collapse;
  font-size: 0.7em;
  height: 160px;
  width: 160px;
  margin: 4px 0 4px 6px;
}
.col-left .adjacent table td {
  width: 52px;
  height: 52px;
  border: 1px solid #8D2424;
}
.col-left .adjacent table tr,
.col-left .adjacent table tr td {
  background-color: #C0C0C0;
  margin: 0;
  padding: 0;
}
.col-left .adjacent table tr td a,
.col-left .adjacent table tr td p {
  display: block;
  text-align: center;
  font-size: 1.33em;
  padding: 18px 0 12px 0;
  margin: 0;
  height: 22px;
}
.col-left .adjacent table tr td a {
  color: #8D2424;
}
.col-left .adjacent table tr td a:hover {
  color: #202020;  
  background: #D0D0D0;
}
.col-left .adjacent table tr td.thistetrad {
  background-color: #989898;
  color: #404040;
}
#osmap-pane {
  height: 460px;
  padding-bottom: 8px;
}
#general .col-centre #osmap-pane h3 {
	color: #202020;
	background: #F8F8F8;
  position: absolute;
  top: 0;
  left: 0; 
  font-size: 1.25em;
  font-weight: normal;
  margin: 0;
  border: 2px solid #8D2424;
  border-bottom: none; 
  padding: 4px 8px 2px 8px;
  width: 386px; 
}
#general .col-centre #osmap-pane h4 {
	color: #202020;
	background: #F8F8F8;
  position: absolute;
  top: 30px;
  left: 0;
  padding: 0 8px 3px 8px;
  border: 2px solid #8D2424;
  border-top : none; 
  margin: 0;
  font-size: 0.9375em;
  font-style: oblique;
  width: 386px;  
}
div#OSmap {
  position: relative;
  top: 54px;
  width: 402px; 
  height: 402px; 
  border: 2px solid #8D2424;
}
#OSmap p {
  font-size: 0.5em;
}
#OSmap .OpenSpaceControlCopyrightCollection {
  font-size: 10px !important;
}

.col-left span.zoom {
  font-size: 0.875em;
  width: 77px;
  width: auto;
  height: 21px;
  display: inline-block;
  margin: 0 0 0 6px;
  background-color: #C0C0C0;
}
.col-left span.zoom a {
  padding: 0 10px 3px 10px;
  margin: 0;
  text-align: center;
  color: #8D2424;
}
.col-left span.zoom a:hover {
  color: #202020;  
  background: #D0D0D0;
}  

/*** Paragraph styles for sidebar for general text pages*****************/
#general .col-centre h2 {
  padding: 0 8px 12px 0;
	margin: 0;
} 
#general .col-centre h3 { 
	font-weight: bold;
	padding: 4px 8px 8px 0;
	margin: 0;
}
#general .col-centre h4 { 
	font-weight: normal;
	padding: 0 8px 4px 0;
	margin: 0;
}
#general .col-centre h5 { 
	padding: 0 8px 4px 0;
	margin: 0;
}
#general .col-centre p,
#general .col-centre li,
#general .col-centre li ul li {
  font-size: 0.875em;
  padding: 2px 2px 6px 0;
	margin: 0;
}

#dataupload td {
   padding-top: 12px;
   margin: 0;
}

/*** Paragraph styles for right sidebar for species maps ***/
#key-wrapper {
	width: 170px;
	margin: 0;
	padding: 0;
	top: 0;
}
#key-column p {
	position: absolute;
	display: inline; 
	font-size: 0.7em;
	margin: 0; 
}
#key-column img {
	display: inline-block; 
	width: 17px;
	height: 17px; 
	border-width: 5px;
	padding: 0 2px;
	vertical-align: top;
}
#key-column h4 {
	font-size: 0.875em;
	text-align: center;
	padding: 2px 0; 
	margin: 0;
	font-weight: normal;
	background: #c0c0c0;
	color; #202020;
}
.separator {
	margin: 4px 0 0 0;
	border-top: 2px solid #989898;
}
#key-column p.c1 {
 	width: 15px;
	padding: 2px 0 0 0;
}

#key-column p.c2 {
	color: inherit;
	left: 23px; 
	width: 68px; 
	padding: 3px 0 0 7px;
}
#key-column p.c23 {
	color: inherit;
	left: 23px; 
	width: 110px; 
	padding: 3px 0 0 0;
}
#key-column p.c3 {
	color: inherit;
	left: 75px; 
	text-align: right;
 	width:  48px; 
	padding: 3px 4px 0 0;
}
#key-column p.c4 {
	color: inherit;
	left: 110px; 
	text-align: right;
 	width:  48px; 
	padding: 3px 4px 0 0;
}
xx-#key-column p.c1-3 {
  color: inherit;
	text-align: center;
  width: 137px;
  padding: 2px 0 0 0;
}
#key-column .maptables {
  margin-bottom: 4px;
}
#key-column .maptables div.deep {
  height: 32px;
}

div#grid {
  position: relative;
  float: right;
}
/*** Paragraph styles for right sidebar for adjacent squares grid ***/
#grid table {
  font-size: 1.6em;
  text-align: center;
  background-color: #FFF;
  border: 2px solid #000;
  border-collapse: collapse;
  margin: 10px 0 30px 50px;
}
#grid table td {
  height: 40px;
  width: 40px;
  border: 1px solid #000;
  text-align: center;
  padding: 1px;
}

table#speciesedit {
  margin-left: -3px;
}

.imagecredit {
  font-size: 0.6em;
  margin: 2px 0 0 0;
  padding: 0;
  float: left;
}
.devcredit {
  font-size: 0.6em;
  margin: 2px 0 0 0;
  padding: 0;
  float: right;
}
.devcredit a,
.imagecredit a {
  color: #606060;
}
.devcredit a:hover, 
.imagecredit a:hover {
  color: #D0D0D0;
}

/*** Placement for Towns and Sites ***/
#Towns span,
#Sites span {
  color: #fff;
  background-color: #404040;
  padding: 2px 4px;
  font-size: 75%;
  z-index: 100;
}

span#Caf { position: absolute; left: 448px; top: 420px; }
span#Bay { position: absolute; left: 398px; top: 474px; }
span#OgS { position: absolute; left: 136px; top: 424px; }                                               
span#Pol { position: absolute; left: 106px; top: 402px; }
span#Cay { position: absolute; left: 405px; top: 330px; }
span#Pod { position: absolute; left: 330px; top: 294px; }
span#MeT { position: absolute; left: 302px; top: 132px; }
span#Abe { position: absolute; left: 277px; top: 168px; }
span#Coe { position: absolute; left: 262px; top: 420px; }
span#LlM { position: absolute; left: 228px; top: 474px; }
span#Mag { position: absolute; left: 138px; top: 276px; }

span#MGW { position: absolute; left: 522px; top: 383px; }
span#RhE { position: absolute; left: 499px; top: 418px; }
span#CaH { position: absolute; left: 404px; top: 418px; }
span#CBW { position: absolute; left: 416px; top: 439px; }
span#CoC { position: absolute; left: 419px; top: 460px; }
span#LaW { position: absolute; left: 473px; top: 481px; }
span#FlH { position: absolute; left: 480px; top: 517px; }
span#RoP { position: absolute; left: 360px; top: 512px; }
span#EAb { position: absolute; left: 326px; top: 490px; }
span#Gin { position: absolute; left: 271px; top: 488px; }
span#Nat { position: absolute; left: 201px; top: 480px; }
span#CwN { position: absolute; left: 184px; top: 459px; }
span#Son { position: absolute; left: 158px; top: 438px; }
span#OgE { position: absolute; left:  67px; top: 406px; }
span#MeM { position: absolute; left: 165px; top: 412px; }
span#Poo { position: absolute; left: 165px; top: 390px; }
span#SkP { position: absolute; left: 079px; top: 384px; }
span#KeP { position: absolute; left:  73px; top: 362px; }
span#PaS { position: absolute; left: 150px; top: 348px; }
span#Lld { position: absolute; left: 270px; top: 363px; }
span#HlL { position: absolute; left: 305px; top: 384px; }
span#LlR { position: absolute; left: 489px; top: 327px; }
span#PaT { position: absolute; left: 402px; top: 384px; }
span#HeL { position: absolute; left: 479px; top: 363px; }
span#FoF { position: absolute; left: 383px; top: 350px; }
span#LoR { position: absolute; left: 290px; top:  96px; }
span#RhP { position: absolute; left: 308px; top: 132px; }
span#CwC { position: absolute; left: 214px; top:  96px; }
span#Lln { position: absolute; left: 296px; top: 240px; }