/* Override default em style
---------------------------------------- */
em {
  font-style: italic;
  color: var(--text-color);
}

.placeholder {
  color: var(--light); // needed for search404 message em
}

/* Override home header color
---------------------------------------- */
.homepage .header {
  background: var(--light);
}

/* override header main color
---------------------------------------- */
.header-main {
  background: var(--light);
}

/* Override search form color
---------------------------------------- */
.search-box-open: {
  background: var(--light);
}

/* Override page header text color
---------------------------------------- */
.page-header h1, h2 {
  color: var(--dark);
}

.page-header {
  background: var(--light);
  color: var(--dark);
}

/* Override block titles
---------------------------------------- */
.field--type-text-long h1, h2 {
  color: var(--dark);
}

.layout .block .block-title {
  color: var(--dark);
  padding: 5px 0 0 15px;
}

/* Style images displayed in paragraphs
---------------------------------------- */
.field--name-field-image {
  width: 70%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Override body color
---------------------------------------- */
body {
  background-color: var(--light);
}

/* Style country profile view output
---------------------------------------- */
.country-profile-col {
  padding: 20px 15px;
  background: var(--dark);
  margin: 20px 10px 0;
  color: var(--light);
  text-align: center;
  height: 385px;
}

.field-content.country-profile-col img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 25%;
}

.views-field.views-field-field-first-paragraph {
  padding: 10px 10px 0;
}

/* Style taxonomy/term view output
---------------------------------------- */
.term-col {
  border: solid #B8D5F1 1px;
  margin: 20px 10px 0;
  text-align: center;
  height: 550px;
}

.term-col-title, .term-col-first-paragraph {
  padding: 10px 15px 0;
}

.feed-icon {
  margin-top: 20px;
}

/* Style recent content view output
---------------------------------------- */
.recent-content-block {
  background: #eee;
  margin: 0 0 30px;
}

.recent-content-block h2 {
  color: var(--text-color);
  padding: 5px 0 0 15px;
}

.recent-content-col {
  border: solid #B8D5F1 1px;
  margin: 20px 10px 0;
  text-align: center;
  height: 535px;
  background: var(--light);
}

.recent-content-title, .recent-content-first-paragraph {
  padding: 10px 15px 0;
}

/* Style one column layout
---------------------------------------- */
.layout.layout--onecol {
  margin: 20px 0 30px;
}

/* Style more link
---------------------------------------- */
.more-link {
  padding: 15px;
  text-align: center;
}

/* Style footer blocks
---------------------------------------- */
.footer-contact-us {
  float: right;
}

/* Style header
---------------------------------------- */
.header-container {
  border-bottom-style: solid;
  border-color: #B8D5F1;
}

/* Style book navigation links
---------------------------------------- */
.book-pager {
  list-style: none;
  display: flex;
  justify-content: space-between;
}

.book-pager .book-pager-item a:link {
  background-color: var(--primary);
  color: white;
  padding: 14px 25px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}

.book-pager .book-pager-item a:hover, a:active {
  background-color: var(--secondary);
}

.book-navigation .menu {
  display: none;
}

/* Position modal so it's below sticky header
---------------------------------------- */
.ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front {
  top: 100px !important;
}

@media (max-width: 420px) {
  .ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front {
    width: 98% !important;
    top: 155px !important;
  }
}

/* Indent lists
---------------------------------------- */
.node-content ul, ol {
  margin-left: 30px;
}

/* Position flexslider controls
---------------------------------------- */
.flex-direction-nav a::before {
  position: relative;
  bottom: 13px;
}

.slides, .slides > li, .flex-control-nav, .flex-direction-nav {
  padding: 0 20px;
  margin-right: 30px;
}

/* Megamenu overrides - config must select default style. First two rules fix having to
   click theme menu icon then click module menu icon in mobile view. The rest is colors.
   Required copying the black.css to this file and modifying per requirements.
---------------------------------------- */
.btn.btn-navbar.tb-megamenu-button {
  display: none;
}
.nav-collapse.always-show.collapse {
  height: auto !important;
  overflow: visible !important;
}
.tb-megamenu {
  background-color: #fff;
  color: var(--text-color);
}
.tb-megamenu .nav > li > a,
.tb-megamenu .nav > li > span.tb-megamenu-no-link {
  /*background: url(../../../../modules/contrib/tb_megamenu/images/line.png) no-repeat 100% 0;*/
  border-right: none;
  color: var(--dark);
  font-weight: bold;
}
.tb-megamenu .nav > li > a:focus,
.tb-megamenu .nav > li > a:hover,
.tb-megamenu .nav > li > span.tb-megamenu-no-link:focus,
.tb-megamenu .nav > li > span.tb-megamenu-no-link:hover {
  background-color: var(--light);
  color: var(--secondary);
}
.tb-megamenu .nav > .active > a,
.tb-megamenu .nav > .active > a:hover,
.tb-megamenu .nav > .active > a:focus,
.tb-megamenu .nav > .active > span.tb-megamenu-no-link,
.tb-megamenu .nav > .active > span.tb-megamenu-no-link:hover,
.tb-megamenu .nav > .active > span.tb-megamenu-no-link:focus {
  background-color: #FFFFFF;
  color: var(--secondary);
}
.tb-megamenu .nav-collapse .nav > li.active > a:hover,
.tb-megamenu .nav-collapse .nav > li.active > a:focus,
.tb-megamenu .nav-collapse .nav > li.active > span.tb-megamenu-no-link:hover,
.tb-megamenu .nav-collapse .nav > li.active > span.tb-megamenu-no-link:focus {
  background-color: var(--light);
  color: var(--secondary);
}
.tb-megamenu .row-fluid + .row-fluid {
  border-color: #EFEFEF;
}
.tb-megamenu .dropdown .caret {
  margin-left: 5px;
  border-top-color: #666;
  border-bottom-color: #666;
}
.tb-megamenu .nav li.dropdown > .dropdown-toggle .caret {
  border-top-color: #666;
  border-bottom-color: #666;
  margin-top: 8px;
}
.tb-megamenu .nav li.dropdown > .dropdown-toggle:hover .caret {
  border-top-color: #666;
  border-bottom-color: #666;
}
.tb-megamenu .nav li.dropdown.open > .dropdown-toggle .caret,
.tb-megamenu .nav li.dropdown.active > .dropdown-toggle .caret,
.tb-megamenu .nav li.dropdown.open.active > .dropdown-toggle .caret {
  border-top-color: #666;
  border-bottom-color: #666;
}
.tb-megamenu .dropdown-menu {
  -webkit-box-shadow: 0 5px 10px rgba(0,0,0,0.2);
  -moz-box-shadow: 0 5px 10px rgba(0,0,0,0.2);
  box-shadow: 0 5px 10px rgba(0,0,0,0.2);
}
.tb-megamenu .dropdown-menu li > a,
.tb-megamenu .dropdown-menu li > span.tb-megamenu-no-link {
  border-top: 1px solid #444;
  padding: 5px 20px;
  text-shadow: none;
}
.tb-megamenu .dropdown-menu li:first-child > a,
.tb-megamenu .dropdown-menu li:first-child > span.tb-megamenu-no-link {
  border-top: 0;
}
.tb-megamenu .navbar .nav > li > .dropdown-menu:before {
  display: none;
}
.tb-megamenu .navbar .nav > li > .dropdown-menu:after {
  display: none;
}
.tb-megamenu .dropdown-menu .disabled > a,
.tb-megamenu .dropdown-menu .disabled > a:hover,
.tb-megamenu .dropdown-menu .disabled > span.tb-megamenu-no-link,
.tb-megamenu .dropdown-menu .disabled > span.tb-megamenu-no-link:hover {
  color: #999;
}
.tb-megamenu .dropdown-menu .disabled > a:hover,
.tb-megamenu .dropdown-menu .disabled > span.tb-megamenu-no-link:hover {
  background-color: transparent;
}
.tb-megamenu .nav li.dropdown.open > .dropdown-toggle {
  background-color: #666;
  color: #ccc;
}
.tb-megamenu .nav li.dropdown.active > .dropdown-toggle {
  background-color: inherit;
  color: #7bb9e0;
}
/* change default colors for dropdown */
.tb-megamenu .nav > li.dropdown.open.active > a:hover,
.tb-megamenu .nav > li.dropdown.open.active > a:focus,
.tb-megamenu .nav > li.dropdown.open.active > span.tb-megamenu-no-link:hover,
.tb-megamenu .nav > li.dropdown.open.active > span.tb-megamenu-no-link:focus {
  background-color: #EFEFEF;
  color: var(--secondary);
}
.tb-megamenu .dropdown-menu {
  background-color: var(--light);
  border: none;
}
.tb-megamenu .dropdown {
  padding: 4px 0 0;
}
.tb-megamenu .dropdown-menu li > a,
.tb-megamenu .dropdown-menu li > span.tb-megamenu-no-link {
  color: var(--text-color);
  border-top: 1px solid #333;
}
.tb-megamenu .dropdown-menu li > a:hover,
.tb-megamenu .dropdown-menu li > a:focus,
.tb-megamenu .dropdown-submenu:hover > a,
.tb-megamenu .dropdown-menu li > span.tb-megamenu-no-link:hover,
.tb-megamenu .dropdown-menu li > span.tb-megamenu-no-link:focus,
.tb-megamenu .dropdown-submenu:hover > span.tb-megamenu-no-link {
  background: none;
  color: #7bb9e0;
}
.tb-megamenu .nav li.dropdown.open > .dropdown-toggle,
.tb-megamenu .nav li.dropdown.open.active > .dropdown-toggle {
  background-color: var(--light);
  color: #7bb9e0;
}
.tb-megamenu .mega-nav .mega-group > .mega-group-title,
.tb-megamenu .dropdown-menu .mega-nav .mega-group > .mega-group-title,
.tb-megamenu .dropdown-menu .active .mega-nav .mega-group > .mega-group-title {
  color: inherit;
  border: 0;
}
.tb-megamenu .mega-nav .mega-group > .mega-group-title:hover,
.tb-megamenu .dropdown-menu .mega-nav .mega-group > .mega-group-title:hover,
.tb-megamenu .dropdown-menu .active .mega-nav .mega-group > .mega-group-title:hover,
.tb-megamenu .mega-nav .mega-group > .mega-group-title:active,
.tb-megamenu .dropdown-menu .mega-nav .mega-group > .mega-group-title:active,
.tb-megamenu .dropdown-menu .active .mega-nav .mega-group > .mega-group-title:active,
.tb-megamenu .mega-nav .mega-group > .mega-group-title:focus,
.tb-megamenu .dropdown-menu .mega-nav .mega-group > .mega-group-title:focus,
.tb-megamenu .dropdown-menu .active .mega-nav .mega-group > .mega-group-title:focus {
  color: var(--secondary);
}
.sub-group-title {
  font-style: italic;
}
.tb-megamenu .tb-block {
  background: transparent;
  color: inherit;
}
.tb-megamenu .tb-block .block-inner {
  padding: 0;
}
.tb-megamenu .tb-block .block-title {
  background: inherit;
  color: #ddd;
}
.tb-megamenu .block-ct {
  background: inherit;
  color: inherit;
  padding: 0;
  *zoom: 1;
}
.tb-megamenu .block-ct:before,
.tb-megamenu .block-ct:after {
  display: table;
  content: "";
  line-height: 0;
}
.tb-megamenu .block-ct:after {
  clear: both;
}
.tb-megamenu .tb-block ul.unstyled,
.tb-megamenu .tb-block ol.unstyled,
.tb-megamenu .tb-block ul.nav,
.tb-megamenu .tb-block ol.nav {
  margin-left: 0;
}
.tb-megamenu .block_menu .nav {
  margin-bottom: 20px;
}
.tb-megamenu .block_menu .nav > li {
  border-top: 1px solid #444;
}
.tb-megamenu .block_menu .nav > li > a,
.tb-megamenu .block_menu .nav > li > span.tb-megamenu-no-link {
  padding: 5px;
}
.tb-megamenu .block_menu .nav > li:first-child {
  border-top: 0;
}
.tb-megamenu .block_menu .nav > li:first-child > a,
.tb-megamenu .block_menu .nav > li:first-child > span.tb-megamenu-no-link {
  padding-top: 0;
  border-top: 0;
}
/* increase padding for border-top */
.tb-megamenu .mega-nav > li a,
.tb-megamenu .dropdown-menu .mega-nav > li a,
.tb-megamenu .mega-nav > li span.tb-megamenu-no-link,
.tb-megamenu .dropdown-menu .mega-nav > li span.tb-megamenu-no-link {
  padding: 10px 0 0;
}

@media (max-width: 979px) {
  .tb-megamenu {
    background-image: none;
    background-color: inherit;
    color: inherit;
  }
  .tb-megamenu .nav-collapse,
  .tb-megamenu .nav-collapse .dropdown-menu {
    background-color: #333;
  }
  .tb-megamenu .nav-collapse .nav > li > a,
  .tb-megamenu .nav-collapse .dropdown-menu a,
  .tb-megamenu .nav-collapse .nav > li > span.tb-megamenu-no-link,
  .tb-megamenu .nav-collapse .dropdown-menu span.tb-megamenu-no-link {
    border-bottom-color: #444;
    border-top-color: #444;
    color: #eee;
  }
  .tb-megamenu .nav > li > a,
  .tb-megamenu .nav > li > span.tb-megamenu-no-link {
    color: #eee;
    border-right: 1px solid #444;
  }
  .tb-megamenu .nav > .active > a,
  .tb-megamenu .nav > .active > a:hover,
  .tb-megamenu .nav > .active > a:focus,
  .tb-megamenu .nav > .active > span.tb-megamenu-no-link,
  .tb-megamenu .nav > .active > span.tb-megamenu-no-link:hover,
  .tb-megamenu .nav > .active > span.tb-megamenu-no-link:focus {
    background-color: transparent;
  }
}

@media (max-width: 738px) {
  .tb-megamenu {
    color: inherit;
  }
  .tb-megamenu .nav-collapse .nav li a,
  .tb-megamenu .nav-collapse .nav li span.tb-megamenu-no-link {
    border-top-color: #444;
  }
  .tb-megamenu .nav-collapse .nav > li > a,
  .tb-megamenu .nav-collapse .dropdown-menu a,
  .tb-megamenu .nav-collapse .nav > li > span.tb-megamenu-no-link,
  .tb-megamenu .nav-collapse .dropdown-menu span.tb-megamenu-no-link {
    border-bottom: none;
    border-top-color: #444;
    color: #eee;
  }
  .tb-megamenu .row-fluid + .row-fluid {
    border-top-color: #444;
  }
}

.block-view-demo .views-field-field-image img {
  border: 1px solid #333;
}

.block-view-demo .item-list ul li {
  border-bottom: 1px solid #333;
}

.block-view-demo .views-field-title a:hover,
.block-view-demo .views-field-title a:focus {
  color: #7bb9e0;
}

.tb-megamenu .nav > li > a, .tb-megamenu .nav > li > span.tb-megamenu-no-link {
  padding: 15px 16px;
}

/* set font color white when background is dark
---------------------------------------- */
.em-text-white {
  color: var(--light);
}

/* flip card styles
   entire container, keeps perspective
---------------------------------------- */
.flip-container {
  perspective: 1000px;
}
/* flip the pane when hovered
---------------------------------------- */
.flip-container:hover .flipper, .flip-container.hover .flipper {
  transform: rotateY(180deg);
}

.flip-container, .front, .back {
  width: 320px;
  height: 480px;
}

/* flip speed goes here
---------------------------------------- */
.flipper {
  transition: 0.6s;
  transform-style: preserve-3d;
  position: relative;
}

/* hide back of pane during swap
---------------------------------------- */
.front, .back {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden; /* needed for safari */
  position: absolute;
  top: 0;
  left: 0;
}

/* front pane, placed above back
---------------------------------------- */
.front {
  z-index: 2;
  /* for firefox 31 */
  transform: rotateY(0deg);
}

/* back, initially hidden pane
---------------------------------------- */
.back {
  transform: rotateY(180deg);
}

/*  quick questions caption
---------------------------------------- */
.field-content.quick-question-title {
  text-align: center;
}

.field-content.quick-question-image {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 92%;
}

/* style owl carousel prev and next buttons
---------------------------------------- */
.owl-next, .owl-prev {
  height: 50px;
  width: 40px;
}

.owl-next span, .owl-prev span {
  font-size: 35px;
  border-radius: 3px;
  position: relative;
  bottom: 10px;
}

/* align views exposed filter label with select
---------------------------------------- */
#views-exposed-form-content-recent-page-1 .form-item-topic label {
  display: block;
  float: left;
  margin: 5px 5px 0 0;
}

/* don't display some page elements when printing
---------------------------------------- */
@media print {
  .block-region.region-primary-menu {
    display: none;
  }

  .mobile-menu {
    display: none;
  }

  .full-page-search {
    display: none;
  }

  .search-box-content {
    display: none;
  }

  .cookiealert.show {
    display: none;
  }

  .share-node {
    display: none;
  }

  .footer-blocks-container {
    display: none;
  }

  @page :not:first .header-container {
    display: none;
  }
}

/* center quick question card deck block title
---------------------------------------- */
#block-views-block-quick-questions-block-2 h2 {
  text-align: center;
}

/* style contributors list view table
---------------------------------------- */
.contributor-image {
  width: 110px;
}

.contributors-list td {
  border: none;
}

/* add vertical space between top menu and submenu
   add padding on sides
---------------------------------------- */
.tb-megamenu .nav > li > a {
  padding: 35px 16px;
}

.tb-megamenu-submenu.dropdown-menu {
  padding: 0 20px;
}

/* fix menu display in tablet landscape mode
---------------------------------------- */
.site-branding {
  padding-right: 0px;
}