/***********************************************/
/* Web Fonts                                   */
/***********************************************/

@font-face {
	font-family: "Shell Font";
	src: url("https://assets-pub.shelltrainings.com/fonts/latin/ShellMedium.woff") format("woff");
	font-weight: 500;
}

@font-face {
	font-family: "Shell Font";
	src: url("https://assets-pub.shelltrainings.com/fonts/latin/ShellMediumItalic.woff") format("woff");
	font-weight: 500;
	font-style: italic;
}

@font-face {
	font-family: "Shell Font";
	src: url("https://assets-pub.shelltrainings.com/fonts/latin/ShellHeavy.woff") format("woff");
	font-weight: 600;
}

/*****************************************************************
 Bootstrap 3 Grid Breakpoints (http://getbootstrap.com/css/#grid)

 xs - Extra small devices 	        < 768 px
 sm - Small devices			< 992 px
 md - Medium devices		        < 1200 px
 lg - Large devices			>= 1200 px

*****************************************************************/

:root {
	--red: #dd1d20;
	--yellow: #ffc800;
	--white: #ffffff;

	--main_background: #ffffff;
	--main_font: #4a4a4a;

	--button_primary: #4a4a4a;
	--button_primary_text: #ffffff;
	--button_primary_disabled: #d9d9d9;
	--infobox_border: #00ff00;
	--infobox_border_right: #0000ff;
	--form_background: var(--main_background);
	--form_border: 1px solid #4a4a4a33;
	--form_border_focus: 1px solid var(--yellow);
	--placeholder_text: #707070;
	--label_text: #1d232a;
	--list_border_bottom: #dbdbdb;
	--list_border_top: #dbdbdb;
	--map_background: #f5f5f5;
	--list_article_bottom_border: #dbdbdb;
	--icon_cluster_text: #ffffff;
	
	--icon_plus: url(../images/plus.png);
	--icon_down: url(../images/icon-down.svg);
        --icon_upload: url(../images/upload.gif);
	--icon_file: url(../images/icon-file.gif);
        --icon_close_white: url(../images/icon-close-white.png);
	--icon_close_red: url(../images/icon-close-red.png);
	--icon_close_red_true: var(--icon_close_red);
	--icon_featured: url(../images/icon-featured.png);

	--iw_background: var(--main_background);
        --iw_foreground: var(--main_font);
	--site_focus: #000;
	--zoom_focus: var(--red);

	--error: var(--red);

	--upload_filename: var(--main_font);
}

@media (prefers-color-scheme: dark) {
	:root {
		--red: #b82e00;
		--yellow: #d6a100;
		--white: #e0e0e0;

		--main_background: #1e232a;
		--main_font: #e0e0e0;

		--button_primary: #ffffff;
		--button_primary_text: #e0e0e0;
		--button_primary_disabled: #d9d9d9;

		--infobox_border: #d9d9d9;
		--infobox_border_right: #e5e5e5;
		
		--form_background: var(--main_background);
		--form_border: 1px solid #e0e0e033;
		--form_border_focus: 1px solid #e0e0e0;
		--placeholder_text: var(--main_font);
		--label_text: #1d232a;
		--list_border_bottom: #45494f;
		--list_border_top: #45494f;
		--map_background: #14191f;
		--list_article_bottom_border: #45494f;
		--icon_cluster_text: #e0e0e0;

		--icon_plus: url(../images/plus_dark.png);
		--icon_down: url(../images/icon-down_dark.svg);
		--icon_upload: url(../images/upload_dark.gif);
		--icon_file: url(../images/icon-file.gif);
		--icon_close_white: url(../images/icon-close-white_dark.png);
		--icon_close_red: url(../images/icon-close-red_dark.png);
		--icon_close_red_true: url(../images/icon-close-red.png);
		--icon_featured: url(../images/icon-featured_dark.png);

		--iw_background: #14191f;
        	--iw_foreground: var(--main_font);
		--site_focus: #fff;
		--zoom_focus: var(--yellow);
		--error: var(--yellow);
		--upload_filename: var(--main_background);
	}
}

label {
	color: var(--main_font) !important;
}

*:focus {
	outline: none !important;
}

*:focus:not(:focus-visible) {
	outline: none !important;
}

*:focus-visible,
.focus_in_group:focus-within {
	outline: 2px solid var(--site_focus) !important;
	outline-offset: -2px !important;
}

.gm-control-active:focus-visible {
	outline: 2px solid var(--zoom_focus) !important;
}

/***********************************************/
/* General styles                              */
/***********************************************/

body {
	font-family: "Shell Font";
	color: var(--main_font);
	background-color: var(--main_background);
	font-weight: 500;
}

a {
	text-decoration: underline;
	color: var(--red);
	transition: color .1s ease 0s, background-color .1s ease 0s, border-color .1s ease 0s;
}

a:hover,
a:focus {
	color: var(--red);
}

hr {
	border: none;
}

li {
	list-style-type: square;
	margin-left: -14px;
}

li::marker {
	color: var(--red);
}

@media (prefers-color-scheme: dark) {
	li::marker {
		color: var(--yellow);
	}
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 600;
	margin: 1.25rem 0rem .625rem 0rem;
}

h2 {
	font-size: 26px;
	margin-bottom: 30px;
	margin-top: 30px;
}

h3 {
	font-size: 20px;
}

h4 {
	font-size: 18px;
}

h5 {
	font-size: 16px;
}

h6 {
	font-size: 14px;
}

ul {
	padding-left: 33px;
}

/* mobile */

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

	h1 {
		font-size: 28px;
	}

	h2 {
		font-size: 28px;
	}

}

/***********************************************/
/* Overwritten Bootstrap Styles                */
/***********************************************/

.container-fluid {
	padding-right: 100px;
	padding-left: 100px;
}

.btn {
	transition: color .1s ease 0s, background-color .1s ease 0s, border-color .1s ease 0s;
	padding: 13px;
	text-decoration: none;
	font-weight: 600;
	min-width: 150px;
	border-radius: 8px;
	box-shadow: none !important;
}

.btn-primary {
	background-color: var(--red) !important;
	color: var(--button_primary_text) !important;
	border: 1px solid var(--red) !important;
/*	outline: none !important;*/
}

.btn-primary:hover {
	background-color: var(--button_primary_text) !important;
	color: var(--red) !important;
	border: 1px solid var(--red);
/*	outline: none !important;*/
}

.btn-warning {
	background-color: var(--yellow);
	color: var(--label_text);
	border: 1px solid var(--yellow);
/*	outline: none !important;*/
}

.btn-warning:focus,
.btn-warning:hover,
.btn-warning:active:focus,
.btn-warning:active:hover
 {
	background-color: var(--label_text);
	color: var(--yellow);
	border: 1px solid var(--yellow);
/*	outline: none !important;*/
}

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
	opacity: 1;
}

.btn-primary.disabled,
.btn-primary.disabled.active,
.btn-primary.disabled.focus,
.btn-primary.disabled:active,
.btn-primary.disabled:focus,
.btn-primary.disabled:hover,
.btn-primary[disabled],
.btn-primary[disabled].active,
.btn-primary[disabled].focus,
.btn-primary[disabled]:active,
.btn-primary[disabled]:focus,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary,
fieldset[disabled] .btn-primary.active,
fieldset[disabled] .btn-primary.focus,
fieldset[disabled] .btn-primary:active,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary:hover {
	background-color: var(--button_primary_disabled) !important;
	color: var(--label_text) !important;
        border: 1px solid var(--button_primary_disabled) !important;
}

.form-control:focus {
	box-shadow: none;
}

.form-control[readonly] {
	background-color: var(--form_background);
	border: var(--form_border);
}

.has-error .form-control {
	box-shadow: none;
	border-color: var(--error);
}

.row {
	margin-right: -8px;
	margin-left: -8px;
}

.col-lg-1,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-md-1,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-sm-1,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-xs-1,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9 {
	padding-right: 10px;
	padding-left: 10px;
}

.alert {
	margin-top: 20px;
	border-radius: 0;
}

/* mobile */

@media screen and (max-width: 991px) {
	.container-fluid {
		padding-right: 50px;
		padding-left: 50px;
	}
}

@media screen and (max-width: 767px) {
	.container-fluid {
		padding-right: 20px;
		padding-left: 20px;
	}
}

/***********************************************/
/* Forms                                       */
/***********************************************/

.form-control {
	border: var(--form_border);
	border-radius: 8px;
	box-shadow: none !important;
	height: auto;
	padding: 14px 18px;
	background-color: var(--form_background);
	color: var(--main_font);
	height: 52px;
}

/*.form-control:focus {*/
/*	border: var(--form_border_focus);*/
/*}*/

input[type=submit] {
	color: var(--white);
}

input,
select {
	border: var(--form_border);
	background-color: var(--form_background);
	padding: 15px;
/*	outline: none;*/
	line-height: 18px;
}

input::placeholder {
	color: #707070 !important;
}

::-webkit-input-placeholder {
	/* Chrome/Opera/Safari */
	color: #707070 !important;
}

::-moz-placeholder {
	/* Firefox 19+ */
	color: #707070 !important;
}

:-ms-input-placeholder {
	/* IE 10+ */
	color: #707070 !important;
}

:-moz-placeholder {
	/* Firefox 18- */
	color: #707070 !important;
}

@media (prefers-color-scheme: dark) {

	input::placeholder {
		color: #8a8a8a !important;
	}

	::-webkit-input-placeholder {
		/* Chrome/Opera/Safari */
		color: #8a8a8a !important;
	}

	::-moz-placeholder {
		/* Firefox 19+ */
		color: #8a8a8a !important;
	}

	:-ms-input-placeholder {
		/* IE 10+ */
		color: #8a8a8a !important;
	}

	:-moz-placeholder {
		/* Firefox 18- */
		color: #8a8a8a !important;
	}

}

select,
select.form-control {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: var(--icon_down) no-repeat;
	background-size: 18px auto;
	background-position: right 15px center;
	padding: 15px 45px 15px 15px;
	background-color: var(--form_background);
/*	height: 52px;*/
	border-radius: 8px;
}

select::-ms-expand {
	display: none;
}

option {
	font-family: "Shell Font", sans-serif;
	background-color: var(--form_background);
}

input[type=file].form-control {
	height: auto;
	line-height: 16px;
/*	max-height: 52px;*/
	padding: 15px 18px;
}

textarea.form-control {
	padding-top: 12px;
	padding-bottom: 12px;
	min-height: 104px;
	resize: vertical;
}


.form-group {
	margin-bottom: 20px;
}

form small {
	color: var(--placeholder_text);
	font-style: italic;
}

label {
	font-weight: 500;
	color: var(--label_text);
}

/***********************************************/
/* Components	               		           */
/***********************************************/

#upload-list {
        display: grid;
        gap: 16px;
	border: var(--form_border);
	background-color: var(--form_background);
	padding: 16px;
	margin-bottom: 20px;
	border-radius: 8px;
}

#upload-list .form-group {
	margin-bottom: 3px;
}

#upload-list.empty .form-group:nth-child(2) {
	visibility: hidden;
	position: absolute;
	height: 0;
}

/* select-control */

#upload-list .select-control {
	position: relative;
	overflow: hidden;
	height: 162px;
	background-image: var(--icon_upload);
	background-repeat: no-repeat;
	background-position: center 50px;
}

#upload-list .form-group.selected .select-control {
	height: auto;
}

#upload-list input[type=file] {
	position: absolute;
	opacity: 0;
	width: 100%;
	height: 100%;
	cursor: pointer;
	border: none;
}

#upload-list .select-control .form-control {
	text-align: center;
	border: none;
	color: var(--placeholder_text);
	margin-top: 75px;
}

#upload-list .form-group.selected input[type=file],
#upload-list .form-group.selected .select-control .form-control {
	visibility: hidden;
	position: absolute;
	height: 0;
}

/* selected-control */

#upload-list .selected-control {
	visibility: hidden;
	position: absolute;
	height: 0;
	left: 0;
	width: 0;
}

#upload-list .form-group.selected .selected-control {
	visibility: visible;
	position: relative;
	height: auto;
}

#upload-list .selected-control input[type=text] {
	background-image: var(--icon_file);
	background-repeat: no-repeat;
	background-position: 17px center;
	padding: 13px 17px 13px 50px;
	background-color: var(--white);
}

#upload-list .selected-control .btn {
	background-image: var(--icon_close_white);
	background-repeat: no-repeat;
	background-position: center center;
	width: 48px;
	min-width: 0;
}

#upload-list .selected-control .btn:hover,
#upload-list .selected-control .btn:focus {
	background-image: var(--icon_close_red);
}

#upload-list .selected-control .btn:active:hover,
#upload-list .selected-control .btn:active:focus {
	background-image: var(--icon_close_white);
}

.gly-spin {
	-webkit-animation: spin 2s infinite linear;
	-moz-animation: spin 2s infinite linear;
	-o-animation: spin 2s infinite linear;
	animation: spin 2s infinite linear;
}

@-moz-keyframes spin {
	0% {
		-moz-transform: rotate(0deg);
	}

	100% {
		-moz-transform: rotate(359deg);
	}
}

@-webkit-keyframes spin {
	0% {
		-webkit-transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(359deg);
	}
}

@-o-keyframes spin {
	0% {
		-o-transform: rotate(0deg);
	}

	100% {
		-o-transform: rotate(359deg);
	}
}

@keyframes spin {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(359deg);
		transform: rotate(359deg);
	}
}

/***********************************************/
/* Pages styles    		                      */
/***********************************************/

/* section *************************************/

section.search-offers h2.header {
	text-align: center;
	margin: 30px 0;
}

section.search-offers form input,
section.search-offers form select {
	margin-right: 18px;
	margin-bottom: 20px;
}

/* mobile */

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

	section.search-offers form input,
	section.search-offers form select,
	section.search-offers form button.search {
		display: block;
		width: 100%;
		margin-right: 0;
	}

	section.search-offers form button.search {
		font-size: 14px;
		font-weight: 600;
	}

}

/* section *************************************/

section.offers-list .offers-count {
	border-top: 1px solid var(--list_border_top);
	border-bottom: 1px solid var(--list_border_bottom);
	margin-bottom: 0;
	padding-bottom: 20px;
	padding-top: 20px;
}

section.offers-list .offers-count--featured {
	font-weight: 600;
	color: var(--red);
}

section.offers-list .offers--featured header h3 a {
	color: var(--red);
}

section.offers-list .offers--featured header h3 a:hover {
	color: var(--main_font);
}

@media (prefers-color-scheme: dark) {
	section.offers-list .offers-count--featured {
		font-weight: 600;
		color: var(--yellow);
	}

	section.offers-list .offers--featured header h3 a {
		color: var(--yellow);
	}

	section.offers-list .offers--featured header h3 a:hover {
		color: var(--white);
	}
}

section.offers-list article {
	padding-top: 20px;
	border-bottom: 1px solid var(--list_article_bottom_border);
}

section.offers-list .offers--featured article {
	background-image: var(--icon_featured);
	background-repeat: no-repeat;
	background-position: left 22px;
	padding-left: 55px;
}

section.offers-list article:last-child {
	border-bottom: none;
}

section.offers-list article header {
	position: relative;
}

section.offers-list article header .icon {
	position: absolute;
	transition: all .3s ease 0s;
	margin-left: calc(100% - 34px);
	background: var(--icon_plus) no-repeat;
	height: 23px;
	width: 23px;
	cursor: pointer;
}

section.offers-list article.expanded header .icon {
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	-ms-transform: rotate(-135deg);
	-o-transform: rotate(-135deg);
	transform: rotate(-135deg);
}

section.offers-list article header h3 {
	margin-bottom: 10px;
	margin-top: 0;
	padding-right: 48px;
}

section.offers-list article header h3 a {
	transition: color .3s ease 0s;
	color: inherit;
}

section.offers-list .offers--featured article header h3 a {
	color: var(--red);
}

section.offers-list article header h3 a:hover,
section.offers-list article header h3 a:focus,
section.offers-list article.expanded header h3 a {
	color: var(--red);
}

@media (prefers-color-scheme: dark) {
	section.offers-list .offers--featured article header h3 a {
		color: var(--yellow);
	}

	section.offers-list article header h3 a:hover,
	section.offers-list article header h3 a:focus,
	section.offers-list article.expanded header h3 a {
		color: var(--yellow);
	}
}

section.offers-list article header .summary {
	margin: 0;
}

section.offers-list article main {
	max-height: 0;
	overflow: hidden;
	padding-top: 20px;
	visibility: hidden;
}

section.offers-list article main .retailer {
	margin-bottom: 20px;
}

section.offers-list article main .offer-description {
	margin-top: 30px;
}

section.offers-list article.expanded main {
	max-height: none;
	overflow: hidden;
	visibility: visible;
}

section.offers-list article .apply {
	margin: 25px 0;
}

section.offers-list .load-more {
	margin-top: 25px;
	margin-bottom: 25px;
}

/* section *************************************/

section.map #map {
	height: 450px;
	background-color: var(--map_background);
	border-radius: 8px;
}

.cluster-icon {
	color: var(--icon_cluster_text);
}

/* google maps InfoWindow */

.gm-style .gm-style-iw-d::-webkit-scrollbar-track, 
.gm-style .gm-style-iw-d::-webkit-scrollbar-track-piece,
.gm-style .gm-style-iw-c,
.gm-style .gm-style-iw-t::after,
.gm-style .gm-style-iw-tc::after { 
  background: var(--iw_background);
}

.gm-style .gm-style-iw {
        color: var(--iw_foreground);
	width: 100%;
	max-height: unset !important;
	margin-top: 5px;
}

.gm-style .gm-style-iw-tc {
	filter: unset;
	-webkit-filter: unset;
	margin-top: 5px;
	margin-left: -1px;
}

.gm-ui-hover-effect>span {
	background-color: var(--iw_foreground);
}

.gm-style-iw-ch>span {
	color: var(--iw_foreground);
	font-size: 20px;
	line-height: 1;
	font-weight: bold;
}

/* job alert form */
.job-alert-form {
	margin-bottom: 40px;
}

.job-alert-form__title {
	text-align: center;
	margin: 30px 0;
}

.job-alert-form__description {
	margin-bottom: 20px;
}

.job-alert-form__form {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
	align-content: flex-start;
}

.job-alert-form__site-input {
	flex-grow: 1;
	flex-shrink: 1;
}

.job-alert-form__job-title-input {
	flex-grow: 1;
	flex-shrink: 1;
}

.job-alert-form__email-input {
	flex-grow: 1;
	flex-shrink: 1;
}

.job-alert-form__send-button {
	flex-grow: 0;
	flex-shrink: 0;
	width: 100%;
	align-self: flex-start;
}

.job-alert-form .form-group {
	margin-bottom: 0px;
}

.help-block {
	margin-bottom: 0px;
	display: block !important;
}

.has-error .help-block {
	color: var(--error);
}

.offers {
	border-bottom: 1px solid var(--list_border_bottom);
}

.offers--featured {
	border-bottom: unset;
}

.hr_a {
	height: 1px;
	background-color: var(--list_border_bottom);
	margin-top: 14px;
	margin-bottom: 3px;
}

.hr_b {
	height: 1px;
	background-color: var(--list_border_bottom);
	margin-top: 14px;
	margin-bottom: 12px;
}

/* mobile */

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

	section.map #map {
		height: 500px;
	}

	.gm-style .gm-style-iw {
		font-size: 12px;
	}

	.infobox .site {
		margin-bottom: 18px;
		margin-top: 8px;
		border-bottom: 1px solid var(--infobox_border);
	}

	.infobox .site h3 {
		font-size: 16px;
		margin-bottom: 6px;
		margin-top: 10px;
	}

	.infobox .positions {
		display: block;
		margin-bottom: 0;
	}

	.infobox .positions .position,
	.infobox .positions .position:not(:last-child) {
		width: auto;
		display: block;
		margin-right: 0;
		padding-right: 0;
		border-right: 0;
		padding-bottom: 16px;
	}

	.infobox .positions .position h5 {
		margin-top: 0;
		margin-bottom: 8px;
		min-height: 0;
		font-size: 12px;
	}

	.infobox .send-cv {
		padding-top: 0;
		padding-bottom: 10px;
	}

	.gm-style>div:nth-child(1)>div:nth-child(3)>div:nth-child(2)>div:nth-child(4)>div:nth-child(1)>div:nth-child(1)>div:nth-child(4) {
		background: none;
	}
}

@media screen and (max-width: 780px) and (orientation: landscape) {

	section.map #map {
		height: 350px;
	}

	.infobox .site {
		border-bottom: 0;
		margin-bottom: 0;
	}

	.infobox .positions .position,
	.infobox .positions .position:not(:last-child) {
		padding-bottom: 10px;
		display: flex;
		align-items: center;
	}

	.infobox .positions .position h5,
	.infobox .send-cv p {
		width: 212px;
	}

	.infobox .positions .position .btn,
	.infobox .send-cv .btn {
		width: 212px;
	}

	.infobox .send-cv {
		display: flex;
		align-items: center;
		padding-top: 0;
		padding-bottom: 12px;
	}

}

/* section *************************************/

section.offer-details {
	padding-top: 20px;
}

section.offer-details header {
	position: relative;
}

section.offer-details header h3 {
	margin-bottom: 10px;
	margin-top: 0;
	padding-right: 48px;
}

section.offer-details header .summary {
	margin: 0;
}

section.offer-details main {
	padding-top: 20px;
}

section.offer-details main .retailer {
	margin-bottom: 20px;
}

section.offer-details main .offer-description {
	margin-top: 30px;
}

section.offer-details .apply {
	margin: 25px 0;
}

/* section *************************************/

section.application h2 {
	margin-bottom: 20px;
}

section.application h3 {
	margin-top: 0px;
	margin-bottom: 20px;
}

section.application .address {
	margin-top: -15px;
	margin-bottom: 25px;
}

section.application .row.top-space {
	margin-top: 40px;
	margin-bottom: 40px;
}

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

	section.application .row.top-space {
		margin-top: 0px;
	}

}

.row_new {
	display: grid;
	grid-template-columns: repeat(4,25%);
	margin-right: -8px;
	margin-left: -8px;
}

.row_new div {
	width: 100%;
}

@media (max-width: 1000px) {
	.row_new {
		grid-template-columns: repeat(2,50%);
	}
}

@media (max-width: 767px) {
	.row_new {
		grid-template-columns: 100%;
	}
}

.gm-style iframe + div { border:none!important; }

.apply, .btn {
	height: 52px;
	align-content: center;
}

h4 {
	margin-top: 30px;
	margin-bottom: 20px;
	font-size: 26px;
}

h5 {
	margin-top: 0px;
	margin-bottom: 20px;
	font-size: 20px;
}

#upload-list .selected-control {
	width: 100%;
}

#upload-list .selected-control input {
	color: var(--upload_filename);
}

#upload-list .btn:hover {
	background-image: var(--icon_close_red_true) !important;
}

.apply_row {
	margin-left: 0px;
	margin-right: 0px;
}

.offers .application {
	margin-top: -25px;
}