.intro-page{
    background: url(../img/header.png) center/cover no-repeat fixed rgba(255, 255, 255, 0);
}


#lon-header .intro-fw H1 {
    margin: 0;
    padding: 2em 0;
    font-family: "K2D", Arial, sans-serif !important;
    font-size: 4em;
    text-align: center;
    color: #FFFFFF;
    text-shadow: 5px 3px 4px rgb(0 0 0 / 30%);
}

#lon-header .intro-fw-tne H1 {
    margin: 0;
    padding: 2em 0;
    font-family: "K2D", Arial, sans-serif !important;
    font-size: 4em;
    text-align: center;
    color: #FFFFFF;
    text-shadow: 5px 3px 4px rgb(0 0 0 / 30%);
}

.txt-indigo{
	color : #6826EF;	
}
	
.txt-orange{
	color : #FF7F00;	
}

.txt-violet{
	color : #A711C9;
}

.txt-jaune{
	color : #FFCE00;	
}
	
.txt-turquoise{
	color : #11C2C9;	
}

.txt-rouge{
	color : #D03100;
}

.txt-blanc{
	color : #FFFFFF;
}

.txt-gris{
	color : #CBCBCB;
}

.txt-anthracite{
	color : #3B3B3B;
}

#saviezvous p{
	color:#ffffff !important;
}

.opacity-50{
	opacity:0.50;
}

.fond-vert{
    background-color: #92c474;
    color: #ffffff !important;
    border-radius: 10px;
	padding:20px;
}

.txt-vert{
color:#407c40;
}

.txt-marron{
color:#735a42;
}

.radius{
		border-radius:10px;
}

.pointer{
		cursor:pointer;
}

.bg-indigo {
    background-color: #6826EF !important;
    border-radius: 10px !important;
    padding: 20px !important;
    margin: 0 0 10px 0 !important;
}

.bg-orange {
    background-color: #FF7F00 !important;
    border-radius: 10px !important;
    padding: 20px !important;
    margin: 0 0 10px 0 !important;
}

.bg-violet {
    background-color: #A711C9 !important;
    border-radius: 10px !important;
    padding: 20px !important;
    margin: 0 0 10px 0 !important;
}

.bg-jaune {
    background-color: #FFCE00 !important;
    border-radius: 10px !important;
    padding: 20px !important;
    margin: 0 0 10px 0 !important;
}

.bg-turquoise {
    background-color: #11C2C9 !important;
    border-radius: 10px !important;
    padding: 20px !important;
    margin: 0 0 10px 0 !important;
}

.bg-rouge {
    background-color: #D03100 !important;
    border-radius: 10px !important;
    padding: 20px !important;
    margin: 0 0 10px 0 !important;
}

.bg-blanc {
    background-color: #FFFFFF !important;
	border : 1px solid #CBCBCB;
    border-radius: 10px !important;
    padding: 20px !important;
    margin: 0 0 10px 0 !important;
}

.bg-gris {
    background-color: #CBCBCB !important;
    border-radius: 10px !important;
    padding: 20px !important;
    margin: 0 0 10px 0 !important;
}

.bg-anthracite {
    background-color: #3B3B3B !important;
    border-radius: 10px !important;
    padding: 20px !important;
    margin: 0 0 10px 0 !important;
}

.width90{
		width:90%;
}

.width80{
		width:80%;
}

.width70{
		width:70%;
}

.width60{
		width:60%;
}

.width50{
		width:50%;
}

.height200{
		min-height:200px;
}

.height300{
		min-height:300px;
}

.height400{
		min-height:400px;
}

.height500{
		min-height:500px;
}

.margin-auto{
		 margin-left:auto !important;
		 margin-right:auto !important;
}

.shadowed {
    box-shadow: 0 7px 14px rgb(160 160 160 / 80%);
}

@media (max-width: 768px) {

#lon-header .intro-fw H1{
	font-size:2em;
}
}

/*MENU ANCRE*/

.menu-manuel ul li {
    display: inline-block !important;
    list-style: none !important;
}

#menu.fixed {
	position: fixed;
	top: 0;
	z-index: 99;
	background-color: #FFFFFF;
	/*+box-shadow: 0 8px 20px 0 rgba(136, 136, 136, 0.25);*/
	-moz-box-shadow: 0 8px 20px 0 rgba(136, 136, 136, 0.25);
	-webkit-box-shadow: 0 8px 20px 0 rgba(136, 136, 136, 0.25);
	box-shadow: 0 8px 20px 0 rgba(136, 136, 136, 0.25);
	padding: 8px;
}

#menu.fixed UL {
	padding: 0;
	margin: 0;
}


/* Back to top */

@media (min-width:900px) {
	.menu-manuel {}
}

.menu-manuel {
	padding: 1em;
	min-height: 3em;
}

.menu-manuel>UL {
	transition: max-height 0.25s linear;
}

.menu-manuel UL {
	margin: 0;
	padding: 0;
	text-align: center;
}

.menu-manuel LI {
	transition: visibility 0.25s linear;
	display: inline-block;
	padding: 0;
	margin: 0;
	position: relative;
}

.menu-manuel LI A {
	display: inline-block;
	background-color: #435D7B !important;
	color: #F5F5F5 !important;
	font-weight: 500;
	margin: 8px 0;
	padding: 16px;
	position: relative;
	text-decoration: none !important;
	text-transform: uppercase;
	transition: visibility 0.25s linear;
	font-size: 12px;
}

.menu-manuel LI A:hover {
	background-color: #D8325C !important;
	color: #F5F5F5 !important;
}

@media (min-width:651px) {
	.menu-manuel LI UL {
		display: none;
		position: absolute;
		top: 100%;
		margin-top: 1px;
		left: -1px;
		right: -1px;
	}
	.menu-manuel {}
	.menu-manuel LI:hover UL {
		display: block;
	}
	.menu-manuel LI LI {
		margin: -1px 0 0 0;
		box-sizing: border-box;
		width: 100%;
	}
}

@media (max-width:768px) {
	#lon-header .intro-fw H1{
		font-size:2em;
	}
	.menu-manuel>UL {
		max-height: 0;
		overflow: hidden;
		margin: 0 1em;
	}
	.menu-manuel LI {
		visibility: hidden;
		display: block;
		padding: 0.25em;
	}
	.menu-manuel LI A {
		transition: visibility 0.25s linear;
		display: inline-block;
		padding: 0.5em;
		margin: 0.25em;
		position: relative;
		text-decoration: none;
		width: 100%;
		border: 1px solid rgba(67, 93, 123, 0.112);
	}
	.menu-manuel LI UL {
		margin-top: 0.5em;
		border-left: 1px solid #000;
	}
	.menu-manuel .navbar-manuelhandle {
		display: block;
		color: #435D7B;
	}
	.menu-manuel .navbar-manueltitle {
		display: block !important;
		color: #435D7B;
		font-family: "K2D", Arial, sans-serif !important;
	}
	#navbar-manuelcheckbox:checked+.menu-manuel UL {
		max-height: 800px;
		margin: 32px 0px;
	}
	#navbar-manuelcheckbox:checked+.menu-manuel LI {
		visibility: visible;
	}
	#navbar-manuelcheckbox:checked+.menu-manuel .navbar-manuelhandle,
	#navbar-manuelcheckbox:checked+.menu-manuel .navbar-manuelhandle:after,
	#navbar-manuelcheckbox:checked+.menu-manuel .navbar-manuelhandle:before {
		border-color: #DA325C;
	}
	.menu-manuel {
		background-color: #F4F4F4;
		border-bottom: 1px solid rgba(197, 197, 197, 0.491);
	}
}

.navbar-manuelcheckbox {
	display: none;
}

.navbar-manuelhandle {
	display: none;
	cursor: pointer;
	position: relative;
	font-size: 45px;
	padding: 0.5em 0;
	height: 0;
	width: 1.66666667em;
	border-top: 3px solid;
}

.navbar-manuelhandle:before,
.navbar-manuelhandle:after {
	position: absolute;
	left: 0;
	right: 0;
	content: ' ';
	border-top: 3px solid;
}

.navbar-manuelhandle:before {
	top: 0.37777778em;
}

.navbar-manuelhandle:after {
	top: 0.88888889em;
}

.menu-manuel {
	top: 0;
	left: 0;
	right: 0;
}

.menu-manuel .navbar-manuelhandle {
	position: absolute;
	font-size: 1em;
	top: 1em;
	right: 1em;
	z-index: 10;
}

.menu-manuel .navbar-manueltitle {
	position: absolute;
	top: 1em;
	left: 1em;
	z-index: 10;
	display: none;
	font-weight: 600;
}

a.btn {
    display:block;
}

a.btn:visited {
    color: #ffffff !important;
}


/*+clearfix {*/

body {
	font-size: 1.5rem;
}

.flex-div{
	display: flex;
}

.content .node-page .content {
	max-width: 100%;
	padding-top: 0;
}

/*.content .node-page .content ul li {
	display: list-item;
	list-style: square;
	font-size: 16px;
}*/

.content .node-page .content ul li::before {
	/*border-radius: 0;
    width: 4px;
    height: 4px;
    margin-top: 7px;
    margin-right: 12px;
    background-color: #000;*/
	content: none;
}


.content .node-page .content h4,
.content .node-page .content h3 {
	border-bottom: 0;
	border: none;
}

.content .node-page .content h4::after,
.content .node-page .content h3::after {
	border-bottom: 0;
}



@media (max-width:992px) {

	.hide{
		display:none !important;
	}
	#lon-content .intro H2{
		font-size: 18px !important;
	}
	#lon-content P{
		font-size: 14px !important;
	}	
	#lon-content ul.dots li {
		font-size: 14px !important;
	}	
	
	#lon-content ul li{
		font-size: 14px !important;		
	}
	
}



#lon-content H2 {
	padding: 0;
	margin: 0;
	font-family: "K2D", Arial, sans-serif !important;
	font-size: 3em;
	color: #435D7B;
	position: relative;
	font-weight: 400;
}

#lon-content H3 {
	font-size: 32px;
	font-weight: bolder;
}

#lon-content H2::after {
	content: none;

}

#lon-content H4 {
	font-size: 26px;
	font-weight: 400;
}

#lon-content P {
	line-height: 1.8em;
	font-size: 20px;
	padding: 0 0 0.5em 0;
	margin: 0;
	font-weight: 300;
}

#lon-content P.bleu {
	background-color: #e2e9fb !important;
    border-radius: 10px !important;
    padding: 20px !important;
	margin : 0 0 10px 0 !important;
	color : #000000 !important;
}

#lon-content P.vert {
	background-color: #e2fbe7 !important;
    border-radius: 10px !important;
    padding: 20px !important;
	margin : 0 0 10px 0 !important;
	color : #000000 !important;	
}

#lon-content P.rouge {
	background-color: #fbe4e2 !important;
    border-radius: 10px !important;
    padding: 20px !important;
	margin : 0 0 10px 0 !important;
	color : #000000 !important;	
}

#lon-content P.jaune {
	background-color: #fafbe2 !important;
    border-radius: 10px !important;
    padding: 20px !important;
	margin : 0 0 10px 0 !important;
	color : #000000 !important;	
}

#lon-content P.violet {
	background-color: #f3e2fb !important;
    border-radius: 10px !important;
    padding: 20px !important;
	margin : 0 0 10px 0 !important;
	color : #000000 !important;	
}

#lon-content P.orange {
	background-color: #fbe5d6 !important;
    border-radius: 10px !important;
    padding: 20px !important;
	margin : 0 0 10px 0 !important;
	color : #000000 !important;	
}

#lon-content .intro ul{
	
}

#lon-content ul li, #lon-content ol li{
	line-height: 1.8em;
   font-size: 16px;
    padding-top: 0;
    padding-bottom: 0;
	margin: 0 0 5px 0;
    font-weight: 300;	
}

#lon-content ul.dots li{
font-size: 16px;	
}

#lon-content ul li a{
	color:#000;
	text-decoration:none;
}

#lon-content ul li a:hover{
	color:#000;
	text-decoration:underline;
}

#lon-content.gris {
    background-color: #F4F4F4;
}

#lon-content.blanc {
    background-color: #ffffff;
}

#lon-content ul.dots li::before,
#lon-content .intro ul.round li::before {
    content: '';
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-top: 5px;
    margin-right: 8px;
    background-color: #D8325C;
}	

#lon-content .intro ul.dots li::before {
    content: "\00BB \0020";
    animation: colorchange 5s;
    -webkit-animation: colorchange 5s;
    animation-iteration-count: infinite;
    width: 0;
    height: 0;
    font-size: 16px;
    font-weight: bold;
    margin-right: 17px;
}

.cadre-bleu{
border: 4px solid #435D7B;
    padding: 30px;
	
}

.cadre-rouge{
border: 4px solid #D8325C;
    padding: 30px;	
}

.rouge{
    color: #D8325C;	
}
.bleu{
    color: #435D7B;	
}

.vert{
    color: #d6df23;	
}

.padding-left-10{
	padding-left:10px;
}
.padding-left-20{
	padding-left:20px;
}
.padding-left-30{
	padding-left:30px;
}
.padding-left-40{
	padding-left:40px;
}
.padding-left-50{
	padding-left:50px;
}
.margin-top-10{
	margin-top:10px;
}
.margin-top-20{
	margin-top:20px;
}
.margin-top-30{
	margin-top:30px;
}
.margin-top-40{
	margin-top:40px;
}
.margin-top-50{
	margin-top:50px;
}
.margin-left-10{
	margin-left:10px;
}
.margin-left-20{
	margin-left:20px;
}
.margin-left-30{
	margin-left:30px;
}
.margin-left-40{
	margin-left:40px;
}
.margin-left-50{
	margin-left:50px;
}
.size-50{
	width:50%;
}
.size-60{
	width:60%;
}
.size-70{
	width:70%;
}
.size-80{
	width:80%;
}
.size-90{
	width:90%;
}
.display-inline{
	display:inline !important;
}
.display-block{
	display:block !important;
}
.display-inlineblock{
	display:inline-block !important;
}

IMG.couv{
	width: 100%;
    display: block;
    margin: auto;	
}

SPAN.rouge{
	color: #fff;
    background-color: #D8325C;
}


SPAN.rouge:hover { background-color: #435D7B; }

SPAN.vert{
	color: #fff;
    background-color: #d6df23;
}

SPAN.vert:hover { background-color: #435D7B; }

SPAN.orange{
	color: #fff;
    background-color: #f15a23;
}

SPAN.orange:hover { background-color: #435D7B; }


SPAN.vignette{
	text-transform: uppercase;
    padding: 8px 10px;
-moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; -webkit-transition: 0.4s; -moz-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; 
    display: inline-block;
    line-height: 20px;
    text-align: center;
}




#lon-content .text-center {
	text-align: center;
}

#lon-content .text-left {
	text-align: left;
}

#lon-content .text-right {
	text-align: right;
}

#lon .bouton {
	padding: 8px 15px 8px 16px;
	color: #FFFFFF;
	background-color: #D8325C;
	text-decoration: none;
	display: inline-block;
	margin-top: 8px;
	margin-bottom: 8px;
}

#lon .bouton:hover {
	box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.25);
	opacity: 0.8;
	text-decoration: underline;
}


.nav p{
		font-weight:bold !important;
		font-size: 14px !important;
}
.nav a{
	color:#435D7B;
	text-decoration:none;
}

.nav a:hover{
		color:#435D7B;
	text-decoration:underline;
}
  .indicator{
position: relative;
    width: 30px;
    height: 30px;
    transform: rotate(45deg);
margin: 30px auto auto auto;
  }
    .indicator span{
      position:absolute;
      left:0;
      top:0;
      width:18px;
      height:18px;
      box-sizing:border-box;
      border:none;
      border-bottom:3px solid #fff;
      border-right:3px solid #fff;
      animation:animate 1s linear infinite;
	}
	
    .indicator span.round{
		width:10px !important;
		height:10px !important;	
		border: 1px solid #fff !important;
		border-radius: 10px !important;
		background-color: #435D7B !important;
	}	
      .indicator span:nth-child(1){
        top:-20px;
        left:-20px;
        animation-delay:0s;
      }
      .indicator span:nth-child(2){
        top:-10px;
        left:-10px;
        animation-delay:0.2s;
      }
      .indicator span:nth-child(3){
        top:0;
        left:0;
        animation-delay:0.4s;
      }
      /*.indicator span:nth-child(4){
        top:15px;
        left:15px;
        animation-delay:0.6s;
      }
      .indicator span:nth-child(5){
        top:30px;
        left:30px;
        animation-delay:0.8s;
      }*/
  

@keyframes animate{
  0%{
    border-color:#435D7B;
    transform:translate(0,0);
  }
   20%{
    border-color:#435D7B;
     transform:translate(10px,10px);
  }
   20.1%,100%{
    border-color:#435D7B;
  }
}


.wrapp-flex{
    /*width: 100%;*/
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;  
}
/*
.one{
    float: left;
    background: red;
    width: 22%;
    height:100px; 
}

.two{
    float: right;
    background: blue;
    width: 56%;
    height:100px; 
}*/

@media only screen and (max-width: 768px){
	img.shrink{
			width:50% !important;
	}
    .one{
        -webkit-order: 2;
        -ms-order: 2;     
        order: 2;
        width: 100%;
	}
	.two{
		-webkit-order: 1;
		-ms-order: 1;     
		order: 1;
		width: 100%;
	}
	.iframe-video{
		width:100% !important;
		height:340px !important;
	}
	.size-70{
		width:100% !important;
	}
	#lon-content H1, #lon-content H2{
		font-size: 32px !important;
	}
	
#lon-header .intro-fw H1 {
    font-size: 1.5em;
}	

.flex-div{
	display: block;
}	

}

/* Back to top */

@media (min-width:651px) {
	
}

@media (max-width:768px) {
	
}


/* SLICK SLIDER */


.slick-slider .slick-dots li.slick-active button {
    background-color: #D8325C;
}

.slick-slider img {
    width: 90%;
	margin: auto;	
}

.slick-slider .slick-arrow {
    -webkit-background-size: 14px 14px;
    background-size: 14px 14px;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transition: all ease-out 0.3s;
    -o-transition: all ease-out 0.3s;
    transition: all ease-out 0.3s;
    position: absolute;
    top: -webkit-calc(50% - 35px);
    top: calc(50% - 35px);
    height: 30px;
    width: 30px;
    border: 3px solid #524F4F;
    border-radius: 50%;
    background-color: #FFFFFF;
    opacity: 0.5;
    -webkit-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    transform: translate(0,-50%);
    z-index: 1;
}

.slick-slider .slick-arrow.slick-prev {
    background-image: url(/sites/all/themes/bordas2019/assets/images/arrow_slider_l.svg);
    background-repeat: no-repeat;
    left: 10px;
}

.slick-slider .slick-arrow.slick-next {
    background-image: url(/sites/all/themes/bordas2019/assets/images/arrow_slider_r.svg);
    background-repeat: no-repeat;
    right: 10px;
}