/***********************GLOBAL SETTINGS***********************/
/* Changes within this document will apply to the whole site */
/*************************************************************/

body {
        background: #e7e7e2;
	padding: 0; 
	margin: 0;
	text-align: center; /*part 1 of centering hack*/
}

/*global font family*/
body, p, h1, h2, h3, h4, h5, h6, address {
	font-family: arial, helvetica, verdana, sans-serif;
	/*color: #666;*/
	color: #444444;
	font-size: 12px;
}

img {
	border: 0;
}

a {
	color: #cf6914;
	text-decoration: none;
}

#container {
	width: 759px;
	background: #fff url(../i/container_background4.png) repeat-y;
	text-align: left; /*part 2 of centering hack*/
	margin: 0 auto;
	padding: 0 6px;
	/*position: relative;*/
	min-height: 100%;
	height: 100%;
	voice-family: "\"}\"";
    voice-family: inherit;
    height: auto;
}
html>body #container {
	height: auto;
}

.mainheader { 
	font-size: 12pt; font-weight: bold; color: #930; 
	}

/*//////////////////////SETTINGS FOR NAV//////////////////////*/
#nav {
	/*background: #fff url(../i/menu_shadow.gif) no-repeat -2px -2px;*/
	background: #bbc9cf url(../i/menu_shadow_3.gif) repeat-x bottom;
	margin: 0;
	padding: 0;
	width: 759px;
	height: 105px; 
	position: relative;
	z-index: 10;
}
html > body #nav {
	position: static;
}

#nav div#logo {
	height: 61px;
	float: left;
	display: inline;
	position: relative;
	left: -14px;
	top: 4px;
}


/*settings for all lists(menus) in nav*/
#nav ul {
	display: block;
	width: 759px;
	border: 0px;
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

/*settings for all list(menu) items in nav*/
#nav li {
	display: block;
	float: left;
	margin: 0px;
	width: auto;
	font-weight: bold;
}

/*settings for all links in nav w/ important boxmodel hack*/
#nav ul li a, #nav ul li a:visited {
	display: block;
	padding: 8px 0 0 10px;
	width: 93px;
	height: 30px;
	voice-family: "\"}\""; 
	voice-family:inherit;
	width: 82px;
	height: 22px;
}

/*settings for topnav in nav w/ important boxmodel hack*/
#nav #topnav {
	font-size: 10px;
	width: 666px;
	float: right;
	display: inline;
	padding-top: 18px; 
	/**margin-left: -14px;**/
	/*overflow: hidden;*/
	voice-family: "\"}\""; 
	voice-family: inherit;
	height: 30px;
}


/*settings for topnav links in nav*/
#nav #topnav li a, #nav #topnav li a:visited {
        color: #444444;
        margin: 0 0 0 6px;
	width: auto; /*45px; originally 78px; added another link*/
        float: left;
}

#nav #topnav li a:hover, #nav #topnav li a:active {
	color: #222222;
}

.faces_nav #topnav {
	padding-top: 14px ! important;
}

  
/*settings for second nav in nav*/
#nav #secondnav {
	display: block;
	height: 30px;
	border-top: 1px solid #97aeb7;
	clear: right;
    text-align: left;
}

#nav #secondnav li {
	position: relative;
}

#nav #secondnav li a {
	border-right: 1px solid #bdb9ae;
	font-size: 9pt;
}
#nav #secondnav li a:hover {
	background: #cdcbc0;
}

#nav #secondnav li.selected, #nav #secondnav li.selected:visited {
	color: #444;
	background: #cdcbc0;
}

/*settings for first link in second nav w/ important boxmodel hack*/
#nav #secondnav li a.firstlink {
	width: 86px;
	voice-family: "\"}\""; 
	voice-family: inherit;
	width: 75px;
}

/*settings for last link (nr #8) in second nav w/ important boxmodel hack*/
#nav #secondnav li a.lastlink {
	border-right: 0;
	voice-family: "\"}\""; 
	voice-family: inherit;
}
#nav #secondnav li a.lastlink:hover {
	border-right: 1px solid #bdb9ae;
}

/*settings for dropdown navigation lists*/
#nav #secondnav li ul {
	display: none;
	position: absolute;
	top: 30px;
	left: -1px;
	width: 188px;
}
/*settings for last link (nr #8) in second nav w/ important boxmodel hack*/
#nav #secondnav li ul.short {
        width: 115px;
        border-right: 0;
        voice-family: "\"}\"";
        voice-family: inherit;
        width: 105px;
}
#nav #secondnav li ul.lesswidth {
	left: 0;
}
/*#nav #secondnav li ul.lesswidth2 {
	left: -1px;
}*/
/*#nav #secondnav li ul li {
	float: none;
	height: auto;
	padding: 0;
}*/
#nav #secondnav li>ul { /* to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left */
	top: auto;
	left: -1px;
}
#nav #secondnav li a:hover, #nav #secondnav li:hover ul, #nav #secondnav li.over ul {
	display: block; /* lists nested under hovered list items */
	z-index: 20;
}

#nav #secondnav li ul li a {
	border-top: 1px solid #97aeb7;
	color: #666666;
	background: #c6d3d8;
	display: block;
	width: 174px;
	padding: 3px 3px 3px 10px;
	height: auto;
	border-right: 0;
}
#nav #secondnav li ul.short li a {
        border-top: 1px solid #97aeb7;
        color: #666666;
        background: #c6d3d8;
        display: block;
        width: 105px;
        padding: 3px 3px 3px 10px;
        height: auto;
        border-right: 0;
}
/*settings for dropdown hover*/
#nav #secondnav li ul li a:hover, #nav #secondnav li ul li a:active {
	background: #dae3e7;
}

#nav #secondnav li ul.lesswidth, #nav #secondnav li ul.lesswidth li a, #nav #secondnav li ul.lesswidth2 li a {
	width: 166px;
}

#nav #secondnav li ul.short, #nav #secondnav li ul.short li a {
        width: 105px;
}


/*settings for the title box in nav w/ important boxmodel hack*/
#nav #title {
	padding-top: 5px;
	padding-left: 8px;
	padding-right: 2px;
	/*width: 179px;*/
	width: 60px;
	voice-family: "\"}\""; 
	voice-family: inherit;
	/*width: 169px;*/
	width: 50px;
}

#nav #title a, #nav #title a:visited {
	width: 40px;
	border: 0;
	padding: 0;
	margin: 0;
}

/*Settings for the search box in nav*/
#nav form {
	float: right;
	padding: 0;
	margin: 0;
	height: 15px;
	margin-top: 5px;   
}
/*Settings for the div in the faces version*/
#form_box {
    text-align: right;
}

/*Settings for the searchcontainer in nav*/
#nav #search_cont {
    display: inline;
}

#nav #search{
	/*width: 170px;*/
	width: 400px;
	float: right;
    
}
/*Settings for the searchfield in nav*/
#nav #searchfield {
	width: 104px;
	font-size: 10px;
	background: #f6f5f3; /**#e9e8e3;**/
	border: 1px solid #bdb9ae;
	padding: 2px 3px;
	margin-bottom: 5px;
    text-align: left;
}
/*Settings for Faces version of searchfield in nav*/
.quickSearchField {
	width: 104px;
	font-size: 10px;
	background: #f6f5f3; /**#e9e8e3;**/
	border: 1px solid #bdb9ae;
	padding: 2px 3px;
	margin-bottom: 5px;
}
/*Settings for the select box in nav*/
#nav #search select {
	font-size: 10px;
	/*background: #c9d6db;
	border: 1px solid #97aeb7;*/
	background: #f6f5f3; /**#e9e8e3;**/
	border: 1px solid #bdb9ae;
	margin-bottom: 5px;
    margin-left: 2px;
}
/*Settings for the searchbutton in nav*/
#searchbutton {
	/*position: absolute;
	top: 5px;
	left: 655px;*/
	width: 64px;
	height: 19px;
	/**line-height: 0;**/
    border:2px solid #bdb9ae;
    color: #383838;
    background-color: #f6f5f3;;
    font: bold 10px 'trebuchet ms',helvetica,sans-serif;
    vertical-align:top;
}
/*Settings for the Faces searchbutton in nav*/
.quickSearchButton {
	/*position: absolute;
	top: 5px;
	left: 655px;*/
	width: 64px;
	height: 19px;
    border:2px solid #bdb9ae;
    color: #383838;
    background-color: #f6f5f3;;
    font: bold 10px 'trebuchet ms',helvetica,sans-serif;
	/**line-height: 0;**/
    vertical-align:top;
    margin-left: 2px;
    
}
/*//////////////////////END SETTINGS FOR NAV//////////////////////*/

/*//////////////////////SETTINGS FOR HEADER//////////////////////*/

#breadcrumbs {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	padding: 20px 0;
	margin-left: 196px;


}
#breadcrumbs a {
	color: #666;
	margin: 0 2px;
}
#breadcrumbs a.selected {
	color: #930;
}

/*//////////////////////END SETTINGS FOR HEADER//////////////////////*/

/*//////////////////////SETTINGS FOR CONTENT//////////////////////*/
#content{
	clear: both;
	margin: 0;
	padding: 0;
	height: auto;
    min-height: 1%; /*ie mac 5.2 needs this*/
}

#content #rightcolumn h1, #content #rightcolumn h2, #content #rightcolumn h3, #content #rightcolumn h4, #content #rightcolumn h5, #content #rightcolumn h6 {
	display: block;
	margin: 4px 0 0 0; /*align with menu type*/
}

/*settings for links*/
#content a, #printer_friendly a,  #footer a {
	/*color: #888; 
	font-weight: bold;*/
	/*color: #96adb8;*/
	color: #2a568f;
	font-size: 12px;
	/*border-bottom: 1px dotted #96adb8;*/
	/*border-bottom: 1px dotted #2a568f;*/
}
#content a:hover, #printer_friendly a:hover #footer a:hover {
	/*text-decoration: underline;*/
	font-size: 12px;
	background: #feffbb;
}

/*settings for left nav in left column*/
#content #leftcolumn ul {
	padding: 0;
	margin: 0;
	border-top: 1px solid #ccc;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}
#content #leftnav li {
	border-bottom: 1px solid #ccc;
	list-style: none;
	letter-spacing: .5px;
	padding: 0;
}
#content #leftnav li a { 
	/*color: #888;*/
	color: #777;
	font-weight: bold;
	border: 0;
	width: 151px;
	padding: 3px 10px;
	display: block;
}
#content #leftnav li.selected a {
	color: #930;
	background: #f5f5f3;
	font-weight: bold;
}
/* This is an equivalent to the '>' modifier that isn't supported in IE */
/* Make sure everything that is set in the above block is "unset" below */
#content #leftnav li.selected * a {
	color: #777;
	background: #ffffff;
	font-weight: normal;
}
#content #leftnav li a:hover {
	background: #eeede8;
	text-decoration: none;
}

/*2, 3 or 4 column layout*/

#content #leftnav li ul {
	border: 0;
	margin: 2px 0;
}
#content #leftnav li ul li {
	border: 0;
}
#content #leftnav li ul li a { /* 2nd, 3rd, 4th level page */
	width: 146px;
	padding: 2px 5px 2px 0;
	margin: 0 0 0 20px;
	/*border-top: 1px solid #e6e6e6;*/
	display: block;
	font-weight: normal;
	font-size: 10px;
	letter-spacing: .25px;
}
#content #leftnav li ul li.selected a { /* 2nd, 3rd, 4th level page (selected) */
	border-top: 1px solid #edede7;
	border-bottom: 1px solid #edede7;
}
#content #leftnav li ul li a:hover { /* 2nd, 3rd, 4th level page (hover) */
	background: #eeede8;
}

#content #leftnav li ul li ul li a { /* 3rd level page */
	width: 136px;
	margin-left: 30px;
}
#content #leftnav li ul li ul li ul li a { /* 4th level page */
	width: 126px;
	margin-left: 40px;
}


/*leftcolumn and rightcolumn for two column layout*/
/*leftcolumn, maincolumn and rightcolumn for three column layout*/
/*left, middleleft, middleright and right for four column layout*/
#content #leftcolumn, #content #rightcolumn {
	float: left;
}

/*//////////////////////END SETTINGS FOR CONTENT//////////////////////*/

/*//////////////////////SETTINGS FOR PRINTER FRIENDLY LINK//////////////////////*/
#printer_friendly {
	padding: 0 10px;
	margin: 15px 0;
}
#printer_friendly img {
	padding-right: 8px;
    padding-left: 8px;
	position: relative;
	top: 3px;
}
/*//////////////////////END SETTINGS FOR PRINTER FRIENDLY LINK//////////////////////*/


/*//////////////////////SETTINGS FOR FOOTER//////////////////////*/
#footer{
	clear: both;
	margin: 15px 0 0px 0;
	padding: 10px 10px 20px 10px;
	color: #666;
	background: #f7f6f3;
	font-size: 11px;
	border-top: 1px solid #e1e1d8;
	width: 739px;
	position: relative;
}
.footerText {
	width: 739px;
	}
.logos {
	float: right;
	height: 40px;
	white-space: nowrap;
}
/*//////////////////////END SETTINGS FOR FOOTER//////////////////////*/

/*clearer hack*/
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
/* End hide from IE-mac */


/***********************TWO COLUMN SETTINGS***********************/
/*Changes within this document will apply to the whole site  */
/*************************************************************/

/*settings for leftcolumn*/
#content #leftcolumn{
	margin: 0;
	margin-top: 20px;
	margin-right: 25px;
	padding: 0;
	width: 171px;
}

#content #leftcolumn img{
	max-width: 171px; /*protection from having to wide imgs*/
}

/*settings for the right column*/
#content #rightcolumn, #content #maincolumn{
	padding: 0 15px 0 0;
	margin: 0;
	width: 548px;
}
#content #rightcolumn img, #content #maincolumn img{
	max-width: 533px; /*protection from having too wide imgs*/
}

#content #margincolumn {
	padding: 0 15px 0 0;
	margin-left: 25px;
	width: 548px;
}

#content #margincolumn img{
	max-width: 533px; /*protection from having too wide imgs*/
}

/***********************SPECIFIC PAGE  CONTENT SETTINGS***********************/
/*Changes within this document will apply to the whole site  */
/*************************************************************/

/*SETTINGS FOR CONTENT*/
#content div.event {
	background: #f7f6f3;
	border-top: 1px solid #e1e1d8;
	border-bottom: 1px solid #e1e1d8;
	padding: 20px 10px;
	margin: 0 0 10px 0;
}

#content div.event img.noborder {
	display: inline;
	padding: 0px;
	border: none;
	float: none;
}

#content div.event img {
	display: block;
	padding: 4px;
	background: #fff;
	border: 1px solid #e1e1d8;
	float: left;
}

#content div.event div {
	padding: 0;
	margin-left: 130px;
	padding-bottom: 40px;
        padding-top: 10px;
}
#content #rightcolumn div.event h2 {
	margin: 0;
	padding: 0;
}
/*END SETTINGS FOR CONTENT*/

/***********************COLOR SETTINGS***********************/
/*To change the colors of the site or scheme, this is the place  */
/*************************************************************/

.red {
	color: #f00;
}
.blue {
	color: #00f;
}
.purple {
	color: #c0f;
}

/*color of second nav links*/
#nav #secondnav li a, #nav #secondnav li a:visited, #squarenavs .square h1 a,#squarenavs .square h1 a:visited  {
	/*color: #639916;*/
	color: #666666;
}
#nav #secondnav li a:hover,#nav #secondnav li a:active, #squarenavs .square h1 a:hover,#squarenavs .square h1 a:active {
	color: #222222;
}

/*the nu main color is #003B78 */
/*#header h1.inst, #header h1.inst a, #header h1.inst a:visited, #header a, #header a:visited, #content a:hover, #content a:active, #content #maincolumn h1, #content p.h1sub, #squarenavs .square a:hover, #squarenavs .square a:active, #content th.sectiontitle, #maincolumn p.color, #rightcolumn h1, #content p.quote {
	color: #003B78;
}*/
#nav #secondnav li ul li a:hover, #nav #secondnav li ul li a:active {
	color: #444;
}
#nav #secondnav, #content #articlenav li.title, #squarenavs .square h1 {
	/*background: #dddccf;*/
	background: #dddcd2;
}
#content th.sectiontitle {
	border-top: 1px solid #003B78;
}

#disclaimer li {
	margin: 5px;
}

.feed {
  margin-left: 3px;
  padding: 0 0 0 19px;
  background: url("../i/feed-icon-S.png") no-repeat 0 50%;
} 

.header-message {
 float: left;
 position: absolute;
 margin: 0;
 padding:10px 10px 3px 60px; 
 font-size: 1em;
 color: #A00;
 z-index: 1000;
 width: 380px;
 /*font-weight: bold;*/
}

.pageErrorMessage {
    color: red;
    padding-left: 5px;
    font-size: larger;
    font-weight: bold;
}

.pageInfoMessage {
    color: black;
    padding-left: 5px;
    font-size: larger;
    font-weight: bold;
}

.fieldErrorMessage {
    color: red;
    padding-left: 0px;
    font-weight: bold;
}

.fieldInfoMessage {
    color: black;
    padding-left: 0px;
    font-weight: bold;
}

.fieldLabelColumn {
	text-align: right;
}

.authors {
	white-space: nowrap;
	width: 16em;
	overflow: hidden;
	text-overflow: ellipsis;
	text-decoration: underline;
}

#addCommentButton { /* Text and background colour*/
color: black;
background-color: #cccc99; /*#d7de8c*/
}
/* popover image for Waht's new on the locus detail page button TAIR-2802*/
.popover__wrapper {
    position: relative;
    display: inline-block;
}
.popover__content {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    /*left: -150px;*/
    transform: translate(0,10px);
    background-color: #BFBFBF;
    /*padding: 1.5rem;*/
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    width: auto;
    top: 42px
}
.popover__content:before {
    position: absolute;
    z-index: -1;
    content: '';
    right: calc(30% - 10px);
    /*top: -8px;*/
    border-style: solid;
    border-width: 10px 10px 10px 10px;
    border-color: transparent transparent #BFBFBF transparent;
    transition-duration: 0.3s;
    transition-property: transform;
}
.popover__wrapper:hover .popover__content {
    z-index: 10;
    opacity: 1;
    visibility: visible;
    transform: translate(0,-20px);
    transition: all 0.5s cubic-bezier(0.75, -0.02, 0.2, 0.97);
}