/* FILE: main/header/__banner.scss */

//
// Site banner on front page
//





.site-banner {
	clear: both;
	position: relative;
	border-color: currentColor;

	a {

		&,
		&:hover {
			text-decoration: none;
		}

	}

	.post .entry-title {
		@extend %font_weight_400;
	}



	&-header {
		position: absolute;
		width: 100%;
		bottom: 1rem;

		@include responsive( map_get( $breakpoint, 'l' ) ) {
			bottom: 19%;
		}

	}



	&-title {
		width: 88%;
		max-width: 1020px;
		padding: 0;
		padding-#{$right}: 5rem; // {{RTL}}
		margin: 0 auto;
		text-transform: none;
		letter-spacing: 2px;
		font-size: 1.38rem;
		color: inherit;

		@include responsive( map_get( $breakpoint, 'm' ) ) {
			font-size: 2.38rem;
		}

		@include responsive( map_get( $breakpoint, 'l' ) ) {
			padding-#{$right}: 19rem;
			font-size: 3.62rem;
		}

	}



	&-media {
		position: relative;
		z-index: 0;

		&::before {
			content: '';
			position: absolute;
			display: block;
			width: 100%;
			height: 38%;
			#{$left}: 0; // {{RTL}}
			bottom: 0;
			z-index: 1;
		}

	}

}



.entry {

	.no-js .site-banner.enable-slider &,
	.enable-slider .site-banner-inner:not(.slick-slider) & {
		display: none;

		&:first-child {
			display: block;
		}

	}

}