/* This file will hold styles for the mobile version of your website (mobile first). */
/* This also can include ANY global CSS that applies site-wide. Unless overwritten by a more specific style rule, CSS declarations in global.css will apply site-wide. */

/* PMEL: */
/* Layout	Size	CSS Stylesheet						Description */
/* Mobile	All		global								Apply first to all device widths. */
/* Tablet	>=740px	pacific-marine-alpha-default		Inherit Mobile, add/override from Tablet. */
/* Desktop	>=980px	pacific-marine-alpha-default-normal	Inherit Global & Tablet; add/override from Desktop. */


/* fix firefox boxsizing issue */
* {
  -moz-box-sizing: content-box;
}

body {
  font: 14px/16px Arial, Verdana, sans-serif normal;
}

html body.admin-menu {
  margin-top: 79px !important;
}

table {
  width: 100%;
  border: none;
}

table tr:hover td,
tr.even:hover td.active, 
tr.odd:hover td.active {
  background: none;
}

img,
input,
select {
  max-width: 100% !important;
  height: auto !important;
}

sub {
  vertical-align: sub;
  font-size: 80%;
  line-height: 80%;
}

/* 8/12/14 added - tn */
sup {
	vertical-align: super;
	font-size: 80%;
	line-height: 80%;
}

a,
a:link,
a:visited {
  text-decoration: none;
  color: #4474a3;
}

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

h1, h2, h3, h4, h5, h6 {
  font-family: Arial, Verdana, sans-serif;
  margin: 10px 0;
}

h1 {
  line-height: 40px;
  /*font-variant: small-caps;*/		/* Commented out 6/27/14 - tn */
  font-size: 30px;					/* Overrides omega-text.css - tn */
}

h2,
h2.node-title,
h2.block-title {
  font-size: 22px;
  line-height: 28px;
  /*font-variant: small-caps;*/		/* Commented out 6/27/14 - tn */
  padding-bottom: 5px;
  border-bottom: 1px solid #707070;
  width: 100%;
  margin-bottom: 10px;
}

h2,
h2.node-title,
h2.block-title,
h2.block-title a {
  color: #965951;  
}

h3 {
  font-weight: bold;
  font-size: 16px;
  line-height: 20px;
  margin: 7px 0;
}

h3, h3 a, h3 a:link, h3 a:visited {
  color: #575757;
}

h4 {
  font-size: 14px;
  line-height: 18px;
  font-weight: bold;
  margin-bottom: 5px;
}

.node .content .field {
  margin-bottom: 10px;
}

ul.menu li.leaf,
ul.menu li.collapsed,
ul.menu li.expanded {
  display: inline;
  list-style: none;
}

.region-sidebar-first ul.menu li.leaf,
.region-sidebar-first ul.menu li.collapsed,
.region-sidebar-first ul.menu li.expanded,
.region-sidebar-second ul.menu li.leaf,
.region-sidebar-second ul.menu li.collapsed,
.region-sidebar-second ul.menu li.expanded {
  display: list-item;
}

.region-sidebar-first-inner .block,
.region-sidebar-second-inner .block {
  margin-bottom: 20px;
}

.region-sidebar-first .item-list ul li {
  margin: 0 0 0 .5em;
  padding: 0.2em .5em 0 0;
}

#region-branding,
#region-menu {
  margin: 0;
  margin-bottom: 10px;
}

.logo-img {
  margin: 10px 0 0 5px;
  background: url('../images/pmel_logo.png') 0 0 no-repeat;  /* mobile logo */
  background-size: contain;
  height: 90px;
  width: 100%;
}

.logo-img a {
  width: 100%;
  height: 100%;
  display: block;
}

.logo-img img {
  display: none;
}

#zone-header {
  position: relative;
}

#noaa-doc {
  float: right;
  width: 100%;
  margin-top: 10px;
}

#noaa-doc div {
  float: right;
}

#noaa-doc div.words {
  float: none;
  font-size: 12px;
  line-height: 13px;
  text-align: right;
  text-transform: uppercase;
  margin-right: 5px;
}

#noaa-doc div.words #doc {
  font-size: 9px;
  color: #555;
}

.logos .logo img {
  height: 40px;
  width: 40px;
}

#hamburger,
#search {
  display: block;
  position: absolute;
  z-index: 10;
  cursor: pointer;
  top: 10px;
}

#hamburger {
  right: 30px;
}

#search {
  right: 0px;
}

#block-search-form {
  display: none;
}

#block-search-form form {
  margin-bottom: 0;
}

#block-search-form input {
  padding: 2% 5%;
  width: 100%;
  margin: 10px 0;
  font-size: 18px;
  color: #8e8e8e;
  border-radius: 20px;
  border: 1px solid #ccc;
}

#block-system-main-menu {
  display: none;
  padding-top: 15px;
}

#block-system-main-menu li {
  width: 100%;
  margin: 0px;
  padding: 0px;
}

#block-system-main-menu li a {
  display: block;
  padding: 0 7%;
  width: 90%;
  font-size: 18px;
  line-height: 30px;
  text-decoration: none;
}

#block-system-main-menu li a:after {  
  float: right;
  margin-right: 10px;
  content: "〉";
  font-family: sans-serif;
}

#block-system-main-menu li.open > a:after {
  transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
}

#block-system-main-menu li.expanded ul.menu {
  display: none;
}

#block-system-main-menu li.expanded ul.menu {
  padding: 0 10%;
}

.view-pmel-themes .widget_pager .views-slideshow-pager-field-item {
  float: left;
  width: 50%;
  color: #707070;
  text-align: center;
}

.view-pmel-themes .widget_pager .views-slideshow-pager-field-item a {
  padding: 20px;
  display: block;
}

.view-pmel-themes .widget_pager .views-slideshow-pager-field-item.active {
  background-color: #eee;
}

.view-pmel-themes .widget_pager .views-slideshow-pager-field-item .views-content-name {
  padding: 5%;
  width: 90%;
  height: 40px;
  display: table-cell;
  vertical-align: middle;
  cursor: pointer;
}

.view-pmel-themes .widget_pager .views-slideshow-pager-field-item.active .views-content-name {
  color: #3b73b6;
}


.view-what-s-new.view-display-id-page .views-exposed-widgets,
.view-pmel-in-the-media.view-display-id-page .views-exposed-widgets {
  margin-bottom: 20px;
}

.view-pmel-in-the-media.view-display-id-page .views-exposed-form .views-exposed-widget .form-submit {
  margin-top: 14px;
}

.view-what-s-new.view-display-id-page .views-row,
.view-pmel-in-the-media.view-display-id-page .views-row,
.view-featured-publications.view-display-id-page .views-row {
  clear: both;
  margin-bottom: 20px;
  width: 96%;
  padding: 2%;
  float: left;
  border-radius: 5px;
}

.view-what-s-new.view-display-id-page .views-row-odd,
.view-pmel-in-the-media.view-display-id-page .views-row-odd,
.view-featured-publications.view-display-id-page .views-row-odd {
  background: #efefef;
}

.view-what-s-new .views-row .views-field img h4 a {
  color: #575757;
  font-style: italic;
}

.node-type-news-story .field-name-field-atom,
.view-what-s-new .views-field-field-atom {
  position: relative;
  padding-bottom: 60%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
  margin-bottom: 10px;
}

.node-type-news-story .field-name-field-news-story-image img,
.view-what-s-new .views-field-field-news-story-image img,
.view-what-s-new .whats-new-image img,
.view-featured-publications .views-field-field-featured-pub-image img {
  background: #a7b9ce;
  padding: 4px;
  margin: 0;
}

.view-featured-publications .views-field-field-featured-pub-image {
  margin-bottom: 7px;
}

/* IE11: Fixes slideshow image that is too wide when site is small (non-responsive) */
.views-slideshow-cycle-main-frame,
.views-slideshow-cycle-main-frame-row,
.views-slideshow-cycle-main-frame-row img {
  width: 100% !important;
}

/* 9/5/14 added to fix date in What's New story on homepage (EDD, Arctic): */
/* .views-field-field-publication-date span.date-display-single - tn */
.views-field-field-publication-date span.date-display-single,
.pub-date,
.img-caption,
.image-field-caption {
  font-size: 12px;
  color: #555;
  font-style: italic;
  margin-bottom: 3px;
}

.image-field-caption p {
  margin-bottom: 0;
}

.view-what-s-new .image-caption-wrapper {
}

.view-what-s-new .image-caption-wrapper .img-caption {
  padding-top: 3px;
}

.node-type-news-story .field-name-field-atom iframe,
.node-type-news-story .field-name-field-atom object,
.node-type-news-story .field-name-field-atom embed,
.view-what-s-new .views-field-field-atom iframe,
.view-what-s-new .views-field-field-atom object,
.view-what-s-new .views-field-field-atom embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.front #section-content,
.front #region-content {
  margin-bottom: 30px;
}

/** footer **/
#section-footer,
#section-footer ul.menu {
  text-align: center;
}

#section-footer {
  padding-bottom: 40px;
}

footer ul.menu li.leaf {
  margin: 0;
  padding: 0;
}

footer ul.menu li.leaf a {
  padding: 0 5px;
  border-right: 1px solid #333;
}

footer ul.menu li.first.leaf a {
  padding-left: 0px;
}

footer ul.menu li.last.leaf a {
  padding-right: 0px;
  border-right: none;
}

#block-block-3 p {
  margin: 18px 0;
  text-align: center;
}

#block-switchtheme-switch-form {
  margin-top: 20px;
}

/** node-specific **/
.views-field-field-citation p,
.field-name-field-citation p {
  font-size: 12px;
  color: #555;
}

.field-name-field-banner-image,
.field-name-field-banner-image-wide{
  background: #a7b9ce;
  padding: 5px;
}

.node-type-pmel-theme #page-right .field-name-field-page-images img,
.node-type-page #page-right .field-name-field-page-images img {
	margin-bottom: 10px;
}

#block-views-related-stories-block img,
#block-views-related-stories-related-items img {
  float: left;
  margin: 0px 5px 0px 0px;
  max-width: 40% !important;
  border: 2px solid #a8b8cf;
  height: 55px !important;
  width: auto;
}

#block-views-related-stories-related-items .views-row {
  margin-bottom: 7px;
  clear: left;
  min-height: 65px;
}

#block-views-related-stories-related-items .views-field-body {
  font-size: 11px;
  line-height: 13px;
}

/* scientists view and pages */
.view-scientists .views-row {
  width: 100%;
  float: left;
  clear: both;
  margin-bottom: 15px;
}

.view-scientists .views-field-field-scientist-image {
  float: left;
  margin-right: 3%;
  width: 25%;
  max-width: 100px;
  border: 3px solid #a7b9ce;
}

.view-scientists .views-field-field-scientist-image img {
  margin: 0 auto;
  max-width: 150px;
}

/* featured publications */
.node-type-featured-publication .field-name-field-featured-pub-image {
  float: left;
  max-width: 40% !important;
  margin: 0 14px 0 0;
}

.node-type-featured-publication .field-name-field-featured-pub-image img {
  padding: 4px;
  background-color: #a7b9ce;
  float: left;
  margin: 0 7px 7px 0;
}

.pager li.pager-first a, .pager li.pager-previous a, .pager li.pager-next a, .pager li.pager-last a {
  width: 70px;
}

.pager li.pager-previous {
  left: 70px;
}

.pager li.pager-next {
  right: 70px;
}

.dnd-atom-wrapper.atom-align-left {
  margin-right: 7px;
}

.dnd-atom-wrapper.atom-align-right {
  margin-left: 7px;
}

span.date-display-single {
	font-style: italic;
}

.block-related-stories-related-items .image-field-caption {
  display: none;
}

/* Override omega-text.css; Publications results - tn */
dd {
    font-style: normal;
    font-size: 1em;
    padding-left: 30px;
    margin-bottom: 0;
}
dt {
    font-size: 1em;
}
/* Reset tables - tn */
table, td {
    margin: 0;
    padding: 0;
}
/* Node Gallery – individual photo gallery – tn */
/* Hide text links above thumbnails */
.node-node-gallery-item h2 {
	display: none;
}
.view-node-gallery-gallery-item-views .views-row {
	width: 21%;			/* Basically, 4 columns */
	float: left;
	margin: 2% 2% 2% 2%;
}
/* Node Gallery – listing of all galleries - tn */
.view-node-gallery-gallery-summaries h2 {
	font-size: 13px;
	border-bottom-style: none;
	line-height: 1em;
}
.view-node-gallery-gallery-summaries .views-row {
	width: 21%;			/* Basically, 4 columns */
	margin: 2% 0 2% 2%;		/* Need minimal horizontal space between cover images for inline-block to work */
	display: inline-block;	/* Instead of float: left, inline-block aligns rows */
	vertical-align: top;
	/* IE 6/7 Hack*/
  	zoom: 1;
	*display: inline;
}
/* Service Links alignment fix for social media sharing buttons – tn */
.twitter-share-button,
.service-links-facebook-share {
	vertical-align: bottom;
	padding-top: 15px;
}

/** Phone list **/
.font-small { font-size: 12px; }

/* Beautify table */
#phone-table {
	width: 99%;
	color: #000;
	background-color: #fff;
}
#phone-table tbody tr:nth-child(even) {
	background-color: #EDEDED;
}	
#phone-table tbody tr:hover {
	background-color: #E6F3FF;
}
/* Force table to not be like tables anymore */
#phone-table, #phone-table tbody, #phone-table th, #phone-table td, #phone-table tr {
	display: block;
}
/* Hide table headers (but not 'display: none;', for accessibility) */
#phone-table thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
#phone-table tr {
	border: 1px solid #ddd;
	padding: 6px;
}	
#phone-table td {		/* Behave  like a "row" */
	border: none;
	position: relative;
	padding-left: 23%;	/* Make room for row label */
}
/* Set up space to place labels on each row */
#phone-table td:before {
	position: absolute;	/* Now like a table header */
	top: 2px;			/* Top/left values mimic padding */
	left: 2px;
	width: 23%;
	padding-right: 10px;
	white-space: nowrap;
	font-weight: bold;
}
/* Add labels to the data */
#phone-table td:nth-of-type(1):before { content: "Name:"; }
#phone-table td:nth-of-type(2):before { content: "Telephone:"; }
#phone-table td:nth-of-type(3):before { content: "Division:"; }

/* Awards page */
.view-award-list .views-field-title,
.view-award-list-by-year .views-field-title { 
	text-transform: uppercase;
}

.view-award-list p,
.view-award-list-by-year p { margin-bottom: 0; }

.view-award-list ul li,
.view-award-list-by-year ul li { margin-top: 20px; }

.view-award-list .views-field-body,
.view-award-list-by-year .views-field-body { font-style: italic; }

.view-award-list h3,
.view-award-list-by-year h3 {
	color: #965951;
	/*margin-top: 10px;*/
	font-size: 18px;
	border-bottom: 1px solid #707070;
	margin-top: 15px;
}

.view-award-list span.date-display-single,
.view-award-list-by-year h3 span.date-display-single { font-style: normal; }

.view-award-list .item-list li,
.view-award-list-by-year .item-list li { list-style: inherit; } 	/* Override removal of bullets */

/* 2020 lab review */
table.agenda, table.agenda thead, table.agenda tbody, table.agenda th, table.agenda tr, table.agenda td {
	display: block;
}
table.agenda tr {
	padding-bottom: 10px;
}
table.agenda td {
	vertical-align: top;
}
.context-2020-lab-review h1::before {
	display: block;
	content: "PMEL 2020 Lab Review \A";
	white-space: pre;		/* won't work without this */
	font-size: 33px;
	text-align: center;
	margin-bottom: 15px;
}
/* 2020 lab review homepage title */
.context-2020-lab-review.page-node-1588 h1 {
	text-align: center;
}
/* Tree view: https://www.w3schools.com/howto/howto_js_treeview.asp */
/* Remove default bullets */
.nested, #agenda-day1, #agenda-day2, #agenda-day3 {
	list-style-type: none;
}
/* Remove margins and padding from the parent ul */
#agenda-day1, #agenda-day2, #agenda-day3 {
	margin: 0;
	padding: 0;
}
/* Style the caret/arrow */
.caret {
	cursor: pointer;
	user-select: none; /* Prevent text selection */
}
/* Create the caret/arrow with a unicode, and style it */
.caret::before {
	/*content: "\25B6";*/
	content: "+";
	color: black;
	display: inline-block;
	margin-right: 6px;
}
/* Rotate the caret/arrow icon when clicked on (using JavaScript) */
/*.caret-down::before {
	transform: rotate(90deg);
}*/
.caret-down::before {
	content: "-";
	color: black;
	display: inline-block;
	margin-right: 6px;
}
/* Hide the nested list */
.nested {
	display: none;
}
/* Show the nested list when the user clicks on the caret/arrow (with JavaScript) */
.agenda-active {
	display: block;
}
/* Science Presentations page - if p followed by ul, remove margin-top from ul */
article#node-page-1602 p + ul {
	margin-top: -17px;
}
/* End 2020 lab review */