/**
 * @file
 * custom.css
 * 
 * Layout and Theme styles for the entire site
 * 
 * -------------------------------------------------
 * Attached thru `.info.yml`
 *
 ============================================================================ */

/**
 * Global
=========================================*/
body {
  font-family: 'Roboto', Arial, sans-serif;
  line-height: 1.5;
  font-size: 16px;
}

/* Media View */
@media (min-width: 50em) {
  .media-item.display-flex {
    flex-wrap: nowrap;
  }
  
  .midia-item__content {
    flex: 1;
    margin-left: 2em;
    margin-bottom: 2em;
  }
}

@media (max-width: 70em) and (min-width: 30em) {
  .midia-item__content {
    min-width: 25em;
  }
}
  
.media-item__image {
  min-width: 15em;
  margin: 0 auto 1em;
}

.midia-item__content {
  margin-bottom: 3em;
}


/**
 * Regions
=========================================*/

/*----------------------------
    Header
  ----------------------------*/
.site-logo-link {
  line-height: 0;
  margin: 1rem 0;
}

#block-toplinks {  overflow: hidden;  }

#block-toplinks ul {  margin: 0 -0.7rem;  }

#block-toplinks li {
  text-transform: uppercase;
  font-weight: 500;
  font-size: 0.9em;
  color: #333;
  margin: 1rem 0.7rem;
}

/*----------------------------
    Menu bar
  ----------------------------*/
.menu-bar {
  flex-basis: 100%;
  /* overflow: hidden; */
  border-top: 0.5em solid #111; 
}

.menu-bar-inner {
  display: flex;
}

.menu-bar ul {  margin: 0 -1.4em;  }

.menu-bar li {
  font-weight: 700;
  text-transform: uppercase;
  padding: 1rem 1.4em;
}

/* Fix padding */
#superfish-main .menu-bar li:first-child a {
    padding-left: 0;
}

/* Hide Electronic Issues */
#main-menu-link-content029f9a2b-f376-4878-8ea6-1422ab974178,
#main-menu-link-content029f9a2b-f376-4878-8ea6-1422ab974178-accordion {
  display: none;
}

/* Accordion */
#superfish-main-toggle {
    padding: .4em .6em;
    margin: .5em 0;
    color: #be1d2d;
    font-weight: bold;
    border: 2px solid;
}

@media (max-width: 1000px) { /* Fix Content Shifting on mobile */
  .sf-main.sf-horizontal {
    max-height: 48px;
    overflow: hidden;
  }

  .sf-main.sf-horizontal.sf-js-enabled {
    max-height: none;
    overflow: initial;
  }
}

/* Show top links menu in main menu */
li.js--show-in-sf-accordion {  display: none;  }

.sf-accordion li.js--show-in-sf-accordion {  display: inline-block;  }

@media (max-width: 767px) { /* Match with #sf-mainmenu */
    #block-toplinks {  display: none;  }
}

/* Search */
.search-form {
  position: relative;
  margin: 0.7rem 0 .3em auto;
  padding-left: 2em;
  z-index: 700;
}

.search-form .form-item label {
  background: center no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19.9 19.7'%3E%3Cg fill='none' stroke-width='2' stroke='%23848F91'%3E%3Cpath d='M18.5 18.3l-5.4-5.4'/%3E%3Ccircle cx='8' cy='8' r='7'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 1.5rem;
  width: 1.5rem;
  height: 1.8rem;
  cursor: pointer;
  position: relative;
  z-index: 20;
  text-indent: -99em;
  overflow: hidden;
  float: right;
}

.search-form .form-item input {
  width: 0;
  top: 0;
  position: absolute;
  right: 2.3rem;
  color: transparent;
  border-radius: .1em;
  z-index: 30;
  border: 1px solid transparent;
  transition: all .5s ease 0s;
  -webkit-transition: all .5s ease 0s;
  -webkit-box-shadow: none;
  box-shadow: none;
  background: transparent;
  font-size: .9em;
}

body.path-search .search-form input,
.search-form .form-item input:focus,
.search-form .form-item:hover input {
  background: #fff;
  border-color: #ccc;
  opacity: 1;
  width: 12em;
  max-width: 60vw;
  color: #000;
  padding: .4em .5em;
}

.search-form .form-actions {
  display: none !important
}

/*----------------------------
    Main Content
  ----------------------------*/
.main-content {
  padding: 2em 0 8rem;
}

/* Page Title */
#block-letsgo-page-title {  margin: 0 0 2rem;  }

/* Sidebar Tisement */
.side-tisements {
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
}

.side-tisement {
  line-height: 0;
  margin: 0 0 2em;
  border: 1px solid #ccc;
  box-shadow: 0 0 0.4em #ccc;
  /* float: left; */
}

@media (min-width: 450px) {  /* Temp - just until ads are resized */
  .side-tisement img,
  .fp--visements img {
    min-width: 390px;
  }
}

/* Video embed */
.sidebar-video {
  margin: 3em auto 0;
  max-width: 40em;
}

.video-embed-field-launch-modal {
  position: relative;
  line-height: 0;
  margin: 1em 0;
  background: #111;
  padding: 2em 0.4em;
  text-align: center;
}

.video-embed-field-launch-modal:after {
  content: '\25B6';
  display: inline-block;
  padding: .3em 1em;
  background: #111;
  color: #fff;
  border-radius: 0.7em;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -1.4em;
  box-shadow: .2em .2em .5em #000;
  pointer-events: none;
  line-height: 1.5;
}

/* Bottom Adver-tisement */
.footer-tisement {
  margin: 5rem 0 0;
}

@media (min-width: 1100px) {   /* Temp - just until ads are resized */
  .footer-tisement img {
    width: 1050px
  }
}

/*----------------------------
    Footer
  ----------------------------*/
.layout-footer {
  background: rgba(0,0,0,0.92);
  position: relative;
  color: #888;
  line-height: 2;
}

.layout-footer:after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  left: 0; right: 0;
  display: block;
  background: url(https://hashilthsa.com/sites/default/files/photos/Amos%20WEB.jpg?itok=586BKW1o) center;
  background-size: cover;
  z-index: -1;
  filter: grayscale();
}

.subfooter {
  padding: 4rem 0;
}

.subfooter-inner {
  justify-content: space-around;
}

.subfooter ul li {
  display: block;
}

/* Published By */
.subfooter-1 {
  text-align: center;
  font-size: 2rem;
  margin: 0 0 2rem;
  flex-basis: 100%;
}

/* Logos + Main Menu */
.subfooter-2-inner {
  display: flex;
  justify-content: space-around;
  max-width: 60em;
  margin: 0 auto;
}

@media (max-width: 50em) {
  .subfooter-2-inner {
    flex-wrap: wrap;
    text-align: center;
  }
}

#block-sitelogos,
.subfooter-2,
.subfooter-3 {
  margin: 0 5rem 2em 0;
  min-width: 10em;
}

@media (max-width: 89em) {
  .subfooter-2 {
    flex-basis: 100%;
  }

  #block-sitelogos,
  .subfooter-2,
  .subfooter-3 {
    margin: 0 3rem 2em;
  }
}

@media (max-width: 30em) {
  #block-sitelogos,
  .subfooter-2,
  .subfooter-3,
  .subfooter-4 {
    text-align: center;
    margin: 0 1rem 3em;
  }
}

/* Links + Social Icons */
#block-sociallinks {
  margin: 2rem 0;
}

/* Contributing Nations */
.subfooter-4 {
  min-width: 10em;
}

#block-letsgo-hashilthsa-block-5 {
  max-width: 39em;
  float: right;
}

.contrib-nations__logos img {
  height: 75px;
  width: auto;
  margin: 0 0.5em 0.5em;
}

/* Bottom Footer */
.footer {
  padding: 2em 0;
  border-top: 1px solid #333;
}

.footer-inner img {
    vertical-align: top;
}

@media (max-width: 1100px) {
  .footer-inner .row {
    min-width: 100%;
    text-align: center;
  }
}

/**
 * News Stories
=========================================*/
.articles--taxonomy .view-header {
  margin: 0 0 3rem;
}

/* Top Stories */
div.article-previews {
  overflow: hidden;
  margin: 0 0 2rem; /* 5rem - .article-preview */
}

.article-previews > .view-rows {
  margin: 0 -0.75rem;
}

.article-preview,
.article-preview ~ .views-row--display-flex-spacer {
  flex: 1 1 25em;
  max-width: 30em;
  margin: 0 auto;
}

.article-preview {
  padding: 0 0.75rem 3rem;
}

.article-preview__meta {
  margin: 0 0 .5em;
}
.article-preview__info {
  padding: .5em .7rem;
}

.article-preview__category {
  color: #D97469;
  text-transform: uppercase;
  font-weight: 500;
}

h3.article-preview__title {
  margin: 0 0 .5rem;
  font-size: 1.3rem;
  line-height: 1.3;
  font-weight: 700;
  color: #444;
}

h3.article-preview__title:hover {
  color: #B33330;
}

.article-preview__meta {
  margin: 0 0 .5rem;
}

.article-preview__descript {  color: #999;  }

/**
 * Reusuable
 ========================================*/
.article__text-small {
  color: #999;
  font-size: 0.9rem;
}
 
/**
 * Nodes
 ========================================*/

.field__label {
  margin: 1.3rem 0 0.5rem;
}


/* Labels (only used in Events) */
.field-label-inline {
  display: flex;
  align-content: center;
}
  
.field-label-inline .field__label {
  margin: 0 0 1em;
}

.field-label-inline .field__label:after {
  content: ': ';
  white-space: pre;
}

/* Files (currently only used in Events) */
.node--type-events .file + span {  display: none;  }

/* Files (For Facilities & Events) */
.file--application-pdf {
  background-image: url(/core/themes/seven/images/classy/icons/application-pdf.png);
}

.file--x-office-document {
  background-image: url(/core/themes/seven/images/classy/icons/x-office-document.png);
}

.file {
  display: inline-block;
  min-height: 16px;
  padding-left: 25px;
  background-repeat: no-repeat;
  background-position: left center;
}


/* Events */
.node--type-events .field-node--field-image {
  margin: 0 0 1em;
}

.node--type-events .field-node--field-date .field__item {
  font-size: 1.2em;
  line-height: normal;
}

.node--type-events .article__author-info-wrapper { /* Hide the author info */
    font-size: 0;
}

/* Add to Any */
#block-addtoany-node {
  margin-top: 3em;
}

#block-addtoany-node h2 {
  font-size: 0.9rem;
  margin: 0 0 0.3rem;
  color: #333;
  font-weight: 500;
}

/* Jobs Page */
.jobs tr {
  border-bottom: 1px solid #ccc;
}

.jobs .views-field-created {  min-width: 6em;  }

.jobs h3 {
  font-size: 1.1rem;
  color: #B33330;
}

@media (max-width: 750px) {
  .jobs thead {  display: none;  }

  .jobs td,
  .jobs tr {
      display: block;
      padding: 0.1em 0;
  }

   .jobs tr {
     border: none;
     padding-bottom: 1.5em;
   }
}

/**
 * Contact Page
 */

.contact_info td {
  padding: 1em 3em 0 0;
}

@media (max-width: 600px) {
  .contact_info td {
    display: block; 
  }

}

/* Subscribe */
.subscribe-form {
  max-width: 40em;
}

.subscribe-form legend,
.subscribe-form label {
  display: block;
  font-weight: bold;
  margin: 0 0 0.5em;
}

.subscribe-form input {
  font-size: 1rem;
  width: 100%;
  padding: .4em .6em;
}

.subscribe-form .webform-element-description {
  margin: 0.1em 0 0;
  font-size: 0.9em;
}

.webform-elements > .form-composite,
.webform-elements > .form-item {
  margin: 1.3em 0;
}

/* Fix the margins for flex-boxes */
.webform-flexbox {
  margin-top:0;
}

.webform-type-webform-name .webform-flexbox {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .webform-flex--container > .form-item > input {
    margin: 0 0 .5em;
  }
}

/* Submit button */
.subscribe-form .form-actions {
  margin: 2em 0 0;
  max-width: 6em;
}



/**
 * Responsive
 ========================================*/
.layout-sidebar {
  flex-basis: 100%;
  margin: 3em 0 0;
}

@media screen and (max-width: 1310px) {
  .side-tisement {
    margin: 1.5em 0.7em 0;
  }
}

@media screen and (min-width: 1311px) {
  .layout-sidebar {
    max-width: 390px;
    margin: 0 0 0 6rem;
  }
}