/* General Styles */

@font-face {
  font-family: 'FaktPro-Black';
  src: url('../../assets/fonts/FaktPro-Black.eot?#iefix') format('embedded-opentype'),  url('../../assets/fonts/FaktPro-Black.otf')  format('opentype'),
	     url('../../assets/fonts/FaktPro-Black.woff') format('woff'), url('../../assets/fonts/FaktPro-Black.ttf')  format('truetype'), url('../../assets/fonts/FaktPro-Black.svg#FaktPro-Black') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'FaktPro-Bold';
  src: url('../../assets/fonts/FaktPro-Bold.eot?#iefix') format('embedded-opentype'),  url('../../assets/fonts/FaktPro-Bold.otf')  format('opentype'),
	     url('../../assets/fonts/FaktPro-Bold.woff') format('woff'), url('../../assets/fonts/FaktPro-Bold.ttf')  format('truetype'), url('../../assets/fonts/FaktPro-Bold.svg#FaktPro-Bold') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'FaktPro-Medium';
  src: url('../../assets/fonts/FaktPro-Medium.eot?#iefix') format('embedded-opentype'),  url('../../assets/fonts/FaktPro-Medium.otf')  format('opentype'),
	     url('../../assets/fonts/FaktPro-Medium.woff') format('woff'), url('../../assets/fonts/FaktPro-Medium.ttf')  format('truetype'), url('../../assets/fonts/FaktPro-Medium.svg#FaktPro-Medium') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'FaktPro-Normal';
  src: url('../../assets/fonts/FaktPro-Normal.eot?#iefix') format('embedded-opentype'),  url('../../assets/fonts/FaktPro-Normal.otf')  format('opentype'),
	     url('../../assets/fonts/FaktPro-Normal.woff') format('woff'), url('../../assets/fonts/FaktPro-Normal.ttf')  format('truetype'), url('../../assets/fonts/FaktPro-Normal.svg#FaktPro-Normal') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
	font-family: 'Pe-icon-7-stroke';
	src:url('fonts/Pe-icon-7-stroke.eot?d7yf1v');
	src:url('fonts/Pe-icon-7-stroke.eot?#iefixd7yf1v') format('embedded-opentype'),
		url('fonts/Pe-icon-7-stroke.woff?d7yf1v') format('woff'),
		url('fonts/Pe-icon-7-stroke.ttf?d7yf1v') format('truetype'),
		url('fonts/Pe-icon-7-stroke.svg?d7yf1v#Pe-icon-7-stroke') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
  font-family: 'FaktPro-Blond';
  src: url('../../assets/fonts/FaktPro-Blond.eot?#iefix') format('embedded-opentype'),  url('../../assets/fonts/FaktPro-Blond.otf')  format('opentype'),
	     url('../../assets/fonts/FaktPro-Blond.woff') format('woff'), url('../../assets/fonts/FaktPro-Blond.ttf')  format('truetype'), url('../../assets/fonts/FaktPro-Blond.svg#FaktPro-Blond') format('svg');
  font-weight: normal;
  font-style: normal;
}


body { padding-top:149px; font-family:"Roboto", arial; font-size:16px; color:#312783; margin:0; padding-bottom:0; background:#f5f5f5; transition:0.2s all ease-out; }
body#home { background:url(../../assets/img/domotec-le-confort-bien-pensee-visuel-accueil.jpg) center top no-repeat #f5f5f5; }
.tiny-body { padding-top:149px; }
a { color:#a3195b; }
a:hover { color:#be266f; }
.bg-whitegrey { background:#f5f5f5; }
header { position:fixed; width:100%; z-index:1030; top:0; left:0; background:#f5f5f5;  transition:0.2s all ease-out; }
header.tiny-header { position:fixed; height:130px; box-shadow:0 10px 20px -10px rgba(0,0,0,0.2); background:#f5f5f5; transition:0.2s all ease-out; }
header.tiny-header .navbar-brand { width:auto; margin:0px; }
header.tiny-header .navbar-brand img { margin-top:0px; }
header.tiny-header nav {  font-size:12px; justify-content: center; padding-top:0; padding-bottom:0; }

header .ref_top { /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#832766+0,a3195b+15,a3195b+85,832766+100 */
background: #832766; /* Old browsers */
background: -moz-linear-gradient(left,  #832766 0%, #a3195b 15%, #a3195b 85%, #832766 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #832766 0%,#a3195b 15%,#a3195b 85%,#832766 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #832766 0%,#a3195b 15%,#a3195b 85%,#832766 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#832766', endColorstr='#832766',GradientType=1 ); /* IE6-9 */
text-align:left; font-size:12px; margin:0; color:#ea84b5; padding:8px 0; max-height:35px; overflow:hidden; position:relative; }

header > .container { padding:20px 15px 0px 15px; }
header.tiny-header >  .container { padding:10px 15px 5px; }
@media screen and (min-width: 1140px) {
header > .container, .solutions .container, .realisations .container, .certifications .container, .footer .container, header .ref_top .container  { width:calc(100% - 150px); max-width:calc(100% - 150px); }

.societe > .container { width:calc(100% - 150px); max-width:calc(100% - 150px); }
}


.navbar-brand { display:block; margin:0; transition:0.2s all ease-out;  }
.navbar-brand img.img-fluid { min-width:180px; }
nav { top:auto; font-family:"FaktPro-Normal", arial; font-weight:600; font-size:12px; width:auto; }
.navbar-expand-lg .navbar-nav { width:auto; margin:auto; }
.navbar-expand-lg {  justify-content: center; }
nav ul { width:100%; justify-content: space-between; padding:0; }
nav a { color:#312783; text-transform:uppercase; display:block; }
nav a.font-weight-bold { font-family:"FaktPro-Bold", arial; }
.navbar-expand-lg .navbar-nav .nav-link { padding:10px; }
nav li:hover, nav a:hover { color:#a3195b; }
.navbar-nav .dropdown.static {
    position: static;
}
.navbar-nav { text-align: center; }
.navbar-nav .dropdown-menu { font-size:13px; border-radius:unset; margin:-3px 0 0 0; border:none; top:auto; background:#fff;   padding:25px 0 20px; }
@media screen and (min-width: 992px) {
.navbar-nav li:hover>.dropdown-menu {
  display: block;
}
.dropdown.static .dropdown-menu-100 { width: 147.9%; left: -29.6%; right:0px; margin:-3px 0 0 0; }
}
.navbar-nav .dropdown-menu a { color:#312783 }
.navbar-nav .dropdown-menu a:hover { background:#fff; color:#a3195b; }
.navbar-nav .dropdown .dropdown-toggle::after { display:none; }

.navbar-nav li.nav-item.dropdown:hover .nav-link {
  color:#a3195b;
	background:#fff;
}

.dropdown-item.active, .dropdown-item:active {
    color: #be266f;
    text-decoration: none;
    background-color: #fff;
}

.nav-abs { margin-top: 1rem !important; padding-top: 1.5rem !important; }

header .form-inline { display:none; }

.rge_ban { text-align:right; }
.logo_rge_ban { float:right; }

.intro-home { padding:0; text-align:center; position:relative; height:75vh; }

.bg-slogan { background:#a3195b; padding:200px 0; background-position: top center; background-size: cover; }
.bg-chauffer { background-image: url('../../assets/img/bg-slogan-chauffer.jpg'); }
.bg-real { background-image: url('../../assets/img/illus-realisations.jpg'); }
.bg-news { background-image: url('../../assets/img/illus-actualites.jpg'); }
.bg-news-depannage { background-image: url('../../assets/img/depanner.jpg'); }
.bg-real-id {  background-image: url('../../assets/img/illus-plan.jpg'); background-position: center center; padding:60px 0 40px 0; }
.bg-clients {  background-image: url('../../assets/img/illus-clients.jpg'); }
.bg-climatiser {  background-image: url('../../assets/img/illus-climatisation.jpg'); }
.bg-solaire {  background-image: url('../../assets/img/illus-photovoltaique.jpg'); }
.bg-domotec {  background-image: url('../../assets/img/illus-domotec.jpg'); }
.slogan { background: -moz-linear-gradient(top,  rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.7) 65%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.7) 65%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.7) 65%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */   font-weight:400; font-size:20px; text-align:center; padding:50px; width:60%; margin:auto;  }
.slogan .h1, .slogan h1 {  display:block; font-family:"FaktPro-Normal", arial;  color:#a3195b;  font-size:36px; font-weight:400; margin-bottom:10px; }

@media screen and (max-width: 992px) {
.col { flex-basis: auto; }
.bg-slogan { background:#a3195b; padding:180px 0; background-position: top center; background-size: cover; }	
.service-detail { font-size:14px; }
}

@media screen and (max-width: 768px) {
.bg-slogan { background:#a3195b; padding:150px 0; background-position: top center; background-size: cover; }	
.slogan { padding:10px; font-size:14px; }
.slogan .h1, .slogan h1 { font-size:18px; margin:0; }
.service-detail { font-size:14px; }
}


.h1, h1 { font-size:2.7rem; font-family:'FaktPro-Bold', arial; position:relative; padding-bottom:20px; margin-bottom:20px; text-align:center; color:#a3195b; text-transform:uppercase; }
.h2, h2 { font-size:2.2rem; font-family:'FaktPro-Bold', arial; position:relative; padding-bottom:10px; color:#a3195b; text-transform:uppercase; }

h3, .h3 {
    font-size: 1.65rem; font-family:'FaktPro-Bold', arial;
}

h3, h4, h5, h6, h7 { font-family:'FaktPro-Bold', arial; text-transform:uppercase; }


.intro-home-text { /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0.7+52,0+100 */
background: -moz-linear-gradient(top,  rgba(255,255,255,0.7) 0%, rgba(255,255,255,0.7) 52%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.7) 52%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.7) 52%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
padding:80px 25px 50px 25px; }

.circle-simu { -moz-transform: rotate(10deg);
-webkit-transform: rotate(10deg);
-o-transform: rotate(10deg);
-ms-transform: rotate(10deg);
transform: rotate(10deg);border:1px solid #fff; box-shadow:0 0 0px 10px #a3195b, 0 0 20px 5px #000; color:#fff; display:flex; background: #a3195b; border-radius:50%; height:220px; width:220px; text-align:center; padding:10px; position:absolute; top:-30px; right:-160px; }

.btn-simu { background: #312783; padding: 10px; margin-top: -10px; }

@media screen and (max-width: 768px) {
	.circle-simu { display:block; height:180px; width:180px; text-align:center; padding:20px; position:relative; top:auto; right:auto; margin: 30px auto 0; }
	#header .size-14 { font-size:12px !important; }
}


.intro-home-text .h2, .intro-home-text h2 {
    font-size: 2.2rem; text-transform:uppercase; line-height:2.6rem; margin-bottom:30px;
}

.intro-home-text p { font-size:16px; }

.image-popup { position:relative; display:block; height:auto; }
.image-popup::after { content:""; display:block; position:absolute; right:10px; bottom:20px; width:25px; height:20px; background:url(../../assets/img/zoom-icon.png) top left no-repeat; }

.solutions { background:url(../../assets/img/top-home-text.png) center 60px no-repeat; padding:0px 0 -100px 0; margin-top:0px; }
.solutions h2 { padding-top:160px; padding-bottom:0; margin-bottom:0; }

.flottement-gauche { float:left; }
.flottement-droit { float:right; }

.card-solution { position:relative; overflow:hidden; height:100%; width:100%; }
.card-solution .solution-img { width:100%; transition:0.2s all ease-out; }
.card-solution .solution-overlay { width:100%; height:100%; position:absolute; top:0; left:0;  transition:0.3s all ease-out; }
.card-solution .solution-text { position:absolute; background:#a3195b; width:100%; bottom:0; z-index:2; color:#fff; padding:14px 0; line-height:1.6rem; text-align:center; text-transform:uppercase; font-family:"FaktPro-Bold"; font-size:1.5rem;  transition:0.2s all ease-out; }
.card-solution .solution-text:after { content:''; width:100%; height:30px; display:block; position:absolute; top:-30px; left:0;
-webkit-clip-path: polygon(100% 0%, 0% 100%, 100% 100%);
clip-path: polygon(100% 0%, 0% 100%, 100% 100%);
 background:#a3195b; transition:0.2s all ease-out; }

.card-solution .solution-text2 { position:absolute; background:url(../../assets/img/domotec-filigrane.png) -30px 30px no-repeat #fff; width:100%; bottom:-500px; opacity:0; z-index:3; color:#a3195b; padding:15px; text-align:center; text-transform:uppercase; font-family:"Roboto"; font-size:12px;  transition:0.3s all ease-out 0.2s; }
.card-solution .solution-text2:after { content:''; width:100%; height:30px; display:block; position:absolute; top:-30px; left:0;
-webkit-clip-path: polygon(100% 0%, 0% 100%, 100% 100%);
clip-path: polygon(100% 0%, 0% 100%, 100% 100%);
 background:#fff; transition:0.3s all ease-out 0.2s; }
 .card-solution .solution-text2 .btn { font-size:12px; }
 
.card-solution:hover .solution-overlay { opacity:0.4; background:#a3195b; }
.card-solution:hover .solution-text { background:transparent; bottom:60%; line-height:2.2rem; font-size:2.2rem; text-shadow:3px 3px 5px rgba(0,0,0,0.5) }
.card-solution:hover .solution-text:after { background:transparent; }
.card-solution:hover .solution-text2 { bottom:0; opacity:1; }

.degrade { /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#a3195b+0,312783+100 */
background: rgb(163,25,91); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(163,25,91,1) 0%, rgba(49,39,131,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(163,25,91,1) 0%,rgba(49,39,131,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(163,25,91,1) 0%,rgba(49,39,131,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a3195b', endColorstr='#312783',GradientType=1 ); /* IE6-9 */ border:none; padding:0px; color:#fff; }

.degrade.simu { clip-path: polygon(50% 0, 100% 15%, 100% 85%, 50% 100%, 0% 85%, 0% 15%); }

.logo-domotec { background-image:url(../../assets/img/logo-domotec-filigrane.png); background-position:center left; background-repeat:no-repeat; padding:30px;  }
.logo-phone { background-image:url(../../assets/img/logo-phone-filigrane.png); background-position:center left; background-repeat:no-repeat; padding:30px;  }

.cadre_degrade { /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#a3195b+0,312783+100 */
background: rgb(163,25,91); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(163,25,91,1) 0%, rgba(49,39,131,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(163,25,91,1) 0%,rgba(49,39,131,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(163,25,91,1) 0%,rgba(49,39,131,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a3195b', endColorstr='#312783',GradientType=1 ); /* IE6-9 */ border:none; margin:20px; padding:40px 30px 30px; color:#fff; display:block; }

.cadre_degrade img { max-width:100%; height:auto; width:auto; }

.mceTmpl .container .row .col img { max-width:100%; height:auto; width:auto; }

.degrade h3, .cadre_degrade h3 { text-transform:uppercase; }

.degrade.modal-content .modal-header, .degrade.modal-content .modal-footer { border:none; }
.degrade.modal-content .modal-header .close { color:#fff; opacity:1; }

.modal-dialog .logo-domotec { background-image:url(../../assets/img/logo-domotec-filigrane.png); background-position:left 100%; background-repeat:no-repeat; padding:0 30px;  }
.modal-dialog .logo-phone { background-image:url(../../assets/img/logo-phone-filigrane.png); background-position:left 100%; background-repeat:no-repeat; padding:0 30px;  }

#callBack .modal-dialog, #freeQuotation .modal-dialog { max-width: 400px; }

.certifications { background:#fff; padding:50px 0; box-shadow: inset 0px 0px 20px -10px rgba(0,0,0,0.5); margin-top: 70px; }

.services { background:url(../../assets/img/arrow-services.png) center 80% no-repeat #fff; padding:0; box-shadow: inset 0px 0px 20px -10px rgba(0,0,0,0.5); margin-top:0px; }
.services div.size-16 { margin-top:10px; color:#a3195b; }
.service-card { background:#fff; margin:30px 0; padding:0px 20px; display:inline-block; } 
.service { overflow:hidden; position:relative; }
.service .service-card-hover { position:absolute; background:#f5f5f5; width:100%; height:100%; padding:20px; left:0; top:-250px; opacity:0; transition:0.2s all ease-out; }
.service:hover .service-card-hover { top:0; opacity:1; }
.service-detail { position:absolute; width:100%; left:0; opacity:0; transition:0.2s all ease-out; background:#f5f5f5; padding:20px; }
.service-detail-hover {  transform:translateY(-99%); opacity:1; }

@media screen and (max-width: 768px) {
.services { background-image:none; }
}

@media screen and (max-width: 460px) {
.services { display:none; }
}

.slide-real .slick-prev, .slide-real .slick-next { width:60px; }

.btn { border-radius:0; border:none; background:#a3195b; color:#fff; text-transform:uppercase; }
.btn:hover { color:#a28228; border:none; background:#811549; color:#fff; }
.btn-primary { background:#fff; }
.btn-primary:hover { background:#c3a140; color:#fff; }
.btn-grey { background:#fff; color:#2a2a2a; border:1px solid #2a2a2a; }
.btn-bleu { background: #312783; border:none; color:#fff; transition:0.2s all ease-out; }
.btn-bleu:hover { border:none; color:#fff; background:#231c58; }
.btn-degrade { /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#a3195b+0,312783+100 */
background: rgb(163,25,91); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(163,25,91,1) 0%, rgba(49,39,131,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(163,25,91,1) 0%,rgba(49,39,131,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(163,25,91,1) 0%,rgba(49,39,131,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a3195b', endColorstr='#312783',GradientType=1 ); /* IE6-9 */ border:none; color:#fff; }
.big-btn { font-size:20px; }
.btn-fillwhite { background: transparent; border:2px solid #fff; color:#fff; transition:0.2s all ease-out; }
.btn-fillwhite:hover { border:2px solid #fff; }

.bg-bleu-marine { background-color:#231c58; }
.bg-bleu { background-color:#312783; }
.bg-rose { background-color:#a3195b; }
.bg-gris { background-color:#adadad; }

.txt-rose { color:#a3195b; }

.footer { position:relative; background:#312783; padding:0px; margin:0px; color:#fff; }
.footer .col-md-4 { padding-top:50px; padding-bottom:40px; margin:0; }
.footer a { color:#f391a3; }
.footer a:hover { color:#d96278; }
.footer h4 { text-transform:uppercase; font-size:20px; padding-bottom:15px; margin-bottom:25px; }

.text-vert { color:#d96278; }

/* sign in  */
.form-signin {
  width: 100%;
  max-width: 330px;
  padding: 15px;
  margin: 0 auto;
}
.form-signin .checkbox {
  font-weight: 400;
}
.form-signin .form-control {
  position: relative;
  box-sizing: border-box;
  height: auto;
  padding: 10px;
  font-size: 16px;
}
.form-signin .form-control:focus {
  z-index: 2;
}
.form-signin input#login {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.form-signin input#password {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

@media screen and (max-width: 768px) {
.form-group  .col-md-6:first-child { margin-bottom: 1rem; }
}

.bg-grey { background:transparent; display:flex; -ms-flex-align: center; -webkit-align-items: center; -webkit-box-align: center; align-items: center; margin-bottom:30px;  }
.degrade .card  {
    background: #fff;
		margin:0;
		padding:10px;
		text-align:center;
    box-shadow: 0 2px 5px 0px rgba(0,0,0,0.07);
		border:none;
		font-size:16px;
		justify-content: center;
		flex-grow: 1;
		flex-basis: 0;
		color:#312783;
		font-family:"FaktPro-Normal", arial;
}

.card .icon { font-size:36px; color:#312783; }
.degrade .card:nth-child(2) { margin:0 2%; }
.degrade .card:nth-child(3) { margin:0 2% 0 0; }

.bg-grey .card:hover { background:#7a9d30; }

.fx-zoom {
    overflow: hidden;
    width: 100%;
}
.fx-zoom:hover img {
    transform: scale(1.05);
}
.fx-zoom img {
    transition: filter 400ms linear,transform .7s ease-in-out;
    transform: scale(1);
}

.slide-avis { position:relative; margin-bottom:30px; }
.slide-avis div.col-md-6 { position:relative; } 
.avis { margin:10px; padding:20px 30px; background:#fff; min-height:235px; max-height:300px; box-shadow: 0px 0px 20px -10px rgba(0,0,0,0.3); }
.avis h4 { color:#a3195b;	padding:0; margin:10px 0; }

.li_actu { background:#fff; position:relative; margin:0 0 40px 0; padding-bottom:10px; transition:all ease-in 0.2s;  box-shadow: 0px 0px 20px -10px rgba(0,0,0,0.3); }
.li_actu .actu_img { display:block; overflow:hidden; position:relative; max-height: 240px; min-height: 240px; }
.li_actu div { margin:0 20px 20px; padding-top:30px; position:relative;  transition:all ease-in 0.2s; z-index:1; }
.li_actu div:before { content:""; background:#fff; position:absolute; left:-20px; right:-20px; top:-50px; width:calc(100% + 40px); height:70px; -webkit-clip-path: polygon(0 100%, 0 70%, 100% 20%, 100% 100%); clip-path: polygon(0 100%, 0 70%, 100% 20%, 100% 100%);  transition:all ease-in 0.2s; z-index:-1; }
.li_actu:hover div:before { top:-65px; background:#f5f5f5; }
.li_actu:hover { background:#f5f5f5; }
.li_actu .fx-zoom:hover img {
		transition: filter 400ms linear,transform .3s ease-in-out;	
}

.li_actu .fx-zoom img {
    transition: filter 400ms linear,transform .3s ease-in-out;
    transform: scale(1) translateX(-50%);
    position: absolute;
    left: 50%;
    display: block;
}

.li_actu .fx-zoom:hover img, .li_actu:hover .fx-zoom img {
    transform:scale(1.05) translateX(-50%);
    position: absolute;
    left: 50%;
    display: block;
}

.date_articles { font-weight:normal; color:#cdcdcd; font-style:italic; }

.actu_categ { position:absolute; display:block; font-size:13px; right:0; top:-15px; color:#a3195b;  transition:all ease-in 0.2s; }
.li_actu:hover .actu_categ { color:#312783;  top:-25px;  transition:all ease-out 0.2s 0.2s; }

.col-liste_actualites div { border-bottom:1px solid #cecece; padding:20px 20px 10px 10px; transition:all ease-in 0.1s;; }

.col-liste_actualites div:hover { background:#ececec; padding-left:20px; padding-right:10px; transition:all ease-out 0.2s; }

.li_actu h3 { font-family:"FaktPro-Normal"; font-size:20px; text-transform:uppercase; }
.slide-real .li_actu div { margin: 5px 20px 10px; }
.slide-real .li_actu h3.titre-real-home { margin:0; padding:0; }
.slide-real .li_actu div:before { top:-60px;}
.slide-real .li_actu:hover div:before { top:-70px; }

.link-gallery { width:100%; height:100%; padding-bottom:70%; position: relative; overflow: hidden; display: block;  box-shadow: 0px 0px 20px -10px rgba(0,0,0,0.3); border:10px solid #fff; }
.img-gallery { max-width:100%; height:auto; position:absolute; display:block; top:50%; transform:translateY(-50%); }
top: calc(50% - attr(height) / 2);

.items { margin:0; padding:0; }
.item { padding:0; flex: 1 0 26%; }
.item_2 { background:#fff; min-height:250px; }
.li_page { padding:20px; }
.li_page_image { position:relative; overflow:hidden; height:270px; }
.li_page_image img {position:relative; left:auto; top:auto; transform:translate(0%,0%) }

@media screen and (min-width: 1140px) {
.li_page_image img { position:absolute; left:50%; top:50%; transform:translate(-50%,-40%) }
}



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

.navbar-nav { text-align: left; }
.text-ref-top { display:none; }

}

.fx-zoom-categ {
    overflow: hidden;
		width:100%;
		height:100%;
		display:block;
}
.item:hover .fx-zoom-categ img {
    transform: scale(1.05) translate(-49%,-35%);
}
.item .fx-zoom-categ img {
    transition: filter 400ms linear,transform .3s ease-out;
    transform: scale(1) translate(-50%,-40%);
}


@media screen and (max-width: 992px) {
.container-fluid-990 { max-width:990px }
nav { font-size: 14px; }

.nav-abs { position:absolute; top:0px; right:0px; width:100%; z-index:10; padding:0; margin:0; margin-top: 0rem !important; padding-top: 0rem !important;  }
.navbar { padding:0; margin:0; background:#f5f5f5;  }
ref_top { display:none; }
.navbar-toggler { position:absolute; right:5px; top:80px; z-index:11; }

.rge_ban { text-align:right; }
.logo_rge_ban { float:none; }

.collapse, collapse.show { padding:0;  transition:all ease-in 0.2s; }
}

@media screen and (max-width: 576px) {
.text-ref-top { display:none; }
.rge_ban { text-align:left; }
.logo_rge_ban { width:60px; margin-top:10px }
}

@media screen and (max-width: 330px) {
.navbar-brand img.img-fluid {
    min-width:auto;
}

.logo_rge_ban { width:40px; margin-top:10px }

}

@media screen and (max-width: 820px) {
nav { font-size: 14px; }
}

.navbar-toggler-icon {
		display:block;
    width: 1.5em;
    height: .2em;
    vertical-align: top;
    background: #a3195b no-repeat center center;
		margin-top:0.2em;
}

.navbar-toggler {
    font-size: 1.25rem;
    line-height: 1;
		margin-top:-30px;
}

.faktNormal { font-family:"FaktPro-Normal", arial; }
.roboto { font-family:"Roboto", arial; }

.size-12 { font-size:12px; }
.size-14 { font-size:14px; }
.size-16 { font-size:16px; }
.size-18 { font-size:18px; }
.size-20 { font-size:20px; }
.size-24 { font-size:24px; }
.size-48 { font-size:48px; }

@media screen and (max-width: 992px) {
.size-16 { font-size:12px; }
.size-18 { font-size:14px; }
.size-20 { font-size:16px; }
.size-24 { font-size:20px; }
.size-48 { font-size:40px; }
}


.fill-bleu { padding:10px 10px 5px; border:2px solid #312783; margin-bottom:1rem; }
.fill-blanc { padding:10px; border:2px solid #fff; margin-bottom:1rem; }
.fill-rose { padding:10px; border:2px solid #a3195b; margin-bottom:1rem; }


@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/materialicons/v48/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -moz-font-feature-settings: 'liga';
  -moz-osx-font-smoothing: grayscale;
}

.starrating > input {display: none;}  /* Remove radio buttons */

.starrating > label
{
  color: #fff; /* Start color when not clicked */
}

.starrating > input:checked ~ label
{ color: #ffca08 ; } /* Set yellow color when star checked */

.starrating > input:hover ~ label
{ color: #ffca08 ;  } /* Set yellow color when star hover */

@media screen and (min-width: 1365px) {
.navbar-nav li:first-child { margin-left:-130px; }

}

@media screen and (min-width: 1200px) {
#collapseGradient1 { height:150px; overflow:hidden; transition:all ease-in 0.2s; }
#collapseGradient1.degrade1-hover { height:230px; }

#collapseGradient2 { height:150px; overflow:hidden; transition:all ease-in 0.2s; }
#collapseGradient2.degrade2-hover { height:210px; }




}
@media screen and (max-width: 1200px) {
.li_actu .actu_img { max-height: 200px; min-height: 200px; }

}

@media (min-width: 768px) {
   .col-md-2.point5 {
    width: 20%;
    max-width: 20%;
    flex: 0 0 20%;
	 }
}

.white-popup {
    position: relative;
    background: #FFF;
    padding: 30px;
    width: auto;
    max-width: 720px;
    margin: 20px auto;
		border-radius:20px;
}

.multi_active { text-decoration:underline; color:#312783 !important; position:relative; }
.multi_active::before { position:absolute; left:0; content: ''; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23312783' viewBox='0 0 8 8'%3E%3Cpath d='M3.75 0l-0.5 0.5 3.5 3.5-3.5 3.5 .5 .5 4-4-4-4z'/%3E%3C/svg%3E");
width: 10px;
height: 10px;
display: block;
position: absolute;
top: 40%;
transform:translateY(-50%);  }

.bg-gris.multi_active::before { top:50%; width: 12px; height: 12px; }


.v2022 {
  -moz-transform: rotate(10deg);
  -webkit-transform: rotate(10deg);
  -o-transform: rotate(10deg);
  -ms-transform: rotate(10deg);
  transform: rotate(10deg);
  border: 1px solid #fff;
  box-shadow: 0 0 0px 10px #a3195b, 0 0 20px 5px #000;
  color: #fff;
  display: flex;
  background: #a3195b;
  border-radius: 50%;
  height: 140px;
  width: 140px;
  text-align: center;
  padding: 25px 20px;
  position: absolute;
  top: 0px;
  right: 80px;
  line-height:24px;
}


.exit-modal .modal-content {
  border-radius: 0.5rem;
  border: none;
}
.exit-modal .modal-header,
.exit-modal .modal-footer {
  border: none;
}
.exit-modal .highlight {
  font-weight: bold;
}