/*=============================================================================

    Theme Name: KWS Theme
    
===============================================================================*/

.technologie-stack {
	background:#eef2f5;
	padding:75px 0;
	overflow:hidden;
}

.list-technologie-stack {
	position:relative;
	margin:-20px -65px;
	padding:20px 0;
}

.list-technologie-stack div.item {
	display:inline-block;
	width:120px;
	margin:20px 65px;
	vertical-align:top;
	text-align:center;
}

.list-technologie-stack div.item  p {
	font-size:18px;
	line-height:28px;
	color:#34414b;	
	margin:0;
	padding:4px 0 0 0;
}

.list-technologie-stack div.image {
	display:inline-block;
	width:80px;
	height:80px;
	background-color:#448fed;
	border-radius:50%;
	position:relative;
	transition: all 0.5s;
}

.list-technologie-stack div:hover div.image {
	background-color:#FFF;
	box-shadow: 0px 15px 25px 0px rgba(68, 143, 237, 0.3);
}

.list-technologie-stack div.image .normal,
.list-technologie-stack div.image .hover {
	display:inline-block;
	width:80px;
	height:80px;
	background-repeat:no-repeat;
	background-position:center center;
	position:absolute;
	left:0px;
	right:0px;
	bottom:0px;
	top:0px;
	transition: all 0.5s;
}

.list-technologie-stack .item div.image .hover {
	opacity:0;
}

.list-technologie-stack .item:hover div.image .normal {
	opacity:0;
}

.list-technologie-stack .item:hover div.image .hover {
	opacity:1;
}

/*------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.we-are-successful {
	background:#ffffff;
	padding:85px 0;
	overflow:hidden;
}

.we-are-successful .line {
	width:100%;
	height:20px;
	background:#edf0f2;
	border-radius:15px;
	margin:80px 0;
}

.we-are-successful .two,
.we-are-successful .three {
	position:relative;
	margin:0 -80px;
	text-align:center;
}

.we-are-successful .two div,
.we-are-successful .three div {
	font-size:18px;
	line-height:28px;
	color:#34414b;
	text-align:center;
	display:inline-block;
	margin:0 80px;
	vertical-align:top;
	width:260px;
	position:relative;
	height:50px;
}

.we-are-successful .two div p,
.we-are-successful .three div p {
	padding:0;
	margin:0;
}

.we-are-successful .two div::before,
.we-are-successful .three div::before {
	content:'';
	display:block;
	width:18px;
	height:53px;
	position:absolute;
	left:50%;
	margin:0 0 0 -9px;
	transition: all 0.5s;
}

.we-are-successful .two div::before {
	background:url("images/we-are-successful-bottom.png") no-repeat center center;
	top:-75px;
}

.we-are-successful .two div:hover::before {
	background:url("images/we-are-successful-bottom-hover.png") no-repeat center center;
	top:-60px;
}

.we-are-successful .three div::before {
	background:url("images/we-are-successful-top.png") no-repeat center center;
	bottom:-75px;
}

.we-are-successful .three div:hover::before {
	background:url("images/we-are-successful-top-hover.png") no-repeat center center;
	bottom:-60px;
}

.we-are-successful .two span,
.we-are-successful .three span {
	border:12px solid rgb(68, 143, 237);
	background:#ffffff;
	border-radius: 50%;
	box-shadow: 0px 15px 25px 0px rgba(68, 143, 237, 0.3);
	position: absolute;
	width: 40px;
	height: 40px;
	margin:0 0 0 -20px;
	left:50%;
	transition: all 0.5s;
}

.we-are-successful .two div:hover span,
.we-are-successful .three div:hover span {
	border:12px solid #FFF;
	background:rgb(68, 143, 237);
}

.we-are-successful .three span { bottom:-109px; }
.we-are-successful .two span { top:-109px; }

.we-are-successful .two span::before,
.we-are-successful .three span::before,
.we-are-successful .two span::after,
.we-are-successful .three span::after {
	content: '';
	position: absolute;
	border: 1px solid #d9e3ec;
	left:-12px;
	right:-12px;
	top:-12px;
	bottom:-12px;
	border-radius: 50%;
	opacity: 1;
	animation: pulse 2s linear infinite;
}

.we-are-successful .two div:hover span::before,
.we-are-successful .two div:hover span::after,
.we-are-successful .three div:hover span::before,
.we-are-successful .three div:hover span::after {
	border: 1px solid #448fed;
}

.we-are-successful .two div span::before,
.we-are-successful .three div  span::before {
	animation-delay: 1s;
}

.we-are-successful .two div span::after,
.we-are-successful .three div span::after {
	animation-delay: 2s;
}

@keyframes pulse {
	0% {
		transform: scale(0.9);
		opacity: 0;
	}
	10% {
		opacity: 0.1;
		transform: scale(1);
	}
	50% {
		opacity: 0.6;
		transform: scale(1.3);	
	}
	90% {
		transform: scale(1.5);
		opacity: 0.9;
	}
	100% {
		transform: scale(1.6);
		opacity: 0;
	}
}

.we-are-successful .button {
	text-align:center;
	padding:50px;
}

.we-are-successful .button a {
	font-family:'Noto Sans Display Condensed';
	text-transform: uppercase;
	display:inline-block;
	width: 200px;
	height: 69px;	
	border-radius: 5px;
	background-color: rgb(239, 57, 33);
	box-shadow: 0px 15px 25px 0px rgba(239, 57, 33, 0.3);
	font-size:16px;
	color:#ffffff;
	text-decoration:none;
	transition: all 0.5s;
	text-align:center;
	padding:24px 0;
}

.we-are-successful .button a:active,
.we-are-successful .button a:hover {
	background-color: rgb(220, 26, 0);
	box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.1);	
}

/*------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.frontpage__head.localisation {
	min-height:600px;
}

.frontpage__head.localisation .list {
	padding:5px 0 5px 30px;
	position:relative;
}

.frontpage__head.localisation .list::before {
	content:'';
	display:block;
	position:absolute;
	left:0px;
	top:9px;
	width:14px;
	height:9px;
	background:url("images/list.png") no-repeat 0 0;
}

.showhide { 
	display:none;
	padding:5px 0 0 0; 
}

/*---------------------------------------------------------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 1180px) {
	
	.list-technologie-stack {
		margin:-20px -35px;
		text-align:center;
	}

	.list-technologie-stack div.item {
		margin:20px 35px;
	}	
	
	.we-are-successful .two,
	.we-are-successful .three {
		margin:0 -30px;
	}

	.we-are-successful .two div,
	.we-are-successful .three div {
		margin:0 30px;
	}	
	
}

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

	.we-are-successful .two,
	.we-are-successful .three {
		margin:0 -10px;
	}

	.we-are-successful .two div,
	.we-are-successful .three div {
		margin:0 10px;
		font-size:16px;
		line-height:26px;
		width:220px;
	}	
	
}

@media screen and (max-width: 780px) {
	
	.list-technologie-stack {
		margin:-10px -15px;
	}

	.list-technologie-stack div.item {
		margin:10px 15px;
	}	
	
}

@media (max-width: 767.98px) {
	
	.showhide { 
		display:block; 
	}
	
	.we-are-successful {
		padding:55px 0;
	}

	.technologie-stack {
		padding:55px 0;
	}
	
}

@media screen and (max-width: 760px) {
	
	.we-are-successful .line { display:none; }
	
	.we-are-successful .two,
	.we-are-successful .three {
		text-align:center;
		margin:0;
	}	
	
	.we-are-successful .two div,
	.we-are-successful .three div {
		width:100%;
		text-align:center;
		height:auto;
		margin:0;
	}
	
	.we-are-successful .two div p,
	.we-are-successful .three div p {	
		width:240px;
		font-size:18px;
		line-height:28px;
		display:inline-block;
		margin:20px 0;
	}
	
	.we-are-successful .two div p br,
	.we-are-successful .three div p br { display:none; }
	
	.we-are-successful .two span,
	.we-are-successful .three span {
		left:0px;
		bottom:auto;
		top:50%;
		margin:-20px 0 0 0;
	}
	
	.two-three {
		position:relative;
		width:500px;
		margin:0 auto;
	}
	
	.two-three::before {
		content:'';
		width:20px;
		background:#edf0f2;
		border-radius:15px;
		position:absolute;
		left:10px;
		bottom:0px;
		top:0px;
	}
	
	.we-are-successful .two div::before,
	.we-are-successful .two div:hover::before	{
		-webkit-transform: rotate(90deg);
		-moz-transform: rotate(90deg);
		-o-transform: rotate(90deg);
		transform: rotate(90deg);	
		top:50%;
		margin:-25px 0 0 0;
		left:80px;
	}
	
	.we-are-successful .three div::before {
		-webkit-transform: rotate(270deg);
		-moz-transform: rotate(270deg);
		-o-transform: rotate(270deg);
		transform: rotate(270deg);
		top:50%;
		margin:-25px 0 0 0;
		left:80px;
	}
	
	.part__phone { text-align:center; }
		
}

#header__mobile .part__lang {
	float:right;
	flex-flow: 1;
    padding: 0 15px;
	margin-right:10px;
	margin-top:5px;
}

#header__mobile .drop-dl ul {
    z-index:111;
}

#header__mobile {
	height:90px;
    overflow: visible;
}