/* OpSec Resource Center
------------------------------------------- 

Table of contents
	- Archive
	- Single Page
	- Featured Loop
	- Media Queries

------------------------------------------- */

/* Archive
-------------------------------------------- */

.post-type-archive-resources .site-inner {
	padding: 80px 24px;
}

.resources-loop {
	display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 80px 0;
}

.resource-container {
	display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 65%
}

.resource-filters {
	width: 30%;
}

.resource.card {
	background-color: #fff;
	border: 1px solid #3167BE;
	display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: 2%;
	min-height: 336px;
	padding: 56px 40px 40px;
	position: relative;
	width: 49%;
}

.resource.card:before {
	background-color: #3167BE;
	content: '';
	height: 12px;
	left: 0;
	position: absolute;
	top: 0;
	transition:all ease 0.5s;
	width: 70%;
}

.resource.card:hover:before {
    width: 100%;
}

.resource .content-type-meta {
	margin-bottom: 8px;
}

.resource .content-type {
	color: #3167BE;
	font-size: 16px;
	font-weight: 700;
}

.resource .title-link {
	color: #001549;
    font-weight: 600;
    text-decoration: none;
}

.resource .title-link:hover,
.resource .title-link:focus {
	color: #3167be;
}

.resource .resource-more-link {
	margin-top: auto;
}

.resource.card:empty {
	background-color: transparent;
	border: none;
	margin-bottom: 0;
	min-height: 0;
	padding: 0;
}

.resource.card:empty:before {
	content: none;
}

.resource-filters section {
	background-color: #F3F3F3;
	border-bottom: 12px solid #001549;
	padding: 32px;
}

.resource-filters h3 {
	margin-bottom: 24px;
}

.resource-filters .facetwp-checkbox {
	background-image: url(/wp-content/uploads/2021/07/facet-checkbox-1.png);
	color: #001549;
	font-size: 16px;
	margin-bottom: 12px;
}

.resource-filters .facetwp-checkbox.disabled {
	background-image: url(/wp-content/uploads/2021/07/facet-checkbox.png);
}

.resource-filters .facetwp-checkbox.checked {
	background-image: url(/wp-content/uploads/2021/07/facet-checkbox-on.png);
}

.resource-filters .facetwp-toggle {
	font-size: 14px;
}

.facetwp-flyout {
	background-color: #F3F3F3 !important;
	border-bottom: 12px solid #001549;
	font-size: 16px;
	max-width: 100% !important;
	padding: 24px;
	width: 500px !important;
	z-index: 99999 !important;
}

.facetwp-flyout h3 {
	font-size: 20px;
}

.facetwp-flyout-close {
	color: #001549;
	font-size: 24px;
	font-weight: 900;
}

.facetwp-flyout-close:hover,
.facetwp-flyout-close:focus {
	color: #41b7e5;
}

/* Single Page
-------------------------------------------- */

.single-resources .site-container {
	display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: 100vh;
}

.single-resources .site-inner {
	width: 100%;
}

.single-resources .site-inner .content-sidebar-wrap {
    max-width: 960px;
}

.single-resources .entry-content {
	padding: 80px 0 200px;
}

.single-resources .resource-featured-image {
	margin-bottom: 40px;
}

.single-resources .resource-featured-image img {
	width: 100%;
}

.single-resources .site-container .wp-block-button .wp-block-button__link {
	background-color: #41B6E6 !important;
    border: 4px solid #41B6E6;
    border-radius: 0;
    color: #001549;
    font-weight: 900;
    padding: 8px 32px;
}

.single-resources .site-container .wp-block-button .wp-block-button__link:hover,
.single-resources .site-container .wp-block-button .wp-block-button__link:focus {
	background-color: transparent !important;
}

.single-resources .footer-widgets {
	margin-top: auto;
}

/* Featured Loop
-------------------------------------------- */

.featured-resource .content-type-wrap {
	margin-bottom: 4px;
}

.featured-resource .content-type {
	color: #3167BE;
    font-size: 16px;
    font-weight: 700;
}

.featured-resource h3 {
	margin-bottom: 24px;
}

.featured-resource-more-link {
	margin: auto 0 0;
}

/* Media Queries
------------------------------------------- */

@media (min-width: 500px) {
    .facetwp-flyout-open {
        display: none;
    }
}

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

	.resources-loop {
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
		padding: 40px 0;
	}

	.resource-container,
	.resource-filters {
		width: 100%;
	}

	.resource-filters .custom-html-widget {
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-flex-wrap: nowrap;
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-justify-content: flex-start;
		-ms-flex-pack: start;
		justify-content: flex-start;
		-webkit-align-content: stretch;
		-ms-flex-line-pack: stretch;
		align-content: stretch;
	}

	.resource-filters .custom-html-widget .facet-wrap {
		width: 50%;
	}

}

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

	.resource-filters .custom-html-widget {
		display: initial;
	}

	.resource-filters .custom-html-widget .facet-wrap {
		display: none;
	}

	.resource-filters .custom-html-widget .facet-wrap,
	.resource.card {
		width: 100%;
	}

}