/* ===================================
   Banner
====================================== */
.preload
{
	width           : 100%;
	height          : 100%;
	position        : absolute;
	z-index         : 999;
	text-align      : center;
	background      : #000000;
	align-items     : center;
	justify-content : center;
	display         : flex;
}

.lds-ripple
{
	display  : inline-block;
	position : relative;
	width    : 80px;
	height   : 80px;
}

.lds-ripple div
{
	position      : absolute;
	border        : 4px solid #FFF;
	opacity       : 1;
	border-radius : 50%;
	animation     : lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}

.lds-ripple div:nth-child(2)
{
	animation-delay : -0.5s;
}

@keyframes lds-ripple
{
	0%
	{
		top     : 36px;
		left    : 36px;
		width   : 0;
		height  : 0;
		opacity : 1;
	}
	100%
	{
		top     : 0px;
		left    : 0px;
		width   : 72px;
		height  : 72px;
		opacity : 0;
	}
}

.banner-area
{
	/*background-image  : url("../images/banner.jpg"); */
	height            : 100vh;
	background-repeat : no-repeat;
	background-size   : cover;
	padding           : 0;
}

.center-content
{
	height      : 100vh;
	align-items : center;
}

.banner-area .green-box
{
	background  : #008256;
	padding     : 200px 0;
	width       : 75%;
	margin-left : auto;
	position    : relative;
}

.banner-area .box-content
{
	top            : 50%;
	left           : 0;
	width          : 100%;
	text-align     : right;
	position       : absolute;
	text-transform : uppercase;
	transform      : translate(-30%, 30%);
}

.banner-area .box-content2
{
	top            : 50%;
	left           : 0;
	width          : 154%;
	max-width      : 154%;
	text-align     : right;
	position       : absolute;
	text-transform : uppercase;
	transform      : translate(-45%, 172%);
}

.box-content h1, .box-content2 h1
{
	padding     : 10px;
	width       : 90%;
	color       : #FFFFFF;
	font-size   : 58px;
	font-weight : 500;
	background  : rgb(0 0 0 / 54%);
	display     : inline-block;
	font-family : Oswald, sans-serif;
}

.banner-area .button
{
	font-size      : 18px;
	margin-top     : 20px;
	position       : relative;
	color          : #FFFFFF;
	display        : inline-block;
	text-transform : capitalize;
}

.banner-area .button i
{
	font-size     : 18px;
	padding       : 5px;
	border-radius : 50%;
	border        : 2px solid #FFFFFF;
	transition    : .5s ease;
	margin-right  : 8px;
}

.banner-area .button:hover i
{
	background   : #202020;
	color        : #FFFFFF;
	transition   : .5s ease;
	border-color : #202020;
}

/* ===================================
   Job Listing
====================================== */
.section-job-title
{
	margin-bottom : 65px;
}

.section-job-title .job-title
{
	line-height    : 1.2;
	letter-spacing : 0.92px;
	margin-bottom  : 0;
	padding        : 10px;
	font-size      : 42px;
	color          : #FFFFFF;
	font-weight    : 500;
	background     : #003261;
	display        : inline-block;
	font-family    : Oswald, sans-serif;
	opacity        : 1;
}

.section-job-title .job-title span
{
	color : #35C2F8;
}

.single-job-list
{
	background    : #FFF;
	box-shadow    : 0 4px 20px #9398A11A;
	border-radius : 8px;
	padding       : 22px 35px 22px 26px;
	transition    : all 0.3s ease;
	margin-bottom : 40px;
	align-items   : center;
}

.single-job-list:hover
{
	box-shadow : 0 7px 30px #9398A11C;
}

.single-job-list img
{
	width  : 66px;
	height : 66px;
}

.single-job-list .media-body
{
	border-left  : 1px solid #EEEBF7;
	margin-left  : 26.5px;
	padding-left : 25.5px;
}

.single-job-list .media-body h6
{
	font-size      : 15px;
	font-weight    : 500;
	line-height    : 22px;
	letter-spacing : 0.18px;
	color          : #5B6880;
	display        : inline-block;
	margin-bottom  : 0px;
}

.single-job-list .media-body span
{
	font-size      : 15px;
	line-height    : 30px;
	font-weight    : 400;
	letter-spacing : 0.3px;
	color          : #5B6880;
	display        : block;
}

.job-apply-btn
{
	background     : #FFFFFF;
	border         : 1px solid #D6DAE1;
	border-radius  : 4px;
	font-size      : 15px;
	letter-spacing : 0.3px;
	color          : #97A1B3;
	height         : 44px;
	line-height    : 44px;
	transition     : all 0.3s ease;
	cursor         : pointer;
	padding        : 0 30px;
	display        : inline-block;
}

.job-apply-btn:hover
{
	background : #0A66C2;
	color      : #FFF;
	border     : 1px solid #0A66C2;
}

.job-apply-btn:focus, .job-apply-btn:active
{
	box-shadow : none;
	outline    : 0;
}

/* ===================================
   Contacts area
====================================== */
.contact-sec .heading
{
	color         : #FFFFFF;
	font-size     : 48px;
	margin-bottom : 40px;
	font-weight   : bold;
}

.contact-sec .contact-details
{
	font-family : Roboto, sans-serif;
	width       : 90%;
	margin-left : 20px;
	padding-top : 20%;
}

.contact-sec .contact-details .heading
{
	margin-bottom : 35px;
	font-size     : 30px;
	font-weight   : normal;
}

.contact-sec .contact-details .text
{
	color       : #FFFFFF;
	font-size   : 17px;
	font-weight : normal;
}

.contact-sec .contact-details ul
{
	padding-left  : 0;
	margin-bottom : 0;
	margin-top    : 50px;
}

.contact-sec .contact-details ul li:first-child
{
	width : 60%;
}

.contact-sec .contact-details ul li
{
	color         : #FFFFFF;
	list-style    : none;
	margin-bottom : 22px;
	font-size     : 16px;
	display       : flex;
	align-items   : center;
	font-weight   : normal;
	font-family   : 'Roboto', sans-serif;
}

.contact-sec .contact-details ul li i
{
	font-size     : 30px;
	margin-right  : 20px;
	margin-bottom : 8px;
	color         : #FFFFFF;
}

.contact-sec .contact-form input
{
	color      : #FFFFFF;
	font-size  : 16px;
	height     : 40px;
	padding    : 25px 0;
	background : transparent;
}

.contact-sec .contact-form .form-control
{
	border        : none;
	border-radius : 0;
	padding-left  : 0;
	border-bottom : 1px solid rgba(255, 255, 255, 0.3);
}

.contact-sec .contact-form textarea
{
	padding-top   : 20px;
	height        : 150px;
	color         : #FFFFFF;
	font-size     : 16px;
	resize        : none;
	background    : transparent;
	margin-bottom : 40px;
}

.contact_btn
{
	font-size      : 16px;
	font-weight    : 600;
	text-transform : uppercase;
}

.btn.btn-white
{
	background      : transparent;
	border-color    : #FFFFFF;
	color           : #FFFFFF;
	text-decoration : none;
}

.btn.btn-medium
{
	font-size   : 16px;
	padding     : 10px 48px;
	line-height : 1.8em;
}

.bg-eurotolia
{
	background-color : #35C2F8;
}

.btn.btn-white:hover
{
	background   : #FFFFFF !important;
	border-color : #FFFFFF;
	color        : #232728 !important;
}

.contact-sec .contact-form .form-control:focus
{
	box-shadow    : none;
	border-bottom : 1px solid #FFFFFF;
}

.contact-sec .contact-details .text.alt-font
{
	font-family : 'Roboto', sans-serif;
}

.bg-services #services_slider
{
	left : 200px;
}

#out-team
{
	right : 130px;
}

.w-title-box
{
	font-size : 45pt !important;
}

.w-title-box .w-title
{
	font-family    : 'Montserrat', sans-serif;
	text-transform : initial;
	color          : #FFF;
}

.w-title-box .w-sub-title
{
	font-family    : 'Montserrat', sans-serif;
	text-transform : initial;
	font-size      : 20pt;
	color          : #FFF;
}

.w-title-box .w-sub-title .text-light-red
{
	color : #FF5757;
}

.w-title-box .w-sub-title .text-light-blue
{
	color : #7DB7CB;
}

.w-title-box .w-sub-title .text-purple
{
	color : #CB6CE6;
}

.w-title-box .w-sub-title .text-yellow
{
	color : #FFDE59;
}

.btn-information
{
	background    : #FF5757;
	padding       : 15px 35px 15px 35px;
	border-radius : 25px;
	font-size     : 17pt !important;
}

.w-team
{
	margin-top  : 85px;
	margin-left : -200px;
}

.w-team .w-team-title
{
	font-family    : 'Montserrat', sans-serif;
	text-transform : initial;
	color          : #FFF;
	font-size      : 40pt;
	max-width      : 64%;
}

.w-team .w-team-sub-title
{
	font-family    : 'Montserrat', sans-serif;
	text-transform : initial;
	font-size      : 20pt;
	color          : #FFF;
	max-width      : 90%;
	margin-top     : 20px;
}

.job-disabled:hover
{
	background   : #000000 !important;
	border-color : #000000 !important;
	color        : #FFF    !important;
	cursor       : not-allowed;
}

/* ===================================
   Media Queries
====================================== */

@media screen and (max-width : 1600px)
{
	.banner-area .box-content
	{
		transform : translate(-45%, -33%);
	}
	.bg-services #services_slider
	{
		left : 0;
	}
}

@media screen and (max-width : 1199px)
{
	.header-appear .side-nav-btn
	{
		position : relative;
	}

	.bg-services #services_slider
	{
		left : 0;
	}

	#out-team
	{
		right : 0;
	}

}

@media screen and (max-width : 767px) and (min-width : 480px)
{
	.bg-contact
	{
		padding-bottom : 25rem;
	}
}

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

	.banner-area .box-content
	{
		top            : 50%;
		left           : 0;
		width          : 100%;
		max-width      : 100%;
		text-align     : right;
		position       : absolute;
		text-transform : uppercase;
		transform      : translate(-5%, -33%);
	}

	.header-appear .side-nav-btn
	{
		top      : -14px;
		position : relative;
		left     : -25px;
	}

	.logo-dark
	{
		top      : -15px;
		position : relative;
		left     : 15px
	}

	.box-content h1, .box-content2 h1
	{
		padding   : 16px;
		font-size : 35px;
	}

	.bg-services
	{
		background-size     : auto;
		background-repeat   : no-repeat;
		background-position : center;
	}

	.w-team
	{
		margin-top    : -50px;
		margin-left   : 40px;
		margin-bottom : 60px;
	}

	.w-team .w-team-title
	{
		text-align  : left;
		margin-left : 0;
		font-size   : 21pt;
		max-width   : 90%;
	}

	.w-team .w-team-sub-title
	{
		font-size  : 16pt;
		text-align : left;
		margin-top : 20px;
	}
}

@media screen and (max-width : 767px)
{
	.logo-dark
	{
		top      : 0;
		position : initial;
		left     : 0;
	}

	.header-appear .side-nav-btn
	{
		top      : 0;
		position : relative;
		right    : 22px;
	}

}

@media screen and (max-width : 479px)
{
	.bg-team .team-row
	{
		margin : 0;
	}

	.banner-area .box-content
	{
		top            : 50%;
		left           : 0;
		width          : 100%;
		max-width      : 100%;
		text-align     : right;
		position       : absolute;
		text-transform : uppercase;
		transform      : translate(-5%, -33%);
	}

	.banner-area .button
	{
		font-size      : 18px;
		margin-top     : 85px;
		position       : relative;
		color          : #FFFFFF;
		display        : inline-block;
		text-transform : capitalize;
	}

	.box-content h1, .box-content2 h1
	{
		padding   : 16px;
		font-size : 24px;
	}

	.bg-services #services_slider
	{
		margin : 0;
	}

	.section-job-title
	{
		margin-bottom : 50px;
	}

	.section-job-title .job-title
	{
		line-height    : 1.2;
		letter-spacing : 0.92px;
		padding        : 10px;
		font-size      : 24px;
		color          : #FFFFFF;
		font-weight    : 500;
		background     : #003261;
		display        : inline-block;
		font-family    : Oswald, sans-serif;
		opacity        : 1;
	}

	.single-job-list
	{
		background    : #FFF;
		box-shadow    : 0 -3px 20px #9398A11A;
		border-radius : 8px;
		padding       : 10px 0 10px 0;
		transition    : all 0.3s ease;
		margin-bottom : 18px;
		align-items   : center;
	}

	.single-job-list img
	{
		width       : 10%;
		margin-left : 8px;
	}

	.single-job-list .media-body
	{
		border-left  : 1px solid #EEEBF7;
		margin-left  : 10px;
		padding-left : 10px;
	}

	.single-job-list .media-body span
	{
		font-size      : 12px;
		line-height    : 16px;
		font-weight    : 400;
		letter-spacing : 0.3px;
		color          : #5B6880;
		display        : block;
	}

	.job-apply-btn
	{
		margin-right   : 10px;
		background     : #FFFFFF;
		border         : 1px solid #D6DAE1;
		border-radius  : 4px;
		font-size      : 13px;
		letter-spacing : 0.3px;
		color          : #97A1B3;
		height         : 31px;
		line-height    : 10px;
		transition     : all 0.3s ease;
		cursor         : pointer;
		padding        : 0 10px;
		display        : inline-block;
	}

	.bg-services
	{
		background-size     : auto;
		background-repeat   : no-repeat;
		background-position : center;
	}

	.contact-sec .heading
	{
		font-size     : 22px;
		margin-top    : 40px;
		margin-bottom : 20px;
	}

	.contact-sec .contact-form input
	{
		font-size : 15px;
		height    : 30px;
		padding   : 17px 0;
	}

	.contact-sec .contact-form textarea
	{
		padding-top   : 0;
		height        : 75px;
		color         : #FFFFFF;
		font-size     : 15px;
		resize        : none;
		background    : transparent;
		margin-bottom : 25px;
	}

	.btn.btn-rounded.btn-medium
	{
		padding     : 2px 3px;
		max-width   : 40%;
		font-size   : 14px;
		line-height : 21px;
	}

	.contact-sec .contact-details
	{
		font-family : Roboto, sans-serif;
		width       : 100%;
		margin-left : 0;
		padding-top : 8px;
	}

	.contact-sec .contact-details .heading
	{
		margin-bottom : 15px;
		font-size     : 22px;
		font-weight   : bold;
	}

	.contact-sec .contact-details .text
	{
		color       : #FFFFFF;
		font-size   : 16px;
		font-weight : normal;
	}

	.contact-sec .contact-details ul
	{
		padding-left  : 0;
		margin-bottom : 0;
		margin-top    : 20px;
	}

	.contact-sec .contact-details ul li:first-child
	{
		width : 90%;
	}

	.contact-sec .contact-details ul li
	{
		color         : #FFFFFF;
		list-style    : none;
		margin-left   : 20px;
		margin-bottom : 7px;
		font-size     : 13px;
		display       : flex;
		align-items   : center;
		font-weight   : normal;
		font-family   : 'Roboto', sans-serif;
	}

	.contact-sec .contact-details ul li i
	{
		font-size     : 25px;
		margin-right  : 40px;
		margin-bottom : 10px;
	}

	.h-100
	{
		margin-top : 55px;
	}

	.bg-team
	{
		background-size     : auto;
		background-repeat   : no-repeat !important;
		background-position : center;
	}

	.bg-contact
	{
		background        : url(../images/general/pg6-mobile.jpg);
		background-size   : cover !important;
		background-repeat : round !important;
	}

	.contact-body
	{
		height : inherit !important;
	}

	.section-image
	{
		background-repeat   : no-repeat;
		background-position : center;
		background-size     : contain;
	}

	.swiper-slide
	{
		background : black;
	}

	.arrows-wrap
	{
		margin-top : 80px;
	}
}

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

}