
/**
 * 1. UIkit additions
 * 2. Reusable
 * 3. Fotoheader block
 * 4. Content Slider block
 * 5. Fotogrid block
 * 6. Prijstabel block
 * 7. Call to action block
 */

/* 1. UIkit additions */
/* 1.1 .uk-block-small */

.uk-block-small {
    padding-top: 15px;
    padding-bottom: 15px;
}
@media ( min-width: 768px ) {
    .uk-block-small {
        padding-top: 20px;
        padding-bottom: 20px;
    }
}
@media ( min-width: 1220px ) {
    .uk-block-small {
        padding-top: 30px;
        padding-bottom: 30px;
    }
}
.uk-text-normal {
	font-weight: normal !important;
}

/* 2. Resets */

.owcb-block {
	overflow-x: hidden; /* In case absolute children are wider than the window */
	background-position: center; /* For block background image */
	background-size: cover; /* For block background image */
}
.owcb-text:last-child > p:last-child {
	margin-bottom: 0;
}

/* 2. Reusable */

.owcb-overlay--dark {
	background: rgba( 0, 0, 0, 0.5 );
}
.owcb-overlay--light {
	background: rgba( 255, 255, 255, 0.5 );
}
.owcb-overlay--half-dark {
	background: rgba( 0, 0, 0, 0.25 );
}
.owcb-overlay--half-light {
	background: rgba( 255, 255, 255, 0.25 );
}

/* 3. Fotoheader block */
/* //todo responsive */

.owcb-fotoheader {}
.owcb-fotoheader-inner {}
.owcb-fotoheader .uk-container {
	width: 100%;
}
.owcb-fotoheader--height-small {
	min-height: 300px;
}
.owcb-fotoheader--height-medium {
	min-height: 450px;
}
.owcb-fotoheader--height-large {
	min-height: 600px;
}
.owcb-fotoheader--height-fullscreen {
	height: 100vh; /* To make uikit vertical-aligning work it needs a height */
	max-height: 2300px;
}
@media ( max-width: 767px ) {
	.owcb-fotoheader {
		min-height: 0;
		height: auto;
	}
}

/* 4. Content Slider block */

.owcb-contentslider {}
.owcb-contentslider-container {}

/* 4.1 Slides */

.owcb-contentslider-slide {
	transition: opacity 0.3s;
}
.uk-slide-before,
.uk-slide-after {
	opacity: 0.5;
}
.owcb-contentslider-slide-inner {
	position: relative; /* For overlay positioning */
	padding: 50px 90px;
}

/* 4.2 Widths */

.owcb-contentslider--w100p {}

/* 4.3 Heights */

.owcb-contentslider-container,
.owcb-contentslider-slide-inner {
	box-sizing: border-box;
}
.owcb-contentslider--h400px .owcb-contentslider-container,
.owcb-contentslider--h400px .owcb-contentslider-slide-inner {
	height: 400px;
}
.owcb-contentslider--h450px .owcb-contentslider-container,
.owcb-contentslider--h450px .owcb-contentslider-slide-inner {
	height: 450px;
}
@media ( max-width: 767px ) {
	.owcb-contentslider--h400px .owcb-contentslider-container,
	.owcb-contentslider--h400px .owcb-contentslider-slide-inner {
		height: 300px;
	}
	.owcb-contentslider--h450px .owcb-contentslider-container,
	.owcb-contentslider--h450px .owcb-contentslider-slide-inner {
		height: 325px;
	}
}

/* 4.4 Slide content */

.owcb-contentslider-slide-content {
	width: 100%; /* Because uikit vertical align middle can make it an inline-block */
}
.owcb-contentslider-slide-title {
	margin-top: 0 !important;
}
.owcb-contentslider-slide-title:last-child {
	margin-bottom: 0 !important;
}
.owcb-contentslider-slide-text {}
.owcb-contentslider-slide-text p:last-child {
	margin-bottom: 0;
}

/* 4.5 Navigation arrows */

.owcb-contentslider-arrow {
	display: block !important;
	transition: color 0.3s;
}
.owcb-contentslider-arrow--left {}
.owcb-contentslider-arrow--right {}

/* 5. Fotogrid block */

.owcb-fotogrid {}
.owcb-fotogrid-item {}
.owcb-fotogrid-item-inner {
	width: 100%;
	position: relative;
	overflow: hidden;
	background-position: center;
	background-size: cover;
}
.owcb-fotogrid-item-content {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
.owcb-fotogrid-item-inner--height-auto .owcb-fotogrid-item-content {
	position: static;
}
.owcb-fotogrid-overlay {
	transition: opacity 0.25s;
}
.owcb-fotogrid-overlay--initial {
	opacity: 1;
	z-index: 0;
}
.owcb-fotogrid-overlay--hover {
	opacity: 0;
	z-index: 1;
}
.owcb-fotogrid-item--has-hover:hover .owcb-fotogrid-overlay--initial {
	opacity: 0;
}
.owcb-fotogrid-item--has-hover:hover .owcb-fotogrid-overlay--hover {
	opacity: 1;
}

/* 6. Prijstabel block */

.owcb-prijstabel {}
.owcb-prijstabel-col {}
.owcb-prijstabel-col--primary {}
.owcb-prijstabel-col-title {}

/* 7. Call to action block */

.owcb-calltoaction {}
.owcb-calltoaction--buttonright {}
.owcb-calltoaction--buttonbelow {}
.owcb-calltoaction-col {}
.owcb-calltoaction .owcb-buttons {
	text-align: center;
}
.owcb-calltoaction--buttonright .owcb-buttons {
	text-align: right;
}
@media ( max-width: 767px ) {
	.owcb-calltoaction .owcb-calltoaction-col {
		text-align: center;
	}
}
