/* ==========================================================================
	Project:     Custom Blog - Brick Industry Association
	Date:        04/23/2024 - File created	
	Created by:  Third Wave Digital (www.thirdwavedigital.com)
========================================================================== */

/* Slideshow */
.blog-slideshow {position: relative; z-index: 0;-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size:cover; mask-size:cover; -webkit-mask-image: url(https://www.gobrick.com/img/mask-bricks-bottom-right.svg); mask-image: url(https://www.gobrick.com/img/mask-bricks-bottom-right.svg); -webkit-mask-position: bottom right; mask-position: bottom right;}
.blog-slideshow:before {width: 50%; height: 100%; content: ""; position: absolute; z-index: 0; background: linear-gradient(to right, rgba(0,0,0,0.75) 0%,rgba(0,0,0,0) 100%);}

.blog-slideshow .slick-arrow {border: none; z-index:2; position: absolute; top: 50%; background:none; padding: 0px; height: 30px; width: 30px;margin-top: -15px;}
.blog-slideshow .slick-arrow::after {content:""; border: 1px solid #fff;width: 15px; height: 15px;border-width: 0px 0px 2px 2px;display:block;}
.blog-slideshow .slick-prev {left: 10px}
.blog-slideshow .slick-next {right: 10px}
.blog-slideshow .slick-prev::after {-webkit-transform: rotate(45deg); -ms-transform: rotate(45deg);transform: rotate(45deg);margin-left:11px;}
.blog-slideshow .slick-next::after {-webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg);transform: rotate(-135deg);margin-left:5px;}

.blog-slideshow .slick-dots {margin: 0px; padding: 0px; display:-webkit-flex; display:flex; justify-content: flex-end; position: absolute;right: 15px; list-style: none; }
.blog-slideshow .slick-dots li {display:inline-block; margin-left: 10px;display:-webkit-flex; display:flex; align-items:center}
.blog-slideshow .slick-dots button {border: none; background:none; padding: 0px; height: 25px; width: 25px;display:-webkit-flex; display:flex; align-items:center}
.blog-slideshow .slick-dots button:focus {outline:none}
.blog-slideshow .slick-dots button::after {content:"";background: #fff;height: 2px;width: 100%; transition: height 250ms ease;}
.blog-slideshow .slick-dots .slick-active button::after {background: #B12C1B; height: 4px;}

.blog-slideshow .item::before {width: 50%; height: 100%; content: ""; position: absolute; z-index: 1; background: linear-gradient(to right, rgba(0,0,0,0.75) 0%,rgba(0,0,0,0) 100%);}
.blog-slideshow img {object-fit:cover; object-position: center center; width: 100%; height: 100%; position: absolute; z-index: -1; top: 0px; left: 0px}
.blog-slideshow .container-fluid {position: relative; z-index: 2;}

/* Toolbar */
.blog-toolbar form[role=search] {max-width: 300px}
.blog-toolbar form[role=search] input {font-size: .813rem; border:none; border-bottom: 1px solid #707070;}
.blog-toolbar form[role=search] input::placeholder {color: #808285}
.blog-toolbar form[role=search] input:focus {border-color: inherit; box-shadow: 0 0 0 .2rem rgba(0,0,0,.15);}
.blog-toolbar #filters {top: 110px; font-size: .813rem}
.blog-toolbar .btn-red {font-size: .813rem; padding: 0px 10px; height: 33px;transition: none; border:none;}
.blog-toolbar .btn-red::after {color: #fff;margin-left: 10px}
.blog-toolbar .btn-red[aria-expanded=true],.blog-toolbar .btn-red:hover, .blog-toolbar .btn-red:focus {background: #C56154;color: #fff}
.blog-toolbar .btn-red[aria-expanded=true]::after {color: #fff}
.blog-toolbar .dropdown:nth-child(2) {position: relative;}
.blog-toolbar .dropdown:nth-child(2)::before,.blog-toolbar .dropdown:nth-child(2)::after {content:""; height: 15px; top: 9px; width: 1px; background: white; display:block; position: absolute; z-index: 1;}
.blog-toolbar .dropdown:nth-child(2)::before {left: -1px}
.blog-toolbar .dropdown:nth-child(2)::after {right: 0px}
.blog-toolbar .dropdown-toggle[aria-expanded=true]::after {-webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg)}
.blog-toolbar .dropdown-menu {margin-top: -1px; background: #fff; border-radius: 0px; border:none; padding: 20px; font-size: .813rem;min-width: 200px;}
.blog-toolbar .dropdown-menu {overflow-y:auto; max-height:250px}
.blog-toolbar .dropdown-menu::-webkit-scrollbar {-webkit-appearance: none;width: 5px}
.blog-toolbar .dropdown-menu::-webkit-scrollbar-track {margin: 0px;background: #ccc; border-radius: 4px;}
.blog-toolbar .dropdown-menu::-webkit-scrollbar-thumb {background: rgba(0,0,0,.6);border-radius: 4px;}
.blog-toolbar .dropdown-menu::-webkit-scrollbar-thumb:hover {background: rgba(0,0,0,.6);}
.blog-toolbar .dropdown-menu .custom-control:not(:last-child) {margin-bottom: 3px}

.blog-toolbar .custom-control-input:not(:disabled):active~.custom-control-label::before {border-color: #ccc; background-color: #ccc}
.blog-toolbar .custom-control-input:checked~.custom-control-label::before {border-color: #B12C1B;background-color:#B12C1B}
.blog-toolbar .custom-control-input:focus { box-shadow: 0 0 0 .2rem rgba(177,44,27,.25);}
.blog-toolbar .custom-control-input:focus:not(:checked)~.custom-control-label::before {border-color:#B12C1B;}
.blog-toolbar .custom-control-input:focus~.custom-control-label::before {box-shadow: 0 0 0 .2rem rgba(0,0,0,.15);}

/* Cards */
.results .card a {color: #000}
.results .card img {aspect-ratio: 6 / 6.5; object-fit: cover;}
.results .card-overlay {font-size: .813rem; line-height: 1.4; transition: all 500ms ease; color: #fff; background: rgba(177,44,27,.9); position: absolute; top: 100%; left: 0px; width: 100%; border-top-left-radius: calc(.25rem - 1px); border-top-right-radius: calc(.25rem - 1px);opacity: 0; pointer-events: none; visibility: hidden;}
.results .active .card-overlay {opacity: 1; top: 0px; pointer-events: all; visibility: visible;}
.results .card-overlay .text-xs {font-size: .688rem;}
.results .card-overlay .text-light-red {color: #FFABA0}
.results .card-overlay .teaser {width: 100%; overflow:hidden; -webkit-box-orient: vertical; display: -webkit-box;-webkit-line-clamp: 3}
.results .card-title {z-index: 1}

/* Helpers */
.font-weight-medium {font-weight: 500}

/* Comments */
.blog-comments .form-control {font-size: .875rem}

/* Media Queries */
@media (min-width: 0px) {
	.blog-slideshow .item, .blog-slideshow .slick-track {height: 400px}
	.blog-slideshow .slick-dots { bottom: 55px; }
	.h1 {font-size: 1.5rem}
}

@media (min-width: 768px) {
	.blog-slideshow .item, .blog-slideshow .slick-track {height: 500px}
	.blog-slideshow .slick-dots { bottom: 75px; }
	.h1 {font-size: 2rem}
}

@media (min-width:992px) {
	.h1 {font-size: 2.5rem}
}

@media (min-width: 1200px) {
	.blog-slideshow .item, .blog-slideshow .slick-track {height: 550px}
}

@media (min-width: 1600px) {
	.blog-slideshow .item, .blog-slideshow .slick-track {height: 600px}
	.h1 {font-size: 2.75rem}
}