@charset "utf-8";

/* Base *******/
html,
body {
	margin: 0;
	padding: 0;
	scroll-behavior: smooth;
	width: 100%;
	overflow-x: hidden;
}

:root {
	font-size: 20px;
}

body {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 1rem;
	cursor: default;
}

a,
button,
video:hover {
	cursor: pointer;
}

.maxContainer {
	width: 100%;
	margin: auto;
	max-width: 1200px;
	position: relative;
}

#maincontent {
	width: 99.99%;
	margin: auto;
}

/* Font ******/
@font-face {
	font-family: 'fontello';
	src: url('../font/fontello.eot?86321134');
	src: url('../font/fontello.eot?86321134#iefix') format('embedded-opentype'),
		url('../font/fontello.woff2?86321134') format('woff2'),
		url('../font/fontello.woff?86321134') format('woff'),
		url('../font/fontello.ttf?86321134') format('truetype'),
		url('../font/fontello.svg?86321134#fontello') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="iconbkm-"]::before,
[class*=" icon-"]::before {
	font-family: "fontello";
	font-style: normal;
	font-weight: normal;
	speak: none;
	display: inline-block;
	text-decoration: inherit;
	width: 1em;
	text-align: center;
	font-variant: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.iconbkm-youtube::before {
	content: '\e800';
}

.iconbkm-facebook::before {
	content: '\e802';
}

/* '' */
.iconbkm-instagram::before {
	content: '\e801';
}

/* '' */
.iconbkm-linkedin::before {
	content: '\e803';
}

/* '' */
.iconbkm-corn::before {
	content: '\e804';
}

/* '' */

/* Design *****/
/* Header ******/
#mainHeader {
	background: #FFF;
	border-bottom: solid 2px #20608b;
	position: fixed;
	top: 0;
	left: 0;
	height: 50px;
	width: 100%;
	z-index: 900;
	transform: translateZ(10px);
	transition: border-color .5s ease;
}

#mainHeader.ref {
	background: rgba(0, 0, 0, .3) !important;
	border-bottom: solid 2px #FFF !important;
}

/*logo*/
#mainlogo {
	display: inline-block;
}

#logo {
	height: 50px;
}

#Frame {
	opacity: 0;
}

#km,
#b,
#Frame {
	transition: all 1.5s ease;
	transform-origin: center;
}

#b,
#Frame {
	transform: translate(-29%, 0) scale(1) rotateY(0deg);
}

#logo:hover #km {
	transform: translate(100%, 0);
}

#logo:hover #b,
#logo:hover #Frame {
	transform: translate(0, 0) scale(.8) rotateY(360deg);
	transform-origin: center;
}

#logo:hover #Frame {
	opacity: 1;
}

#mainHeader.ref .logocolor {
	fill: #FFF !important;
}

@-webkit-keyframes anisvg {
	from {
		stroke-dashoffset: 4000;
	}

	to {
		stroke-dashoffset: 0;
	}
}

@keyframes anisvg {
	from {
		stroke-dashoffset: 4000;
	}

	to {
		stroke-dashoffset: 0;
	}
}

/* Menu ******/
#mainMenu {
	position: absolute;
	right: 0;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

#mainMenu ul,
#mainMenu li {
	margin: 0;
	padding: 0;
	display: inline-block;
	vertical-align: middle;
}
#mainMenu li {
	margin: 0 3px;
}

#mainMenu li a,
#slider a.button,
#maincontent a.button,
#maincontent .mail button {
	position: relative;
	color: #000;
	text-decoration: none;
	padding: 5px 10px;
	display: inline-block;
	transition: transform .4s .1s, border .4s .1s;
	margin: 1px;
	overflow: hidden;
	background: rgba(255, 255, 255, 0) !important;
	outline: none;
	font-size: 1rem;
	text-shadow: none !important;
	box-shadow: none !important;
	box-sizing: border-box;
	border:none;
	border-left:solid 1px #000;
	border-right:solid 1px #000;
	font-weight: 400;
	font-family: 'Montserrat', sans-serif;
}
#slider a.button{
	filter: invert(1);
	text-shadow: 0 0 20px #fff, 0 0 10px #fff, 0 0 5px #fff!important;
}

#mainMenu li a {
	border: 0 !important;
	border-radius: 0;
	font-size: .8rem;
	color:#1f6088;
	font-weight: 500;
}
.ref #mainMenu li a {
	color:#fff;
}

#maincontent .mail button {
	outline: none;
}

#maincontent .mail button:focus {
	outline: none;
}

#mainMenu #mainSocial li a {
	padding: 5px;
	font-size: 1rem;
}

#showroom {
	border-bottom: solid 2px #20608b !important;
	border-radius: 6px !important;
}

#showroom i {
	font-size: 2rem;
}

#mainMenu li a:hover,
#slider a.button:hover,
#maincontent a.button:hover,
#maincontent .mail button:hover {
	-webkit-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
	z-index: 1;
	border-color:rgba(0, 0, 0, 0)!important;
}

#mainMenu li a::before,
#slider a.button::before,
#maincontent a.button::before,
#maincontent .mail button::before,
#mainMenu li a::after,
#slider a.button::after,
#maincontent a.button::after,
#maincontent .mail button::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: -100%;
	width: 100%;
	height: 1px;
	background: #000;
	-webkit-transition: left ease-in-out .3s;
	transition: left ease-in-out .3s;
}
#mainMenu li a::before,
#maincontent a.button::before,
#slider a.button::before,
#maincontent .mail button::before {
	left: 100%;
}
#mainMenu li a::before,
#mainMenu li a::after {
	background: #20608b;
}
.ref #mainMenu li a::before,
.ref #mainMenu li a::after {
	background: #fff;
}

#mainMenu li a:hover::before,
#slider a.button:hover::before,
#maincontent a.button:hover::before,
#maincontent .mail button:hover::before,
#mainMenu li a:hover::after,
#slider a.button:hover::after,
#maincontent a.button:hover::after,
#maincontent .mail button:hover::after {
	left: 0;
}

#mainMenu li a.selected::before,
#mainMenu li a.selected::after {
	left: 0;
}

/* #mainHeader.ref #mainMenu li a,
#mainHeader.ref #mainMenu li a:hover {
	background: none !important;
	color: #FFF !important;
} */

#mainHeader.ref #mainMenu li a:hover {
	border-bottom: solid 1px #FFF !important;
}

/* Slider ******/
/* swipe */
.swipe {
	overflow: hidden;
	position: relative;
}

.swipe-wrap {
	overflow: hidden;
	position: relative;
}

.swipe-wrap>div {
	float: left;
	width: 100%;
	position: relative;
}

/* arrow */
#sliderpar {
	position: fixed;
	width: 100%;
	padding-top: 40%;
	top: 0;
}

#sliderContainer {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

#sliderContainer #right,
#sliderContainer #left {
	position: absolute;
	height: 40px;
	width: 40px;
	z-index: 10;
	top: 50%;
	cursor: pointer;
}

#sliderContainer #right svg,
#sliderContainer #left svg {
	fill: #20608b;
	stroke: #FFFFFF;
	stroke-width: 5%;
	stroke-dasharray: 3000;
	stroke-dashoffset: 3000;
	transform: translateY(-50%);
	transition: all .5s ease-in-out;
}

#sliderContainer #right:hover svg,
#sliderContainer #left:hover svg {
	stroke-dashoffset: 0;
	transform: translateY(-50%) scale(1.5);
}

#sliderContainer #left {
	left: 20px;
}

#sliderContainer #right {
	right: 20px;
}

#slider {
	width: 100%;
	position: relative;
}

#slider .item {
	display: none;
	overflow: hidden;
}

#slider .item:nth-child(1),
#slider .item[data-index] {
	display: block;
}

#slider .descContainer {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	max-width: 900px;
	height: 100%;
	z-index: 1;
}

#slider a.descGoto {
	position: absolute;
	top: 0;
	left: 20%;
	right: 20%;
	bottom: 0;
	z-index: 1;
}

#slider .vidContainer {
	width: 100%;
	padding-top: 43%;
	overflow: hidden;
}

#slider .videoContainer {
	position: absolute;
	top: 45%;
	left: 50%;
	width: 100%;
	height: 140%;
	transform: translate(-50%, -50%);
	background: #FFF;
}

#slider .desctilt {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	transform-style: preserve-3d;
	box-shadow: none !important;
}

#slider .descContent {
	position: absolute;
	top: 48%;
	left: 56%;
	width: 80%;
	padding: 10px;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	transform-style: preserve-3d;
}

#slider .descContent h2 {
	font-size: 1.5rem;
	line-height: 1.1em;
	padding: 10px 0;
	margin: 0;
	transform: translateZ(50px);
	color: #FFF;
	text-shadow: 0 0 20px #000, 0 0 10px #000, 0 0 5px #000;
	font-weight: normal;
}

#slider .descContent p {
	text-align: justify;
	padding: 10px 0;
	margin:0;
	line-height: 130%;
	color: #FFF;
	text-shadow: 0 0 20px #000, 0 0 10px #000, 0 0 5px #000;
}

#slider .preview {
	overflow: hidden;
}

/* Ref container */
#refContainer {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	background: #000;
}

#refContainer .video-js {
	width: 100%;
	padding-top: 56.5%;
	height: 0;
	background: #000;
}

#refContainer .video-js .vjs-big-play-button {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

#refContainer .vjs-has-started .vjs-control-bar {
	position: fixed;
	background-color: rgba(0, 0, 0, 1);
}

/* Content ****/
/* Paragraphe */
#maincontent.par {
	background: #FFF;
	position: relative;
}

.wave {
	width: 100%;
	position: relative;
	fill: transparent;
	margin-top: 40%;
	display: block;
}

#maincontent p {
	display: block;
	line-height: 1.1em;
	margin: 0;
	padding: 15px 30px;
	text-align: left;
	color: #000;
}

#maincontent p:first-child {
	padding-top: 0;
}

/* Header */
#maincontent h1,
#maincontent h2,
#maincontent h3 {
	font-size: 1.5rem;
	line-height: 1.1em;
	padding: 30px;
	margin: 0;
	/* color: #20608b; */
	font-weight: 500;
}
#maincontent h1{
	color:#000;
	font-weight: 600;
}

#maincontent h1:first-child,
#maincontent h2:first-child,
#maincontent h3:first-child {
	padding-top: 0;
}

#maincontent h2 {
	font-size: 1.25rem;
}

#maincontent h3 {
	font-size: 1rem;
}

/* Inline */
#maincontent b {
	font-weight: 500;
}

#maincontent i {}

#maincontent u {}

#maincontent s {}

#maincontent a {
	color: #20608b;
	text-decoration: none;
}

#maincontent a:hover img,
#maincontent a.open img {
	border: solid 2px #20608b;
}

/* Button */
a.ctaButton {
	display: inline-block;
	white-space: nowrap;
	background: #FFF;
	max-width: 36px;
	height: 36px;
	width: auto;
	overflow: hidden;
	padding: 5px 0px 5px 36px;
	position: relative;
	box-sizing: border-box;
	-webkit-transition: padding .3s .1s ease-in-out, max-width .3s .1s ease-in-out;
	transition: padding .3s .1s ease-in-out, max-width .3s .1s ease-in-out;
	text-decoration: none;
	color: #20608b;
	font-weight: bold;
	margin-top: 15px !important;
}

a.ctaButton::before,
a.ctaButton::after {
	content: "";
	display: block;
	position: absolute;
	background: #20608b;
	border-radius: 3px;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	-webkit-transition: left .3s .1s ease-out;
	transition: left .3s .1s ease-out;
}

a.ctaButton.popcorn::before {
	display: none;
}

a.ctaButton.popcorn::after {
	content: '\e804';
	font-family: "fontello";
	font-style: normal;
	font-weight: normal;
	speak: none;
	text-decoration: inherit;
	width: 1em;
	height: 1em;
	transform: translate(-50%, -50%);
	font-size: 1.5rem;
	text-align: center;
	font-variant: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background: transparent;
	border: 0;
}

a.ctaButton::before {
	width: 6px;
	height: 26px;
}

a.ctaButton::after {
	width: 26px;
	height: 6px;
}

#maincontent.editing a.ctaButton,
a.ctaButton:hover {
	max-width: 500px;
	padding: 5px 10px;
}

#maincontent.editing a.ctaButton::before,
a.ctaButton:hover::before {
	left: 150%;
}

#maincontent.editing a.ctaButton::after,
a.ctaButton:hover::after {
	left: -50%;
}

/* List */
#maincontent ol {}

#maincontent ul {}

#maincontent li {
	text-align: left;
	padding: 5px;
	position: relative;
	transition: all .4s ease-in-out;
}

@media only screen and (min-width:900px) {
	#maincontent #sliderLogoContainer img {
		display: inline-block;
		width: 49%;
	}
}

/* Image */
#maincontent img {
	width: 100%;
	height: auto;
}

#maincontent div.col[data-class=lieff] ul {
	padding: 0;
}

#maincontent div.col[data-class=lieff] li {
	list-style: none;
	font-size: .75rem;
	display: inline-block;
	width:48%;
}

#maincontent div.col[data-class=lieff] img {
	display: inline-block;
	width: 50px;
	vertical-align: middle;
	margin-right: 10px;
}

#maincontent img.natural {
	/* Reel Size */
	display: inline-block;
	width: auto;
	max-width: 100%;
}

#maincontent img.size50 {
	/* 50% size of container */
	display: inline-block;
	width: 40%;
	margin: 0 4.99%;
}

#maincontent img.size30 {
	/* 30% size of container */
	display: inline-block;
	width: 29%;
	margin: 0 1.99%;
}

#maincontent img.size25 {
	/* 25% size of container */
	display: inline-block;
	width: 21%;
	margin: 0 1.99%;
}

/* video and embed */
.editing .ce-element--type-video,
#maincontent .video-wrapper {
	width: 100% !important;
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0 !important;
	overflow: hidden;
}

#maincontent .video-wrapper iframe,
#maincontent .video-wrapper object,
#maincontent .video-wrapper embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Alignment */
#maincontent .text-left {
	text-align: left;
}

#maincontent .text-center {
	text-align: center;
}

#maincontent .text-right {
	text-align: right;
}

#maincontent img.text-left {
	float: left;
}

#maincontent img.text-center {
	margin: auto;
}

#maincontent img.text-right {
	float: right;
}

#maincontent a.ctaButton.text-left {}

#maincontent a.ctaButton.text-center {
	margin: auto;
}

#maincontent a.ctaButton.text-right {
	margin-left: auto;
}

/* Blocks*/
#maincontent section {
	padding: 50px 0;
}

#maincontent div.row {
	max-width: 1200px;
	margin: auto;
	position: relative;
	padding: 50px 0;
	transform: translateZ(1px);
}

#maincontent div.row[data-class=np] {
	padding: 0;
}
#maincontent div.col[data-class=np] {
	padding: 0;
	min-height: 70px;
}

#maincontent div.col {
	position: relative;
	text-align: center;
}

.shad {
	text-shadow: 0 0 10px black, 0 0 30px black;
}

/* Module Mail */
/* #maincontent .mail button{ */
/* display:block; */
/* margin:auto; */
/* border:0; */
/* margin:0; */
/* background:#20608b; */
/* padding:10px; */
/* color:#FFFFFF; */
/* font-family:Lato, sans-serif; */
/* font-size:1rem; */
/* } */
/* Natural Gradient */
#maincontent section[data-class=ntrea]::after,
#maincontent section[data-class^=ntgr]::after,
#maincontent section[data-class^=ntgr]::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 75px;
	background: #FFF;
	left: 0;
	z-index: 1;
}

/* #maincontent section[data-class=ntgrhome]::after {
	display: none;
} */
#maincontent section[data-class=ntrea]::after,
#maincontent section[data-class=ntrea]::before {
	height: 50px;
}

#maincontent section[data-class=ntrea]::before,
#maincontent section[data-class^=ntgr]::before {
	bottom: -1%;
}

#maincontent section[data-class=ntrea]::after,
#maincontent section[data-class^=ntgr]::after {
	top: -1%;
}

#maincontent section[data-class=ntgrrsc] {
	background: linear-gradient(70deg,#028db4 0%, #1f6088 100%);
}
#maincontent section[data-class=ntgrau] {
	background: linear-gradient(70deg,#634285 0%, #352147 100%);
}
#maincontent section[data-class=ntgrrad] {
	background: linear-gradient(70deg,#fdc700 0%, #d7ac1e 100%);
}
#maincontent section[data-class=ntgrsm] {
	background: linear-gradient(70deg,#eb5f9e 0%, #ca253c 100%);
}
#maincontent section[data-class=ntgrrdig] {
	background: linear-gradient(70deg,#c2321d 0%, #6b1c0f 100%);
}
#maincontent section[data-class=ntgrsig] {
	background: linear-gradient(70deg,#aa549b 0%, #5b2049 100%);
}
#maincontent section[data-class=ntgrrev] {
	background: linear-gradient(70deg, #f19943 0%, #d77423 100%);
}
#maincontent section[data-class=ntgrpr] {
	background: linear-gradient(70deg,#059c3c 0%, #034c25 100%);
}

#maincontent section[data-class^=ntgr] {
	background-size: cover;
	position: relative;
	padding: 0;
}

#maincontent section[data-class=ntrea],
#maincontent section[data-class=nt] {
	background: #20608b;
	background: linear-gradient(45deg, #15496b, #257dab);
	padding: 0;
	position: relative;
}

#maincontent section[data-class^=ntgr] h1,
#maincontent section[data-class^=ntgr] h2,
#maincontent section[data-class^=ntgr] h3,
#maincontent section[data-class^=ntgr] p {
	color: #FFF;
}

/* #maincontent section[data-class^=nt]::before,
#maincontent section[data-class^=nt]::after{
	content:"";
	position:absolute;
	left:0;
	right:0;
	background:#FFF;
	height:50px;
	z-index:1

}
#maincontent section[data-class^=nt]::before{
	top:-3px;
	border-bottom-right-radius:100%;
}
#maincontent section[data-class^=nt]::after{
	bottom:-3px;
	border-top-left-radius:100%;
}*/
#maincontent section[data-class^=nt] div.row {
	padding: 0;
	z-index: 2;
}

#maincontent section[data-class^=nt] div.col {
	vertical-align: middle;
	padding: 140px 0;
}

/* Home */
#maincontent section[data-class^=home] {
	background: #fafafa;
	position: relative;
	padding-bottom: 0px;
}

#maincontent section[data-class^=home] .row {}

#maincontent section[data-class^=home] h1,
#maincontent section[data-class^=home] h2,
#maincontent section[data-class^=home] h3,
#maincontent section[data-class^=home] p {}

/* #maincontent section[data-class^=homef]::before{
	content:"";
	position:absolute;
	left:0;
	padding-top:3.2%;
	background:url(../ui/barre.svg) no-repeat right top;
	background-size:cover;
	height:0;
	top:0;
	width:100%;
} */
#maincontent section[data-class^=home] div.row {
	z-index: 2;
	padding: 10px;
}

#maincontent section[data-class^=home] div.col {}

#maincontent section[data-class=homealt] {
	background: #FFF;
}

#maincontent section[data-class=homefalt]::before {
	background: url(../ui/barre2.svg) no-repeat center top;
}

/* Left blue bar */
/* #maincontent div.row[data-class=lbb],
#maincontent div.col[data-class=lbb] {
	padding-left: 20px;
	border-left: solid 10px #000000
} */

#maincontent div.col[data-class=spacer] {
	width: 10%;
}

/* #maincontent div[data-class=lbb] h1,
#maincontent div[data-class=lbb] h2,
#maincontent div[data-class=lbb] h3, */
#maincontent div[data-class=lbb] p {
	color: #20608b;
}

/* tilt */
#maincontent div.col[data-class^=tilt] {
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	-webkit-backface-visibility: hidden;
	z-index: 100;
	transition: all .3s ease-in-out;
}
#maincontent section[data-class=ntgrrsc] div.col[data-class^=tilt] {
	height:150px;
}

#maincontent div.col[data-class=tiltalt] {
	background-repeat: no-repeat;
	background-size: 203%;
	background-position: 0 0;
	padding-top: 23%;
	vertical-align: bottom;
	padding-bottom: 6%;
	position: relative;
	z-index: 5;
	transition: all 500ms ease;
}

#maincontent div.row[data-class=fourfix] div.col[data-class=tiltalt] {
	padding-top: 14%;
}

#maincontent div.col[data-class=tiltalt] * {
	color: #FFF;
	padding: 3px;
	margin: auto 10px;
	font-weight: 300;
}

#maincontent div.col[data-class=tiltexp] {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 0 0;
	padding-top: 21%;
	vertical-align: bottom;
	padding-bottom: 6%;
	position: relative;
	z-index: 5;
}

#maincontent div.col[data-class=tiltexp] * {
	color: #FFF;
	padding: 0;
	font-weight: 300;
}

@media only screen and (min-width:900px) {

	#maincontent:not(.editing) div.col[data-class=tiltalt]:hover {
		background-position: 100% 0;
		z-index: 10;
	}

	#maincontent:not(.editing) div.col[data-class=tiltexp]>:nth-child(1),
	#maincontent:not(.editing) div.col[data-class=tiltexp]>:nth-child(2),
	#maincontent:not(.editing) div.col[data-class=tiltexp]>:nth-child(3) {
		transform: translate(-50%, -50%) translateZ(50px);
		transition: transform .5s ease-in-out, opacity .5s ease-in-out;
		opacity: 0;
		position: absolute;
		top: 50%;
		left: 50%;
		width:100%
	}
	#maincontent:not(.editing) div.col[data-class=tiltexp]>:nth-child(1) {
		transform: translate(-50%, -50%) translateZ(150px);
		font-size: clamp(22px, 2.5vw, 30px) !important;
	}
	#maincontent:not(.editing) div.col[data-class=tiltexp]>:nth-child(2) {
		transform: translate(-50%, -50%) translateZ(100px);
		max-width:150px;
	}
	#maincontent:not(.editing) div.col[data-class=tiltexp]>:nth-child(4) {
		opacity: 1;
		transition: opacity .5s ease-in-out;
	}

	#maincontent:not(.editing) div.col[data-class=tiltexp]:hover>:nth-child(1) {
		opacity: 1;
		transform: translate(-50%, -300%) translateZ(150px);
	}
	#maincontent:not(.editing) div.col[data-class=tiltexp]:hover>:nth-child(2) {
		opacity: 1;
	}
	#maincontent:not(.editing) div.col[data-class=tiltexp]:hover>:nth-child(3) {
		opacity: 1;
		transform: translate(-50%, 200%) translateZ(100px);
	}
	#maincontent:not(.editing) div.col[data-class=tiltexp]:hover>:nth-child(4) {
		opacity: 0;
	}

	#maincontent {
		background: #FFF;
		margin-bottom: 200px;
	}

	#maincontent section:nth-last-child(1) {
		padding-bottom: 0;
	}
}

#maincontent div[data-class^=tilt] h1,
#maincontent div[data-class^=tilt] h2,
#maincontent div[data-class^=tilt] h3,
#maincontent div[data-class^=tilt] p,
#maincontent div[data-class^=tilt] a {
	transform: translateZ(100px);
	text-shadow: 0 0 15px rgba(0, 0, 0, .7), 0 0 5px rgba(0, 0, 0, .7);
	padding: 10px 20%;
}

#maincontent:not(.editing) div.col[data-class^=tilt]::before {
	content: "";
	position: absolute;
	top: 10%;
	left: 10%;
	bottom: 10%;
	right: 10%;
	border: solid 2px rgba(255, 255, 255, 0);
	background: rgba(0, 0, 0, 0);
	transform: translateZ(50px);
	transition: border .3s ease, background .3s ease;
}

#maincontent div.col[data-class^=tilt]:hover::before {
	border: solid 2px rgba(255, 255, 255, 1);
	background: rgba(0, 0, 0, .6);
}

/* Ref */
#VideoMenu {
	position: fixed;
	top: 0;
	left: -300px;
	width: 300px;
	background: rgba(0, 0, 0, .6);
	z-index: 5;
	bottom: 0;
	padding: 80px 0px;
	transition: left .3s ease-out;
	height: 100vh;
	overflow-y: auto;
	box-sizing: border-box;
	overflow-x: hidden;
}

#VideoMenu ul,
#VideoMenu li {
	margin: 0;
	padding: 0;
	display: block;
}

#VideoMenu li li {
	padding-left: 10px;
}

#VideoMenu li a {
	font-weight: 500;
	background: #20608b;
	text-decoration: none;
	display: block;
	padding: 7px 17px;
	text-transform: uppercase;
	color: #FFFFFF;
	position: relative;
}

#VideoMenu li li a {
	text-transform: capitalize;
	color: #FFF;
	font-weight: 300;
	transition: color .3S ease;
}

#VideoMenu li li a:hover {
	color: #8fadff !important;
}

#VideoMenu h2 {
	text-align: center;
	color: #FFF;
}

/*
#VideoMenu li a::before{
	content:"\25BE";
	position:absolute;
	right:5px;
	top:5px;
	color:#FFF;
	transition:transform ease .5s;
}
#VideoMenu li a.opened::before{
	transform:rotate(180deg);
}*/
#VideoMenu li a+ul {
	/* max-height:0;
	overflow:hidden;
	transition:max-height .5s ease-in-out; */
	border-bottom: 5px solid rgba(255, 255, 255, .1);
}

#VideoMenu li a.opened+ul {
	max-height: 500px;
}

#VideoMenu li li a {
	background: none;
	font-weight: normal;
}

#VideoMenu li li a::before {
	content: "";
}

/* Responsive */
@media only screen and (min-width:900px) {

	/* Column system */
	#maincontent div.row {
		display: table;
		table-layout: fixed;
		width: 100%;
	}

	#maincontent div.col {
		display: table-cell;
		vertical-align: top;
		position: relative;
		padding: 20px;
	}

	/* Maincol system */
	#maincontent div.row[data-colmaj="col1"] .col:nth-child(1):nth-last-child(2),
	#maincontent div.row[data-colmaj="col2"] .col:nth-child(2):nth-last-child(1) {
		width: 66.66%;
	}
	#maincontent div.row[data-colmaj="col2"] .col:nth-child(1):nth-last-child(2),
	#maincontent div.row[data-colmaj="col1"] .col:nth-child(2):nth-last-child(1) {
		width: 33.33%;
	}

	#maincontent div.row[data-colmaj="col1"] .col:nth-child(1):nth-last-child(3),
	#maincontent div.row[data-colmaj="col2"] .col:nth-child(2):nth-last-child(2),
	#maincontent div.row[data-colmaj="col3"] .col:nth-child(3):nth-last-child(1) {
		width: 50%;
	}

	#maincontent div.row[data-colmaj="col1"] .col:nth-child(1):nth-last-child(4),
	#maincontent div.row[data-colmaj="col2"] .col:nth-child(2):nth-last-child(3),
	#maincontent div.row[data-colmaj="col3"] .col:nth-child(3):nth-last-child(2),
	#maincontent div.row[data-colmaj="col4"] .col:nth-child(4):nth-last-child(1) {
		width: 33.33%;
	}

	/* Gradient and reverse */
	#maincontent:not(.editing) .row[data-class=rev],
	#maincontent:not(.editing) section[data-class=rev],
	#maincontent:not(.editing) section[data-class^=ntgrr] {
		direction: rtl;
	}

	#maincontent:not(.editing) .row[data-class=rev] .col,
	#maincontent:not(.editing) section[data-class=rev] .col,
	#maincontent:not(.editing) section[data-class^=ntgrr] .col {
		direction: ltr;
	}

	#maincontent.editing section[data-class=rev],
	#maincontent.editing section[data-class^=ntgrr] {
		border-left: solid 5px #F00;
		border-right: solid 5px #F00;
	}

	/* Ref */
	#maincontent.reference {
		position: fixed;
		top: 0;
		right: -40%;
		width: 40%;
		background: rgba(0, 0, 0, .6);
		z-index: 10;
		bottom: 0;
		padding: 80px 0;
		transition: right .3s ease-out;
		color: #FFF;
		white-space: pre-line;
	}

	#maincontent.reference section {
		padding: 0;
	}

	#maincontent.reference::before {
		content: "";
		display: block;
		position: absolute;
		border-radius: 100%;
		top: 50%;
		left: 0%;
		height: 100px;
		width: 100px;
		background: rgba(0, 0, 0, 1);
		transform: translate(-50%, -50%) scale(0);
	}

	#maincontent.reference #descTrigger {
		display: block;
		position: absolute;
		right: 100%;
		top: 50%;
		height: 60px;
		width: 40px;
		background-size: contain;
		border-radius: 30px 0 0 30px;
		transform: translate(0, -50%);
		background: rgba(0, 0, 0, .6);
	}

	#maincontent.reference #descTrigger::before,
	#maincontent.reference #descTrigger::after {
		content: "";
		display: block;
		position: absolute;
		height: 6px;
		width: 24px;
		border-radius: 3px;
		background: #FFF;
		top: 50%;
		left: 50%;
		transition: transform .5s ease-in-out;
	}

	#maincontent.reference #descTrigger::before {
		transform: translate(-50%, -50%) rotate(0deg);
	}

	#maincontent.reference #descTrigger::after {
		transform: translate(-50%, -50%) rotate(-90deg);
	}

	#maincontent.reference #descTrigger.opened::before {
		transform: translate(-40%, -50%) rotate(45deg) scale(1.3);
	}

	#maincontent.reference #descTrigger.opened::after {
		transform: translate(-40%, -50%) rotate(-45deg) scale(1.3);
	}

	#maincontent.reference.opened {
		right: 0;
	}

	#maincontent.reference.opened::before {
		-webkit-animation: aniplop .4s linear forwards;
		animation: aniplop .4s linear forwards;
	}

	#refDesc #refDescContent {
		overflow: auto;
		padding: 0 20px;
		height: 100%;
	}

	#VideoMenu::before {
		content: "";
		display: block;
		position: absolute;
		border-radius: 100%;
		top: 50%;
		left: 100%;
		height: 100px;
		width: 100px;
		background: rgba(0, 0, 0, 1);
		transform: translate(-50%, -50%) scale(0);
	}

	#VideoMenu #videoTrigger {
		display: block;
		position: absolute;
		left: 100%;
		top: 50%;
		height: 60px;
		width: 40px;
		background-size: contain;
		border-radius: 0 30px 30px 0;
		transform: translate(0, -50%);
		background: rgba(0, 0, 0, .6);
	}

	#VideoMenu #videoTrigger::before,
	#VideoMenu #videoTrigger::after {
		content: "";
		display: block;
		position: absolute;
		height: 6px;
		width: 24px;
		border-radius: 3px;
		background: #FFF;
		top: 50%;
		left: 50%;
		transition: transform .5s ease-in-out;
	}

	#VideoMenu #videoTrigger::before {
		transform: translate(-50%, -10px) rotate(45deg);
	}

	#VideoMenu #videoTrigger::after {
		transform: translate(-50%, 4px) rotate(-45deg);
	}

	#VideoMenu #videoTrigger.opened::before {
		transform: translate(-60%, -50%) rotate(-45deg) scale(1.3);
	}

	#VideoMenu #videoTrigger.opened::after {
		transform: translate(-60%, -50%) rotate(45deg) scale(1.3);
	}

	#VideoMenu.opened::before {
		-webkit-animation: aniplop .4s linear forwards;
		animation: aniplop .4s linear forwards;
	}

	#VideoMenu.opened {
		left: 0;
	}
}

@-webkit-keyframes aniplop {
	from {
		transform: translate(-50%, -50%) scale(0);
		opacity: 1;
	}

	99.9% {
		transform: translate(-50%, -50%) scale(12);
		opacity: 0;
	}

	to {
		transform: translate(-50%, -50%) scale(0);
		opacity: 0;
	}
}

@keyframes aniplop {
	from {
		transform: translate(-50%, -50%) scale(0);
		opacity: 1;
	}

	99.9% {
		transform: translate(-50%, -50%) scale(20);
		opacity: 0;
	}

	to {
		transform: translate(-50%, -50%) scale(0);
		opacity: 0;
	}
}

/* responsive min 600 */
@media only screen and (max-width:1200px) {
	#menuTrigger {
		position: absolute;
		top: 10px;
		right: 10px;
		height: 40px;
		width: 40px;
		display: block;
		z-index: 400;
		background: #20608b;
		border-radius: 20px;
		transition: background-color .3s ease-in-out;
	}

	#menuTrigger span {
		position: absolute;
		display: block;
		top: 50%;
		right: 50%;
		transform: translate(50%, -50%);
		width: 8px;
		height: 8px;
		background: #FFF;
		border-radius: 4px;
		z-index: 10;
	}

	#menuTrigger span::before,
	#menuTrigger span::after {
		content: '';
		position: absolute;
		top: 50%;
		right: 50%;
		display: block;
		width: 8px;
		height: 8px;
		background: #FFF;
		border-radius: 4px;
		transition: transform .3s .3s ease-in-out, width .3s ease-in-out;
	}

	#menuTrigger span::before {
		transform: translate(50%, -200%);
	}

	#menuTrigger span::after {
		transform: translate(50%, 100%);
	}

	#mainHeader.opened #menuTrigger span::before {
		transform: translate(50%, -50%) rotate(225deg);
		width: 30px;
	}

	#mainHeader.opened #menuTrigger span::after {
		transform: translate(50%, -50%) rotate(-225deg);
		width: 30px;
	}

	#mainMenuContainer {
		position: fixed;
		width: 80%;
		top: 25%;
		left: 50%;
		transform: translate(-50%, -100%);
		opacity: 0;
		transition: all .3s ease;
	}

	#mainHeader.opened #mainMenu #mainMenuContainer {
		opacity: 1;
		transform: translate(-50%, 0%);
	}
	#mainHeader.opened #mainMenu #mainMenuContainer li a {
		color: #20608b;
		font-size: 1.3rem;
		font-weight:normal;
	}

	#mainMenu ul {
		display: block;
		margin: auto;
		width: 80%;
		max-width: 300px;
		text-align: center;
	}

	#mainMenu li {
		width: 100%;
	}

	#mainMenu #mainSocial li {
		width: 20%;
	}

	#mainMenu li a {
		text-align: center;
		width: 100%;
		border-radius: 0;
	}

	#mainHeader {
		height: 60px;
		overflow: hidden;
		transition: height .3s ease;
	}

	#mainHeader.opened {
		height: 100%;
		background: transparent;
	}

	#mainHeader .maxContainer {
		height: 100%;
	}

	#logo {
		height: 45px;
		padding-top: 10px;
	}

	#mainMenu {
		top: 0;
		left: 0;
		position: fixed;
		transform: none;
	}

	#mainMenu::before {
		content: '';
		display: block;
		transform: none;
		top: 0;
		right: 0;
		width: 0;
		height: 0;
		background: #FFF;
		position: fixed;
		overflow: hidden;
		border-radius: 0 0 0 100%;
		transition: width .5s ease-in-out, height .5s ease-in-out;
	}

	#mainHeader.opened #mainMenu {
		bottom: 0;
		right: 0;
	}

	#mainHeader.opened #mainMenu::before {
		width: 1500px;
		height: 1500px;
		z-index: -1;
	}
}

@media only screen and (min-width:1201px) {
	#mainMenu ul:not(#mainSocial) li:nth-child(1) a {
		display: none;
	}
}

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

	/* Design */
	#refContainer .video-js .vjs-big-play-button {
		width: 2em;
		height: 2em !important;
	}

	#slider {
		margin-top: 60px;
	}

	#slider .desc,
	#slider .preview {
		width: 100%;
		padding-top: 60%;
		display: block;
	}

	#slider .desc {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 10;
		padding-top: 60%;
		width: 50%;
		background: -moz-linear-gradient(left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%) !important;
		background: -webkit-linear-gradient(left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%) !important;
		background: linear-gradient(to right, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%) !important;
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#00000000', GradientType=1);
	}

	#slider .descContent {
		top: 70%;
	}

	#slider .descContent h2 {
		margin-right: 10%;
	}

	#slider .descContent a.ctaButton {
		position: absolute;
		right: 10px;
		bottom: 0;
		z-index: 2;
	}

	#slider .descContent p {
		display: none;
	}

	#sc {
		transform: none!important;
		width: auto!important;
		margin-left: 0!important;
	}

	#maincontent section[data-class^=ntgr] div.row {
		padding: 10px;
	}

	#maincontent section[data-class^=ntgr] div.col {
		padding: 60px 0;
	}

	#slider .vidContainer,
	#sliderpar {
		padding-top: 75%;
	}

	.wave {
		margin-top: 72%;
	}

	#sliderContainer #right,
	#sliderContainer #left {
		top: 60%;
	}

	#slider .videoContainer {
		top: 35%;
		position: absolute;
		width: 140%;
		height: 100%;
	}

	#refContainer {
		position: relative;
	}

	#refContainer .video-js {
		width: 136%;
		padding-top: 77%;
		left: -18%;
	}

	#maincontent div.col[data-class^=tilt]::before {
		border: solid 2px rgba(255, 255, 255, 1) !important;
	}

	#maincontent div.col[data-class=tiltalt]::before,
	#maincontent div.col[data-class=tiltalt]:hover::before {
		border: none !important;
	}

	#maincontent div.col[data-class=tiltalt] {
		padding-top: 96%;
	}

	#maincontent div.col[data-class=tiltalt]:nth-child(2) {
		margin-bottom: 100px;
	}

	#VideoMenu {
		position: relative;
		width: 100%;
		left: 0;
		padding: 0;
		height:auto!important;
	}

	.refvdo {
		background: #333;
	}

	#maincontent div.col[data-class=tiltalt] * {
		color: #20608b;
		text-shadow: none;
	}

	#videoTrigger {
		display: none;
	}

	#maincontent div.col[data-class^=tilt] {
		transform: perspective(1000px) rotateX(-75deg) !important;
		box-shadow: none !important;
		transition: transform .3s ease-in-out;
	}

	#maincontent div.col[data-class^=tilt].appear,
	#maincontent div.row[data-class=fourfix] div.col[data-class^=tilt].appear {
		transform: perspective(1000px) rotateX(0deg) !important;
		transition-duration: .8s !important;
		padding: 0;
		padding-top: 100%;
	}
}

@media only screen and (max-width:899px) and (orientation:landscape) {
	#refContainer .video-js {
		width: 100% !important;
		padding-top: 0;
		left: 0;
		height: 90vh;
	}

	.vjs-control-bar {
		top: 100vh;
		margin: auto;
		position: absolute !important;
		transform: translateY(-100%);
	}
}

/* Video */
#refContainer .video-js .vjs-big-play-button {
	height: 3em;
	border-radius: 100%;
	background: url(../ui/playvdo.svg) no-repeat center center;
	background-size: contain;
}

#refContainer .video-js .vjs-big-play-button * {
	display: none;
}

#maincontent .row[data-class=nopad] {
	padding: 0;
}

/* Focus */
#maincontent div.col[data-class=focus] p {
	opacity: 0;
	transition: opacity .3s ease-in-out;
	padding: 0;
	text-align: center;
	color:#20608b;
}

#maincontent div.col[data-class=focus] H1 {
	font-size: 2rem!important;
	padding-bottom: 0px;
}

@media only screen and (max-width:899px) {
	#maincontent div.col[data-class=focus] {
		padding-bottom: 100px;
	}
	
	#maincontent div.col[data-class=focus] p {
		opacity: 1;
	}
}

#maincontent div.col[data-class=focus] .col {
	padding-bottom: 40px;
}

#maincontent div.col[data-class=focus]:hover p {
	opacity: 1;
}

@media only screen and (min-width:899px) {
	#maincontent div.col[data-class=focus]::before,
	#maincontent div.col[data-class=focus]::after {
		position: absolute;
		display: block;
		content: "";
		width: 10px;
		height: 10px;
		border: 2px solid #FFF;
		transition: all .4s ease-in;
		z-index: 5;
		top: 50%;
	}

	#maincontent div.col[data-class=focus]::before {
		left: 50%;
		transform: translate(-1px, 0);
		border-width: 2px 0 0 2px;
	}

	#maincontent div.col[data-class=focus]::after {
		right: 50%;
		transform: translate(1px, -10px);
		border-width: 0 2px 2px 0;
	}

	#maincontent div.col[data-class=focus]:hover::after {
		top: 100%;
		right: 0;
		width: 30px;
		height: 30px;
		border-color: #20608b;
	}

	#maincontent div.col[data-class=focus]:hover::before {
		top: 0;
		left: 0;
		width: 30px;
		height: 30px;
		border-color: #20608b;
	}
}

/* BKM & Footer ********/
#bkmprod,
footer {
	background: #000;
	color: #FFF;
	text-align: center;
	padding: 10px;
	font-family: sans-serif;
	font-size: .75rem;
}

#bkmprod {
	background: #FFF;
	color: #20608b;

}
footer .half {
	display: inline-block;
	width: 39%;
	vertical-align: middle;
	text-align: left;
	padding: 10px 5%;
}
footer .half:nth-child(1) {
	border-right: solid 1px #FFF;
	text-align: right;
}
@media only screen and (max-width:899px) {
	#bkmprod {
		text-align: left;
	}
	footer .half {
		font-size:10px;
	}
	#bkmprod a {
		font-size:10px;
	}
}

footer {
	background: linear-gradient(45deg, #15496b, #257dab);
	padding: 30px 0;
}

#bkmprod a,
footer a {
	color: #FFF;
	text-decoration: none;
}

#bkmprod a {
	color: #20608b;
}

.browserupgrade {
	background: #900;
	margin: 0px;
	padding: 5px;
	top: 0px;
	color: #FFF;
	position: fixed;
	z-index: 1000;
}

.browserupgrade a {
	color: #FFF;
}

/* responsive min 600 */
@media only screen and (max-width:600px) {

	.descContent{
		display: none;
	}

	.descContainer .desctilt {
		transform: none !important;
	}

	#refContainer .vjs-has-started .vjs-control-bar {
		top: 90%;
		width: 76%;
		margin: auto;
		position: absolute;
	}

	#maincontent div.col[data-class^=tilt]:hover::before {
		background: rgba(0, 0, 0, 0) !important;
	}

	#maincontent div.col[data-class=focus]::before,
	#maincontent div.col[data-class=focus]::after {
		top: 140px;
	}
}

*

/* Fixer */
/* FF */
@-moz-document url-prefix() {
	#maincontent div.col[data-class=tiltalt] {
		padding-top: 18%;
	}
}

.bgrelax {
	position: absolute;
	background-position: center center;
	background-size: cover;
	top: -25%;
	left: 0;
	bottom: -25%;
	right: 0;
}

@media only screen and (max-width:899px) {
	.bgrelax {
		top: -5%;
        bottom: -5%;
        background-position: -400px center;
	}
}

/*video,
.vjs-tech,*/
.vjs-poster {
	opacity: 0;
	transition: all .5s linear;
}

.vjs-tech.appear,
.vjs-poster.appear {
	opacity: 1;
}

.transButton {
	background: rgba(0, 0, 0, 0) !important;
}

.transButton:hover,
.transButton.open {
	background: #20608b !important;
}

/* Projects */
[data-class=project] h2 {
	padding: 0 !important;
	padding-left: 30px !important;
	position: relative;
	cursor: pointer;
	text-align: left;
}

[data-class=project] h2::before {
	content: "";
	display: block;
	position: absolute;
	top: 12px;
	left: 12px;
	height: 24px;
	width: 24px;
	transform: translate(-50%, -50%);
	transition: transform .5s;
	background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6N0ZCRUU1MkFEQzFGMTFFOEEzOTFGQzM5QzAwMDEyQTQiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6N0ZCRUU1MjlEQzFGMTFFOEEzOTFGQzM5QzAwMDEyQTQiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkE1MTg4RDY5REI4RTExRThCMzFEODRDODVERDA4MDNBIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkE1MTg4RDZBREI4RTExRThCMzFEODRDODVERDA4MDNBIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+kQrPEAAAAbZJREFUeNqklU0oRFEUx2dEoawkE4qtLMjHTkkSGyyYjXwnGytWNsZHKWUxlLKQojAWkg01SY2aspSys5DysZCNZIOe36079bzeGTPHrX9nZs69//85/3fmvqDjOIHUCkaSs4R58Ay+7M9mQxG4B93OYvNjIIuV4/m+BmKgHFRaVIFiUA+2KCJfLUB1b4RRcCLs7zAi/+nAiHxakRvhTD9dLGUqEHQ/g1+JSLKGcA5KhbMjFLOjFrAixpJj4Oe76bQLkXhWFnnsilu7/FYe2KaIRrWAFTkgzAjpENhFpEJlkccuMz1jQvoCtNsBya4D15oAp0KuBWyqLHJZ9W0mB1wKW4bpck5tkcuqMjtZTcKWVYqZ0liU6uTJCkirTvsMUh30ERaEtBnrsNoiyDsJR6DAJ30N2ujwVTumtYQzUOKTNld4K+S3qimCPGSvcT/yDzDgR56RAOSFhH1QLWwZhzyhvipYG6Z9ITcNeUx9F1H9MmFISEchj/7nfTBJWBfOHUIeVr3RLHlvGvJEmiv8bwHIewh7wv4rMEj175kK5HrIGwgr5iO4s3njoZmkFzuOD9n8838EGADisZQajkdvawAAAABJRU5ErkJggg==');
}

[data-class=ntgr] [data-class=project] h2::before {
	background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpBNTE4OEQ2OURCOEUxMUU4QjMxRDg0Qzg1REQwODAzQSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpBNTE4OEQ2QURCOEUxMUU4QjMxRDg0Qzg1REQwODAzQSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkE1MTg4RDY3REI4RTExRThCMzFEODRDODVERDA4MDNBIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkE1MTg4RDY4REI4RTExRThCMzFEODRDODVERDA4MDNBIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+rwj4bAAAATdJREFUeNqk1btKA0EUxvH1BhKCjQqS2FqlUIgPYKedhSkUBB8glZWVWAmCoE8QUNDKxkLBSq0sBEUQxC4WIQa19YIi6//ACnHJHEm+gV+xO8v59jJzNorjOGqyim/U8JCo4gVXyKeu/1f6xAD24vA4Qb8SYPpw5ITsqwFmGLdOyLoaYApoOCFLaoCZxnsg4DOZlwLMvPMUj5hUA8yKE3KPUTXAVJyQ82T1SQE9OHZCdtSA3+V74YSsqQEmh0snZLv5+u6o/VHHoTM/8eeogyco4cvpVUPKK5rBW6D4DQaVbzCOp0Bxa+9jyioawV2g+CumlI2WwamzahbUVrHrFF9Wm92GU3xLbddlp/iB+sOZc4qfIasEzOIjUPzaa82t9Ka2eRGb6EIVNs9tRBk8YxG1dvrKjwADADujz+ir0fLuAAAAAElFTkSuQmCC');
}

article:not(.editing) [data-class=project] p {
	max-height: 0px !important;
	overflow: hidden;
	display: block !important;
	min-height: 0 !important;
	padding: 2px !important;
	margin: 10px 0px !important;
	transition: max-height .5s;
}

[data-class=project] h2.open::before {
	transform: translate(-50%, -50%) rotate(90deg);
}

article:not(.editing) [data-class=project] p.open {
	max-height: 400px !important;
}

article.editing .row[data-class=slider] {
	background: #FFF;
	margin-bottom: 10px !important;
}

.row[data-class=slider] div.col {
	padding: 20px !important;
}

.row[data-class=slider] .col:nth-child(3) img {
	display: inline;
	width: 49% !important;
}

.row[data-class=slider] .col:nth-child(5) img,
.portfolioContainer li .porfolioItem .porfolioItemText img {
	display: inline-block;
	padding-left: 30px;
	padding-top: 15px;
	width: 50px !important;
	height: auto !important;
}

/* Slider */
.portfolioContainer {
	max-width: 1200px;
	width: 90%;
	margin: auto;
	position: relative;
	z-index: 2;
	text-align: center;
	padding: 0;
}

.portfolioContainer li {
	display: inline-block;
	width: 30%;
	position: unset !important;
}

a.reatilt img,
.portfolioContainer a.porttilt img {
	transition: border .4s ease-in-out;
	-webkit-filter: grayscale(100%);
	/* Safari 6.0 - 9.0 */
	filter: grayscale(100%);
	border: solid 2px transparent;
	box-sizing: border-box;
}

a.reatilt img:hover,
a.reatilt.selected img,
.portfolioContainer a.porttilt img:hover {
	-webkit-filter: none;
	/* Safari 6.0 - 9.0 */
	filter: none;
	position: relative;
	z-index: 20;
}

a.reatilt.selected {
	border: solid 2px #FFF;
	box-sizing: border-box;
	display: block;
}

a.reatilt.selected img {
	border: solid 2px #20608b;
	box-sizing: border-box;
	display: block;
}

a.reatilt:hover {
	background: none !important;
}

.portfolioContainer li.open a.porttilt img {
	box-shadow: none !important;
	transform: none !important;
	border: solid 13px transparent;
	box-sizing: border-box;
	-webkit-filter: none;
	/* Safari 6.0 - 9.0 */
	filter: none;
}

.row[data-class=portfolioContainer] {
	padding: 0 !important;
}

.row[data-class=portfolioContainer] div.col {
	padding: 3px 5px !important;
}

.portfolioContainer li .porfolioItem .porfolioItemImage,
.portfolioContainer li .porfolioItem .porfolioItemText {
	display: table-cell;
	width: 28%;
	padding: 20px 1%;
}

.portfolioContainer li .porfolioItem .porfolioItemText {
	display: table-cell;
	width: 68%;
	padding: 1%;
	vertical-align: middle;
	position: relative;
}

.portfolioContainer li .porfolioItem .porfolioItemText p {
	min-height: 0 !important;
}

.portfolioContainer li .porfolioItem .porfolioItemImage img {
	width: 98% !important;
}

.portfolioContainer li .porfolioItem .porfolioItemImageContainer img {
	width: 47% !important;
	margin-right: 1%;
}

.portfolioContainer li a:hover {
	background: none !important;
}

.portfolioContainer li.open a {
	position: relative;
}

.portfolioContainer li a.porttilt::after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 22px 32px 22px;
	border-color: transparent transparent #FFF transparent;
	top: 30px;
	left: 50%;
	transform: translateX(-50%);
	transition: all .3s;
	display: block;
	opacity: 0;
	z-index: 15;
}

.portfolioContainer li.open a::after {
	top: 0;
	opacity: 1;
}

@media only screen and (max-width:800px) {
	.portfolioContainer li {
		width: 40%;
	}

	.portfolioContainer li .porfolioItem .porfolioItemImage,
	.portfolioContainer li .porfolioItem .porfolioItemText {
		width: 48%;
	}
}

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

	.portfolioContainer li .porfolioItem .porfolioItemImage,
	.portfolioContainer li .porfolioItem .porfolioItemText {
		width: 100%;
	}
}

/* Showroom */
.lightbox {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 10000;
	transform: translateZ(110px);
	background: rgba(0, 0, 0, .6);
	display: none;
}

.lightbox.open {
	display: block;
}

.lightbox img {
	position: absolute;
	top: 50%;
	left: 50%;
	max-width: 90%;
	max-height: 90%;
	transform: translate(-50%, -50%);
}

.lightbox .videoContainer {
	width: 80%;
	padding-top: 45%;
	left: 50%;
	top: 50%;
	position: absolute;
	transform: translate(-50%, -50%);
	height: 0;
}

.adslide,
#scslide {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-size: cover;
	background-position: right;
	transition: all 7s ease;
}

#scslide div{
	position: absolute;
	top: 0;
	bottom: 0;
	right:50%;
	left:50%;
	background-size: cover;
	background-position: center center;
	transition: all .7s ease;
}
#scslide.go div:nth-child(1){
	transition-delay: 0;
	right:0;
	left:0;
}
#scslide.go div:nth-child(2){
	transition-delay: .5s;
	right:0;
	left:0;
}
#scslide.go div:nth-child(3){
	transition-delay: 1s;
	right:0;
	left:0;
}
#scslide.go div:nth-child(4){
	transition-delay: 1.5s;
	right:0;
	left:0;
}

.appear .adslide {
	background-position: left;
}

.panel {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 0;
	background-size: cover;
	background-position: center center;
	transition: width .5s ease;
}

.panel.affdyn {
	z-index: 1;
	background-image: url("/img.php?src=pages/expertises/affdyn2.jpg");
	width: 100%;
}

.panel.p1 {
	z-index: 1;
	background-image: url("/img.php?src=pages/expertises/p1-2022.jpg");
	width: 100%;
}

.panel.p2 {
	z-index: 2;
	background-image: url("/img.php?src=pages/expertises/p2-2022.jpg");
	transition-delay: .5s;
}

.panel.p3 {
	z-index: 3;
	background-image: url("/img.php?src=pages/expertises/p3-2022.jpg");
	transition-delay: 1s;
}

.panel.p4 {
	z-index: 4;
	background-image: url("/img.php?src=pages/expertises/p4-2022.jpg");
	transition-delay: 1.5s;
}

.panel.p5 {
	z-index: 5;
	background-image: url("/img.php?src=pages/expertises/p5-2022.jpg");
	transition-delay: 2s;
}

.panel.p6 {
	z-index: 6;
	background-image: url("/img.php?src=pages/expertises/p6-2022.jpg");
	transition-delay: 2.5s;
}

.panel.p7 {
	z-index: 7;
	background-image: url("/img.php?src=pages/expertises/p7-2022.jpg");
	transition-delay: 3s;
}

.panel.p8 {
	z-index: 8;
	background-image: url("/img.php?src=pages/expertises/p8-2022.jpg");
	transition-delay: 3.5s;
}

.appear .panel {
	width: 100%;
}

html {
	scroll-behavior: smooth;
}

#scrollToTop {
	display: block;
	position: fixed;
	bottom: -60px;
	right: 20px;
	width: 50px;
	height: 50px;
	background: url("../ui/returntop.png") transparent !important;
	background-color: #20608b !important;
	z-index: 100;
	border-radius: 10px 10px 0 0;
	transition: bottom .5s ease, background-color .5s ease;
}

#scrollToTop:hover {
	background-color: none !important;
}

.editing [data-class=prfl] {
	background: #20608b;
}

.editing [data-class=prfl] .row {
	background: #FFFFFF;
}

.editing [data-class=prfl] .row:nth-child(1) .col:nth-child(1) img {
	width: 25% !important;
}

.porfolioItem .row:nth-last-child(1) img,
[data-class=prfl] .row:nth-last-child(1) img {
	display: inline-block !important;
	width: 20% !important;
}

.porfolioItem .row:nth-last-child(1) .col:nth-last-child(1) img,
[data-class=prfl] .row:nth-last-child(1) .col:nth-last-child(1) img {
	display: inline-block !important;
	width: 40% !important;
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	transition: all 500ms ease 0s;
}

.porfolioItem .row:nth-last-child(1) .col:nth-last-child(1) img:hover {
	-webkit-filter: none;
	filter: none;
}

.porfolioItem .row:nth-last-child(1) .col:nth-last-child(2) img,
[data-class=prfl] .row:nth-last-child(1) .col:nth-last-child(2) img {
	transform: translate(0, 0);
	transition: transform .3s ease-in-out;
}

.porfolioItem .row:nth-last-child(1) .col:nth-last-child(2) img:hover {
	transform: translate(0, -10px);
}

.porfolioItem .col {
	padding: 10px !important;
}

.porfolioItem p {
	color: #20608b !important;
}

img.picto {
	display: inline-block;
	padding-left: 2%;
	padding-top: 15px;
	width: 12% !important;
	height: auto !important;
}

.col[data-class=step] {
	padding: 0 !important;
}

.col[data-class=step] img {
	position: absolute;
	width: 10% !important;
	transform: translate(-50%, -50%);
	cursor: pointer;
	transition: width .5s ease-in-out;
	z-index: 2;
}

.col[data-class=step] img:hover {
	width: 150px !important;
	z-index: 20;
}

@media only screen and (min-width:900px) {
	.col[data-class=step] img:hover {
		width: 20% !important;
	}
}

@media only screen and (min-width:601px) {
	.col[data-class=step] img {
		width: 10% !important;
	}

	.col[data-class=step] {
		padding-top: 32% !important;
		background: url(../ui/steph.jpg) no-repeat center center;
		background-size: cover;
	}

	.col[data-class=step] img:nth-child(1) {
		top: 27%;
		left: 8%;
	}

	.col[data-class=step] img:nth-child(2) {
		top: 68%;
		left: 12%;
	}

	.col[data-class=step] img:nth-child(3) {
		top: 36.5%;
		left: 21.5%;
	}

	.col[data-class=step] img:nth-child(4) {
		top: 75%;
		left: 27.5%;
	}

	.col[data-class=step] img:nth-child(5) {
		top: 35%;
		left: 34.5%;
	}

	.col[data-class=step] img:nth-child(6) {
		top: 71%;
		left: 44%;
	}

	.col[data-class=step] img:nth-child(7) {
		top: 32%;
		left: 49%;
	}

	.col[data-class=step] img:nth-child(8) {
		top: 68%;
		left: 59%;
	}

	.col[data-class=step] img:nth-child(9) {
		top: 63%;
		left: 73%;
	}

	.col[data-class=step] img:nth-child(10) {
		top: 26%;
		left: 63%;
	}

	.col[data-class=step] img:nth-child(11) {
		top: 24%;
		left: 77%;
	}

	.col[data-class=step] img:nth-child(12) {
		top: 70%;
		left: 89%;
	}

	.col[data-class=step] img:nth-child(13) {
		top: 31%;
		left: 94.5%;
	}
}

@media only screen and (max-width:600px) {
	.col[data-class=step] img {
		width: 19% !important;
	}

	.col[data-class=step] {
		padding-top: 200% !important;
		background: url(../ui/stepv.jpg) no-repeat center center;
		background-size: cover;
	}

	.col[data-class=step] img:nth-child(1) {
		top: 7%;
		left: 66%;
	}

	.col[data-class=step] img:nth-child(2) {
		top: 11%;
		left: 41%;
	}

	.col[data-class=step] img:nth-child(3) {
		top: 21%;
		left: 60%;
	}

	.col[data-class=step] img:nth-child(4) {
		top: 27.5%;
		left: 35%;
	}

	.col[data-class=step] img:nth-child(5) {
		top: 34.5%;
		left: 61%;
	}

	.col[data-class=step] img:nth-child(6) {
		top: 44%;
		left: 37.5%;
	}

	.col[data-class=step] img:nth-child(7) {
		top: 50.5%;
		left: 62.5%;
	}

	.col[data-class=step] img:nth-child(8) {
		top: 59%;
		left: 42.5%;
	}

	.col[data-class=step] img:nth-child(9) {
		top: 73%;
		left: 43%;
	}

	.col[data-class=step] img:nth-child(10) {
		top: 63%;
		left: 68%;
	}

	.col[data-class=step] img:nth-child(11) {
		top: 77%;
		left: 69%;
	}

	.col[data-class=step] img:nth-child(12) {
		top: 89%;
		left: 39.5%;
	}

	.col[data-class=step] img:nth-child(13) {
		top: 94.5%;
		left: 64%;
	}
}

.col[data-class=step] svg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
}

.col[data-class=step] svg path {
	fill: none;
	stroke: #FFFFFF;
	stroke-width: 60;
	stroke-dasharray: 0, 0, 1000%;
	stroke-dashoffset: 0%;
	transition: stroke-dasharray 5s ease-in-out;
}

.col.line[data-class=step] svg path {
	stroke-dasharray: 0, 400%, 1000% !important;
}

@media only screen and (max-width:600px) {
	.col[data-class=step] svg {
		display: none;
	}
}

.row[data-class=resonly] {
	display: none !important;
}

.col[data-class=mexp] {
	display: grid !important;
	grid-template-columns: .5fr repeat(8, 1fr) .5fr;
	grid-template-rows: repeat(2, 1fr);
	grid-column-gap: 0px;
	grid-row-gap: 0px;
	width: 99vw;
	max-width: 1200px;
	height: 20vw;
	max-height: 500px;
	margin: auto;
	margin-bottom: 100px;

}
#sc {
	transform: rotate(-3deg);
    width: 102vw;
    margin-left: -1vw;
}
h3#sc,
h3#av,
h3#ad,
h3#rs,
h3#wd,
h3#sg,
h3#ev,
h3#pr{scroll-margin-top: 100px;}

.row[data-class=ag] {
	padding: 0;
}

.col[data-class=aga] {
	perspective: 1500px;
}

.col[data-class=agb] {
	perspective: 1500px;
}

@media only screen and (max-width:900px) {
	section[data-class=team] .row {
		padding: 20px !important;
	}

	.col[data-class=agc] {
		display: none;
	}
}

.col[data-class=agb] h2,
.col[data-class=agb] p {
	text-align: center !important;
	padding: 5px !important;
}

.col[data-class=mexp] a {
	cursor: pointer;
	position: relative;
}

.col[data-class=mexp] a::before {
	content: "";
	position: absolute;
	background: bottom center no-repeat;
	background-size: contain;
	width: 80%;
	height: 80%;
	bottom: 0;
	left: 10%;
	transition: transform .5s ease-in-out;

}

.col[data-class=mexp] a::after {
	content: "";
	position: absolute;
	background: top center no-repeat;
	background-size: contain;
	width: 80%;
	height: 80%;
	top: 100%;
	left: 10%;
	transition: transform .5s ease-in-out;

}

.col[data-class=mexp] a:hover::before {
	transform:translateY(-20px) rotate(-5deg);
}
.col[data-class=mexp] a:hover::after {
	transform:translateY(20px) rotate(5deg);
}

.col[data-class=mexp] .sclink {
	grid-area: 1 / 2 / 2 / 3;
}

.col[data-class=mexp] .sclink::before {
	background-image: url(../img/pole/scf.png);
}

.col[data-class=mexp] .sclink::after {
	background-image: url(../img/pole/scs.png);
}

.col[data-class=mexp] .avlink {
	grid-area: 1 / 3 / 2 / 4;
}

.col[data-class=mexp] .avlink::before {
	background-image: url(../img/pole/avf.png);
}

.col[data-class=mexp] .avlink::after {
	background-image: url(../img/pole/avs.png);
}

.col[data-class=mexp] .sglink {
	grid-area: 1 / 4 / 2 / 5;
}

.col[data-class=mexp] .sglink::before {
	background-image: url(../img/pole/sgf.png);
}

.col[data-class=mexp] .sglink::after {
	background-image: url(../img/pole/sgs.png);
}

.col[data-class=mexp] .slink {
	grid-area: 1 / 5 / 2 / 6;
}

.col[data-class=mexp] .slink::before {
	background-image: url(../img/pole/smf.png);
}

.col[data-class=mexp] .slink::after {
	background-image: url(../img/pole/sms.png);
}

.col[data-class=mexp] .wdlink {
	grid-area: 1 / 6 / 2 / 7;
}

.col[data-class=mexp] .wdlink::before {
	background-image: url(../img/pole/wdf.png);
}

.col[data-class=mexp] .wdlink::after {
	background-image: url(../img/pole/wds.png);
}

.col[data-class=mexp] .evlink {
	grid-area: 1 / 7 / 2 / 8;
}

.col[data-class=mexp] .evlink::before {
	background-image: url(../img/pole/evf.png);
}

.col[data-class=mexp] .evlink::after {
	background-image: url(../img/pole/evs.png);
}

.col[data-class=mexp] .afdlink {
	grid-area: 1 / 8 / 2 / 9;
}

.col[data-class=mexp] .afdlink::before {
	background-image: url(../img/pole/adf.png);
}

.col[data-class=mexp] .afdlink::after {
	background-image: url(../img/pole/ads.png);
}

.col[data-class=mexp] .prlink {
	grid-area: 1 / 9 / 2 / 10;
}

.col[data-class=mexp] .prlink::before {
	background-image: url(../img/pole/prf.png);
}

.col[data-class=mexp] .prlink::after {
	background-image: url(../img/pole/prs.png);
}

.col[data-class=mexp] .sh1,
.col[data-class=mexp] .sh2{
	grid-area: 1 / 1 / 2 / 10;
	background: url(../img/pole/sha.png) bottom center no-repeat;
	background-size: contain;
	display:block;
	pointer-events: none;
}

.col[data-class=mexp] .cov1,
.col[data-class=mexp] .cov2{
	grid-area: 2 / 1 / 3 / 11;
	background: linear-gradient(0deg, rgba(255, 255, 255, 1) 30%, rgba(255, 255, 255, 0) 100%);
	z-index: 1;
}

.col[data-class=mexp] .sh2,
.col[data-class=mexp] .cov2{
	grid-area: 1 / 1 / 1 / 1;
}

@media only screen and (max-width:700px) {
	.col[data-class=mexp] {
		grid-template-rows: repeat(3, 1fr);
		grid-template-columns: .5fr repeat(4, 1fr) .5fr;
		height: 90vw;
		max-height: 700px;
	}
	.col[data-class=mexp] a:hover::before,
	.col[data-class=mexp] a:hover::after {
		transform:none;
	}
	.col[data-class=mexp] .sh1,
	.col[data-class=mexp] .sh2,
	.col[data-class=mexp] .cov1,
	.col[data-class=mexp] .cov2{
		display: none;
	}
	.col[data-class=mexp] .wdlink {
		grid-area: 2 / 2 / 3 / 3;
		z-index: 2;
	}
	.col[data-class=mexp] .evlink {
		grid-area: 2 / 3 / 3 / 4;
		z-index: 3;
	}
	.col[data-class=mexp] .afdlink {
		grid-area: 2 / 4 / 3 / 5;
		z-index: 3;
	}
	.col[data-class=mexp] .prlink {
		grid-area: 2 / 5 / 3 / 6;
		z-index: 3;
	}
}
@media only screen and (max-width:900px) {
	.row[data-class=ntag2] .col {
		padding: 20px !important;
	}

	.row[data-class=ntag2] .col:last-child {
		padding-bottom: 200px !important;
	}

	.row[data-class=resonly] {
		display: block !important;
	}

	section[data-class=mrgsml] {
		padding-top: 0 !important;
		margin-bottom: 100px;
	}

	#maincontent div.col[data-class=lieff] ul {
		padding: 0 15px;
	}

	#maincontent div.col[data-class=lieff] li {
		display: block;
	}

	#maincontent div.col[data-class=lieff] li::before {
		content: "|";
		color: #20608b;
		font-weight: bold;
	}

	#maincontent div.col[data-class=lieff] ul.lwd li::before {
		color: #e42529;
	}

	#maincontent div.col[data-class=lieff] ul.lav li::before {
		color: #643188;
	}

	#maincontent div.col[data-class=lieff] ul.lad li::before {
		color: #f2ca4c;
	}

	#maincontent div.col[data-class=lieff] ul.lsg li::before {
		color: #e22284;
	}

	#maincontent div.col[data-class=lieff] ul.lpr li::before {
		color: #47ad4d;
	}

	#maincontent div.col[data-class=lieff] ul.lev li::before {
		color: #ef7e32;
	}

	/* #maincontent div.col[data-class=lieff] li:first-child::before{ */
	/* content:""; */
	/* } */
	#maincontent div.col[data-class=lieff] img {
		display: none;
	}
}

.row[data-class=ntag] {
	border-bottom: solid 2px #FFF;
	padding-top: 100px !important;
}

.row[data-class=ntag2] {
	padding-bottom: 200px;
}

.row[data-class=ntag2] img {
	max-width: 200px !important;
}

.row[data-class=ntag] .col {
	padding: 20px !important;
}

.row[data-class=ntag] .col p,
.row[data-class=ntag2] .col p {
	color: #FFF !important;
	text-align: center !important;
}

section[data-class=ntagrid],
section[data-class=ntagrid] .row,
section[data-class=ntagrid] .col {
	padding-top: 0 !important;
}

/* Portrait */
.portrait {
	position: absolute;
	display: block;
	padding: 0 !important;
	overflow: hidden;
}

.portrait:hover {
	background: none;
}

.portrait img {
	margin: 0 !important;
	padding: 0 !important;
	position: absolute;
	top: 0px;
	left: 0;
	transition: left .5S ease-in-out, top .5S ease-in-out;
}

#portraitbgjb {
	display: block;
	width: 450px;
	height: 450px;
	background: url(../img/jbbg.jpg) no-repeat center center;
	background-size: cover;
	position: relative;
	margin-left: auto;
	margin-right: 0;
}

#portraitbgjb span {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0%;
	background: url(../img/jbin.jpg) no-repeat center 0%;
	background-size: cover;
	transition: opacity .3s;
	opacity: 0;
}

#portraitbgjb span:hover {
	opacity: 1;
}

#portraitbghb {
	display: block;
	width: 450px;
	height: 450px;
	background: url(../img/hbbg.jpg) no-repeat center center;
	background-size: cover;
	position: relative;
	margin-left: 0;
	margin-right: auto;
}

#portraitbghb span {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0%;
	background: url(../img/hbin.jpg) no-repeat center 0%;
	background-size: cover;
	transition: opacity .3s;
	opacity: 0;
}

#portraitbghb span:hover {
	opacity: 1;
}

#portraitbgal {
	display: block;
	width: 450px;
	height: 450px;
	background: url(../img/albg.jpg) no-repeat center center;
	background-size: cover;
	position: relative;
	margin: auto;
}

#portraitbgal span {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotateZ(9deg);
	width: 49%;
	height: 70%;
	background: url(../img/alin.jpg) no-repeat center 0%;
	background-size: cover;
	transition: background-position .3s;
}

#portraitbgal span:hover {
	background-position: center 100%;
}

#portraitbgtv {
	display: block;
	width: 450px;
	height: 450px;
	background: url(../img/tvbg.jpg) no-repeat center center;
	background-size: cover;
	position: relative;
	perspective: 500px;
	margin: auto;
}

#portraitbgtv span {
	display: block;
	position: absolute;
	top: 42%;
	left: 50%;
	transform: translate(-50%, -50%) rotateY(-14deg);
	width: 35%;
	height: 70%;
	background: url(../img/tvin.jpg) no-repeat 0% center;
	background-size: cover;
	transition: background-position .3s;
}

#portraitbgtv span:hover {
	background-position: 100% center;
}

#portraitbgmvm {
	display: block;
	width: 450px;
	height: 450px;
	background: url(../img/mvmbg.jpg) no-repeat center center;
	background-size: cover;
	position: relative;
	margin: auto;
}

#portraitbgmvm span {
	display: block;
	position: absolute;
	top: 47%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 90%;
	height: 60%;
	background: url(../img/mvmin.jpg) no-repeat 0% center;
	background-size: cover;
	transition: background-position .3s;
}

#portraitbgmvm span:hover {
	background-position: 100% center;
}

#portraitbgdv {
	display: block;
	width: 450px;
	height: 450px;
	background: url(../img/dvbg.jpg) no-repeat center center;
	background-size: cover;
	position: relative;
	margin: auto;
}

#portraitbgdv span {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotateZ(-30deg);
	width: 46%;
	height: 62%;
	background: url(../img/dvin.jpg) no-repeat 0% center;
	background-size: cover;
	transition: background-position .3s;
}

#portraitbgdv span:hover {
	background-position: 100% center;
}

.col[data-class=aga] h2,
.col[data-class=aga] p {
	text-align: center !important;
	padding: 5px !important;
}

@media only screen and (min-width:900px) {

	.col[data-class=aga] h2,
	.col[data-class=aga] p {
		position: absolute;
		top: 30%;
		z-index: 10;
		text-align: right;
	}

	.col[data-class=aga] p {
		top: 40%;
	}

	.col[data-class=aga] h2.right,
	.col[data-class=aga] p.right {
		right: 10px;
	}

	.col[data-class=aga] h2.left,
	.col[data-class=aga] p.left {
		left: 10px;
	}
}

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

	#portraitbgjb,
	#portraitbghb {
		margin: auto;
	}
}

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

	#portraitbgjb,
	#portraitbghb,
	#portraitbgal,
	#portraitbgtv,
	#portraitbgmvm,
	#portraitbgdv {
		width: 300px;
		height: 300px;
	}
}

/* Standard */
.logocolor {
	transition: fill .5s ease;
}

.startcolor {
	stop-color: #237DAA;
	transition: stop-color .5s ease;
}

.endcolor {
	stop-color: #15496B;
	transition: stop-color .5s ease;
}

/* Logo Color */

#scrollToTop.studio,
#menuTrigger.studio{
	background-color: #1f6088 !important;
}

.affdyn .startcolor {
	stop-color: #FDC700;
}
#scrollToTop.affdyn,
#menuTrigger.affdyn{
	background-color: #FDC700 !important;
}

.affdyn .endcolor {
	stop-color: #D38E08;
}

.affdyn #logo:hover .logocolor {
	stroke: #D38E08;
}

.social .startcolor {
	stop-color: #eb5f9e;
}
#scrollToTop.social,
#menuTrigger.social{
	background-color: #eb5f9e !important;
}

.social .endcolor {
	stop-color: #ca253c;
}

.social #logo:hover .logocolor {
	stroke: #ca253c;
}

.digital .startcolor {
	stop-color: #C2321D;
}
#scrollToTop.digital,
#menuTrigger.digital{
	background-color: #C2321D !important;
}

.digital .endcolor {
	stop-color: #7F2310;
}

.digital #logo:hover .logocolor {
	stroke: #7F2310;
}

.print .startcolor {
	stop-color: #059C3C;
}
#scrollToTop.print,
#menuTrigger.print{
	background-color: #059C3C !important;
}

.print .endcolor {
	stop-color: #016930;
}

.print #logo:hover .logocolor {
	stroke: #016930;
}

.audiovisuel .startcolor {
	stop-color: #634285;
}
#scrollToTop.audiovisuel,
#menuTrigger.audiovisuel{
	background-color: #634285 !important;
}

.audiovisuel .endcolor {
	stop-color: #452959;
}

.audiovisuel #logo:hover .logocolor {
	stroke: #452959;
}

.signa .startcolor {
	stop-color: #AA549B;
}
#scrollToTop.signa,
#menuTrigger.signa{
	background-color: #AA549B !important;
}

.signa .endcolor {
	stop-color: #782757;
}

.signa #logo:hover .logocolor {
	stroke: #782757;
}

.event .startcolor {
	stop-color: #DE7622;
}
#scrollToTop.event,
#menuTrigger.event{
	background-color: #DE7622 !important;
}

.event .endcolor {
	stop-color: #915115;
}

.event #logo:hover .logocolor {
	stroke: #915115;
}

@media only screen and (min-width:1199px) {

	/* digital */
	#mainHeader.digital,
	#mainHeader.digital a:hover {
		border-color: #7F2310;
		color: #7F2310 !important;
	}

	#mainHeader.digital #showroom {
		border-bottom-color: #7F2310 !important;
	}

	#mainHeader.digital a {
		color: #7F2310;
	}

	/* affdyn */
	#mainHeader.affdyn,
	#mainHeader.affdyn a:hover {
		border-color: #D38E08;
		color: #D38E08 !important;
	}

	#mainHeader.affdyn #showroom {
		border-bottom-color: #D38E08 !important;
	}

	#mainHeader.affdyn a {
		color: #D38E08;
	}

	/* social */
	#mainHeader.social,
	#mainHeader.social a:hover {
		border-color: #ca253c;
		color: #ca253c !important;
	}

	#mainHeader.social #showroom {
		border-bottom-color: #ca253c !important;
	}

	#mainHeader.social a {
		color: #ca253c;
	}
	/*.print */

	#mainHeader.print,
	#mainHeader.print a:hover {
		border-color: #016930;
		color: #016930 !important;
	}

	#mainHeader.print #showroom {
		border-bottom-color: #016930 !important;
	}

	#mainHeader.print a {
		color: #016930;
	}

	/* audiovisuel */
	#mainHeader.audiovisuel,
	#mainHeader.audiovisuel a:hover {
		border-color: #452959;
		color: #452959 !important;
	}

	#mainHeader.audiovisuel #showroom {
		border-bottom-color: #452959 !important;
	}

	#mainHeader.audiovisuel a {
		color: #452959;
	}

	/*.signa */
	#mainHeader.signa,
	#mainHeader.signa a:hover {
		border-color: #782757;
		color: #782757 !important;
	}

	#mainHeader.signa #showroom {
		border-bottom-color: #782757 !important;
	}

	#mainHeader.signa a {
		color: #782757;
	}

	/*.event */
	#mainHeader.event,
	#mainHeader.event a:hover {
		border-color: #915115;
		color: #915115 !important;
	}

	#mainHeader.event #showroom {
		border-bottom-color: #915115 !important;
	}

	#mainHeader.event a {
		color: #915115;
	}
}

/* Fullscreen Video */
#maincontent div[data-class^=videoFull] {
	max-width: 100%;
}

#maincontent div[data-class^=videoFull] .col {
	padding: 0 !important;
}

.gridAgence {
	display: grid;
	grid-template-columns: repeat(10, 1fr);
	grid-template-rows: repeat(14, 1fr);
	grid-column-gap: 0px;
	grid-row-gap: 0px;
	margin-top: -40px;
	box-shadow: 5px 5px 20px rgb(0 0 0 / 30%);
}

.gridAgence img {
	width: 100%;
	height: auto;
	display: block;
	transition: transform .3s;
}

.gridAgence img:hover {
	transform: scale(1.1)
}

.gridAgence div {
	overflow: hidden;
}

.gridAgence div:nth-child(1) {
	grid-area: 1 / 1 / 7 / 5;
}

.gridAgence div:nth-child(2) {
	grid-area: 1 / 5 / 4 / 11;
}

.gridAgence div:nth-child(3) {
	grid-area: 4 / 5 / 7 / 11;
}

.gridAgence div:nth-child(4) {
	grid-area: 7 / 1 / 11 / 7;
}

.gridAgence div:nth-child(5) {
	grid-area: 7 / 7 / 11 / 11;
}

.gridAgence div:nth-child(6) {
	grid-area: 11 / 1 / 15 / 8;
}

.gridAgence div:nth-child(7) {
	grid-area: 11 / 8 / 15 / 11;
}

#maincontent .row[data-class=portfolioContainer] {
	text-align: center;
	transition: all .6s;
}

#maincontent .row[data-class=portfolioContainer] .col {
	display: inline-block;
	width: 40%;
	box-sizing: border-box;
	transition: transform .6s;
}

@media only screen and (min-width:900px) {
	#maincontent .row[data-class=portfolioContainer] .col {
		display: inline-block;
		width: 30%;
		box-sizing: border-box;
	}
}

#maincontent .row[data-class=frameContent] {}

/*Real*/
#maincontent .row[data-class=portfolioContainer].step1 {
	background: #FFF;
	display: block;
}

#maincontent .row[data-class=portfolioContainer].step2 {
	top: 50px !important;
	left: -150px !important;
	bottom: 0 !important;
	width: 150px !important;
	height: auto !important;
	background: #20608b;
	overflow: auto;
	-webkit-transform: translateZ(8px);
	transform: translateZ(8px);
	z-index: 800;
}

#maincontent .row[data-class=portfolioContainer].openMenu {
	left: 0 !important;
	-webkit-transform: translateZ(10)
}

#maincontent .row[data-class=portfolioContainer].step1 .col {
	transform: scale(0.001);
}

#maincontent .row[data-class=portfolioContainer].step3 .col {
	width: 90%;
	transform: scale(1);
}

body .reaFrame {
	position: fixed;
	top: 60px;
	right: 0;
	bottom: 0;
	left: 100%;
	transition: left .6S;
	background: #20608b;
	-webkit-transform: translateZ(7px);
	transform: translateZ(7px);
	z-index: 700;
}

body .reaFrame iframe {
	position: absolute;
	top: 70px;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
	opacity: 0;
	transition: opacity .5S;
	background: #FFF !important;
}

body .reaFrame .closeFrame {
	position: absolute;
	height: 50px;
	width: 50px;
	z-index: 10;
	right: 30px;
	top: 10px;
	transition: left .6S;
	display: none;
}

body .reaFrame .closeFrame::before,
body .reaFrame .closeFrame::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	border: solid 1px #FFF;
	transform: translate(-50%, -50%) rotate(45deg);
}

body .reaFrame .closeFrame::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

body .reaFrame.loading .closeFrame {
	display: block;
}

body .reaFrame .openMenuFrame {
	position: absolute;
	height: 50px;
	width: 50px;
	left: 100%;
	top: 10px;
	transition: right .6S;
}

body .reaFrame .openMenuFrame::before,
body .reaFrame .openMenuFrame::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	border: solid 1px #FFF;
	transform: translate(-50%, -50%);
}

body .reaFrame .openMenuFrame::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

body .reaFrame.loading .openMenuFrame {
	left: 30px;
}

body .reaFrame::before,
body .reaFrame::after {
	content: "";
	position: absolute;
	display: block;
	top: 50%;
	left: 50%;
	width: 100px;
	height: 100px;
	border-radius: 100px;
	background: #FFF;
	transform: translate(-50%, -50%) scale(0);
	transition: transform .6s;
	z-index: 10;
}

body .reaFrame::after {
	border: inset 30px #20608b;
	animation: loading 3s linear infinite;
	display: none;
}

@keyframes loading {
	from {
		transform: translate(-50%, -50%) scale(1) rotate(0deg)
	}

	to {
		transform: translate(-50%, -50%) scale(1)rotate(360deg)
	}
}

body .reaFrame.loading {
	left: 0;
}

body .reaFrame.loading::before {
	transform: translate(-50%, -50%) scale(20);
}

body .reaFrame.loading::after {
	display: block;
}

body .reaFrame.loaded::after {
	display: none;
}

body .reaFrame.loaded::before {
	transform: translate(-50%, -50%) scale(0);
}

@media only screen and (min-width:900px) {
	#maincontent .row[data-class=portfolioContainer] .col {
		display: inline-block;
		width: 30%;
		box-sizing: border-box;
	}

	#maincontent .row[data-class=portfolioContainer].step2 {
		top: 60px !important;
		left: 0 !important;
	}

	body .reaFrame.loading {
		top: 50px;
		left: 150px;
	}

	body .reaFrame iframe {
		top: 0;
	}

	body .reaFrame .openMenuFrame {
		display: none;
	}

	body .reaFrame .closeFrame::before,
	body .reaFrame .closeFrame::after {
		border: solid 1px #000;
	}
}

/* Frame réa */
#maincontent.frame {
	background: #FFF;
	margin: 0;
	min-height: 100vh;
}

#maincontent.frame a.glightbox {
	display: block;
	padding: .2rem;
	transition: background .5S;
}

#maincontent.frame a.glightbox img {
	max-width: 300px;
	display: block;
	border: solid 2px transparent;
}

#maincontent.frame a.glightbox:hover img {
	border: solid 2px #20608b;
}

.gclose {}

#maincontent section[data-class=frame] {
	padding: 0 !important;
}

#maincontent section[data-class=frame] .row,
#maincontent section[data-class=frame] .col {
	margin: 0 auto;
	padding: 0;
}

#maincontent section[data-class=frame] .row {
	margin: 6rem auto;
}

#maincontent .row[data-class=frameLogo] {
	margin: 3rem auto !important;
}

#maincontent .row[data-class=frameLogo] img {
	max-width: 300px !important;
}

#maincontent .row[data-class=frameLogoBKM] {
	margin: 0 auto 6rem !important;
}

#maincontent .row[data-class=frameLogoBKM] .col {
	border-bottom: solid 2px #15496b;
	height: 40px;
	margin-bottom: 40px;
}

#maincontent .row[data-class=frameLogoBKM] img {
	position: absolute;
	height: 40px;
	width: auto;
	right: 30px;
	top: 20px;
}

#maincontent .row[data-class=frameLogoBKMtop] {
	margin: 0 auto !important;
}

#maincontent .row[data-class=frameLogoBKMtop] a.goTop {
	display: block;
	background: url(../img/top.svg) no-repeat top center;
	background-size: 50px 50px;
	text-decoration: none;
	color: #15496b;
	padding-top: 3rem;
	font-weight: 700;
	font-size: .6rem;
}

#maincontent .row[data-class=frameText] .col {
	padding: 20px 40px;
	width: 70%;
	display: block;
}

#maincontent .row[data-class=frameText] .col::after {
	content: "";
	display: block;
	position: absolute;
	width: .5rem;
	top: 0;
	left: 0;
	bottom: 0;
	background: rgb(86, 183, 228);
	background: linear-gradient(0deg, #257dab 0%, #15496b 100%);
}

#maincontent .row[data-class=frameText] h4,
#maincontent .row[data-class=frameText] p {
	/* color:#385abc; */
	color: #000;
	padding: 0.5rem;
	text-align: left;
}

#maincontent .row[data-class=frameText] h4 {
	font-weight: bold;
}

#maincontent .row[data-class^=frameBlock] .col {
	display: grid;
	grid-template-columns: repeat(24, 1fr);
	grid-column-gap: 0px;
	grid-row-gap: 0px;
	align-items: stretch;
}

#maincontent .row[data-class=frameBlockw8] .col {
	grid-template-rows: repeat(8, 1fr);
}

#maincontent .row[data-class=frameBlockw9] .col {
	grid-template-rows: repeat(9, 55px);
}

#maincontent .row[data-class=frameBlockw14] .col {
	grid-template-rows: repeat(14, 1fr);
}

#maincontent .row[data-class=frameBlockw16] .col {
	grid-template-rows: repeat(16, 1fr);
}

#maincontent .row[data-class=frameBlockw17] .col {
	grid-template-rows: repeat(17, 1fr);
}

#maincontent .row[data-class=frameBlockw18] .col {
	grid-template-rows: repeat(18, 1fr);
}

#maincontent .row[data-class=frameBlockw6] .col {
	grid-template-rows: repeat(6, 1fr);
}

#maincontent .row[data-class=frameBlockw7] .col {
	grid-template-rows: repeat(7, 1fr);
}

#maincontent .row[data-class=frameBlockw10] .col {
	grid-template-rows: repeat(10, 1fr);
}

#maincontent .row[data-class=frameBlockw12] .col {
	grid-template-rows: repeat(12, 1fr);
}

#maincontent .row[data-class^=frameBlock] .col .blockFrame {
	align-self: center;
}

#maincontent .row[data-class^=frameBlock] .col .backFrame {
	background: url(../img/backFrame.jpg) no-repeat center center;
	background-size: cover;
}

#maincontent .row[data-class^=frameBlock] .col p {
	color: #FFF;
	font-size: 1rem;
	padding: 0;
}

#maincontent .row[data-class^=frameBlock] .col h3 {
	color: #FFF;
	font-size: 2.2rem;
	padding: 0;
	font-weight: 300;
}

#maincontent .row[data-class^=frameBlock] .col h3 b {
	font-weight: bold;
}

#maincontent .row[data-class^=frameBlock] .col img {
	box-shadow: 0.5rem 0.5rem 1rem rgb(0 0 0 / 30%);
	margin: auto;
}

#maincontent .row[data-class^=frameBlock] .col .blockFrame img.res {
	display: inline-block;
	width: 3rem;
	box-shadow: none !important;
	vertical-align: text-top;
	margin-right: 1rem;
}

@media only screen and (max-width:899px) {
	#maincontent .row[data-class^=frameBlock] .col .blockFrame {
		margin: 2rem 0;
	}

	#maincontent .row[data-class^=frameBlock] .col {
		display: block;
		padding: 1rem;
		background: url(../img/backFrame.jpg) no-repeat center center;
		background-size: cover;
	}

	#maincontent .row[data-class^=frameBlock] .col p,
	#maincontent .row[data-class^=frameBlock] .col h3 {
		text-align: center !important;
		color: #FFF !important;
		padding: 1rem 0;
	}
}

#sliderLogoContainer {
	margin-bottom: 50px;
}

/* Heart Animation */
#heart-container {
	position: absolute;
	right: 10px;
	bottom: 1%;
	width: 200px;
	height: 300px;
	pointer-events: none;
	transition: opacity 0.7s ease;
	opacity: 1;
	z-index: 9999;
}
#heart-canvas {
	width: 100%;
	height: 100%;
	display: block;
}

[data-class="no-margin"] {
	margin: 0 auto !important;
    padding: 0 !important;
}
.row[data-class="fullwidth"],
.row[data-class="fullwidth"] .col{
	margin: 0!important;
    padding: 0 !important;
	width: 100vw;
}
/* Fat Cap */
.tf-b {
	font-size: clamp(36px, 7.4vw, 90px) !important;
    /* line-height: 93% !important; */
}
.tf-b1{
	font-size: clamp(26px, 6vw, 80px) !important;
    padding: 0 !important;
    font-weight: 600 !important;
	/* line-height: 96% !important; */
}
.tf-b2{
	font-size: clamp(34px, 5.1vw, 58px) !important;
    /* line-height: 90% !important; */
    font-weight: 400;
}
.tf-bslider {
	font-size: clamp(30px, 3vw, 50px)!important;
}
.tf-m {
	font-size: clamp(15px, 4vw, 37px)!important;
	font-weight: 400!important;
	color: #20608b!important;
}
.tf-s {
	font-size: clamp(16px, 3vw, 32px)!important;
}
.tf-s1 {
	font-size: clamp(16px, 3vw, 30px)!important;
}

#maincontent section[data-class^=ntgr] .tf-b1{
	font-weight: bold;
}
#maincontent section[data-class^=ntgr] .tf-b{
	text-align: center;
    font-weight: bold;
    font-size: clamp(36px, 4vw, 40px) !important;
    transform-origin: top center;
}
#maincontent section[data-class^=ntgr] .tf-b.top{
	position: absolute;
    min-height: 0;
    top: 50%;
    left: 50%;
}
#maincontent section[data-class^=ntgr] .tf-b.side{
	left: 0 !important;
    transform: translate(-45%, 50%) translateZ(1px) rotate(-90deg) !important;
}
/* @media only screen and (max-width:899px) {
	#maincontent section[data-class^=ntgr] .tf-b{
		transform:translateZ(100px)!important;
	}
} */
[data-class^=scrow]{
	padding:0!important;
	transform:rotate(-3deg)!important;
}
[data-class^=scrow] .col{
	vertical-align: middle!important;
}
[data-class^=scrow] .col *{
	padding: 0!important;
}
[data-class=scrowbg]::before{
	content: "";
    display: block;
	top: 50%;
    left: 50%;
    position: absolute;
    width: 120vw;
    height: 55%;
    background: #007191;
    transform: translate(-50%, -50%);
}
[data-class=maxpadding]{
	padding: 250px 0!important;
}
#maincontent section[data-class=margbot]{
    margin-bottom: 20vh;
}

#maincontent section[data-class^=ntgr] .tf-b1{
    padding-left: 60px!important;
	font-size:clamp(34px, 6vw, 64px) !important;
}
#maincontent section[data-class^=ntgrr] .tf-b1{
    padding-left: 0!important;
	padding-right: 60px!important;
}

#maincontent div.col[data-class=lieff] span{
	display:inline-block;
	white-space: pre;
}
@media only screen and (max-width:899px) {
	.row[data-class=scrowbg]{
		padding: 20px 0!important;
		margin-bottom: 30px !important;
	}
	.row[data-class=scrowbg]::before{
		height: 100%;
	}
	.row[data-class=scrowbg] .col h3{
		text-align:center!important;
	}
	[data-class=hidemob]{
		display:none!important;
	}
	[data-class=scrow]{
		padding:20px!important;
	}

	#maincontent:not(.editing) div.col[data-class=tiltexp]>:nth-child(1),
	#maincontent:not(.editing) div.col[data-class=tiltexp]>:nth-child(2),
	#maincontent:not(.editing) div.col[data-class=tiltexp]>:nth-child(3) {
		opacity:1;
		transform: translate(-50%, -100%) translateZ(100px)!important;
		position:absolute;
		top:50%;
		left:50%;
		z-index: 10;
		width: 75%;
	}
	#maincontent:not(.editing) div.col[data-class^=tiltexp]>:nth-child(3) {
		transform: translate(-50%, 100%) translateZ(100px)!important;
		font-weight: bold;
	}
	#maincontent:not(.editing) div.col[data-class^=tiltexp]>:nth-child(2),
	#maincontent:not(.editing) div.col[data-class^=tiltexp]>:nth-child(4) {
		display:none!important;
	}
	#maincontent section[data-class^=ntgr] .tf-b1{
		padding:20px!important;
		text-align: left!important;
	}

	#maincontent section[data-class=ntrea]::before,
	#maincontent section[data-class^=ntgr]::before,
	#maincontent section[data-class=ntrea]::after,
	#maincontent section[data-class^=ntgr]::after {
		display: none;
	}

	.tf-m br,
	.tf-b2 br{
		display: none;
	}
}
#maincontent section[data-class=homepole] {
	background: linear-gradient(70deg,#194b69 0%, #2678a5 100%);
	position: relative;
}
#maincontent section[data-class=homepole] img{
	width: 100%;
	max-width: 230px;
	opacity:0;
	transition: opacity .3s ease;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translate(0%, -66%)
}
#maincontent section[data-class=homepole] img.step{
	opacity:1;
}
#paralaxHome{
	color: #fff !important;
	font-size: clamp(20px, 4vw, 30px) !important;
}
#maincontent section[data-class=homepole] .button{
	filter: invert(1);
}

#sliderpar .descContent{
	opacity:0;
	transition: opacity .3s ease;
}
#sliderpar:hover .descContent{
	opacity:1;
}
@media only screen and (min-width:900px) {
	#maincontent div.row[data-colmaj="colalt"] .col:nth-child(1){
		width: 35%;
	}
	#maincontent div.row[data-colmaj="colalt"] .col:nth-child(2) {
		width: 65%;
	}
	#maincontent section[data-class=homepole] .button{
		margin-left: 30px;
		margin-right: 100%;
	}
}
@media only screen and (max-width:899px) {
	#maincontent section[data-class=homepole] .col{
		min-height: 270px;
	}
	#maincontent section[data-class=homepole] img{
		right: 50%;
		transform: translate(50%, -50%)
	}
	#paralaxHome{
		text-align: center!important;
	}
}