$default-text-color: #282828;
$primary-color: #00a275;
$secondary-color: #0d7bb4;
$background-color: #ffffff;
$default-border-color: #bfbfbf;
$input-border-color: #bfbfbf;
$default-link-color: $primary-color; 

/* Heading-colors / defaults */
$default-h1-color: $primary-color; 
$default-h2-color: #333333; 
$default-h3-color: $primary-color; 
$default-h4-color: $secondary-color; 
$default-h5-color: $default-text-color; 
$default-h6-color: $default-text-color; 

$primary-font: 'Roboto', sans-serif;
$secondary-font: 'Roboto', sans-serif;

/*$narrow_wrapper: 920px;*/
/*$wide_wrapper: 2000px;*/
/*$wide_alt_wrapper: 1800px;*/

/*$content-default-padding-xs: 15px;*/
/*$content-default-padding-s: 15px;*/
/*$content-default-padding-m: 20px;*/
/*$content-default-padding-l: 30px;*/
/*$content-default-padding-xl: 40px;*/

@mixin override-button-styles 										{ display: inline-block; padding: 20px; font-size: 1em; margin: 0 3px 3px 0; border-radius:0; border:0px; background-color: $primary-color; color: #fff; text-transform:uppercase; font-weight: 700;}
/*@mixin override-button-styles-alt 									{ background-color: $secondary-color; color: #fff; } */
/*@mixin override-button-styles-cta 									{ background-color: $primary-color; color: #fff; } */

$mobile_fsz: 14;
$desktop_fsz: 16;

@import "../../../sf-master-twig/assets/css/styles.scss";
@import "_font_styles.scss";
@import "_navigation.scss";
@import "_slides.scss";

.row.flex:after                                               		{ display: none; }
body 																{font-weight: 300;}
.header-placeholder 												{display:none;}
header#header 														{
	.header-left-col 												{
		#logo 														{
			img 													{width: 65px; margin: 12px 0;}
		}
	}
	.site-search 													{display: none; float: none;}
	.header-buttons 												{display: none;}
	.header-right 													{margin: 0px;
		.search-form 												{background-color: #e5e5e5; border: 0px;
			.search-field 											{background-color: #e5e5e5; color: #444444 !important;}
			button[type="submit"] 									{background-color: #e5e5e5 !important; color: #444444 !important;}
		 }
	}
	hr 																{margin: 0px;}
}

#main-image-container 												{height: 300px; width: 100%;
	.main-image 													{width: 100%; height: 100%; background-size: cover; background-position: center center; background-repeat: no-repeat;}
	.main-image-overlay 											{position: absolute; width: 100%; height: 100%; z-index: 2; background-image: url('../img/alasivut-overlay.png');}
}

#main-content-area 													{
	ul 																{list-style: none; padding: 0;}
	ul li 															{padding-left: 30px; position: relative;}
	ul li:before 													{content: '-'; position: absolute; left: 18px; }

}

.half-lifts-content  												{
	.image-container 												{margin-bottom: 20px ; align-items: flex-end; display: flex;
		img { width: 100%; }
	}
	.background-image-overlay 										{padding: 0 20px; z-index: 5; background-color: rgba(0,0,0,0.1); width: 100%; height: 100%; }
	.content-col  													{ 
		.content-container 											{margin-bottom: 40px; 
			h3 														{font-weight: 300; color: #444444; font-size: em(30, $mobile_fsz);}
		}
	}
}

.page-template-page-category .content-wrapper 						{/*max-width: 780px;*/ margin: 0 auto;}

#outer-content-area-container 										{padding: 30px 0;}

.ingres-text 														{font-weight: 400; font-size: 18px; color: #333333;}
.previous-page-link 												{background-color: #333333;}

.product-background-image 											{height: 425px; background-size: contain; background-position: center center; background-repeat: no-repeat;}

.owl-carousel .product-image {
	& {
		background-color: #fff;
		overflow: hidden;
		width: 100%;
		height: 350px;
	}
	img {
		height: auto;
		width: auto;
		max-width: 100%;
		margin: 0 auto;
	}
}

@include media-from(s){
	.owl-carousel .product-image {
		& {
			height: 425px;
		}
	}
}
@include media-from(m){
	.owl-carousel .product-image {
		& {
			height: 525px;
		}
	}
}
@include media-from(l){
	.owl-carousel .product-image {
		& {
			height: 425px;
		}
	}
}


footer#footer 														{background-color: #f1f1f1;
	#copyright 														{color: #9a9a9a;
		a 															{color: #9a9a9a;}
	}
	.footer-logo img												{width: 70px;}
	
	.footer-right-side img											{width: 95px;}
	.footer-content-area 											{}
	.fab 															{font-size: 25px;}
}

@include media-to(588px){
	footer#footer {
		.footer-right-side .textwidget {
			display: flex;
			justify-content: start;

			p {
				margin-right: 40px;
			}
		}
	}
}			
@include media-from(589px){
	footer#footer .footer-content .row {
		display: flex;
		justify-content: space-between;

		.footer-logo {
			width: 150px;
		}
	}

}	
@include media-from(l){
	footer#footer .footer-content .row {
		.footer-logo {
			margin-right: 20px;
		}
	}

}
@include media-from(xl){
	footer#footer .footer-content .row {
		.footer-logo {
			width: 180px;
		}
	}

}
.half-lifts-content .image-container								{min-height: 0; background-size: cover; background-position: center center; background-repeat: no-repeat;}


@include media-from(m){

header#header 														{
	.header-left-col 												{
		#logo 														{
			img 													{width: 105px;}
		}
	}
}

	header#header 													{
		.search-mobile-container 									{display: inline-block; float: right;}
		.site-search 												{display: inline-block; margin-top: 40px;}
	}



.half-lifts-content  												{ padding: 0 80px;
	.image-container 												{}
	.content-col  													{
		.content-container 											{padding: 0px;
			h3 														{}
		}
	}
}

}
.page-template-page-news .half-lifts-content .image-container.relative.background-contain						{background-size: contain;}

@include media-from(l){



	.product-background-image 										{height: 435px;}

	footer#footer 														{
		#copyright 														{
			a 															{}
		}
		.footer-logo img 													{width:180px;}
		.footer-right-side img											{}
		.footer-content-area 											{}
	}



	header#header .header-left-col #logo img 						{width: 181px; margin: 0px;}

	.half-lifts-content .image-container							{min-height: 0; margin-bottom: 0px; height: 100%;}


	.half-lifts-content:nth-child(even)  							{
		.image-col 													{order:2;
			.button-container 										{position: absolute; bottom: 0; left: 0; z-index: 1;
				.link-button 										{background-color: $secondary-color; margin: 0px;}
			}
		}
		.content-container 											{margin-bottom: 40px; padding: 0 20px;}
		.content-col 												{
			order: 1;
			.content-container {
				padding: 20px 40px 20px 20px;
			}
		}
	}

.half-lifts-content:nth-child(odd) 									{
	.image-col 														{order: 1;
		.button-container 											{position: absolute; bottom: 0; right: 0;z-index: 1;
			.link-button 											{ margin: 0px;}
		}
	}
	.content-col 													{
		order: 2;
		.content-container {
			padding: 20px 20px 20px 40px;
		}
	}	
}

	.half-lifts-content  											{padding: 0;
		.content-col  												{
			.content-container										{padding: 20px 30px; margin-bottom: 0px;
				h3 													{font-size: em(30, $desktop_fsz);}
			}
		}
	}


}

@include media-from(xl){

	header#header 													{
		.header-placeholder.visible 								{display:block;}
		.fixed-moving-header.fixed 									{position: fixed; top: 0; left: 0; width:100%; z-index: 1030; background-color: #ffffff; transition: background-color 0.5s; -webkit-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.4); box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.4);
			hr 														{display: none;}
			.fixed-hidden-content 									{display: none;}
			.header-left-col 										{
				#logo 												{
					img 											{width: 90px; margin: 0; transition: width 0.5s;}
				}
			}

		}

	


	}


	header#header 													{
		hr 															{margin-top: 28px;}
		.header-buttons 											{display: inline-block; vertical-align: top;
			.link-button, .link-button-alt 							{margin-left: 10px; height: 55px; font-weight: 300; padding: 25px 12px 12px 12px; margin-bottom: 0px;}
		}
		.site-search 												{margin-top: 0;}
	}

	.half-lifts-content  											{
		.content-col  												{
			.content-container										{
				h3 													{font-size: em(35, $desktop_fsz);margin-bottom:.25em;}
			}
		}
	}

}


	.site-search 													{height: 55px;
		.search-form 												{height: 55px;
			button[type="submit"] 									{height: 55px; padding: 25px 12px 12px 12px !important;}
			.search-field 											{height: 55px; padding: 25px 12px 12px 12px;}
		}
	}

	.event-list {
		.event {
			& {
				display: grid;
				height: 100%;
				box-shadow: 0 0 5px #e9e9e9;
				border:1px solid #eee;
				cursor:pointer;
			}
			.event-details {
				& {
					padding: 10px 15px;
				}
				.event-details-header {
					& {
						margin-bottom: .5em;
					}
					.event-date, .event-category { 
						color: $default-text-color;
						display: inline-block;
						font-family: $secondary-font;
						margin: 5px 0;
						font-size: .85em;
					}
					.event-date-cat-sep {
						display: inline-block;
						color: $default-text-color;
						margin: 0 10px 0 5px;
					}
				}
				.event-excerpt {
					color: $default-text-color;
				}
			}
		}
	}

/* --------------------------
 *
 * Video container
 *
** ----------------------- */

.video-container { 
	& { 
		position: relative; 
		padding-bottom: 56.25%; 
		padding-top: 35px; 
		height: 0; 
		overflow: hidden; }
	iframe { 
		position: absolute; 
		top:0; 
		left: 0; 
		width: 100%; 
		height: 100%; 
	}
}
@include media-to(m){
	.wp-block-embed-youtube.wp-embed-aspect-16-9 {
		& {
			width: 100%;
		}
		.wp-block-embed__wrapper {
			& { 
				position: relative; 
				padding-bottom: 45.25%; 
				padding-top: 35px; 
				height: 0; 
				overflow: hidden; }
			iframe { 
				position: absolute; 
				top:0; 
				left: 0; 
				width: 100%; 
				height: 100%; 
			}
		}
	}
}