/*
Theme Name: Hempstead
Author: Bright Development
Author URI: https://bright-development.com
Version: 1.0.0
Text Domain: hempstead
Template: twentytwentyone

*/


#maritime-training-popup #maritime-training-popup-responsive {
	@media (width >= 40rem) {
		flex-direction: row;
	}
}

#popup-left-panel, #popup-right-panel {
	@media (width < 40rem) {
		width: 90%;
	}
}

#hempstead a{
	color: inherit;
}
#hempstead a:focus,
#hempstead a:hover{
	outline: 0 !important;
	background: transparent !important;
	text-decoration: none !important;
}

body, html{
	color: #1b4954;
	font-size: 16px;
}

body p + p{
	margin-top: 15px;
}

#hempstead h1,
#hempstead h2,
#hempstead h3,
#hempstead h4,
#hempstead h5,
#hempstead h6{
	color: #2582d1;
}

#hempstead h3,
#hempstead h4,
#hempstead h5,
#hempstead h6{
	font-weight: 900;
}

#hempstead img{
	display: inline-block;
}

ul {
	font-family: 'Lato';
	font-size: 16px;
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}

ol {
	font-family: 'Lato';
}

li {
	font-family: 'Lato';
}

header{
	background-color: #fff;
	border-top: 23px solid #a3b8c6;
}
header > .container{
	padding-top: 10px;
	padding-bottom: 10px;
}

.header-navigation {
	background-color: #2582d1;
	padding-top: 15px;
	padding-bottom: 15px;
}
.header-navigation ul.menu {
	padding-left: 0;
	list-style: none;
	display: flex;
	gap: 25px;
}

#hempstead .header-navigation ul.menu a{
	color: #fff;
	font-size: 20px;
	text-decoration: none;
}

header .cta-heading {
	font-weight: 700;
	font-size: 20px;
	color: #1b4954;
	margin-bottom: 0;
	line-height: 1;
	margin-left: 5px;
}

header .cta-text {
	font-size: 16px;
	color: #1b4954;
	margin-bottom: 0;
	line-height: 1;
	margin-top: 5px;
	margin-left: 5px;
}
.header-search-toggle{
	cursor: pointer;
}

.header-search-toggle + form{
	width: 100%;
	transition: all 0.3s ease;
	overflow: hidden;
	max-width: 250px;
}
.header-search-wrapper form input{
	width: 100%;
	border: 1px solid #1b4954 !important;
	height: auto !important;
	padding: 2px 15px !important;
}
.header-search-toggle:not(.active) + form{
	width: 0%;
}
body.home header#main-header {
	position: fixed;
	top: 0;
	z-index: 99;
	left: 0;
	width: 100%;
}
header#main-header .svg-image svg {
	max-width: 300px;
}
header#main-header .cta-item .svg-image svg {
	max-width: 60px;
	width: 60px;
	margin-right: 10px;
}

/************* EVENTS ****************/

#hempstead #em-wrapper.em .em {
	color: #000000 !important;
	border-bottom-color: #000000 !important;
}

/************* HOMEPAGE **************/
section.homepage-banner img {
	max-width: 100% !important;
	max-height: calc(100vh - 300px);
	object-fit: cover;
	object-position: bottom;
}
.homepage-big-navigation svg {
	width: 180px;
	margin-bottom: 20px;
}



.homepage-big-navigation{
	padding-top: 50px;
	padding-bottom: 80px;
	border-top: 23px solid #f1dbce;
}
.big-navigation-item{
	padding: 0 30px;
}
.big-navigation-item img {
	object-position: center;
	height: 74px !important;
	object-fit: contain;
	margin-bottom: 20px;
}

.big-navigation-item h2 {
	color: #2582d1;
	font-weight: 900;
	font-size: 36px;
	margin-bottom: 10px;
}

.big-navigation-item p {
	color: #1b4954;
	font-weight: 600;
	font-size: 20px;
	line-height: 1.3;
}

.homepage-big-navigation h1 {
	font-size: 72px;
	color: #1b4954;
	font-weight: 900;
	font-style: italic;
	margin-bottom: 40px;
}
button.header-hamburger-button,
.header-mobile-search{
	background-color: transparent !important;
	padding: 0;
	border: none !important;
	line-height: 1 !important;
}



/*************** 404 / no results ****************/
.hempstead-archive {
	padding-top: 40px;
	padding-bottom: 80px;
}

.hempstead-archive h1 {
	color: #2582d1;
	font-size: 48px;
	font-weight: 900;
	margin-bottom: 40px;
}

.hempstead-archive h2 {
	font-size: 30px;
	font-weight: 900;
	color: #2582d1;
}

.hempstead-archive ol {
	padding-left: 20px;
	margin-top: 15px;
}

.hempstead-archive ol li:not(:last-child){
	padding-bottom: 30px;
}
.search-input-wrapper input {
	width: 100%;
	margin-top: 15px !important;
	border: 1px solid #1b4954 !important;
	height: auto !important;
	padding: 2px 15px !important;
}

section.hempstead-404-page ol li {
	font-size: 18px;
	color: #1b4954;
}

.post-date {
	font-weight: 400;
/*    opacity: .4;*/
	font-size: 16px;
	color: #525151;
}





/**************** Sidebar ***************/
.sidebar-container {
	padding-left: 80px;
}
.sidebar-newsletter .gform_title, .sidebar-newsletter .gform_description {
	display: none;
}

.sidebar-newsletter form {
	margin-top: 7px;
	display: flex;
	align-items: center;
}

.sidebar-newsletter form .gform_footer {
	margin-top: 0;
	margin-left: 15px;
}

.sidebar-newsletter form .gform-body {
	flex: 1;
}

.sidebar-newsletter form .gform_footer .gform_button {
	background-color: #2582d1 !important;
}
.post-item-featured-image img {
	min-width: 200px;
	max-height: 150px;
	object-fit: cover;
}
.post-list-item:not(:last-child) {
	padding-bottom: 40px;
	margin-bottom: 40px;
	border-bottom: 1px solid #f1dbce;
}






/*************** Slider PRO *******************/
.slider-pro{
	overflow: hidden;
}
.slider-pro .sp-layer.sp-text {
	font-size: 48px;
	color: #fff;
	font-style: italic;
	font-weight: 900;
	font-family: 'Lato';
	white-space: wrap !important;
	text-align: center;
	background-color: rgba(0,0,0,0.4);
	border-radius: 12px;
	padding: 5px 25px;
	
	/*width: auto !important;
	display: table;*/
}





/****************** POPUP ****************/
.hempstead-popup {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9;
	background-color: rgba(0,0,0,0.2);
}

.hempstead-popup-wrapper{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.hempstead-popup-container {
	max-width: 755px;
	background-color: #fff;
	position: relative;
	border: 1px solid rgba(0,0,0,0.3);
	box-shadow: 0 0 15px 0 rgba(0,0,0,0.2);
	padding: 30px;
}

.hempstead-popup-container .close {
	position: absolute;
	top: 0;
	right: 0;
	padding: 5px 4px;
	background-color: transparent !important;
	color: rgba(0,0,0,0.2) !important;
	line-height: 0;
	font-size: 30px;
	border: none !important;
	outline: 0 !important;
}

.hempstead-popup-container .close:hover {
	color: rgba(0,0,0,1) !important;
}
.hempstead-popup-block-item {
	flex: 1;
	max-width: 50%;
	padding: 15px;
}

.hempstead-popup-blocks {
	margin: 0 -15px;
}

.hempstead-popup-block-item img {
	width: 100% !important;
	max-width: 100% !important;
	object-fit: cover;
	max-height: 150px;
}
.hempstead-popup-block-item-wrapper {
	padding: 15px 20px;
}

.hempstead-popup-block-item.style-one .hempstead-popup-block-item-wrapper {
	background-color: #e7e8e8;
}

.hempstead-popup-block-item.style-two .hempstead-popup-block-item-wrapper {
	background-color: #2582d1;
	color: #fff;
}
.hempstead-popup-block-item-wrapper p {
	font-size: 16px;
	line-height: 1.3;
}
.hempstead-popup-description p {
	font-size: 18px;
	line-height: 1.3;
	padding: 0 30px;
}

.hempstead-popup-description h3 {
	margin-bottom: 15px;
	color: #1b4954 !important;
}

.hempstead-popup-block-item.style-one .hempstead-popup-block-item-wrapper h4{
	color: #1b4954 !important;
}
.hempstead-popup-block-item.style-two .hempstead-popup-block-item-wrapper h4{
	color: #fff !important;
	font-size: 30px;
}
#hempstead .hempstead-popup-block-item.style-one .hempstead-popup-block-item-button {
	background-color: #2582d1 !important;
	color: #fff !important;
	font-weight: 500;
}

#hempstead .hempstead-popup-block-item.style-two .hempstead-popup-block-item-button {
	background-color: #fff !important;
	color: #2582d1 !important;
	font-weight: 700;
	font-size: 25px !important;
}
.page-content{
	padding-top:40px;
	padding-bottom:80px;
}
.page-title-bg h1{
   /* margin-top:40px;*/
	margin-bottom:40px;
	font-size: 36px;
	font-weight: 900;
}
.col-12.col-lg-8 p {
	font-size: 16px;
}
/****** FOOTER **********/
#main-footer{
	background-color: #f5f2ee;
	padding: 15px 0;
}
.footer-social-media {
	gap: 15px;
}

.copyright-text {
	font-size: 16px;
	font-weight: 700;
	font-family: 'Lato';
}
.page-id-38 .big-navigation-item img {
	height: auto !important;
	margin-bottom: 0;
}
/******************************** RESPONSIVENESS ***********************************/
@media (max-width: 1024px){
	header {
		border-top: 10px solid #a3b8c6;
		box-shadow: 0 0 15px 0 rgba(0,0,0,0.1);
	}
	.header-logo{
		max-width: 250px !important;
	}
	.hempstead-popup-block-item{
		max-width: 100%;
	}
	.header-mobile-search-form-wrapper {
		padding: 10px;
		background-color: #2582d1;
	}

	.header-mobile-search-form-wrapper input {
		width: 100%;
		border: none !important;
		padding: 5px 15px;
		font-size: 16px;
	}
	
	section.homepage-banner {
		margin-top: 100px;
	}
	
	.homepage-big-navigation h1 {
		font-size: 45px;
	}
	.big-navigation-item img{
		margin-bottom: 10px;
	}
	
	.big-navigation-item h2{
		font-size: 24px;
	}
	
	.big-navigation-item p{
		font-size: 16px;
	}
	
	.header-navigation ul.menu {
		flex-direction: column;
		gap: 10px;
	}

	.header-navigation .menu-header-menu-container {
		padding-bottom: 20px;
		margin-bottom: 20px;
		border-bottom: 1px solid #fff;
	}
	
	header .cta-heading, header .cta-text{
		color: #fff !important;
	}
	header .cta-heading{
		font-size: 16px;
	}
	header .cta-text{
		font-size: 14px;
	}
	.cta-icon {
		width: 40px !important;
	}
	
	
	.slider-pro .sp-layer.sp-text {
		font-size: 20px;
		width: auto !important;
		display: table;
	}
	
	.slider-pro .sp-layer.sp-text:first-of-type {
		bottom: 20px !important;
		height: 38.1875px !important;
	}

	.slider-pro .sp-layer.sp-text:nth-of-type(2) {
		bottom: 58px !important;
		inset: 56px 0px 0px !important;
	}

	.slider-pro .sp-layer.sp-text:last-of-type {
		bottom: 96px !important;
		inset: 132px 0px 0px !important;
	}
	
	
	.post-item-featured-image img {
		height: 100% !important;
	}

	.post-list-item > div {
		flex: 0 0 100%;
		width: 100%;
	}

	.post-item-featured-image {
		width: 100%;
	}

	.post-item-details .post-item-excerpt {
		font-size: 16px;
	}

	.post-list-item:not(:last-child) {
		padding-bottom: 20px;
		margin-bottom: 20px;
	}

	.sidebar-container {
		margin-top: 40px;
		border-top: 1px solid;
		padding-left: 0;
		padding-top: 40px;
	}
}


@media (max-width: 767px){
	section.homepage-banner {
		margin-top: 60px;
	}
	.slider-pro .sp-layer.sp-text:nth-of-type(2) {
		bottom: 86px !important;
		inset: 50px 0px 0px !important;
	}
	.slider-pro .sp-layer.sp-text:last-of-type{
		inset: 124px 0px 0px !important;
	}	
}