/* # GENERAL ----------- */

/* # BUTTONS ----------- */
.btn {
	align-items: center;
	background-color: #FFF;
	border: .125em solid #392d37;
	border-radius: 10em;
	box-shadow: 0 .25em 0 0 #00000026;
	color: #392d37;
	display: flex;
	flex: 0 auto;
	font-size: 1.75rem;
	font-weight: 400;
	grid-template-rows: auto auto;
	grid-template-columns: 1fr 1fr;
	grid-auto-columns: 1fr;
	min-height: 60px;
	justify-content: center;
	line-height: 1;
	margin-top: 1.75rem;
	padding-bottom: .1em;
	padding-left: 1em;
	padding-right: 1em;
	text-decoration: none;
	position: relative;
	transform: translateY(0em) rotate(0.001deg);
	transition: all 0.25s cubic-bezier(0.625, 0.05, 0, 1);
}

.btn:hover {
    background-color: #FFF;
    border-color: #392d37;
    box-shadow: 0em 0em 0em 0em rgba(0, 0, 0, 0.5);
    color: #392d37;
    transform: translateY(0.25em) rotate(0.001deg);
}

.btn-pink, .btn-yellow, .btn-orange, .btn-blue, .btn-green, .btn-purple,
.btn-pink:hover, .btn-yellow:hover, .btn-orange:hover, .btn-blue:hover, .btn-green:hover, .btn-purple:hover { color: #392d37 !important; }
.btn-pink:hover, .btn-yellow:hover, .btn-orange:hover, .btn-blue:hover, .btn-green:hover, .btn-purple:hover { border-color: #392d37; }

.btn-pink { background-color: #f489a3; }
.btn-pink:hover { background-color: #f489a3; }

.btn-yellow { background-color: #f5cc76; }
.btn-yellow:hover { background-color: #f5cc76; }

.btn-orange { background-color: #f0bb99; }
.btn-orange:hover { background-color: #f0bb99; }

.btn-blue { background-color: #b3dff1; }
.btn-blue:hover { background-color: #b3dff1; }

.btn-green { background-color: #b6d4ba; }
.btn-green:hover { background-color: #b6d4ba; }

.btn-purple { background-color: #c8b7d8; }
.btn-purple:hover { background-color: #c8b7d8; }

.buttons { align-items: flex-start; display: flex; flex-direction: row; }
.buttons .btn { color: #392d37; margin-top: 0; margin-right: 1rem; }

@media (max-width: 575px) {
	.buttons { align-items: center; flex-direction: column; }
}
@media (max-width: 375px) {
	.buttons .btn, .btn { font-size: 1.5rem; }
}


/* # HATS BLOCK ----------- */
.hats-block-col {
    display: flex;
    flex-direction: column;
}
.hats-block {
	align-items: center;
	background-color: rgba(255, 255, 255, .5);
	border: 10px solid white;
	border-radius: 2.5rem;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    overflow: hidden;
    padding: 3vmax 5vmax;
	height: 100%;
 }
.hats-block h1 { font-size: calc(3rem + .6vw);  }

@media (max-width: 480px) {
	.hats-block { padding: 3vmax 2vmax; text-align: center; }
}

/* # NEWS BLOCK ----------- */
.news .latest-card h4 a { color: #FFF; }
.news .latest-card img { border: .125em solid #392d37; border-radius: 20px; max-height: 250px; }

@media (max-width: 991px) {
	.news .latest-card img {
		max-height: 300px;
	}
}


/* # PODCAST BLOCK ----------- */
.podcast-img img { border: .125em solid #392d37; border-radius: 20px; }

/* # QUOTES BLOCK ----------- */
.hats-block.quotes { justify-content: space-between; }
.quotes { background-color: rgb(255 205 134); background-position: center; background-repeat: no-repeat; background-size: 40%; background-blend-mode: luminosity; }
.quotes .slick-slider { max-width: 100%; }
.quotes .slick-track { align-items: center; display: flex; }
.quotes li.quote.slick-slide { text-align: center; }
.quotes li.quote.slick-slide p { color: #FFF; font-size: 2.5rem; font-weight: 700; line-height: 1; margin-bottom: 0; }
.quotes .slick-next, .quotes .slick-prev { margin: 0; }
.quotes .slick-prev { left: -45px; }
.quotes .slick-next { right: -35px; }
.quotes .slick-next:before, .quotes .slick-prev:before { color: #FFF; font-size: 1.5rem; }
.quotes .slick-dots { display: none !important; }

@media screen and (max-width: 1480px) {
	.quotes { background-size: 60%; }
}
@media screen and (max-width: 1199px) {
	.quotes { background-position: left top; }
}
@media screen and (max-width: 1024px) {
	.quotes .slick-prev { left: -30px; }
	.quotes .slick-next { right: -30px; }
}
@media screen and (max-width: 768px) {
	.quotes { background-blend-mode: soft-light; background-position: right; background-size: contain; }
}
@media screen and (max-width: 480px) {
	.quotes { background-position: bottom; }
}

/* # REELS BLOCK ----------- */
.show_reels h3 { color: #ea7084; }
.show_reels .show_reels_col { display: flex; flex-direction: column; }
.show_reels .show_reels_col p { display: flex; flex: 1 0 auto; flex-direction: column; line-height: 1.1; }

.embed-container { 
	position: relative; 
	padding-bottom: 56.25%;
	overflow: hidden;
	max-width: 100%;
	height: auto;
} 

.embed-container iframe,
.embed-container object,
.embed-container embed { 
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}