/*!
Theme Name: 	Bootsrap on WordPress
Theme URI: 		https://bootstraponwordpress.com/
Description: 	Bootstrap 5 on Wordpress
Version: 		4.1.1
Author: 		Babobski
Author URI: 	https://www.babobski.nl
Tags: 			babobski, bootstrap, basic theme
*/

html { font-size: 16px; }
* { box-sizing: border-box; }
.spacer { clear: both; }
.vert-center { position: relative; top: 50%; transform: translateY(-50%); }

.splash-full-size {
	width: 100%;
	height: 100vh;
}

.splash-left {
	width: 55%;
	height: 100vh;
	float: left;
	background-color: #96a020;
	background-image: url('images/block-island-left-min.jpg');
	background-size: cover;
	background-position: center center;
	position: relative;
}

.splash-left-inner {
	position: absolute;
	width: calc(100% - 3rem);
	height: calc(100% - 3rem);
	left: 1.5rem;
	top: 1.5rem;
	border: 0.25rem solid white;
	box-shadow: inset 0rem 0rem 5rem #0000008f;
}

.splash-left img {
	width: 62%;
	display: table;
	margin: 0 auto;
}

.splash-right {
	width: 45%;
	height: 100vh;
	float: left;
	position: relative;
}

.splash-top {
	width: 100%;
	height: 60%;
	position: absolute;
	top: 0;
	left: 0;
	background-color: white;
	border-bottom: 2rem solid #000b44;
    padding-left: 7%;
    padding-right: 7%;
}

.splash-bottom {
	width: 100%;
	height: 40%;
	position: absolute;
	top: 60%;
	left: 0;
	background-color: #3b6072;
	text-align: center;
	padding: 2%;
}

.splash-page nav.navbar {
	display: none;
}

.splash-bottom h2 {
	text-transform: uppercase;
	color: white;
	font-size: 1.25rem;
	letter-spacing: 4px;
	margin-bottom: 0;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
}

.splash-bottom h1 {
	text-transform: uppercase;
	color: white;
	font-size: 4rem;
	letter-spacing: 0px;
	margin-bottom: 0;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	margin-bottom: 1rem;
}

.splash-bottom p a {
	text-decoration: none;
	color: white;
	transition: all 0.25s ease; -webkit-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -o-transition: all 0.25s ease;
}

.splash-bottom p a:hover {
	color: #fff7c7;
	transition: all 0.25s ease; -webkit-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -o-transition: all 0.25s ease;
}

.splash-bottom p {
	padding-top: 1rem;
	margin-bottom: 0;
	color: white;
	font-family: 'Sofia Sans Condensed', sans-serif;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 1.25rem;
	border-top: 2px solid #000b44;
	max-width: 80%;
	margin-left: auto;
	margin-right: auto;
}

.splash-bottom p span {
	margin-left: 0.5rem;
	margin-right: 0.5rem;
}























@media only screen and (max-width: 1199px) {

html { font-size: 15px; }

}

@media only screen and (max-width: 991px) {

html { font-size: 14px; }
.splash-bottom h2 { font-size: 1rem; letter-spacing: 3px; }
.splash-bottom h1 { font-size: 3rem; }
.splash-bottom p { letter-spacing: 1px; font-size: 1rem; }

}

@media only screen and (max-width: 767px) {

html { font-size: 13px; }
.splash-full-size { width: 100%; height: auto; }
.splash-left { height: 50vh; width: 100%; }
.splash-right { width: 100%; height: auto; }
.splash-right .vert-center { transform: none; top: 0; }
.splash-top, .splash-bottom { position: relative; top: 0; }
.splash-top { padding-top: 4%; padding-bottom: 4%; }
.splash-bottom { padding: 6% 4%; }

}

@media only screen and (max-width: 575px) {

html { font-size: 12px; }

}