/*
Theme Name: WTFRC Base Theme
Author: Chris Outsourcing Solutions
Version: 1.0.0
*/

/*

Table of Contents

X.X Wraps, Elements, Containers
X.X Home Page
X.X Media Queries

*/

/*------------------------------------------------------------------------------
X.X Wraps, Elements, Containers
------------------------------------------------------------------------------*/

.wrap {
  margin: auto;
  max-width: 1280px;
  padding: 0 30px;
  width: 100%;
}

/*------------------------------------------------------------------------------
X.X Navigation
------------------------------------------------------------------------------*/

#main-header {
  box-shadow: 0 2px 2px rgba(10,10,10,.2);
}

.social-nav-container {
  background-color: #6D346B;
  text-align: center;
  width: 100%;
}

.social-nav {
  list-style: none;
  margin: 0;
  padding: 0;
}

.social-nav-item {
  display: inline-block;
  margin-right: 30px;
  padding: 4px 0;
}

.social-nav-item:last-child {
  margin-right: 0;
}

.social-nav-item i {
  color: #fff;
}

/*------------------------------------------------------------------------------
X.X Home Page
------------------------------------------------------------------------------*/

#front-page-1 {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 640px;
  position: relative;
}

/* Front Page 1 Page Banner Menu */

#front-page-1 .page-banner-section {
  bottom: 0;
  min-height: inherit;
  padding: 0;
  position: absolute;
  width: 100%;
}

#front-page-1 .page-banner-section #page-banner-menu li {
  transition: .3s;
}

#front-page-1 .page-banner-section #page-banner-menu li:hover {
  background-color: rgba(187,72,157,1);
}

/* Front Page 2 */

#front-page-2 {
  padding: 30px 0;
}

.front-page-2-grid {
  display: grid;
  grid-gap: 30px;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: auto;
}

.home-post {
  min-height: 540px;
  position: relative;
}

.home-post:first-child {
  grid-column: 1 / 3;
  grid-row: 1 / 3;
}

.home-post-image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.home-post:first-child .home-post-image {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.home-post:not(:first-child) .home-post-image {
  margin-bottom: 15px;
  height: 300px;
  width: 100%;
}

.home-post a {
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.home-post:first-child .home-post-content-container {
  background-color: rgba(253,253,253,.9);
  bottom: 60px;
  padding: 30px;
  position: absolute;
  text-align: center;
  width: 100%;
}

.home-post:first-child .home-post-content {
  margin: auto;
  max-width: 600px;
  text-align: left;
}

.more-posts {
  margin-top: 60px;
  text-align: center;
}

.more-posts .btn {
  background-color: #BB489D;
  opacity: 1;
  transition: .3s;
}

.more-posts .btn:hover {
  opacity: .8;
}

/*------------------------------------------------------------------------------
X.X Reports
------------------------------------------------------------------------------*/

.single-report #sidebar-wrapper {
  text-align: left;
}

.single-report #sidebar-wrapper h2 {
  word-break: break-word;
}

.keyword-list li {
  display: inline-block;
  list-style: none;
  margin-right: 15px;
}

.single-report img {
  height: auto;
  max-width: 100%;
  object-fit: contain;
}

.pdf-container {
  text-align: center;
}

/*------------------------------------------------------------------------------
X.X Events & Latest News
------------------------------------------------------------------------------*/

.blog-section {
	padding: 60px 0 0;
}

.blog-section_title,
.event-section_title {
	text-align: center;
}

.blog-post {
	padding: 15px 0;
}

.blog-post:not(:last-child) {
	border-bottom: 1px solid #e6e6e6;
}

.blog_title {
	margin-bottom: 0;
}

.event:not(:last-child) {
  margin-bottom: 32px;
}

/*------------------------------------------------------------------------------
X.X Color Modifications
------------------------------------------------------------------------------*/

.red .social-nav-container,
.red #main-header #header-menu .nav-links li .dropdown-menu,
.red #main-header #mobile-menu .nav-links li .dropdown-menu,
.red #sidebar-wrapper {
  background-color: #ff6666!important;
}

.red .page-banner-section #page-banner-menu li {
  background-color: rgba(255,102,102,.47)!important;
}

.red .page-banner-section #page-banner-menu li:hover,
.red ::selection,
.red .btn.btn-primary {
  background-color: #ff6666!important;
}

.red #main-header #header-menu .nav-links li .dropdown-menu li a:hover,
.green #main-header #header-menu .nav-links li .dropdown-menu li a:hover {
  color: #141414!important;
}


.green .social-nav-container,
.green #main-header #header-menu .nav-links li .dropdown-menu,
.green #main-header #mobile-menu .nav-links li .dropdown-menu,
.green #sidebar-wrapper {
  background-color: #339933!important;
}

.green .page-banner-section #page-banner-menu li {
  background-color: rgb(51,153,51,.47)!important;
}

.green .page-banner-section #page-banner-menu li:hover,
.green ::selection,
.green .btn.btn-primary {
  background-color: #339933!important;
}

.page-banner-section #page-banner-menu li {
  transition: .3s;
}

.white #main-header #header-menu .nav-links li .dropdown-menu li a,
.lt-grey #main-header #header-menu .nav-links li .dropdown-menu li a {
  color: #000;
}

.white #main-header #header-menu .nav-links li .dropdown-menu li a:hover,
.lt-grey #main-header #header-menu .nav-links li .dropdown-menu li a:hover {
  color: #BB489D;
}

.white .social-nav-container,
.white #main-header #header-menu .nav-links li .dropdown-menu,
.white #main-header #mobile-menu .nav-links li .dropdown-menu,
.white #sidebar-wrapper {
  background-color: #fff!important;
}

.white .social-nav-container,
.lt-grey .social-nav-container {
  border-bottom: 1px solid #000;
}

.white .social-nav-container i,
.lt-grey .social-nav-container i {
  color: #000!important;
}

.white #sidebar-wrapper,
.lt-grey #sidebar-wrapper {
  border-right: 1px solid #000;
}

.white #sidebar-wrapper *,
.lt-grey #sidebar-wrapper * {
  color: #000!important;
}

.white .page-banner-section #page-banner-menu li {
  background-color: #fff!important;
  border-bottom: 1px solid #000!important;
  border-top: 1px solid #000!important;
}

.white .page-banner-section #page-banner-menu li:not(:last-child),
.lt-grey .page-banner-section #page-banner-menu li:not(:last-child)  {
  border-right: 1px solid #000!important;
}

.white .page-banner-section #page-banner-menu li a,
.white .page-banner-section #page-banner-menu li i,
.lt-grey .page-banner-section #page-banner-menu li a,
.lt-grey .page-banner-section #page-banner-menu li i {
  color: #000!important;
}

.white .page-banner-section #page-banner-menu li:hover,
.white ::selection,
.white .btn.btn-primary,
.lt-grey .page-banner-section #page-banner-menu li:hover,
.lt-grey ::selection,
.lt-grey .btn.btn-primary {
  background-color: #BB489D!important;
}


.white .page-banner-section #page-banner-menu li:hover a,
.white .page-banner-section #page-banner-menu li:hover i,
.lt-grey .page-banner-section #page-banner-menu li:hover a,
.lt-grey .page-banner-section #page-banner-menu li:hover i {
  color: #fff!important;
}

.lt-grey .page-banner-section #page-banner-menu li {
  background-color: #e6e6e6!important;
  border-bottom: 1px solid #000!important;
  border-top: 1px solid #000!important;
}


.lt-grey .social-nav-container,
.lt-grey #main-header #header-menu .nav-links li .dropdown-menu,
.lt-grey #main-header #mobile-menu .nav-links li .dropdown-menu,
.lt-grey #sidebar-wrapper {
  background-color: #e6e6e6!important;
}


/*------------------------------------------------------------------------------
X.X Advanced Search
------------------------------------------------------------------------------*/

  .facetwp-facet input[type="text"] {
    max-width: 100%;
    min-width: 380px;
  }

  .facetwp-number {
    margin-right: 15px
  }
  .facetwp-autocomplete {
    margin-right: 15px;
  }
  
  .facetwp-facet input.facetwp-search, .facetwp-facet input.facetwp-location,
  .facetwp-autocomplete {
    margin-bottom: 12px;
    min-width: auto;
    max-width: 100%;
    width: 320px;
  }
  
  .facetwp-number {
    margin-bottom: 12px;
  }

/*------------------------------------------------------------------------------
X.X Media Queries
------------------------------------------------------------------------------*/

@media screen and ( max-width: 991px ) {

  .admin-bar #main-header.header-loaded {
    top: 32px!important;
  }

  #mobile-menu {
    overflow: scroll;
  }

  #main-header #mobile-menu .menu-wrap {
    height: auto!important;
    padding: 25px 0;
    text-align: center;
  }

  #main-header #mobile-menu .menu-wrap li.menu-active {
    border-bottom: 0;
    padding-bottom: 0;
  }

  #main-header #mobile-menu .menu-wrap li .dropdown-menu li:before {
    display: none;
  }

  #main-header #mobile-menu .menu-wrap li .dropdown-menu li {
    background: #fff;
    padding: 0;
  }

  #main-header #mobile-menu .menu-wrap li .dropdown-menu li a {
    border-bottom: 1px solid #BB489D;
    color: #BB489D;
    padding: 12px 5%;
    text-align: center;
  }
}

@media screen and ( max-width: 782px ) {

  .admin-bar #main-header.header-loaded {
    top: 46px!important;
  }
}

@media screen and ( max-width: 600px ) {


  .white #sidebar-wrapper,
  .lt-grey #sidebar-wrapper {
    border-bottom: 1px solid #000;
    border-right: 0;
  }

  .white .page-banner-section #page-banner-menu li,
  .lt-grey .page-banner-section #page-banner-menu li {
    border-bottom: 0!important;
    border-top: 0!important;
  }

  .white .page-banner-section #page-banner-menu li,
  .lt-grey .page-banner-section #page-banner-menu li {
    border-top: 1px solid #000!important;
  }

  .white .page-banner-section #page-banner-menu li:not(:last-child),
  .lt-grey .page-banner-section #page-banner-menu li:not(:last-child) {
    border-right: 0!important;
  }

  .white .page-banner-section #page-banner-menu li:last-child,
  .lt-grey .page-banner-section #page-banner-menu li:last-child  {
    border-bottom: 1px solid #000!important;
  }

  .front-page-2-grid {
    display: block;
  }
  .home-post:not(:last-child) {
    margin-bottom: 30px;
  }
  .home-post {
    min-height: 0;
  }
  .home-post a {
    position: relative;
  }
  .home-post:first-child .home-post-image {
    margin-bottom: 15px;
    height: 300px;
    width: 100%;
    position: static;
  }
  .home-post:first-child .home-post-content-container {
    background-color: transparent;
    padding: 0;
    position: static;
  }
}


@media screen and (min-width: 1030px) {
  .facetwp-facet-categories {
    columns: 3;
  }
}