/* EMPAC RESPONSIVE OVERRIDES
   This is a Mobile First theme - the smaller device widths should not be needed in most cases,
   but are included here for completeness. */

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
}

/* Small Tablets */
@media only screen and (min-width : 600px) {

}

/* Small Devices, Tablets - the primary break point */
@media only screen and (min-width : 768px) {
  /* LOGO & NAVBAR */
  body {
    margin-top: 110px; /* offset the fixed #branding */
  }
  #branding {
    position: fixed;
    top: 0;
    width: 100%;
    height: 110px;
    z-index: 100;
  }
  body.user-logged-in #branding {
    top: 80px; /* account for the admin menu */
  }
  #branding-inner {
    position: relative;
  }
  #branding .logo img {
    margin: 2em 0 2em 2em;
  }
  .navbar-nav {
    margin: 0 -1em 0 0;
    float: right;
  }
  #block-empac-empac-cms-search-form {
    /*display: block;*/
    width: 280px;
    position: absolute;
    right: 15px;
    bottom: -45px;
  }
  #search-block-form input {
    border-radius: 0;
  }
  #search-block-form .btn-primary {
    background-color: #f2f2f2;
    color: #444;
    border: 1px solid #ccc;
    border-radius: 0;
  }
  #block-secondarymenu {
    display: block;
    position: absolute;
    right: 15px;
    bottom: 17px;
    font-size: 0.85em;
    font-family: "ff-meta-serif-web-pro","Georgia","Times New Roman",serif;
    font-weight: bold;
  }
  #block-secondarymenu li {
    display: inline-block;
    text-transform: uppercase;
    padding: 0;
    margin: 0 0 0 1em;
  }
  #block-secondarymenu a {
    color: white;
    padding: 0;
  }
  #navbar {
    position: fixed;
    top: 2em;
    right: 2em;
    background-color: transparent;
    border: none;
    z-index: 100;
  }
  body.user-logged-in #navbar {
    top: 7.5em; /* account for the admin menu */
  }
  /* MAIN NAV */
  #navbar-collapse {
    border: none;
  }
  #navbar nav#block-empac-main-menu {
    margin-left: 150px;
  }  
  #navbar nav#block-empac-main-menu ul li {
    font-family: "ff-meta-web-pro",Arial,Helvetica,sans-serif;
    font-size: 0.9em; /* nav text size */
    display: inline;
    text-transform: uppercase;
  }
  #navbar ul.menu > li:last-child {
    width: 30px;
  }
  #navbar nav#block-empac-main-menu a {
    padding: 15px 7px;
    color: black;
  }
  #navbar nav#block-empac-main-menu a:hover,
  #navbar nav#block-empac-main-menu a:focus {
    background-color: #e7e7e7;
    /*font-weight: bold;*/
  }
  #navbar nav#block-empac-main-menu .active a,
  #navbar nav#block-empac-main-menu .active a:hover,
  #navbar nav#block-empac-main-menu .active a:focus {
    background-color: unset;
    font-weight: bold;
  }

  /* FRONT PAGE */
  #frontpage-main-container {
    margin: 2em -2em 0em 1em;
    margin-top: 0; /* for chameleon hero */
  }
  #frontpage-container {
    margin: 0 2em;
  }
  .page-node-type-front-page .block-views-blockcalendar-block-3 {
    margin: 0;
  }
  #frontpage-videos-container > h2 {
    margin-left: -.7em;
  }
  .page-node-type-front-page .field--name-field-hero-video-credits-caption {
  margin-left: 1em;
  }
  .page-node-type-front-page #frontpage-videos-container {
    margin: 1em 3.9em 1.5em .95em;
  }
  #frontpage-videos-container .field--items {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    align-content: flex-start;
  }
  #frontpage-videos-container .field--item {
    flex: 0 1 48.5%;
  }
  #hero .event-type {
    margin: 1em 0 0em 1.41em;
  }
  #hero .field--name-field-caption {
    margin: 1em 3.8em 0;
  }
  #hero .field--name-field-media-credit {
    margin: 0 3.8em;
  }
/* toggle for news vs events .25 or 1em top */
  #hero h1.page-title {
    margin: .25em 0 0em 0.7em;
  }
  #hero .field--name-field-subtitle {
    margin: 0 0 0 0.73em;
  }
  #hero .calendar-event-date {
    margin: 0 0 0 1.1em;
  }

  /* CONTENT */
  .region-content {
    margin: 0 2em;
  } 
  
  #hero {
    margin: 0 -2em;
  } 
  
  .field--name-field-hero-arbitrary-html {
    margin-left: -2em;
  }
   
  /* CALENDAR */
  .region-content .form--inline {
    margin-top:2em; /*pad the top of the calendar form*/
  }
  .empac-collection .view-content,
  .field--name-field-front-page-videos {
    clear: both;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: stretch;
    align-content: flex-start;
    margin: 0 -15px;
  }
  .empac-featured .empac-collection .views-row,
  .empac-collection .views-row {
    flex: 0 1 50%;
    padding: 0 15px;
  }
  .empac-collection.empac-collection-interior .views-row {
    flex: 0 1 50%;
  }
  /* RxD calendar text styles */
  .empac-collection .calendar-event-date {
    font-size: .92em;
  }
  .empac-collection .calendar-event-title {
    font-size: 1.1em;
  }
  .empac-collection .calendar-event-instance-type,
  .empac-collection .calendar-event-presented-by {
    font-size: 0.65em;
  }
  /* Calendar search form */
  .empac-collection .view-header {
    margin: 0 4px 0 0;
    float: left;
  }
  .empac-collection-noform .view-header {
    margin-top: 2em;
    margin-bottom: 15px;
  }
  .empac-collection #edit-combine { /* combined search input */
    width: 220px;
  }
  .empac-collection #edit-field-start-date-value-1 {
    width: 200px;
    line-height: unset;
  }
  .empac-collection .form-actions .btn {
    margin-right: 10px;
  }

  /* EVENT PAGE */
  #node-container {
    padding: 2em 15px;
  }
  #node-container iframe {
    /*height: 400px; -- this keeps video from spanning 100% of col. -skj*/ 
    margin-bottom: .25em;
  }
  .field--item > .embed-responsive {
    margin-bottom: 1em;
  }

  /* VENUES - EMPAC CARDS */
  .empac-cards .view-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .empac-cards .views-row {
    flex-basis: 48%;
  }
  .empac-cards:nth-child(-n+2), /* remove top margins from first three cards */
  .empac-cards .views-row:nth-child(-n+2),
  .empac-cards .views-row:nth-child(-n+2):hover,
  .empac-cards .views-row:nth-child(-n+2):focus {
    margin-top: 0;
  }
  .list-event-image {
      padding-bottom: .2em;
  }
  .list-event-date {
      font-family: ff-meta-web-pro;
      font-size: 0.9em;
  }
  .list-event-title {
      font-family: ff-meta-web-pro;
      font-weight: 700;
      line-height: 1.8em;
      font-size: .9em;
  }
  .list-event-instance-subtitle {
      font-family: ff-meta-web-pro;
      font-size: .9em;
      margin-bottom: 1em;
  }
 
  /* STAFF / CURATORS (PEOPLE) / YEAR LISTINGS */
  .year-listing .view-content {
    /*-webkit-column-count: 3;
    -webkit-column-gap: 4em;
    -moz-column-count: 3;
    -moz-column-gap: 4em;
    column-count: 3;
    column-gap: 4em;*/
  }
  .year-listing .views-row {
    /*-webkit-column-break-inside: avoid;*/
    /*page-break-inside: avoid;*/
    /*break-inside: avoid;*/
    display: inline-block;
    vertical-align: top;
    margin-right: 1.6em;
    margin-bottom: 1.5em;
    width: 16em;  
  }
  body.page-node-type-person .field.field--name-body.field--type-text-with-summary p {
    /*max-width: 37em;*/
  }
  #block-views-block-research-block-1-2 .year-listing .views-row {
    display: unset;
    display: inherit;
    width: unset;
  }
 
  /* GENERAL */
  ul.program  {
    font-size: .8em;
    list-style: none;
    padding: 0 0 1em;
  }
  ul.program li {
    padding-bottom: 1em;
  }
  ul.program li.below--nospace {
    padding-bottom: 0;
  }
  ul.program li:last-child {
    padding-bottom: 0;
  }
  .initialMeat {
    font-family: "ff-meta-serif-web-pro",helvetica,serif;
  }
  ul.single-line-list { 
    font-size: 1.04em;
    padding: 0 0 1em;
  }
  ul.single-line-list li {}

/*i need to clean this up vv -skj*/
  .twoColumn {
    -webkit-column-count: 2;
    -webkit-column-gap: 20px;
    -moz-column-count: 2;
    -moz-column-gap: 20px;
    column-count: 2 200px;
    column-gap: 2.5em;
    margin: 1em 0 2em;
    padding: 0;
    text-align: left;
  }
  #twoColumn > article {
      -webkit-columns: 2 200px;
      -moz-columns: 2 200px;
      columns: 2 200px;
      -webkit-column-gap: 4rem;
      -moz-column-gap: 4rem;
      column-gap: 4rem;
  }
  #twoColumn > article > h3 {
    font-size: 1.2em;
    -webkit-column-span: all;
    column-span: all;
    margin: 2em 0 1em;
  }
  #twoColumn > article > h3.__no-margin {
    padding: 0;
    margin-top: 0;
  }
  #twoColumn > article > h3:nth-child(1) {
    margin-top: .8em;
  }
  .twoColContainer {
    break-inside: avoid;
  }

  article #commissions {
    column-rule: unset;
    -webkit-column-rule: unset;
    columns: 1;
    -webkit-column-count: 1;
    -moz-columns: 1;
  }

  article > ul.program li {
    font-size: 1.295em;
  }
  .threeColumn {
    -webkit-column-count: 3;
    -webkit-column-gap: 20px;
    -moz-column-count: 3;
    -moz-column-gap: 20px;
    column-count: 3;
    column-gap: 20px;
    margin: 1em 0 2em;
    padding: 0;
    text-align: left;
    list-style: none;
  }
  .twoColumn li,
  .threeColumn li {
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
  }
  /*.twoColumn li {
    margin-left: 0.5em;
  }*/
  iframe {
    height: 450px;
  }
  svg.fa-accessible-icon {
    display: initial;
    float: left; 
    margin: 0em .3em 0em 0;
  }
  .field--name-body > ul.list__bullets {
  }
  .field--name-body > ul.list__bullets--indent > li {
    margin: 0 0 1em 2em;
  }

  /* FOOTER */
  #colophon #footer {
    margin: 2em 4em;
  }
  #colophon #block-footercontactinformation {
    float: left;
    width: 300px;
    padding-right: 2em;
  }
  #colophon #block-fullmenu {
    float: left;
    width: calc(100% - 300px);
    font-size: 1.4em;
  }
  #colophon #block-fullmenu ul.menu--full-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start; /* this is best */
  }
  #colophon #block-fullmenu ul.menu--full-menu li {
    flex-basis: 33%;
  }
  /*
  #colophon li a {
    color: rgba(0,0,0,1);
    padding: .6em 0; 
  }
  */
  #colophon #block-fullmenu a {
    padding: 0.6em;
  }
  #colophon nav ul li {
    margin: 3.9em 0 1.5em;
  }
  /*set the top margin for the last three footer uls when they wrap */
  #colophon nav ul li.dropdown:nth-child(n+4) {
    margin: 0em 0 1.5em;
  }
  #colophon .dropdown-menu > li > a {
    white-space: normal;
  }
  #block-newsletterfootercallout {
    margin: 0em 1em 1em 25.6em;
  }
}

/* Special Treatment for Main Menu (top nav) */
@media only screen and (min-width: 845px) {
  /* MAIN MENU */
  #navbar nav#block-empac-main-menu ul li {
    font-size: 1em;
  }
  #navbar nav#block-empac-main-menu a {
    padding: 15px 8px;
  }
}

/* Special Treatment for Main Menu (top nav) */
@media only screen and (min-width: 890px) {
  /* MAIN MENU */
  #navbar nav#block-empac-main-menu ul li {
    font-size: 1.1em;
  }
  #navbar nav#block-empac-main-menu a {
    padding: 15px 8px;
  }
}


/* Medium Devices, Desktops */
@media only screen and (min-width: 992px) {
  /* EVENT PAGE */
  #node-column-one {
    padding-right: 2.2em;
  }
  #node-container .event-date-box {
    width: 265px; /* do not expand box */
  }
  #node-container .event-info-place-price {
    width: 50%;
    font-size: .9em;
    margin-left: 1em;
  }
  #node-container .event-button .btn-primary {
    font-size:.9em;
  }
  #node-container .field--name-field-event-notes {
    margin-left: 1em;
  }
  /* funding RxD text styles */
  #node-column-two .field--name-field-event-funding p, 
  #node-column-two .field--name-field-credits p {
    font-size: .84em;
  }
  /* RxD calendar text styles */
  .empac-collection .calendar-event-date {
    font-size: 1em;
  }
  .empac-collection .calendar-event-title {
    font-size: 1.2em;
  }
  .empac-collection .calendar-event-instance-type,
  .empac-collection .calendar-event-presented-by {
    font-size: 0.8em;
  }
  /* calendar filters */
  .empac-collection #edit-submit-calendar {
  margin-top: 1.4em;
  }
}

/* Special Treatment for Main Menu (top nav) */
@media only screen and (min-width: 1040px) {
  /* MAIN MENU */

  #navbar nav#block-empac-main-menu ul li {
    font-size: 1.2em;
  }
  #navbar nav#block-empac-main-menu a {
    padding: 15px;
  }
}



/* Medium Devices, Desktops */
@media only screen and (min-width : 1120px) {
  /* CALENDAR */
  .empac-collection.empac-collection-interior .views-row {
    flex: 0 1 33%;
  }
  /* RxD calendar text styles */
  .empac-collection.empac-collection-interior .calendar-event-instance-type,
  .empac-collection.empac-collection-interior .calendar-event-presented-by {
    font-size: 0.75em;
  }
  .empac-collection.empac-collection-interior .calendar-event-date {
    font-size: 0.9em;
  }
  .empac-collection .calendar-event-title {
    font-size: 1.2em;
  }
  /*FP event blocks */
  body.page-node-type-front-page .empac-collection.empac-collection-interior .views-row {
    flex: 0 1 33%;    
  }
  body.page-node-type-front-page .empac-collection.empac-collection-interior .views-row:nth-child(4) {
  display: none;
  }
  /* FEATURED */
  .empac-featured.empac-collection.empac-collection-interior .views-row {
    flex: 0 1 50%;
  }
  /* RECENT VIDEO */
  .page-node-type-front-page #frontpage-videos-container {
    margin-right: 4.5em;
  }
  /* FOOTER */
  #colophon #block-fullmenu ul.menu--full-menu {
    flex-wrap: nowrap;
  }
  #colophon #block-fullmenu ul.menu--full-menu li {
    flex-basis: 16.7%; /*auto*/
  }
  /*reset the top margin for the last three uls when they wrap */
  #colophon nav ul li, #colophon nav ul li.dropdown:nth-child(n+4) {
    margin: 3.9em 0 1.5em;
  }
  #block-newsletterfootercallout {
    margin: 0em 1em 1em .7em;
  }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
  /* VENUES - EMPAC CARDS */
  .empac-cards .views-row {
    flex-basis: 32%;
  }
  .empac-cards:nth-child(-n+3), /* remove top margins from first three cards */
  .empac-cards .views-row:nth-child(-n+3),
  .empac-cards .views-row:nth-child(-n+3):hover,
  .empac-cards .views-row:nth-child(-n+3):focus {
    margin-top: 0;
  }
  /* event dates*/
  #node-container .event-info-place-price {
    font-size: unset;
    margin-left: unset;
  }
  #node-container .event-button .btn-primary {
    font-size: unset;
  }
  #node-container .field--name-field-event-notes {
    margin-left: unset;
  }
  /* funding RxD text styles */
  #node-column-two .field--name-field-event-funding p,
  #node-column-two .field--name-field-credits p {
    font-size: .9em;
  }
  /* CALENDAR */
  /* RxD calendar text styles */
  /*.empac-collection .calendar-event-title {
    font-size: 1.4em;
  }*/
  .empac-collection.empac-collection-interior .calendar-event-instance-type {
    font-size: 0.75em;
  }
  .empac-collection.empac-collection-interior .calendar-event-date {
    font-size: .97em;
  }
  .empac-collection.empac-collection-interior .calendar-event-title {
    font-size: 1.2em;
  }
}



/* make the full center name only appear when it has room to breathe */
@media only screen and (min-width : 1275px) {
  /*EMPAC full name */
  #block-brandingempacfullname {
    display: block;
    position: absolute;
    top: 40px; /*37px*/
    left: 255px;
    font-size: 12px;
    font-family: "ff-meta-web-pro",Arial,Helvetica,sans-serif;
  }
  #block-brandingempacfullname a {
    color: black;
  }
}

/* Very Large Devices, Very Wide Screens */
@media only screen and (min-width : 1400px) {
  /* FRONT PAGE */
  /*#frontpage-main-container .empac-collection .views-row:last-child {
    display: none;
  }*/

  /* CALENDAR */
  .empac-collection .views-row {
    flex: 0 1 33%;
    /*flex: 0 1 25%;*/
  }
  .empac-collection.empac-collection-interior .views-row {
    flex: 0 1 25%;
  }
  /* RxD calendar text styles */
  .empac-collection.empac-collection-interior .calendar-event-date {
  font-size: .867em;
  }
  .empac-collection.empac-collection-interior .calendar-event-instance-type {
    font-size: .75em;
  }
  .empac-collection.empac-collection-interior .calendar-event-instance-subtitle {
  font-size: .9em;
  }
  .empac-collection .calendar-event-title {
    font-size: 1.3em;
  }
  /* FEATURED */
  .empac-featured.empac-collection.empac-collection-interior .views-row {
    flex: 0 1 50%;
  }
  /* RECENT VIDEO */
  .page-node-type-front-page #frontpage-videos-container {
    margin-right: 4em;
  }
  /*FP event blocks */
  body.page-node-type-front-page .empac-collection.empac-collection-interior .views-row {
    flex: 0 1 25%;
  }
  body.page-node-type-front-page .empac-collection.empac-collection-interior .views-row:nth-child(4) {
    display: unset;
  }
}
/* massive Screens */
@media only screen and (min-width : 1600px) {
  #frontpage-videos-container > div > .field--item {
    flex: 0 1 32%;
  }
  body.page-node-type-front-page #frontpage-videos-container > div > .field--item:nth-child(4) {
    display: none;
  }
}
