/*
Title: Map Collection layout-css
Updated: September 29 2008
*/
/*  Common look and feel defaults:
hover:
   color:#fdb813;

Ongoing design principle: slowly change over to relative sizing whenever any given section is touched,
with the eventual aim of making all of it fluid.  Example change, from:
      margin-right: 26px;
to
      margin-right: 3.5%
  where the parent container is 700px  (26/700=.03571...) .
 
 Then when the parent is changed to percent or em the child will automatically follow suite.
   
 */

.debug { display:none;}

 /* Global
---------------------------------------------------------- */

	#logo { float: left; }
   #logo a:link, #logo a:visited {border: 2px solid transparent;}
   #logo a:hover { border: 2px solid #fdb813;background-color:transparent;}
   #logo-maps{
      position: relative;
      top: -10px;
      color: #283C46; /* same as darkest background gradient */
      font-family: Cambria, Georgia, "Times New Roman", serif;
      font-size: 32px;
      }
   
	#global-menu {
		float: left;
		margin-top: 7px;
		width: 700px;
		background: url("http://www.environmentyukon.ca/maps/media/layout/bg-global-menu.png") no-repeat top left;
		}
		
		#global-menu-bottom {
			float: left;
			width: 700px;
			height: 6px;
			background: url("http://www.environmentyukon.ca/maps/media/layout/bg-global-menu-bottom.png") no-repeat 0 0;
			}
			
			#global-menu ul {
				float: left;
				padding: 9px 0 0 23px; 
				width: 400px;
				font-size: 85%;
				font-weight: bold;
				}
				
				#global-menu li {
					float: left;
					margin-right: 2ex;
					}
					
				#global-menu ul .selected {
					/* color: #FF7D58; */
               color: goldenrod;
					}
               
#global-menu a:hover {
color:white;
background:#fdb813;
}            
			#search {
				float: right;
				width: 200px;
				margin-left: 10px;
				padding: 7px 15px 0 10px;
				}
				
			#search-form-page {
				margin-top: 15px;
				}
				
				#search-field {
					margin: 0 7px 0 0;
					padding: 1px 2px;
					width: 120px;
					height: 13px;
					border: 1px solid #A5B8BC;
					color: #628495;
					}
					
					#search-form-page #search-field {
						width: 180px;
						}
					
		input.submit-search {
			border: 1px double #A5B8BC;
			padding: 0 5px;
			background: #CDD8DA url("http://www.environmentyukon.ca/maps/media/layout/bg-input-search-submit.png") repeat-x 0 0;
			font-weight: normal;
			font-size: 80%;
			font-family: Tahoma, "Lucida Grande", "Trebuchet MS", Verdana, Arial, sans-serif;
			color: #628495;
			}					
	
   /* Use main gov site orange link bars */
   .barlink a:link,
	.barlink a:visited, 
	.barlink a:hover,
	.barlink a:active {
      color: #628495;
		padding: 3px 20px;
		display: block;
		background: url('/maps/media/layout/menu.gif') repeat-y 0 0;
		margin-top: 1px;
	}
	.barlink a:hover,
	.barlink a:active {
		background: #fdb813 url('/maps/media/layout/menu_over.gif') repeat-y 0 0;
		color: white;
      }

   /* higlight current position in navigation hierarchy */
   .barlink a.selected { 
      background: #fdb813 url('/maps/media/layout/menu_over.gif') repeat-y 0 0;
		color: white;
      }
   .barlink a.selected:hover { color: black}
   
   /* don't use barlink background  */
   a.nobarlink:link, a.nobarlink:visited, a.nobarlink:active {
      background: url(#) transparent; color: #628495;}
	a.nobarlink:hover {color: black;}
   
   #secondary-text-navigation a.nobarlink {color:#628495; border:none; display:inline; padding:0.5ex;}
   #secondary-text-navigation a.nobarlink:hover {color:white; background-color: #fdb813;border:none; display:inline; padding:0.5ex;}


/* Columns
---------------------------------------------------------- */
	
	#column-one-home, #column-two-home, #column-one-wide, #column-one, #column-two, #column-three, #column-three-wide {
		float: left;
		}
		
		#column-one-home {
			width: 212px;
			margin-right: 7px;
			}
			
		#column-one-wide {
			width: 560px;
			}
			
		#column-one {
			width: 168px;
			}
			
		#column-two {
         width:55em;
			/* width: 330px; */
			margin: 4px 30px 0 0;
			}

      /*  narrower middle column when viewing an individual map, allow for floated map on right */
      #template-view-detail #column-two {
         width: 25em;
         }
      
		#column-three {
			width: 402px;
			margin-top: 2px;
			}
			
		#column-three-wide {
			width: 747px;
			margin-top: 5px;
			}
				

      
/* Homepage
---------------------------------------------------------- */

		#column-one-home h1 {
			margin-bottom: 20px;
			padding-top: 10px;
			font-size: 110%;
			line-height: 22px;
			font-weight: normal;
			}

      /* Intro paragraph  on home page*/
      #column-one-home > p {
      font-size: 110%;
      line-height: 1.25em;
      padding-top: 0.5em;
      margin-bottom: 1.25em;
      }
      /* Ordering info (Notice) */
      #column-one-home h2 {
      font-weight: bolder;
      font-size: 105%;
      }
				
		.call-action {
			float: left;
			padding: 8px 10px 4px 10px;
			width: 192px;
			background: #FF7D58 url("http://www.environmentyukon.ca/maps/media/layout/bg-call-action.png") no-repeat top left;
			color: #FFF;
			font-size: 85%;
			text-align: center;
			}
			
			.call-action span {
				margin-left: 10px;
				padding-left: 18px;
				width: 18px;
				height: 14px;
				background: url("http://www.environmentyukon.ca/maps/media/layout/bg-call-action-arrow.png") no-repeat 0 0;
				}
			
		.call-action-bottom {
			float: left;
			width: 212px;
			height: 7px;
			background: #FF7D58 url("http://www.environmentyukon.ca/maps/media/layout/bg-call-action-bottom.png") no-repeat 0 0;
			}
				
		#column-two-home {
			float: right;
			margin-right: 10px;
			padding: 30px 25px;
			width: 650px;
			background: #628495 url("http://www.environmentyukon.ca/maps/media/layout/bg-column-two-home.png") no-repeat 0 0;
			}
      
      #column-two-home a:link, #column-two-home a:visited  { border: 2px solid transparent; background-color:transparent;}
      #column-two-home a:hover { border: 2px solid #fdb813; background-color:transparent;}
 
 /*      .hover_border a:hover { border: 3px solid #fdb813; background-color:transparent;}
      .hover_border a:link, .hover_border a:visited { border: 3px solid transparent; background-color:transparent;}
  */     
			.note {
				float: right;
				margin: 15px 30px 10px 0;
				width: 600px;
				text-align: right;
				font-size: 75%;
				}
				
				.note p {
					float: right;
					margin-bottom: 10px;
					line-height: 14px;
					width: 190px;
					color: #624855;
					}
			
		#column-two-home-bottom {
			float: right;
			margin-right: 10px;
			width: 700px;
			height: 8px;
			background: #628495 url("http://www.environmentyukon.ca/maps/media/layout/bg-column-two-home-bottom.png") no-repeat 0 0;
			}
			
			.intro-map-type {
				float: left;
				width: 197px;
				margin-right: 3.5%;
				color: #FFF;
				}
				
				.intro-map-type h2 {
					margin: 15px 5px 10px 5px;
					font-weight: bold;
					font-size: 85%;
					line-height: 16px;
					background: #48616F;
					padding: 2px 5px;
					}
					
				.intro-map-type p {
					margin: 0 10px 10px 10px;
					font-size: 85%;
					line-height: 16px;
					}
				
/* 				.intro-map-type a:link, .intro-map-type a:visited {
					color: #FFF;
					}
 */					
/* 				.intro-map-type h2 a:link, .intro-map-type h2 a:visited {
					display: block;
					}
 */
            .intro-map-type a {display:block; color: white;}
					
/*				.intro-map-type h2 a:hover, .intro-map-type h2 a:active {
					color: #FF987C;
					}
*/				
				#intro-last {
					margin-right: 5px;
					}
				
			
/* Text pages
---------------------------------------------------------- */
#wrap-two div.page-column 	{
position:relative;
left:12%;
}
		
			.page-column, .page-column-wide {
/* 				float: left;
				margin-right: 30px;
				width: 250px;
 */				}
				
			.page-column-wide {
				margin-right: 30px;
				width: 450px;
				}
				
				.page-column h1, .page-column-wide h1 {
					margin-bottom: 5px;
					font-size: 105%;
					line-height: 20px;
					font-weight: bold;
					}
					
					.page-column h1 em, .page-column-wide h1 em {
						font-weight: normal;
						}
				
			.page-text {
				float: left;
				/* margin-bottom: 10px; */
            margin: 1em;
            width: 25em;
				}
				
			.page-column-wide .page-text {
				width: 450px;
				}
					
				.page-text h2 {
					margin-top: 10px;
					font-size: 100%;
					line-height: 18px;
					}
					
				.page-text p {
					font-size: 85%;
					line-height: 16px;
					margin-bottom: 10px;
					}
					
					.page-column-wide p {
						font-size: 85%;
						line-height: 16px;
						margin-bottom: 10px;	
						}
					
				.page-text ul {
					font-size: 85%;
					line-height: 16px;
					margin-bottom: 10px;
					}
					
					.page-text li {
						float: left;
						margin-right: 5px;
						}
						
				.pagination {
					font-size: 90%;
					margin-top: 20px;
					}
					

/* Map pages
---------------------------------------------------------- */

	#sub-nav {
		float: left;
		width: 168px;
		border-top: 1px solid #CDD8DA;
		font-size: 85%;
		}
		
		#sub-nav li {
			border-bottom: 1px solid #CDD8DA;
			line-height: 16px;
			}
               
					
	#map-navigation {
		float: left;
		margin-left: -15px;
		}
					
	#map-navigation p, #secondary-text-navigation p {
		padding: 0 30px;
		/* font-size: 85%; */
		line-height: 1.2em;
		margin-bottom: 15px;
		font-weight: normal;
		}
		#secondary-text-navigation ul {
/*			float: left; */
			margin: 0 15px 20px 30px;
/* 			width: 295px; */
/*          max-width: 27em; */
			border-top: 1px solid #CDD8DA;
			font-size: 90%;
			}
      /* wrap sooner when on detail page, allow for floated map on right  */
      #template-view-detail #secondary-text-navigation ul {
         max-width: 25em;
         }

			#secondary-text-navigation li {
				border-bottom: 1px solid #CDD8DA;
				line-height: 16px;
				}
			
		
	#map-box h2 {
		margin: 0 0 10px 10px;
		font-size: 120%;
		line-height: 20px;
		font-weight: bold;
		color: #412F38;		
		}
		
		#column-three-wide #map-box h2 {
			margin: 0 0 0 30px;
			}
		
		#map-frame {
			float: left;
			width: 402px;
			background: url("http://www.environmentyukon.ca/maps/media/layout/bg-map-frame.png") no-repeat top left;
			font-size: 90%;
			text-align: center;
			}

   /* Stop using orange link bars */
   #barlink a:link,
	#barlink a:visited, 
	#barlink a:hover,
	#barlink a:active {
      color: #628495;
      background: transparent;
      padding: 0;
      display: inline;
      margin: 0;
/* 		padding: 3px 20px;
		display: block;
		background: url('/maps/media/layout/menu.gif') repeat-y 0 0;
		margin-top: 1px;
 */	}
	#barlink a:hover,
	#barlink a:active {
/* 		background: #fdb813 url('/maps/media/layout/menu_over.gif') repeat-y 0 0;
 */		color: white;
      background: #fdb813;
      }

		
		#map-frame-bottom {
			float: left;
			width: 402px;
			height: 10px;
			background: url("http://www.environmentyukon.ca/maps/media/layout/bg-map-frame-bottom.png") no-repeat 0 0;			
			}
			
		#tab-zoom-frame {
			float: left;
			margin: 0 10px 0 0;
			width: 727px;
			background: url("http://www.environmentyukon.ca/maps/media/layout/bg-zoom-full-tab-frame.png") no-repeat top left;
			font-size: 80%;
			text-align: center;		
			}

		#tab-zoom-frame-bottom {
			float: left;
			margin: 0 10px 10px 0;
			width: 727px;
			height: 8px;
			background: url("http://www.environmentyukon.ca/maps/media/layout/bg-zoom-full-tab-frame-bottom.png") no-repeat 0 0;			
			}
			
		#tab-frame {
			float: left;
			margin: 10px 10px 0 10px;
			width: 381px;
			background: url("http://www.environmentyukon.ca/maps/media/layout/bg-tab-frame.png") no-repeat top left;
			font-size: 90%;
			text-align: center;		
			}

		#tab-frame-bottom {
			float: left;
			margin: 0 10px 0 10px;
			width: 381px;
			height: 8px;
			background: url("http://www.environmentyukon.ca/maps/media/layout/bg-tab-frame-bottom.png") no-repeat 0 0;			
			}
			
			.tabNavigation, .download-pdf {
				float: left;
				margin: 8px 0 2px 40px;
				font-weight: bold;
				}
				
				.download-pdf {
					float: left;
					margin: 8px 0 2px 0;
					}
					
			#zoom-full .tabNavigation, #zoom-full .download-pdf {
				float: left;
				margin: 8px 0 2px 250px;
				font-weight: bold;
				}
				
				#zoom-full .download-pdf {
					float: left;
					margin: 8px 0 2px 0;
					}
			
			.tabNavigation li, .download-pdf li {
				float: left;
				margin: 0 8px;
				}
				
.tabNavigation li a.selected, .download-pdf li a.selected {
color: goldenrod; 
background-color:transparent;
}
.tabNavigation li a:hover, .download-pdf li a:hover {
color:white;
background:#fdb813;
}
				
				#t-preview span {
					margin-right: 4px;
					padding: 4px 0 4px 12px;
					background: url("http://www.environmentyukon.ca/maps/media/layout/icon-tab-frame-preview.png") no-repeat 0 50%;
					}
					
				#t-zoom span {
					margin-right: 4px;
					padding: 4px 0 4px 12px;
					background: url("http://www.environmentyukon.ca/maps/media/layout/icon-tab-frame-zoom.png") no-repeat 0 50%;
					}
					
				#t-download span {
					margin-right: 4px;
					padding: 4px 0 4px 12px;
					background: url("http://www.environmentyukon.ca/maps/media/layout/icon-tab-frame-download.png") no-repeat 0 50%;
					}
					
		#alert {
			float: left;
			width: 378px;
			margin: 0 10px 10px 0;
			text-align: center;
			font-size: 90%;
			background-color: #FFFFCC;
			border: 1px solid #FFCE8A;
			color: #412F38;
			}
			
			#alert p {
				padding: 7px 10px 9px 10px;
				}
				
			#alert a {
				display: block;
				padding: 4px 0 0 2px;
				}
					
		#preview img {
			float: left;
			margin: 0 1px;
			}
			
		#zoom {
			float: left;
			width: 400px;
			margin: 10px 10px 0 10px;
			}
			
		#zoom-max {
			float: left;
			margin: 10px 10px 0 0;
			width: 381px;
			background: url("http://www.environmentyukon.ca/maps/media/layout/bg-zoom-max.png") no-repeat top left;
			font-size: 90%;
			text-align: center;
			}
			
			#zoom-max p {
				margin: 4px 0 2px 0;
				font-weight: bold;
				}
				
			#zoom-max a {
				display: block;
				padding: 4px 0 0 2px;
				}

		#zoom-max-bottom {
			float: left;
			margin: 0 10px 0 0;
			width: 381px;
			height: 8px;
			background: url("http://www.environmentyukon.ca/maps/media/layout/bg-zoom-max-bottom.png") no-repeat 0 0;
			}
			
		#zoom-full {
			float: left;
			margin: 0 10px;
			padding: 10px;
			width: 727px;
			background: url("http://www.environmentyukon.ca/maps/media/layout/bg-zoom-full.png") no-repeat top left;	
			}

		#zoom-full-bottom {
			float: left;
			margin: 0 10px;
			width: 747px;
			height: 8px;
			background: url("http://www.environmentyukon.ca/maps/media/layout/bg-zoom-full-bottom.png") no-repeat 0 0;			
			}
			
			
/* Map navigation
---------------------------------------------------------- */

	#map-navigation {
		float: left;
		margin: 12px 0 20px 10px;
		}
		
		#map-navigation h2 { 
			margin: 0 0 15px 0;
			font-size: 130%;
			line-height: 18px;
			color: #888;
			}
			
		#map-navigation li {
			margin: 0;
			padding: 0;
			list-style: none;
			display: block;
			position: absolute;
			}

			#map-navigation a {
				display: block;
            background: transparent; /* override inherited barlink class */
				}
				
			/* hover tooltip on index maps */
         div#qTip {	
				padding: 5px 7px 7px 7px;
				display: none;
            color: black;
            background-color: #D4DEDF;
				font-size: 85%;
				text-align: left;
				position: absolute;
				z-index: 1000;
				}
				
		#loader-oc {
			width: 330px;
			height: 380px;
			overflow: hidden;
			}
			
			#loader-oc.loading {
				background: url("http://www.environmentyukon.ca/maps/media/layout/ajax-loader.gif") no-repeat center center;
				}
				
		#loader-adm {
			width: 330px;
			height: 384px;
			overflow: hidden;
			}
			
			#loader-adm.loading {
				background: url("http://www.environmentyukon.ca/maps/media/layout/ajax-loader.gif") no-repeat center center;
				}
			
					
/* Footer
---------------------------------------------------------- */
#footer {
	margin-left:auto;
	margin-right:auto;
	width:60em;
	text-align:center;
	}
#footer p{
	clear: both;
	}
		#footer ul {
			float: left;
			margin-bottom: 5px;

			}
			
			#footer li {
				float: left;
				margin-right: 15px;
				line-height: 16px;
				}
		.legal {
			font-size: 90%;
			}
