/* 
  
  Here's what's happening in this file since the rebrand
  - updated fonts and colors to use variables (in variables.css)
  - removed Higher Logic widget styles
  
  Any other changes should go in rebrand.css for now
  
*/

body {
  background: #f6f4f2 url("../templates/images/bg.gif") repeat-x top;
  margin: 0;
  padding: 0;
  font-family: var(--brandFont);
  /* font-size: 80%; */
  min-height: 100%;
  font-weight: 350;
}

/* Overriding Foundation for better accessibility */
blockquote,
blockquote p {
  color: #585858;
}

blockquote > *:first-child {
  margin-top: 0;
}
/* End */

a:link {
  color: var(--primary1);
  text-decoration: underline;
}
a:visited {
  color: #636;
}
a:hover {
  color: #933;
  text-decoration: underline;
}
img {
  border: none;
}
h1,
h2,
h3 {
  color: var(--primary1);
  font-weight: bold;
  margin: 0.5em 0 0.5em 0;
  padding: 0;
}
h1 {
  font-size: 1.4em;
}
h2 {
  font-size: 1.2em;
}
h3 {
  font-size: 1.2em;
}
h4 {
  font-size: 1em;
  font-weight: bold;
}
h4 a {
  text-decoration: none;
}
p {
  margin: 1em 0;
  line-height: 1.4em;
}
form {
  margin: 0;
  padding: 0;
}
input,
select {
  vertical-align: middle;
}
hr {
  clear: both;
  border: 0;
  width: 100%;
  color: #999;
  background-color: #999;
  height: 1px;
  z-index: 10;
  margin-top: 2px !important;
  padding: 0 !important;
}
* html hr {
  margin: 0;
}
.block_as_inline {
  display: inline;
}
.mainHolder.mainHolder-full-width {
  width: 100%;
  max-width: 100%;
  margin: 0;
  background-color: white;
}
.mainHolder.mainHolder-full-width.mainHolderbgColor {
  /*background-color: var(--primary1);*/
}
.unit-page .mainHolder.mainHolder-full-width {
  background-color: transparent;
}
.unit-page .mainHolder.mainHolder-full-width .row {
  background-color: white;
}
.full-width-row .mainHolder.mainHolder-full-width .row {
  background-color: white;
}
.full-width-row {
  width: 100%;
  background-color: transparent;
  position: relative;
  padding: 0.5em 0;
}
.full-width-row:first-child,
.full-width-row:nth-child(2) {
  padding: 0;
}
.full-width-row-white {
  background-color: #fff;
}
/* begin row background colors */
/* APS Dark Blue */
.full-width-row-003366-100 {
  background-color: var(--primary1);
}
.full-width-row-003366-75 {
  background-color: #40668c;
}
.full-width-row-003366-50 {
  background-color: #7f99b2;
}
.full-width-row-003366-25 {
  background-color: #bfccd9;
}
.full-width-row-003366-15 {
  background-color: #d9e1e8;
}
.full-width-row-003366-5 {
  background-color: #f2f5f7;
}
/* APS Red */
.full-width-row-aps-red {
  background-color: #990000;
}
/* Grays */
.full-width-row-000-100 {
  background-color: #000;
}
.full-width-row-000-75 {
  background-color: #404040;
}
.full-width-row-000-50 {
  background-color: #7f7f7f;
}
.full-width-row-000-25 {
  background-color: #bfbfbf;
}
.full-width-row-000-10 {
  background-color: #cccccc;
}
.full-width-row-000-5 {
  background-color: #f2f2f2;
}
/* Elements */
.full-width-row-footer {
  background-color: #f6f4f2;
}
/* March Meeting 2019 */
.mm19-pink {
  background-color: rgba(189, 69, 122, 0.5);
}
.mm19-blue {
  background-color: rgba(66, 86, 166, 0.8);
}
.mm19-purple {
  background-color: rgba(105, 110, 179, 0.8);
}
.mm19-pink-light {
  background-color: rgba(189, 69, 122, 0.1);
}
.mm19-blue-light {
  background-color: rgba(66, 86, 166, 0.1);
}
.mm19-purple-light {
  background-color: rgba(105, 110, 179, 0.1);
}
/* March Meeting 2018 */
.full-width-row-mm18-yellow {
  background-color: rgba(235, 212, 23, 1);
}
.full-width-row-mm18-lightyellow {
  background-color: rgba(242, 227, 139, 1);
}
.full-width-row-mm18-lightyellow-25 {
  background-color: rgba(242, 227, 139, 0.2);
}
.full-width-row-mm18-blue {
  background-color: rgba(54, 99, 173, 1);
}
.full-width-row-mm18-blue-40 {
  background-color: rgba(54, 99, 173, 0.2);
}
.full-width-row-mm18-purple {
  background-color: rgba(53, 49, 110, 1);
}
.full-width-row-mm18-purple-30 {
  background-color: rgba(53, 49, 110, 0.1);
}
.full-width-row-mm18-aqua {
  background-color: rgba(111, 199, 181, 1);
}
.full-width-row-mm18-aqua-30 {
  background-color: rgba(111, 199, 181, 0.2);
}
.full-width-row-mm18-orange {
  background-color: rgba(241, 101, 34, 1);
}
.full-width-row-mm18-orange-40 {
  background-color: rgba(241, 101, 34, 0.1);
}
.full-width-row-mm18-red {
  background-color: rgba(158, 30, 36, 1);
}
.full-width-row-mm18-red-20 {
  background-color: rgba(158, 30, 36, 0.1);
}

/* NMC 2018 */
.full-width-row-nmc18-purple {
  background-color: rgba(177, 105, 170, 0.2);
}
.full-width-row-nmc18-aqua {
  background-color: rgba(65, 176, 164, 0.2);
}
.full-width-row-nmc18-blue {
  background-color: rgba(26, 45, 111, 0.2);
}
/* end row background colors */

.full-width-row-image {
  background: url("/meetings/march/images/mm18-row-bg-20.png");
}

.full-width-row-image-mm19 {
  background: url("/meetings/march/images/header-mm19-bg.png");
}
.full-width-row-image-mm18 {
  background: url("/meetings/march/images/mm18-row-bg-20.png");
}
.row-image-opa {
  background: url("/images/opa.png");
}
.row-image-diversity {
  background: url("/images/diversity_1.png");
}
.row-image-international {
  background: url("/images/international_1.png");
}
.row-image-outreach {
  background: url("/images/outreach.png");
}
.row-image-industry {
  background: url("/images/industry.png");
}
.row-image-education {
  background: url("/images/education.png");
}
.row-image-honors {
  background: url("/images/honors.png");
}
.row-image-apsnews {
  background: url("/images/apsnews_1.png");
}
.row-image-nmc {
  background: url("/images/nmc-header.png");
}
.row-image-moore {
  background: url("/images/moore-bg.png");
}
.full-width-row-image-hr {
  background: url("/images/hr.png");
}
.full-width-row-image-donate {
  background-repeat: no-repeat;
  background: url("/about/support/images/DevFall2021_WebsiteBanner_2.webp");
}
.full-width-row-image-nmc {
  background: url("/images/ArtbNMC2020_webpage_banner_v3_1.png");
}
.full-width-row-dark-blue {
  background-color: var(--primary1);
  color: #fff;
}
.full-width-row.full-width-row-dark-blue .mainHolder {
  background-color: transparent;
  color: #fff;
}
.full-width-row.full-width-row-dark-blue a,
.full-width-row.full-width-row-dark-blue h1,
.full-width-row.full-width-row-dark-blue h2,
.full-width-row.full-width-row-dark-blue h3,
.full-width-row.full-width-row-dark-blue h4,
.full-width-row.full-width-row-dark-blue h5 {
  color: #fff;
}
.full-width-row.full-width-row-dark-blue .greyBox {
  background-color: rgba(255, 255, 255, 0.3);
  border-color: rgba(255, 255, 255, 0.1);
}
.full-width-row.full-width-row-tan {
  background-color: #f6f4f2;
}
.full-width-row.full-width-row-tan .mainHolder {
  background-color: transparent;
}
#mainHolder,
.mainHolder {
  background-color: #fff;
  font-size: 1.2em;
  max-width: 1200px;
  width: auto;
  margin: 6px auto;
  padding: 0;
  text-align: left;
}
.mainHolder {
  margin: 0 auto;
}
#header,
#innerHolder,
.innerHolder {
  width: 100%;
  padding: 0;
  margin: 0;
}
#header {
  height: 100px;
  background-color: #fff;
  margin: 15px 0 0 0;
}
#topMenu {
  height: auto;
  background-color: var(--primary1);
  margin: 0;
  padding: 20px 0;
}
#homepage #hero {
  width: auto;
  margin: 0;
}
table#bigHolder {
  margin: 0;
  border: 0;
  width: 100%;
}
table#bigHolder td {
  padding: 0;
  margin: 0;
  border: none;
  width: 720px;
}
#homepage #content {
  padding: 20px 0 10px;
}
#navAndBranding {
  width: 1080px;
  margin: 10px;
  border: 0;
}
* html #homepage #content {
}
* html #content {
}
#breadcrumbs {
  margin-top: 10px;
}
/* Fixing page headline and "print,email" alignment issues */
div.left,
div.right,
div#mainpage-titles {
  margin: 0; /*	padding: 0 0 10px 0; */
}
* html div.left,
* html div.right,
* html div#mainpage-titles {
  padding: 0 !important;
}
/* div#mainpage-titles h1#mainpagetitle {
  margin: 0 !important;
  padding: 0 !important;
} */
table#contentHolder {
  margin: 0 0 0 0;
  padding: 0;
  width: 100%;
}
table#contentHolder td {
  padding: 0;
  margin: 0;
  border: none;
  width: 720px;
  text-align: left;
}
table#features {
  margin: 0 5px 0 0;
  padding: 0;
  width: 720px;
}
table#features td {
  padding: 0;
  margin: 0;
  border: none;
  width: 33%;
  text-align: left;
}
table#features td.left {
  padding: 0 20px 15px 0;
}
table#features td.center {
  padding: 0 10px;
}
table#features td.right {
  padding: 0 0 0 20px;
}
div.news span {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: black;
  background: rgba(0, 0, 0, 0.6);
  padding: 4px;
  color: #fff;
  font-weight: bold;
}
div.news a.news {
  position: relative;
  width: 220px;
  height: 120px;
  display: block;
}
div.news a:hover {
  text-decoration: underline;
}
#header img#logo {
  float: left;
  margin-left: 0;
  border: 0;
  width: 123px;
  height: auto;
  padding-left: 10px;
}
#header #headerNav {
  text-align: right;
  margin-right: 10px;
  margin-top: -6px;
  font-size: 13px;
  line-height: 24px;
}
#header span {
  margin: 0 10px;
  color: #bbb;
}
#header #search {
  float: right;
  text-align: right;
  margin-top: 15px;
  margin-right: 10px;
  font-size: 13px;
}
#header #search input {
  margin-bottom: 5px;
  height: 1.5em;
  width: auto;
  display: inline-block;
  padding-top: 0;
  padding-bottom: 0;
}
#header #search input#keyword {
  border: 1px #999 solid;
}
#header #utility {
  font-size: 13px;
  padding-top: 5px;
}
#bigHolder #quickLinks {
  background-color: #933;
  margin: 0;
}
#bigHolder #quickLinks ul {
  color: #fff;
  padding: 0 0 5px 60px;
  margin: 0 0 0 20px;
}
#bigHolder #quickLinks a {
  color: #fff;
  text-decoration: none;
}
#bigHolder #quickLinks a:visited {
  color: #fff;
  text-decoration: none;
}
#bigHolder #quickLinks a:hover {
  color: #fff;
  text-decoration: underline;
}
#bigHolder #quickLinks li {
  margin: 0.25em 0;
  padding-bottom: 3px;
  background-color: #933;
}
#bigHolder #quickLinks h2 {
  color: #fff;
  padding: 10px 0 0 20px;
  margin: 0 0 0 20px;
}
#bigHolder #quickLinks h3 {
  margin-top: 2px;
  padding: 5px 5px 5px 15px;
  color: white;
}
#content td ul {
  padding: 1em;
  margin: 0;
  list-style-type: square;
}
#rightCol {
  margin: 0;
}
#rightCol h2 {
  background-color: var(--primary1);
  color: #fff;
  padding: 5px 5px 5px 15px;
  margin: 0;
}
#rightCol h3 {
  background-color: var(--primary1);
  color: #fff;
  padding: 5px 5px 5px 15px; /*margin: 0 0 8px 0;*/
}
#rightCol h4 {
  color: var(--primary1);
  font-size: 1.1em;
  padding-bottom: 0; /*margin-bottom: 5px;*/
}
#content h4 {
  color: var(--primary1);
  font-size: 1.1em;
  padding-bottom: 0; /*margin-bottom: 5px;*/
}
#footer h4 {
  color: var(--primary1);
  padding-bottom: 0;
  margin-bottom: 5px;
}
#footer h4 a:link {
  color: var(--primary1);
}
#footer {
  clear: both;
  color: #333;
  margin-top: 10px;
  background-color: #f6f4f2;
  padding: 5px;
}
#footer a {
  color: #333;
  text-decoration: none; /*margin: .1em; */
}
#footer a:hover {
  text-decoration: underline;
}
.footer-social-media-icons {
  margin: 0 -5px;
}
.footer-social-media-icons img {
  margin: 5px;
}
div.clear {
  clear: both;
  margin: 0;
  padding: 0;
}
div.buffer {
  margin: 0;
  padding: 10px;
}
#content {
  margin-bottom: -20px;
}
.CS_Element_LinkBar {
  display: inline;
  border-style: none;
}
.CS_Textblock_Text {
  margin-bottom: 10px;
}
table td table td img {
  border: none !important;
}
table.color-table form {
  padding: 0;
  margin: 0;
}
table.color-table table {
  margin-left: 20px;
}
#amazon p {
  margin: 0;
  padding: 0;
}
/* *************** */
/* Utility Styles */
/* ************** */

.clear {
  margin: 0;
  padding: 0;
  clear: both;
}
/* CLEARFIX: Just add a class of .clearfix to any element containing a float needing to be cleared, plus any Guillotine-Bug-fixing block elements within the container. (source: http://www.positioniseverything.net/easyclearing.html) */
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
/* additional clearfix elements are in ie.css */

.clearfix {
  display: inline-block;
} /* IE fix for Mac */
/* IE fix reset for non-mac \*/
* html .clearfix {
  height: 1%;
} /* End hide from IE-mac */
/* IE hack to fix weird EM bug (http://www.positioniseverything.net/explorer/italicbug-ie.html) */
/* \*/
* html #main {
  overflow: hidden;
  o\verflow: visible;
  width: 100%;
  w\idth: auto;
  he\ight: 1%;
}
/* Callout Boxes */
.caption {
  font-size: 1em;
}
.caption a {
  font-size: 1em;
}
.image-grey {
  background: #ebebeb;
  border-style: solid;
  border-color: #ccc;
  border-width: 1px 2px 2px 1px;
  margin: 0 0 1em 1em;
  padding: 0.3em 0.6em 0.6em;
  float: right;
  width: 258px;
}
.image-grey img {
  text-align: center;
}
.image-white {
  padding: 4px;
  float: right;
  margin: 1em;
  width: 258px;
}
.image-white img {
  text-align: center;
  padding: 4px;
}
.credit {
  clear: both;
  display: block;
  font-size: 0.85em;
  margin: 0 4px 3px 0;
  text-align: left;
}
.greyBox {
  background: #ebebeb;
  border-style: solid;
  border-color: #ccc;
  border-width: 1px 2px 2px 1px;
  margin: 0 0 1em 1em;
  padding: 0.3em 0.6em 0.6em;
  float: right;
  width: 258px;
}
.greyBox img {
  text-align: center;
}
.callout {
  background: #f6f6f6;
  border: 1px solid #bbb;
  margin: 1.2em 0 1em 0;
  padding: 0.5em;
}
.callout2 {
  background: #fff;
  border: 1px solid #999;
  margin: 1.2em 0 1em 0;
  padding: 0.5em;
}
.callout3 {
  background: #f4f2f0;
  border: 1px solid #999;
  margin: 1.2em 0 1em 0;
  padding: 0.5em;
}
.callout4 {
  background: none;
  border: 1px solid #999;
  margin: 1.2em 0 1em 0;
  padding: 0.5em;
}
.callout5 {
  background: #ebebeb;
  margin: 1.2em 0 1em 0;
  padding: 0.4em 0.5em;
}
.calloutimage {
  background: #fff;
  border: 1px solid #999;
  margin: 1.2em 0 1em 0;
  padding: 0 0 0.5em 0;
}
.calloutimage3 {
  background: #f4f2f0;
  border: 0;
  margin: 1.2em 0 1em 0;
  padding: 0 0 0.5em 0;
}

@media (max-width: 550px) {
  .greyBox {
    display: block;
    width: auto;
    float: none;
    margin: 1em;
  }
}
.white a:link {
  color: #fff;
  text-decoration: none;
}
.white a:visited {
  color: #fff;
}
.white a:hover {
  color: #fff;
  text-decoration: underline;
}
.meetingblockcompact {
}
.imagegallery img {
  padding: 2px 10px 10px 0;
  width: 80px;
  height: 80px;
}

@media (max-width: 500px) {
  .imagegallery img {
    height: auto;
  }
}
.newsIntro {
  font-size: 120%;
  line-height: 125%;
}
/* Brand New Styles */

#mobileButtons {
  display: none;
}
#mobileButtons a img {
  width: 1.1em;
  height: auto;
  margin: -3px 5px 0 0;
}
.row {
  /*padding-bottom: 0.9375rem;*/
}
/* Calendar Stuff */
h2.calendar {
  background-color: #933;
  color: #fff;
  padding: 4px;
}
.calendar-list {
  display: block;
  overflow: hidden;
  width: 100%;
}
.calendar-list-item {
  display: block;
  overflow: hidden;
  width: 100%;
  padding: 10px;
}
.calendar-list-item a {
  font-weight: 800;
}
.calendar-list-item:nth-child(even) {
  background-color: #f1f1f1;
}
/* Unordered Lists */
ul.striped {
  padding: 0;
  margin: 0;
  list-style: none;
  display: block;
}
ul.striped li {
  display: block;
  padding: 10px;
}
ul.striped li:nth-child(even) {
  background-color: #efefef;
}
/* row stripes */
.row.row-gray {
  background-color: #efefef;
}

@media (max-width: 900px) {
  body {
    background-image: none;
  }
  #mainHolder {
    margin-top: 0;
  }
  #header {
    margin: 0;
    padding-top: 10px;
    height: auto;
    display: block;
    width: 100%;
    overflow: hidden;
  }
  #header img#logo {
    width: auto;
    height: 39px;
  }
  #headerNav,
  #utility {
    display: none;
  }
  #header #search {
    position: absolute;
    top: 60px;
    display: block;
    background: #fff;
    width: 100%;
    z-index: 200;
    max-height: 0;
    overflow: hidden;
    float: none;
    transition: max-height 0.3s;
    margin: 0;
  }
  #header #search.search-open {
    max-height: 50px;
    border-bottom: 1px solid #cecece;
  }
  #header #search form {
    padding: 10px;
    display: block;
    overflow: hidden;
    width: 100%;
  }
  #header #search input {
    margin: 0;
    border: 1px solid #cecece;
    line-height: inherit;
  }
  #mobileButtons {
    float: right;
    display: inline-block;
  }
  #mobileButtons a {
    display: inline-block;
    overflow: hidden;
    margin: 5px 5px 0 0;
    padding: 5px 10px;
    color: #333;
    text-decoration: none;
  }
  #topMenu {
    background-color: #fff;
    position: relative;
    height: auto;
    padding: 0;
    margin-top: 10px;
    overflow: hidden;
  }
}
#nav {
  margin: 0;
  padding: 0;
  background-color: var(--primary1);
  list-style-type: none;
  display: table;
  width: 100%;
}
#nav,
#nav ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
.unit-page #nav {
  position: absolute;
  left: -100000px;
}
#nav > li {
  display: table-cell;
  float: none;
  text-align: center;
}
#nav > li a {
  color: white;
  /* font-size: 1.25em; */
  text-decoration: none;
}
#nav > li a:hover {
  color: #cccccc;
}
#nav li ul li {
  text-align: left;
}
li#apsSitesMobile,
#nav > li.apsUtilitiesMobile {
  display: none;
}
#nav li li a.js-menu-back-link {
  display: none;
}
#nav li a {
  display: block;
}
#nav li ul {
  position: absolute;
  /* width: 10em; */
  left: -999em;
  margin-left: 3px;
  /*z-index: 200;*/
  max-height: 1500px;
  transition: max-height 0.5s;
}
* html #nav li ul {
  top: 157px;
  margin-left: 2px;
} /*something different*/
* html #nav li ul,
* html #homepage #nav li ul {
  top: 157px;
  margin-left: 2px;
} /*something different*/
#nav li li {
  background: #ccc;
  color: #000;
  width: 10em;
}
#nav li li a {
  display: block;
  width: 100%;
  font-size: 0.9em;
  color: #000;
  text-decoration: none;
  padding: 0.2em 0 0.2em 5px;
  background-color: #ccc;
  border-right: 1px solid #000;
  border-bottom: 1px dashed #666;
  border-left: 1px solid #000;
}
#nav li li a:hover {
  background: #ddd;
  color: black;
}
#nav li:hover ul,
#nav li.sfhover ul {
  left: auto;
  z-index: 100;
}
#nav li:hover img {
  position: relative;
  left: -999em;
}
#nav li.sfhover img {
  position: relative;
  left: auto;
}
#leftNav {
  margin: 0;
}
#leftNav a {
  display: block;
  margin: 0;
  padding: 0;
  text-decoration: none;
  color: #000;
}
#leftNav .header {
  background-color: var(--primary1);
}
#leftNav .header h3 {
  margin-bottom: 0;
  position: relative;
}
#leftNav .header h3 a {
  background-color: var(--primary1);
  color: white;
  display: block;
  overflow: hidden;
  margin-top: 10px;
  padding: 8px 5px;
}
#leftNav .header h3 .left-nav-toggle {
  display: none;
}
/* Unit pages don't use header on desktop*/
.unit-page #leftNav .header {
  display: none;
}
#audience-holder #leftNav .header {
  background-color: #c63;
}
#leftNav .header img {
  margin-left: -1px;
}
#leftNav ul {
  list-style-type: none;
  margin: 0;
  padding: 0 0 20px 0;
  background: #ccc;
  max-height: 1500px;
  transition: max-height 0.5s;
}
#leftNav ul ul {
  background: #ebebeb none;
  padding-bottom: 0;
}
#leftNav li {
  height: 100%;
}
#leftNav li a {
  display: block;
  padding: 5px;
  border-bottom: 1px #666 dashed;
}
#leftNav li a:hover {
  background-color: #ddd;
}
#leftNav li li a {
  border-bottom: 1px #ccc solid;
  padding-left: 15px;
  margin: 0;
  background: url(../templates/images/bullet-square.gif) 7px 50% no-repeat;
}
#leftNav li li a:hover {
  background-color: #c8d5df;
}
#leftNav li.on {
  border-bottom: none;
  font-weight: bold;
}
#leftNav li.on li {
  font-weight: normal;
}
#leftNav li.on li.on {
  background-color: #c8d5df;
}
#leftNav li li a.last {
  border-bottom: 0 #ccc solid;
  padding-left: 15px;
  padding-bottom: 2px;
  margin: 0;
  background: url(../templates/images/bullet-square.gif) 7px 50% no-repeat;
}
/** Support for the "iehover-fix.js" **/
#nav iframe {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 0;
  filter: progid:DXImageTransform.Microsoft.Alpha(style=0, opacity=0);
}

/** end **/

@media (max-width: 899px) {
  .unit-page #leftNav .header {
    display: block;
  }
  #leftNav .header h3 .left-nav-toggle {
    display: inline-block;
    position: absolute;
    right: 5px;
    top: -3px;
    height: 1.5em;
    width: 1.5em;
    text-align: center;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.3)
      url("../images/glyphicons_free/glyphicons/png/glyphicons-433-plus-white.png")
      no-repeat center;
  }
  #leftNav ul {
    max-height: 0;
    padding: 0;
    overflow: hidden;
    transition: max-height 0.5s;
  }
  #leftNav.open ul {
    max-height: 1500px;
    padding: 10px;
  }
  #leftNav.open .header h3 .left-nav-toggle {
    background-image: url("../images/glyphicons_free/glyphicons/png/glyphicons-434-minus-white.png");
  }
  .unit-page #nav {
    position: relative;
    left: 0;
  }
}

@media (max-width: 1050px) {
  #nav > li a {
    font-size: 1.1em;
  }
}

@media (max-width: 900px) {
  #nav {
    display: block;
    background-color: transparent;
    width: 100%;
    max-height: 0;
    overflow: hidden;
    transition: max-height 1s;
    /*border-top: 1px solid #cecece;*/
    border-bottom: 1px solid #cecece;
  }
  #nav.nav-pull-left {
    /* left: -100%; */
    /* position:absolute; */
  }
  #nav.nav-open {
    height: auto;
    max-height: 1200px;
  }
  #nav li {
    display: block;
    width: 100%;
    text-align: left;
  }
  #nav > li.apsUtilitiesMobile {
    display: block;
  }
  #nav li a {
    color: #555;
    padding: 12px 10px;
    border-top: 1px solid #cecece;
    position: relative;
  }
  #nav li a:hover {
    background-color: #efefef;
  }
  #nav li:first-child > a {
    /*border-top: none;*/
  }
  li#apsSitesMobile,
  li#apsUtilitiesMobile {
    display: block;
  }
  #nav li ul,
  #nav li:hover ul,
  #nav li.sfhover ul {
    display: block;
    overflow: hidden;
    background-color: #fff;
    position: absolute;
    left: 100%;
    width: 100%;
    margin-left: 0;
    top: 0;
    /* bottom: 0; */
    transition: left 0.3s;
    /*border-top: 1px solid #cecece;*/
    border-bottom: 1px solid #cecece;
  }
  #nav li ul.open-menu {
    left: 0;
    width: 100%;
    height: auto;
    z-index: 1000;
  }
  #nav li ul li,
  #nav li li a {
    width: 100%;
    background: transparent;
    color: #555;
    border: none;
  }
  #nav li li a {
    padding: 12px 10px;
    border-top: 1px solid #cecece;
    font-size: 1.1em;
  }
  li.has-child > a:after {
    content: "";
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #cecece;
    position: absolute;
    right: 10px;
    top: 18px;
  }
  #nav li li a.js-menu-back-link {
    padding-left: 20px;
    display: block;
  }
  #nav li li a.js-menu-back-link:before {
    content: "";
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-right: 5px solid #cecece;
    position: absolute;
    left: 10px;
    top: 18px;
  }
}
div.news-feature-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
  margin: 0 -10px 10px -10px;
}
div.news {
  margin: 0 10px 10px 10px;
  flex-grow: 1;
}
div.news a.news {
  width: 100%;
  height: auto;
  margin-bottom: 10px;
  font-size: 0.9em;
}
div.news a.news img {
  width: 100%;
  height: auto;
}
.collapse-box {
  overflow: hidden;
  margin-bottom: 10px;
  position: relative;
}
.collapse-box h3 a.collapse-box-toggle,
.collapse-box h4 a.collapse-box-toggle {
  display: none;
  position: absolute;
  right: 5px;
  height: 1.5em;
  width: 1.5em;
  text-align: center;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.3)
    url("../images/glyphicons_free/glyphicons/png/glyphicons-433-plus-white.png")
    no-repeat center;
}
.collapse-box h4 a.collapse-box-toggle {
  background-size: 0.8em;
  background: rgba(100, 100, 100, 0.3)
    url("../images/glyphicons_free/glyphicons/png/glyphicons-433-plus.png");
  height: 1.2em;
  width: 1.2em;
}
/* Scrollable tables */
/* Based on http://www.456bereastreet.com/archive/201309/responsive_scrollable_tables/ */
.scrollable.has-scroll {
  position: relative;
  overflow: hidden; /* Clips the shadow created with the pseudo-element in the next rule. Not necessary for the actual scrolling. */
}
.scrollable.has-scroll:after {
  position: absolute;
  top: 0;
  left: 100%;
  width: 50px;
  height: 100%;
  border-radius: 10px 0 0 10px / 50% 0 0 50%;
  box-shadow: -5px 0 10px rgba(0, 0, 0, 0.25);
  content: "";
}
/* This is the element whose content will be scrolled if necessary */
.scrollable.has-scroll > div {
  overflow-x: auto;
}

/* Add scrollbar on webkit browsers */
.scrollable > div::-webkit-scrollbar {
  height: 12px;
}
.scrollable > div::-webkit-scrollbar-track {
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.15) inset;
  background: #f0f0f0;
}
.scrollable > div::-webkit-scrollbar-thumb {
  border-radius: 6px;
  background: #ccc;
}

@media (max-width: 900px) {
  .collapse-box {
    max-height: 2.75em;
    transition: max-height 1s;
  }
  .collapse-box h3,
  .collapse-box h4 {
    height: 2.2em;
  }
  .collapse-box h3 a.collapse-box-toggle,
  .collapse-box h4 a.collapse-box-toggle {
    display: inline-block;
  }
  .collapse-box h4 {
    background-color: rgba(255, 255, 255, 0.9);
    padding: 6px;
  }
  .collapse-box p {
    padding: 0 6px;
  }
  .collapse-box.open {
    max-height: 1200px;
  }
  .collapse-box.open h3 a.collapse-box-toggle {
    background-image: url("../images/glyphicons_free/glyphicons/png/glyphicons-434-minus-white.png");
  }
  .collapse-box.open h4 a.collapse-box-toggle {
    background-image: url("../images/glyphicons_free/glyphicons/png/glyphicons-434-minus.png");
  }
}
/************************
       Accordion
*************************/
.accordion,
.accordion * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.accordion {
  overflow: hidden;
  border: none;
  background: none;
}
/*----- Section Titles -----*/
.accordion-section-title {
  width: 100%;
  padding: 6px 8px;
  font-weight: normal;
  border-bottom: none;
  display: inline-block;
  margin-bottom: 0px;
  background: transparent;
  transition: all linear 0.15s;
  text-decoration: underline !important;
}
.accordion-section-title.active,
.accordion-section-title:hover {
  text-decoration: none;
}
.accordion-section:last-child .accordion-section-title {
  border-bottom: none;
}
/*----- Section Content -----*/
.accordion-section-content {
  padding: 15px;
  display: none;
  background: none;
}
.sideClosed {
  background: url(/images/sidemenu-arrow-closed.png) no-repeat center right;
  width: 10px;
  height: 10px;
  display: inline-block;
  margin-left: 10px;
}
.sideOpen,
.sideClosed.sideOpen {
  background: url(/images/sidemenu-arrow-open.png) no-repeat center right;
  width: 10px;
  height: 10px;
  display: inline-block;
  margin-left: 10px;
}
tbody tr:nth-child(even) {
  background-color: initial;
}
/* custom button colors */
.button {
  line-height: 1.2em;
  font-weight: bold;
  text-decoration: none !important;
}

.button--block {
  display: block;
  width: 100%;
}

.button.bold {
  font-weight: bold;
}

.button.no-underline {
  text-decoration: none;
}

.button.prl {
  font-size: 1.1rem;
  background-color: rgba(81, 126, 102, 1);
  color: #fff;
}
.button.prl:hover,
.button.prl:focus {
  background-color: rgba(81, 126, 102, 0.8);
}
.button.prx {
  font-size: 1.1rem;
  background-color: rgba(0, 78, 188, 1);
  color: #fff;
}
.button.prx:hover,
.button.prx:focus {
  background-color: rgba(0, 78, 188, 0.8);
}
.button.pra {
  font-size: 1.1rem;
  background-color: rgba(113, 127, 129, 1);
  color: #fff;
}
.button.pra:hover,
.button.pra:focus {
  background-color: rgba(113, 127, 129, 0.8);
}
.button.prb {
  font-size: 1.1rem;
  background-color: rgba(190, 15, 52, 1);
  color: #fff;
}
.button.prb:hover,
.button.prb:focus {
  background-color: rgba(190, 15, 52, 0.8);
}
.button.prc {
  font-size: 1.1rem;
  background-color: rgba(0, 119, 112, 1);
  color: #fff;
}
.button.prc:hover,
.button.prc:focus {
  background-color: rgba(0, 119, 112, 0.8);
}
.button.prd {
  font-size: 1.1rem;
  background-color: rgba(90, 126, 146, 1);
  color: #fff;
}
.button.prd:hover,
.button.prd:focus {
  background-color: rgba(90, 126, 146, 0.8);
}
.button.pre {
  font-size: 1.1rem;
  background-color: rgba(148, 94, 58, 1);
  color: #fff;
}
.button.pre:hover,
.button.pre:focus {
  background-color: rgba(148, 94, 58, 0.8);
}
.button.prapplied {
  font-size: 1.1rem;
  background-color: rgba(155, 2, 84, 1);
  color: #fff;
}
.button.prapplied:hover,
.button.prapplied:focus {
  background-color: rgba(155, 2, 84, 0.8);
}
.button.prfluids {
  font-size: 1.1rem;
  background-color: rgba(0, 80, 114, 1);
  color: #fff;
}
.button.prfluids:hover,
.button.prfluids:focus {
  background-color: rgba(0, 80, 114, 0.8);
}
.button.prab {
  font-size: 1.1rem;
  background-color: rgba(0, 117, 155, 1);
  color: #fff;
}
.button.prab:hover,
.button.prab:focus {
  background-color: rgba(0, 117, 155, 0.8);
}
.button.prper {
  font-size: 1.1rem;
  background-color: rgba(159, 96, 181, 1);
  color: #fff;
}
.button.prper:hover,
.button.prper:focus {
  background-color: rgba(159, 96, 181, 0.8);
}
.button.prmaterials {
  font-size: 1.1rem;
  background-color: rgba(144, 42, 43, 1);
  color: #fff;
}
.button.prmaterials:hover,
.button.prmaterials:focus {
  background-color: rgba(144, 42, 43, 0.8);
}
.button.physics {
  font-size: 1.1rem;
  background-color: rgba(75, 17, 111, 1);
  color: #fff;
}
.button.prxquantum {
  font-size: 1.1rem;
  background-color: rgba(0, 0, 0, 1);
  color: #fff;
}

.button.prxquantum:hover,
.button.prxquantum:focus {
  background-color: rgba(0, 0, 0, 0.8);
}

.button.physics:hover,
.button.physics:focus {
  background-color: rgba(75, 17, 111, 0.8);
}
.button.rmp {
  font-size: 1.1rem;
  background-color: rgba(229, 114, 0, 1);
  color: #fff;
}
.button.rmp:hover,
.button.rmp:focus {
  background-color: rgba(229, 114, 0, 0.8);
}
.button.mm18 {
  font-size: 1.1rem;
  background-color: rgba(54, 99, 173, 1);
  color: #fff;
}
.button.mm18:hover,
.button.mm18:focus {
  background-color: rgba(189, 69, 122, 0.8);
}
.button.mar {
  font-size: 1.1rem;
  background-color: rgba(189, 69, 122, 1);
  color: #fff;
}
.button.apr {
  font-size: 1.1rem;
  background-color: rgba(46, 39, 91, 1);
  color: #fff;
}
.button.mar:hover,
.button.mar:focus {
  background-color: rgba(189, 69, 122, 0.8);
}
.button.am18 {
  font-size: 1.1rem;
  background-color: rgba(62, 84, 133, 1);
  color: #fff;
}
.button.am18:hover,
.button.mm18:focus {
  background-color: rgba(62, 84, 133, 0.8);
}
.button.focusarea {
  font-size: 1.2rem;
  background-color: #fff;
  color: var(--primary1);
  font-weight: bold;
}
.button.focusarea:hover,
.button.focusarea:focus {
  background-color: rgba(255, 255, 255, 0.9);
  color: var(--primary1);
  font-weight: bold;
}
.button.aps {
  font-size: 1.2rem;
  background-color: var(--primary1);
  color: #fff;
}

.button.aps:hover,
.button.aps:focus {
  background-color: rgba(0, 51, 102, 0.8);
  color: #fff;
}

.button.red {
  font-size: 1.2rem;
  background-color: #900;
  color: #fff;
  line-height: 1.2em;
}

.button.red:hover,
.button.red:focus {
  background-color: rgba(237, 38, 23, 0.8);
  color: #fff;
}

.button.gray {
  font-size: 1.2rem;
  background-color: #666;
  color: #fff;
}

.button.gray:hover,
.button.gray:focus {
  background-color: rgba(102, 102, 102, 0.8);
  color: #fff;
}

/****** TABS  ***********/

.tabs {
  margin: 0;
  list-style-type: none;
  background: none;
  border: none;
}
/*
.tabs::before, .tabs::after {
  content: ' ';
  display: table;
  flex-basis: 0;
  order: 1;
}
.tabs::after {
  clear: both;
}

.tabs.vertical > li {
  width: auto;
  float: none;
  display: block;
}

.tabs.simple > li > a {
  padding: 0;
}
.tabs.simple > li > a:hover {
  background: transparent;
}

.tabs.primary {
  background: #2199e8;
}
.tabs.primary > li > a {
  color: #fefefe;
}
.tabs.primary > li > a:hover, .tabs.primary > li > a:focus {
  background: #1893e4;
}
*/
.tabs-title {
  float: left;
}
.tabs-title > a {
  display: block;
  padding: 1rem 1rem;
  line-height: 1;
  font-size: 0.9rem;
  text-decoration: none;
  font-weight: bold;
}
.tabs-title > a:hover {
  background: #fefefe;
}
.tabs-title > a:focus,
.tabs-title > a[aria-selected="true"] {
  background: #fff;
}
.tabs-content {
  /*background: #fff;*/
  transition: all 0.5s ease;
  border: none;
  border-top: 0;
}
/*
.tabs-content.vertical {
  border: 1px solid #e6e6e6;
  border-left: 0;
}
*/
.tabs-panel {
  display: none;
  padding: 1rem;
}
.tabs-panel.is-active {
  display: block;
}

.bg-grey {
  background-color: #cccccc;
  padding: 5px;
}
/****** END TABS ********/

/***** NEW HOME *******/
.focusarea {
  background-color: var(--primary1);
  color: #ffffff;
  margin: 1.2em 0 1em 0;
  padding: 0.5em;
}

/***** Meeting Schedule *******/

@media only screen and (max-width: 480px) {
  .full {
    display: block;
    width: 100%;
  }
}
.schedule {
  border-bottom: 1px solid rgb(204, 204, 204);
  background-color: transparent;
  padding: 0px;
  vertical-align: bottom;
}
.schedule p {
  padding: 15px 4px 4px 4px;
  margin: 0px;
}

/***** Image Grid *******/
.advocacydashboard {
  margin: 5px 10px;
}

/*  Careers Job Search Box */

.jobsearch {
  background-color: #64b4b5;
  position: relative;

  display: flex;
  flex-flow: row wrap;
  max-width: 100%;
  justify-content: space-between;
  overflow: hidden;
  margin: 1rem 0 2rem 0;
}

.jobsearch__content {
  padding: 1rem;
  flex: 1 1 300px;
}

.jobsearch__pic {
  min-width: 100px;
  display: flex;
  flex: 1 1 200px;
  justify-content: flex-end;
  padding: 10px 0 0 10px;
}

.jobsearch__pic img {
  align-self: flex-end;
  max-height: 100px;
}

@media (min-width: 640px) {
  .jobsearch__pic img {
    max-height: 150px;
  }
}

@media (min-width: 900px) {
  .jobsearch__pic img {
    max-height: 200px;
  }
}

.jobsearch a {
  color: var(--primary1);
  white-space: nowrap;
  text-decoration: none;
}

.jobsearch__more {
  list-style: none;
  margin-left: 0;
}

.jobsearch input {
  min-width: 0;
  margin-bottom: 0;
  flex: 1 1 auto;
  border: 0 !important;
  box-shadow: none !important;
}

.jobsearch__button {
  color: #fff;
  background: #01586c;
  padding: 0.5em 1em;
  white-space: nowrap;
}

.jobsearch a:hover {
  border-bottom: 1px solid #333;
}

.jobsearch__title {
  margin-top: 0;
  font-size: 1.5em;
}

.jobsearch__search {
  display: flex;
  padding: 0;
  border: 0;
  border: 1px solid #01586c;
}

.jobsearch__employers {
  bottom: 0;
  margin-bottom: 0;
}

.jobsearch--mini input,
.jobsearch--mini button {
  display: inline-block;
}

.jobsearch--mini .jobsearch__sub {
  padding: 0 0 0 1rem;
  display: grid;
  grid-template-columns: 6fr 5fr;
  width: 100%;
}

.jobsearch--mini .jobsearch__pic {
  justify-content: flex-end;
}

.jobsearch--mini {
  /* flex-basis: */
}

.jobsearch--mini .jobsearch__more {
  padding-bottom: 1em;
}

@media (min-width: 640px) {
  .jobsearch--mini .jobsearch__search {
    display: block;
    line-height: 1.2;
    border: 0;
  }

  .jobsearch--mini .jobsearch__search > * {
    display: inline-block;
    width: 100%;
  }

  .jobsearch--mini .jobsearch__search input {
    margin-bottom: 10px;
    border: 1px solid #01586c;
  }

  .jobsearch--mini .jobsearch__pic img {
    max-height: 130px;
    max-width: 100%;
    width: auto;
  }

  .jobsearch--full .jobsearch__more {
    display: flex;
    flex-flow: row wrap;
    line-height: 1;
  }

  .jobsearch--full .jobsearch__more li:not(:last-child) {
    border-right: 1px solid #333;
    padding-right: 0.5em;
    margin-right: 0.5em;
  }
}

/*  OGA Phone2Action Widgets */
.advocacy-actionwidget-iframe {
  overflow: hidden;
}

.c3-texts.c3-texts-data1 > text,
.c3-target-Personalized-emails > text {
  fill: black !important;
  color: black !important;
}

.oga-chart {
  margin-bottom: 1rem;
}

.oga-chart__caption {
  text-align: center;
  color: #666;
  font-size: 0.9em;
  padding-right: 1em;
  padding-left: 1em;
  line-height: 1.1;
}

/* Honors Eligibility Search */

.hsf {
  /* position: relative; */
  margin-top: 1rem;
}

.hsf__suggestions {
  width: 100%;
  background: white;
  overflow: scroll;
  margin: 1rem 0;
}

.hsf__suggestions li {
  padding: 0.5em 1em;
}

.hsf__suggestions li:nth-child(odd) {
  background: #efefef;
}

.hsf__suggestions mark {
  background-color: #fbe878;
}

.hsf__wrap {
  display: flex;
  width: 100%;
  border: 1px solid #ccc;
  align-items: stretch;
}

.hsf__text {
  flex: 1 1 auto;
  height: auto;
  margin-bottom: 0 !important;
}

.button.hsf__submit {
  flex: 0 0 auto;
  white-space: nowrap;
  margin-bottom: 0 !important;
  font-size: 16px !important;
}

/*  Responsive Media */

.responsive-container {
  height: 0;
  overflow: hidden;
  padding-top: calc(9 / 16 * 100%);
  background: white;
  position: relative;
}

.responsive-container > * {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.row-brand {
  background: url("/images/bg-header.png");
}

#mainpage-titles {
  margin-bottom: 1em;
}

#mainpage-titles h1 {
  font-size: 2em;
  line-height: 1.1;
}

.article-issue {
  margin-bottom: 0;
}

.article-issue a {
  color: #666;
  margin-bottom: 0;
}

.top-banner--apsnews {
  width: 160px;
  height: auto;
}

.title--apsnews {
  margin-top: 0;
}