@charset "utf-8";

/*
Theme Name:		Fachkräfteportal Respo
Version:		0.9
Author:			Webit!
Author URI: 	https://www.webit.de/
Date:			2019-02
*/


@media screen and (min-width: 1921px) {
	.main-navigation-inner {
		padding: 60px 8.3%;
	}

	.main-navigation .language-navigation {
		margin-bottom: 85px;
	}

	.main-navigation-additional {
		margin-top: 60px;
	}
}

@media screen and (min-width: 1920px) {
	.blockquote-slider.slick-initialized blockquote {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}

	.video-row .embed-container {
		margin-top: -50px;
	}

	.video-row >:last-child {
		padding-left: 70px;
		padding-top: 50px;
	}

	/* card-slider */
	.card-slider {
		padding-right: 0;
	}

	.card-slider .slide-item {
		padding-left: 4rem;
		padding-right: 4rem;
	}
	
	.card-slider .slick-arrow.slide-next {
		right: 4rem;
	}
	
	.card-slider .slick-arrow.slide-prev {
		left: 4rem;
	}

	/* card-slider */
	.card-slider img {
		width: 50%;
	}
}

@media only screen and (max-width: 1400px) { /* it make sense */

	body.icon-outside:before { width: 500px; height: 500px; left: -280px; top: -160px; }
	.article-item.infobox-right .article-infobox { margin-right: 8.333%; width: 33.333%; }
	h1, h1 a, .likeh1 { font-size: 2rem; }
	.page-image { height: 600px !important; }
	body.mappage .body-icon { left: -17.52rem; }

	.main-navigation.icon-outside::before {
		width: 500px; height: 500px; left: -280px; top: -160px;
	}

	.shape {
		float: right;
		height: 400px;
		width: 600px;
		shape-outside: polygon(100% 0, 60% 0, 100% 100%);
	}

	/* card-slider */
	.card-slider .slide-item {
		padding-bottom: 3.5rem;
		padding-left: 2rem;
		padding-right: 2rem;
	}
}

@media only screen and (max-width: 1200px) { /* lg */

	html, body { font-size: 18px; }
	.article-infobox.fixed-infobox { font-size: 1rem; }
	.fixed-navigation.icon-list > li > .icon-link,
	.fixed-navigation-outer .icon-link { font-size: .75rem; line-height: 1;}
	.fixed-navigation.icon-list > li > .icon-link .icon-title,
	.fixed-navigation-outer .icon-link .icon-title { margin-top: -.5rem; }

	.fixed-infobox .icon-ul a:before { height: 1rem; }
	
	.logo-container {
		margin-left: 4rem;
	}

	.shape {
		float: right;
		height: 400px;
		width: 600px;
		shape-outside: polygon(100% 0, 60% 0, 100% 100%);
	}

	blockquote.gradient-background { margin-left: -15px; margin-right: -15px; }
	
	.gradient-background.gradient-small:before { margin-left: 0; margin-right: 0; }
	.gradient-background.gradient-grey:before { left: 0; right: 0; }
	
	.article-item.image-left .article-image img { max-height: 400px; width: auto; }
	
	.teaser-item { margin-bottom: 2rem; }
	
	/* map */
	.marker-container { font-size: 1rem; }
	
	body.mappage .body-icon { left: -25.52rem; top: -12rem; }

	/* ========= main-navigation */
	.main-navigation-inner {
		padding: 40px 35px;
	}

	.main-navigation .language-navigation {
		margin-bottom: 40px;
	}

	.image-teaser-text {
		padding: 15px 35px;
	}

	.language-navigation,
	.main-navigation-additional,
	.main-navigation .eye-catcher {
		font-size: .8rem;
	}

	.main-navigation-additional {
		margin-top: 30px;
	}

	.main-navigation .eye-catcher img {
		margin-right: 0;
		max-width: 16vw;
	}

	.main-navigation nav {
		font-size: 1rem;
	}

	.page-header .fixed-navigation-outer {
		left: -1.7rem;
		top: 285px;
	}
}

@media only screen and (max-width: 1024px) {
	
	html, body { font-size: 16px; }
	
	body.icon-outside:before { width: 450px; height: 450px; left: -250px; top: -150px; }
	
	.shape {
		float: right;
		height: 240px;
		width: 400px;
		shape-outside: polygon(100% 0, 40% 0, 75% 100%, 100% 100%);
	}

	.page-image { height: 400px !important; }
	
	.logo-container {
		margin-left: 5rem;
	}
	
	.icon-link { line-height: 60px; }
	body.mappage .fixed-navigation.icon-list > li > .icon-link:before,
	.icon-link:before { width: 60px; height: 60px; }

	body.mappage .fixed-navigation.icon-list > li > .icon-link,
	.icon-list li > .icon-link {
		padding: 0 .5rem .5rem .5rem;
		margin: .5rem;
	}

	body.mappage .fixed-navigation.icon-list > li > .icon-link {
		width: 80px;
		height: 80px;
	}

	.icon-list li > .icon-link {

		height: auto;
	}
	
	/* article */
	.article-item.image-left .article-content { width: 50%; float: right; }
	.article-item.image-left .article-image { position: absolute; margin-right: 0%; width: 60%; left: -15%; margin-top: -4rem; }
	.article-item.image-right .article-content { width: 50%; margin-left: 0; }
	.article-item.image-right .article-image { position: absolute; width: 60%; margin-left: 0; right: -15%; margin-top: -4rem; }
	.article-item.infobox-right .article-content { width: 50%; margin-left: 0; }
	.article-item.infobox-right .article-infobox { margin-right: 0; }
	
	body.mappage .body-icon { top: -20rem; }

	/* main navigation */
	.main-navigation.icon-outside::before { width: 450px; height: 450px; left: -250px; top: -150px; }

	.page-header .fixed-navigation-outer {
		top: 270px;
	}
}

@media only screen and (max-width: 991px) {
	.main-navigation.icon-outside::before {
		display: none;
	}
}

@media only screen and (max-width: 990px) {
	.main-navigation nav {
		margin-bottom: 20px;
	}

	/* card slider */

	.card-slider .slide-item {
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.card-slider .slick-arrow {
		bottom: 2rem;
	}
}

@media only screen and (min-width: 769px) {
	.fixed-navigation-outer .icon-main-navigation {
		margin-bottom: 30px;
		margin-top: -30px;
	}

	/* card-slider */
	.card-slider img {
		width: 80%;
	}

	/* story teaser */
	.stories h2 {
		color: #CB4F1C;
	}
}

@media screen and (min-width: 768px) {
	.blockquote-slider .blockquote-image.outside {
		position: static;
		margin-top: -3rem;
		margin-bottom: -7rem;
	}

	.video-row .embed-container {
		margin-top: -3vw;
	}

	.video-row >:last-child {
		padding-left: 3vw;
		padding-top: 2vw;
	}
}

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

	html, body {
		line-height: 1.25;
	}

	body.icon-outside:before {
		width: 400px;
		height: 400px;
		left: -230px;
	}

	/* reset font size */
	.icon-link,
	.teaser-item,
	.page-header .header-intro,
	.markerinfo-container,
	h6, h6 a, .likeh6 {
		font-size: 1rem;
	}

	h1, h1 a, .likeh1 {
		font-size: 1.333rem;
	}

	/* grid */
	.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-left: 1.5rem;
		padding-right: 1.5rem;
	}

	.container {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}

	.row {
		margin-left: -1.5rem;
		margin-right: -1.5rem;
	}

	.bottomSpace {
		padding-bottom: 2rem;
	}

	.topSpace {
		margin-top: 2rem;
	}
	
	/* main-navigation */
	.page-header .fixed-navigation-outer {
		top: 15.2rem;
	}

	/* footer navigation */
	.page-footer {
		margin-top: 5rem;
	}

	.footer-navigation > li {
		width: auto;
	}

	.footer-navigation .slick-slide {
		text-align: center;
	}

	.navigation-container {
		padding-bottom: 2rem;
	}

	.navigation-container:after {
		display: none;
	}

	.meta-navigation-container {
		text-align: center;
		padding-bottom: 1rem;
	}

	.meta-navigation {
		position: relative;
		left: auto;
		bottom: auto;
		display: inline-block;
	}

	.meta-navigation a,
	.footer-navigation a {
		padding: .5rem 2rem;
	}

	/* social navigation */
	.social-navigation-container {
		text-align: center;
		margin-bottom: 2rem;
	}

	/* blockquote */
	blockquote {
		text-align: center;
	}

	blockquote.has-image {
		margin-bottom: 10rem;
		margin-left: -1.5rem; /* negative container padding*/
		margin-right: -1.5rem; /* negative container padding*/
	}

	blockquote .blockquote-image.outside {
		position: relative;
		margin-bottom: -5rem;
		top: 1rem;
	}

	.blockquote-slider {
		margin-left: -1.5rem; /* negative container padding*/
		margin-right: -1.5rem; /* negative container padding*/
	}

	.blockquote-slider.slick-initialized blockquote {
		margin-left: 0;
		margin-right: 0;
		width: auto;
	}

	.blockquote-slider .slick-arrow {
		width: 17px;
	}

	.blockquote-slider .slick-arrow::before {
		background-position: center right;
		background-image: url('/assets/icon-slider-arrow-right.svg');
		opacity: .25;
	}

	.blockquote-slider .slide-prev {
		left: 5px;
	}

	.blockquote-slider .slide-next {
		right: 5px;
	}

	.blockquote-slider .icon-link.icon-left:before {
		float: none;
	}

	/* card slider */
	.card-slider {
		max-width: 520px;
	}

	.card-slider .slick-arrow {
		bottom: 1.5rem;
	}

	.card-slider .slick-arrow.slide-next {
		right: 4rem;
	}

	.card-slider .slick-arrow.slide-prev {
		left: 4rem;
	}

	.card-slider .slide-item {
		padding: 1rem 1.5rem 3.5rem 1.5rem;
	}

	/* article */
	.single-items .teaser-item {
		margin-left: 0;
		margin-right: 0;
	}

	.article-item.infobox-right .article-content,
	.article-item.infobox-right .article-infobox {
		width: 48%;
	}

	/* article */
	.article-item.image-right .article-content,
	.article-item.image-left .article-content {
		width: 100%;
		float: none;
		clear: both;
		margin-left: 0;
		margin-right: 0;
	}

	.article-item.image-right .article-image,
	.article-item.image-left .article-image {
		position: relative;
		margin-top: 0;
		width: 100%;
		left: auto;
		right: auto;
		text-align: center;
	}

	.article-image.outside-left {
		margin-left: 0;
	}

	.article-image.outside-right {
		margin-right: 0;
	}

	/* fixed infobox */
	.fixed-navigation.icon-list > li {
		position: static;
	}

	body:not(.mappage) .article-infobox.fixed-infobox {
		top: auto;
		bottom: 6.3rem;
		left: 0;
		right: 0;
		width: auto;
	}

	/* respo helper	*/
	.respo-left {
		text-align: left;
	}

	/* document */
	.page-document {
		margin-top: 0;
	}

	/* map */
	body.mappage .body-icon {
		top: -24rem;
	}

	body.mappage .wrapper {
		padding-bottom: 96px;
	}

	.main-navigation nav {
		font-size: 1.125rem;
		line-height: 1.5;
	}

	.main-navigation .eye-catcher {
		font-size: 12px;
	}

	.main-navigation .eye-catcher a {
		font-size: 14px;
	}

	.main-navigation .eye-catcher > img {
		margin-right: 10px;
		max-width: 140px;
		min-width: 95px;
		width: 25vw;
	}

	.main-navigation .eye-catcher a:before {
		margin-right: 0;
	}

	.page-header .language-navigation {
		display: none;
	}

	.main-navigation-additional li {
		margin: 3px 0;
	}
}

@media only screen and (max-width: 767px) {
	.page-footer {
		margin-bottom: 75px;
	}

	/* logo */
	.logo-container {
		margin-left: 0;
		margin-bottom: 1.5rem;
	}

	/* fixed navigation */
	body:not(.mappage) .toggle-navigation {
		display: block;
		position: fixed;
		bottom: 6px;
		right: 60px;
		padding: 0;
		z-index: +1;
	}

	body:not(.mappage) .toggle-navigation.active {
		bottom: 6rem;
	}

	.toggle-navigation .icon-link {
		line-height: 1;
		margin: 0;
		display: block;
		padding: 0;
	}

	.toggle-navigation .icon-link:before {
		width: 70px;
		height: 70px;
		background-size: 105px;
	}

	.toggle-navigation.active .is-closed,
	.toggle-navigation:not(.active) .is-open {
		display: none;
	}

	.toggle-navigation .is-closed::before {
		background-image: url('/assets/plus-icon-mobil.svg');
	}

	body:not(.mappage) .fixed-navigation.icon-list {
		display: none;
		top: auto;
		bottom: 0;
		left: 0;
		right: 0;
		margin-bottom: 0;
		z-index: +1;
		position: fixed;
		background: #6a1979;
		background: -moz-linear-gradient(45deg, #6a1979 0%, #cb4f1c 100%);
		background: -webkit-linear-gradient(45deg, #6a1979 0%, #cb4f1c 100%);
		background: linear-gradient(45deg, #6a1979 0%, #cb4f1c 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6a1979', endColorstr='#cb4f1c', GradientType=1);
	}

	.fixed-navigation.icon-list > li {
		display: inline-block;
	}

	.fixed-navigation.icon-list > li > .icon-link {
		width: 85px;
		height: 85px;
		margin: .5rem 0;
		padding: .25rem 0 .75rem 0;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		-o-box-shadow: none;
		box-shadow: none;
	}

	.fixed-navigation.icon-list > li > .icon-link .icon-title {
		margin-top: 0;
	}

	body.mappage .fixed-navigation.icon-list {
		width: 100%;
	}

	body.mappage .infobox-filter {
		width: 300px;
	}

	.main-navigation-container {
		bottom: 10px;
		height: auto;
		position: fixed;
		right: 10px;
	}

	.fixed-navigation-outer .icon-link.icon-main-navigation {
		background-image: url('/assets/menu-mobile.svg');
		background-repeat: no-repeat;
		background-position: center;
		margin: 0;
		height: 70px;
		width: 70px;
		padding: 0;
	}

	.fixed-navigation-outer .icon-link.icon-main-navigation .icon-title {
		display: none;
	}

	.fixed-navigation-outer .icon-link.icon-main-navigation::after {
		display: none;
	}
	
	.icon-main-navigation::before {
		margin-top: 16px;
	}

	/* card-slider */
	.card-slider {
		margin: 0 auto;
	}
}

@media only screen and (max-width: 640px) {
	
	.page-header { margin-top: 4rem; }
	
	.logo-container { max-width: 160px; }

	.shape {
		float: right;
		height: 250px;
		width: 250px;
		shape-outside: polygon(100% 0, 50% 0, 100% 90%);
	}

	.page-image {
		height: 250px !important;
	}

	.indent { margin: .5rem .5rem; }
	.indent-left { padding-left: 0; }
	.indent-right { padding-right: 0; }
	body.mappage .indent-left { padding-left: 1rem; }
	body.mappage .indent-right { padding-right: 1rem; }

	.main-navigation .language-navigation {
		margin-bottom: 0;
	}

	.main-navigation-inner {
		flex-grow: 0;
	}

	.main-navigation nav {
		height: auto !important; /* JavaScript */
		margin: 35px 0;
	}

	.main-navigation nav ul {
		width: auto;
	}

	.main-navigation nav > ul {
		height: auto;
		border-right: none;
		padding-right: 0;
	}

	.main-navigation nav ul ul {
		min-height: 0;
		padding-left: 15px;
		position: static;
		padding-right: 0;
		margin: 5px 0;
	}

	.main-navigation nav ul li {
		padding: 3px 0;
	}

	.main-navigation-footer {
		overflow: auto;
	}

	.main-navigation-footer ul {
		display: flex;
	}

	.main-navigation-footer li {
		flex: 0 0 75vw;
		width: 75vw;
	}
}

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

	.logo-container { max-width: 160px; }
	
	.page-image {
		height: 250px !important;
	}
	
	.icon-list li > .icon-link {
		margin: .125rem;
		padding: 0 .25rem .5rem .25rem;
		/* width: 70px; */
	}
	
	/* article */
	/* .article-item.image-left .article-image { left: -25%; } */
	.article-item.infobox-right .article-content,
	.article-item.infobox-right .article-infobox { width: 100%; clear: both; float: none; }

	.blockquote-slider.slick-initialized blockquote {
		width: 100%;
	}

	/* card-slider */
	.card-slider {
		padding: 0;
	}

	.card-slider .slick-arrow.slide-next {
		right: 3rem;
	}

	.card-slider .slick-arrow.slide-prev {
		left: 3rem;
	}
}

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

	.fixed-navigation.icon-list > li > .icon-link { width: 75px; }
	
	h1, h1 a, .likeh1 { width: 75%; }
	
	.col-xxs-12 { width: 100%; }

	/* card-slider */
	.card-slider h1 {
		margin: 0 auto;
		padding-top: 2rem;
	}
}