
/*********************************

CSS Styles for eloka-arctic.org

Authors S.Truex and T.Tran

created at NSIDC, May 2008

*********************************/

/********************

Global Styles

********************/

body {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:80%;
	background: #FFFFFF;
}



img {
	border: none;
	/*border:1px solid #ADA47D;*/
}



.reset {
	padding: 0;
	margin: 0;
}


.clear {
	clear: both;
}

.floatLeft {
	float: right;
	padding: 0;
	margin: 0;
}

.floatLeft {
	float: left;
	padding: 0;
	margin: 0;
}

/*******************

global font styles

*******************/

h1 {
	margin: .5em;
	margin-left: 0;
}

h2, h3, h4, h5, h6 {
	margin: .5em;
	margin-left: 0;
}

h1 {
	font-size:150%;
	font-weight: normal;
}

h2 {
	font-size:115%;
	font-weight: normal;
	/*margin-left: 5px;*/
}

h3 {
	font-size:105%;
	font-weight: normal;
	/*margin-left: 10px;*/
}

h4 {
	font-size:103%;
	font-weight: normal;
	/*margin-left: 15px;*/
}

h5 {
	font-size:102%;
	font-weight: normal;
	/*margin-left: 20px;*/
}

h6 {
	font-size:100%;
	font-weight: normal;
	/*margin-left: 25px;*/
}

p {
	margin-left: 0;
}

.required {
	color: #990000
}

/********************

global link styles

*********************/

a {
	/*color: #0198CD;*/ /* old link color */
	color: #036e93;
}

a:hover {
	text-decoration:none;
}

/****************

global header 

*****************/

#header {
	width:100%;
	height:95px;
	position: relative;
}

#header .search {
	position: absolute;
	right: 0;
	top: 35px;
	_float:right;
	_width:15%;
}


#logo {
	float:left;
	height:auto;
	border:0
}

/*****************************

global wrappers & containers 

*****************************/

#wrapper {
	max-width:980px;
	min-width:763px;
	margin:auto;
	position: relative;
	overflow:hidden;
	//margin-bottom:3px;
	_height:100%; /*6/2/08 set this to allow secondarycontentdivider to go across entire screen in IE6, commented out all _top:-17 in stylesheet by TT*/
}

#content {
	margin-top: 3px;
	margin-bottom: 3px;
	text-align: center;
	width: 100%;
	height: 337px;
}

#contentDivider {
	clear:both;
	background:#d5c1a8 url('/images/elokabottomend.gif') no-repeat right bottom;
	padding:12px;
	//margin-top:3px;
}

/*****************

Main navigation

*****************/

.first {
	border-top: 1px solid #B5AE9C;
}

/* highlights the current page on the navbar */
/*	background-color:#c9282d; /*shade of red*/
/*	color:#FFFFFF; */

ul#communitiesSubnav {
	position: relative;
	left: 90px;
}

ul#communitiesSubnav li a {
	width: 11em;
}

#mainNav {
	height: 3.2em;
	margin:0em;
        padding: 0em;
	clear:both;
	list-style:none;
	background: #760b1b url('/images/elokanavend.gif') top right no-repeat;
}

/* highlight main navigation item associated with the current page */
body#communities li.communities,
body#partners li.partners,
body#resources li.resources,
body#news li.news,
body#about li.about {
    background-color: #c9282d; /* bgcolor of main menu items on hover */
}

/**************************
 drop-down menus in main navigation bar
 *************************/
 
ul#nav {
    background: inherit;
    list-style: none;
    white-space: nowrap;
    margin: 0em;
    margin-left: 7em;
    padding: 0em;
    border: none;
    border-left: solid 1px white;
    width: auto;
    height: 100%;
    color: white;
}

ul#nav li {
    display: block;
    float: left;
    text-align: center;
    background-color: inherit;
    color: inherit;
    font-size: inherit;
    margin: 0em;
    padding: 0em 0.8em;
    border-top: none;
    border-right: solid 1px white;
    border-bottom: none;
    border-left: none;
    position: relative;
    width: auto;
    height: 100%;
}

ul#nav li:hover {
    color: inherit;
    background-color: #c9282d; /* bgcolor of main menu items on hover */
}

ul#nav li a {
    display: block;
    background-color: inherit;
    color: inherit;
    text-decoration: none;
    padding: 0em;
    margin: 0em;
    line-height: 3.2em;
    height: auto;
    width: auto;
}

ul#nav li a:hover {
    background-color: #c9282d; /* bgcolor of main menu items on hover */
    color: inherit;
    text-decoration: none;
}

/* this sets lists within lists to be menus which are hidden */
/* until the user mouses over the "parent" list item         */
ul#nav li ul {
    display: none;
    position: absolute;
    font-weight: normal;
    margin: 0em;
    padding: 0em;
    width: 12em;
    border: none;
    border-top: solid 1px white;
    z-index: 100;
}

/* sets an unordered list which is a child of another list item */
/* to be positioned at the upper left of the parent list item */
ul#nav li>ul {
    top: 3.2em;
    left: -1px;
}

/* displays the child list when the user mouses over the parent list item */
ul#nav li:hover ul {
    display: block;
}

ul#nav li li {
    border-right: 1px solid #B5AE9C;
    border-left: 1px solid #B5AE9C;
    border-bottom: 1px solid #B5AE9C;
    background-color: white;
    color: black;
    text-align: left;
    white-space: normal;
    font-weight: normal;
    line-height: 1.6em;
    margin: 0em;
    padding: 0.2em;
    width: 100%;
    height: auto;
    z-index: 100;
}

ul#nav li li a {
    display: block;
    padding: 0.3em;
    margin: 0em;
    border: none;
    background-color: inherit;
    color: black;
    line-height: 1.2em;
}

ul#nav li li a:hover {
    background-color: #D5C1A8!important; /* bgcolor of submenu items on hover */
    color: black;
}

ul#nav li li:hover {
    background-color: #D5C1A8!important; /* bgcolor of submenu items on hover */
    color: black;
}

/**********************************************************
Styles specific to the Features section on the homepage
**********************************************************/

#homeFeaturesContainer {
	/*_position: relative;*/
	margin-top:15px;
	/*width:100%;*/
	margin:auto;
	border-bottom:1px solid #ADA47D;	
	height:16px;	
	max-width:980px;
	min-width:763px;
	padding: 0 0 4px 0;
}

#homeFeaturesContainer h1 {
	color:#790013;
	font-size:117%;
	font-weight: normal;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	white-space: none;
}


#homeFeaturesInnerContainer {
	_position: absolute;
	width:100%;
	border-bottom:1px solid #ADA47D;
	height: 118px;
	//height: 118px;
	padding: 0 0 0 13px;
	margin: 7px 0 0 0;
	//margin: 0 0 0 0;
}

.homeFeaturesText {
	font-size: 85%;
	padding: 15px 7px 7px 0;
	margin: 0;
}

/******************************************************
Styles specific to the Current Features on the homepage
*******************************************************/
#currentFeaturesContainer {
	width:49%;
	float:left;
}

.homeCurrentFeaturesHeading{
	padding:0;
	margin:0;
}

.homeCurrentFeaturesText{
	padding: 0 7px 0 0;
	//padding: 0;
	margin:0;
	/*font-size:smaller;*/
}

.homeCurrentFeatureImage {
	float:right;
	position: relative;
	/*top: 1px;*/
	top: 3px;
	padding:0;
	margin:0 0 0 10px;
	//margin:0 0 0 7px;
	border-right:1px solid #ADA47D;
	border-left:1px solid #ADA47D;
}

/**************************************************
Styles specific to News and Events on the homepage
***************************************************/
#newsEventsContainer {
	width:49%;
	float:right;
}

.homeNewsEventsHeading {
	padding:0;
	margin:0;
}

.homeNewsEventsText {
	padding:0 0 0 0;
	margin:0;
	/*font-size:smaller;*/
}

img.homeNewsEventsImage{
	float:right;
	position: relative;
	/*top: 0;*/
	top: 2px;
	padding:0;
	margin:0 0 0 7px;
	border:0;
}

/**********************************

Styles specific to secondary pages

**********************************/


/**********************

secondary containers & wrappers 

**********************/

#secondaryWrapper {
	background: #b7a06c;
	display: block;
	width: 100%;
	margin: 3px 0px 3px 0;
	padding: 0;
	float: left;
	overflow: hidden;
}

#secondaryWrapper img {
	border: 0;
}


#secondaryHeadingContainer {
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	border-bottom: 3px solid #FFFFFF;
	height: 267px;
	overflow: hidden;

}

#secondaryMapContainer {
	position: relative;
	/*top: -1px;
	left: -1px;*/
	float: left;
	width: 30%;
	margin: 0;
	padding: 0;
	z-index: 10;
	_width: 28%;
	/*_top:-17px;*/
	_left:-13px;	
	background:#FFF;
	padding-bottom:1px;
	text-align:center;
	border:0;
	//padding-bottom:6px;
}

#secondaryMapContainer br {
	margin-top:236px;
}

/*#secondaryMapContainer iframe {
	border-right: 3px solid #FFFFFF;
}*/

#secondaryPhotoContainer {
	position: relative;
	float: right;
	width: 70%;
	_width: 71%;
	margin: 0;
	padding: 0;
	/*_top:-17px;*/
	_left:-7px;
}

#secondaryPhotoCaptionContainer {
	background: #74736e; 
	width: 100%; 
	position: relative; 
	top: 225px; 
	opacity: .7; 
	filter: alpha(opacity=70); 
	height: 50px; 
	vertical-align: text-top; 
	padding: 5px;
	//position:absolute;
	//height:32px;

}

#secondaryPhotoCaption {
 	position: absolute; 
 	z-index: 10; 
 	color: #ffffff;
}

#secondaryContent {
	position: relative;
	background-color: #b7a06c;
	vertical-align: top;
	margin: 0 3px 0 0;
	padding: 0 10px 10px 10px;
	width: 55%;/* width if laid out in 3 cols */
	//width:54%;
	float: left; /* used if laid out in 3 cols */
	_width:52%;
	/*_top:-17px;*/
}

#secondaryContentNoNav {
	position: relative;
	background-color: #b7a06c;
	vertical-align: top;
	margin: 0 3px 0 0;
	padding: 0 10px 10px 75px;
	width: 63%;/* width if laid out in 3 cols */
	//width:62%;
	float: left; /* used if laid out in 3 cols */
	_width:60%;
	/*_top:-17px;*/
}

#secondaryContentNoSidebar {
	position: relative;
	background-color: #b7a06c;
	vertical-align: top;
	margin: 0 3px 0 0;
	padding: 0 10px 10px 20px;
	width: 75%;/* width if laid out in 3 cols */
	//width:74%;
	float: left; /* used if laid out in 3 cols */
	_width:72%;
	/*_top:-17px;*/
}

#secondaryContentOneCol {
	position: relative;
	background-color: #b7a06c;
	vertical-align: top;
	margin: 0 3px 0 0;
	padding: 0 10px 30px 75px;
	width: 85%;/* width if laid out in 3 cols */
	//width:84%;
	float: left; /* used if laid out in 3 cols */
	_width:82%;
	/*_top:-17px;*/
}

#secondaryContentNews {
	position: relative;
	background-color: #b7a06c;
	vertical-align: top;
	margin: 0 3px 0 0;
	padding: 0 10px 30px 75px;
	width: 65%;/* width if laid out in 3 cols */
	//width:64%;
	float: left; /* used if laid out in 3 cols */
	_width:62%;
	/*_top:-17px;*/
}

#secondaryToolboxWrapper {
	position: relative;
	top: -3px;
	background: #FFFFFF;
	width: 25%;
	padding-left: 3px;
	padding-right:1px;
	//padding-right:2px;
	float: right;
	margin-bottom:-9999px;
	padding-bottom:9999px;
	_padding-right:12px;
	/*_top:-17px;*/
	_padding-top:3px;
}

#secondaryToolbox {
	float: right;
	vertical-align: top;
	position: relative;
	/*_top: -3px;*/
	background: #FFFFFF;
	/*padding-bottom: 3999px;
	margin-bottom: -3999px;*/
	margin-bottom: -3px;
	width: 100%;
}

#secondaryToolboxInline {
	float: right;
	vertical-align: top;
	position: relative;
	background: #FFFFFF;
	padding: 0 0 3px 0;
	margin: 0;
	width: 25%;
	border-left: 2px solid #FFFFFF;
}

#secondaryToolboxInlineGradient {
	float: right;
	vertical-align: top;
	position: relative;
	background: url(/images/toolboxGradient1x800.jpg) top left repeat-x;
	padding-bottom: 3999px;
	margin-bottom: -3999px;
	_padding-bottom: 800px;
	_margin-bottom: -800px;
	width: 100%;
	border-left: 2px solid #FFFFFF;
}

#gradientLarge {
	float: right;
	vertical-align: top;
	position: relative;
	background: url(/images/toolboxGradient1x1600.jpg) top left repeat-x;
	padding-bottom: 3999px;
	margin-bottom: -3999px;
	_padding-bottom: 800px;
	_margin-bottom: -800px;
	width: 100%;
	border-left: 2px solid #FFFFFF;
}


/*********************

secondary navigation 

*********************/


#secondaryNav {
	position: relative;
	float: left;
	background: #b7a06c;
	width: 12%;
	padding: 10px 10px 10px 20px;
	margin: 3px 3px 3px 0;
}

#secondaryNav ul {
	list-style-type: none;
	padding: 0;
	margin: 13px 0 0 0;
}

#secondaryNav li {
	padding: 0 0 17px 0;
}

#secondaryNav a {
	color: #FFFFFF;
	text-decoration: none;
}

#secondaryNav a:hover {
	color: #FFFFFF;
	text-decoration: underline;
}

li#secondaryNavIcon {
	padding: 0;
	margin: 0 0 0 10px;
}

#secondaryNav img {
	border: 0;
}

ul#leftSubnav li {
	font-size: .95em;
	padding-left: 12px;
}

/*
#communities ul#leftSubnav li a {
	font-size: .95em;
	padding-left: 12px;
}
*/


/**************

secondary images

**************/


.secondaryImage {
	float: right;
	border: none;
	padding: 0 0 0 3px;
	vertical-align: top;
	width:100%;
	/*border: 1px solid #CCCCCC!important;*/
}

.featureImage {
	border: 1px solid #b7a06c;
}

.secondaryFeatureImage {
	border: 1px solid #b7a06c!important;
	float: right;
	padding: 0;
	margin: 0 0 5px 5px;
}

/*
#bottomFeature {
	margin-bottom: 0;
}

.secondaryHeadingMap {
	border: 0;
	width: 100%;
	height: 100%;
	border-right: 3px solid #FFFFFF;
	min-width: 247px;
}
*/

.secondaryHeadingPhoto {
	border: 0;
	width: 100%;
	//height:267px;
	float: right;
	/*max-width: 800px;*/
}

/*************

font styles 

*************/

#secondaryContent > h1, h2, h3, h4, h5, h6 {
	color: #FFFFFF;
}

/* next several rules for IE6, which doesn't support descendant selectors */

#secondaryContent h1 {
	color: #FFFFFF;
}

#secondaryContent h2 {
	color: #FFFFFF;
}

#secondaryContent h3 {
	color: #FFFFFF;
}

#secondaryContent h4 {
	color: #FFFFFF;
}

#secondaryContent h5 {
	color: #FFFFFF;
}

#secondaryContent h6 {
	color: #FFFFFF;
}

#secondaryContentNoNav > h1, h2, h3, h4, h5, h6 {
	color: #FFFFFF;
}

/* next several rules for IE6, which doesn't support descendant selectors */

#secondaryContentNoNav h1 {
	color: #FFFFFF;
}

#secondaryContentNoNav h2 {
	color: #FFFFFF;
}

#secondaryContentNoNav h3 {
	color: #FFFFFF;
}

#secondaryContentNoNav h4 {
	color: #FFFFFF;
}

#secondaryContentNoNav h5 {
	color: #FFFFFF;
}

#secondaryContentNoNav h6 {
	color: #FFFFFF;
}

#secondaryContentNoSidebar > h1, h2, h3, h4, h5, h6 {
	color: #FFFFFF;
}

/* next several rules for IE6, which doesn't support descendant selectors */

#secondaryContentNoSidebar h1 {
	color: #FFFFFF;
}

#secondaryContentNoSidebar h2 {
	color: #FFFFFF;
}

#secondaryContentNoSidebar h3 {
	color: #FFFFFF;
}

#secondaryContentNoSidebar h4 {
	color: #FFFFFF;
}

#secondaryContentNoSidebar h5 {
	color: #FFFFFF;
}

#secondaryContentNoSidebar h6 {
	color: #FFFFFF;
}

#secondaryContentOneCol > h1, h2, h3, h4, h5, h6 {
	color: #FFFFFF;
}

/* next several rules for IE6, which doesn't support descendant selectors */

#secondaryContentOneCol h1 {
	color: #FFFFFF;
}

#secondaryContentOneCol h2 {
	color: #FFFFFF;
}

#secondaryContentOneCol h3 {
	color: #FFFFFF;
}

#secondaryContentOneCol h4 {
	color: #FFFFFF;
}

#secondaryContentOneCol h5 {
	color: #FFFFFF;
}

#secondaryContentOneCol h6 {
	color: #FFFFFF;
}

#secondaryContentNews > h1, h2, h3, h4, h5, h6 {
	color: #FFFFFF;
}

/* next several rules for IE6, which doesn't support descendant selectors */

#secondaryContentNews h1 {
	color: #FFFFFF;
}

#secondaryContentNews h2 {
	color: #FFFFFF;
}

#secondaryContentNews h3 {
	color: #FFFFFF;
}

#secondaryContentNews h4 {
	color: #FFFFFF;
}

#secondaryContentNews h5 {
	color: #FFFFFF;
}

#secondaryContentNews h6 {
	color: #FFFFFF;
}

/* 
#secondaryContent h1, #secondaryContentNoNav h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 150%;
	text-align: left;
	padding-top: 0;
	color: #FFFFFF;
}

#secondaryContent h2, #secondaryContentNoNav h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 130%;
	text-align: left;
	padding-top: 0;
	color: #FFFFFF;
}
*/

.captionText {
	position: relative;
	top: -7px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 75%;
	color: #666666;
	padding: 0 7px 0 7px;
	margin: 0;
}

.featureText {
	position: relative;
	top: -7px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 80%;
	color: #000000;
	padding: 0 7px 0 7px;
	margin: 0;
	float: left;
	/*white-space: nowrap;
	max-width: 225px;*/
}

/*********************************

secondary toolbox (right sidebar)

**********************************/

.secondaryToolboxHeading {
	position: relative;
	top: -16px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-weight: bold;
	color: #750c1a;
	background: url(/images/secondaryFeatureHeading_bg.jpg) top left repeat-x;
	margin: 0;
	padding: 10px 0 10px 10px;
	/*border-top: 1px solid #b7a06c;*/
	//border-top: 0;
	border-bottom: 1px solid #b7a06c;
	//height: 15px;
}

.secondaryImageCaptionContainer {
	width: 99%;
	border: 1px solid #CCCCCC;
	background: #f6f7fa;
	float: right;
	margin: 3px 0 0 2px;
	padding: 0;
}

.secondaryFeatureContainer {
	width: 99%;
	border: 1px solid #b7a06c;
	float: right;
	margin: 3px 0 0 2px;
	vertical-align: top;
}

/*****************************

styles for News & Events page

*****************************/

#newsContentContainer {
	float: left;
	width: 100%; 
	margin-right: 0;
}

#eventsContentContainer {
	float: right; 
	width: 30%; 
	background: #ded5b4; 
	/*border: 1px solid #72491d;*/ 
	padding: 7px;
	margin: 0 0 10px 10px;
}

#eventsContentContainer h1,
#eventsContentContainer h2,
#eventsContentContainer h3 {
	color: #72491d;
}


/****************

Form Styles 

****************/

fieldset {
	border: 0;
}

#searchLabel {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 80%;
	color: #2a2b39;
	margin: 0 0 5px 0;
}

/****************************************
Styles specific to the Footer
****************************************/

#footer{
	max-width:950px;
	min-width:730px;
	margin:auto;
	clear:both;
	padding-top:5px;
	font-size:x-small;
	color:#A3A3A3;
	font-style:italic;
}

#home #footer {
	//padding-top:110px;
}

#footer p{
	width:78%;
	float:left;
}

#footer .contact {
	float:right;
	padding-top:10px;
	//padding-top:0;
	margin:0;
}

#footer a {
	color:#A3A3A3;
}
	
/***********************************


test and experimental styles below

move or delete before concatenation
 

**********************************/

#secondaryContentDivider {
	clear:both;
	background: #d5c1a8 url('/images/elokabottomend.gif') no-repeat right bottom;
	//background-color: #d5c1a8;
	padding-bottom:25px;
	//padding-bottom:12px;
	max-width:980px;
	min-width:766px;
	margin:auto;
	//height: 21px;
}

#contentDividerBackground {
	//position: relative;
	//padding: 0;
	//margin: 0;
	//float: right;
	//background: url('/images/elokabottomend.gif') top right no-repeat;
	//width: 110px;
	//height: 21px;
}
