.reinitialise {
animation : none;
animation-delay : 0;
animation-direction : normal;
animation-duration : 0;
animation-fill-mode : none;
animation-iteration-count : 1;
animation-name : none;
animation-play-state : running;
animation-timing-function : ease;
backface-visibility : visible;
background : 0;
background-attachment : scroll;
background-clip : border-box;
background-color : transparent;
background-image : none;
background-origin : padding-box;
background-position : 0 0;
background-position-x : 0;
background-position-y : 0;
background-repeat : repeat;
background-size : auto auto;
border : 0;
border-style : none;
border-width : medium;
border-color : inherit;
border-bottom : 0;
border-bottom-color : inherit;
border-bottom-left-radius : 0;
border-bottom-right-radius : 0;
border-bottom-style : none;
border-bottom-width : medium;
border-collapse : separate;
border-image : none;
border-left : 0;
border-left-color : inherit;
border-left-style : none;
border-left-width : medium;
border-radius : 0;
border-right : 0;
border-right-color : inherit;
border-right-style : none;
border-right-width : medium;
border-spacing : 0;
border-top : 0;
border-top-color : inherit;
border-top-left-radius : 0;
border-top-right-radius : 0;
border-top-style : none;
border-top-width : medium;
bottom : auto;
box-shadow : none;
box-sizing : content-box;
caption-side : top;
clear : none;
clip : auto;
color : inherit;
columns : auto;
column-count : auto;
column-fill : balance;
column-gap : normal;
column-rule : medium none currentColor;
column-rule-color : currentColor;
column-rule-style : none;
column-rule-width : none;
column-width : auto;
content : normal;
counter-increment : none;
counter-reset : none;
cursor : auto;
direction : ltr;
display : inline;
empty-cells : show;
float : none;
font-family : inherit;
font-size : medium;
font-style : normal;
font-variant : normal;
font-weight : normal;
height : auto;
hyphens : none;
left : auto;
letter-spacing : normal;
line-height : normal;
list-style : none;
list-style-image : none;
list-style-position : outside;
list-style-type : disc;
margin : 0;
margin-bottom : 0;
margin-left : 0;
margin-right : 0;
margin-top : 0;
max-height : none;
max-width : none;
min-height : 0;
min-width : 0;
opacity : 1;
outline : 0;
outline-color : invert;
outline-style : none;
outline-width : medium;
overflow : visible;
overflow-x : visible;
overflow-y : visible;
padding : 0;
padding-bottom : 0;
padding-left : 0;
padding-right : 0;
padding-top : 0;
page-break-after : auto;
page-break-before : auto;
page-break-inside : auto;
perspective : none;
perspective-origin : 50% 50%;
position : static;
/* Vous devrez modifier les quotes selon le langage de la page (ici il s'agit du Langage Français) */
quotes : '\201C' '\201D' '\2018' '\2019';
right : auto;
tab-size : 8;
table-layout : auto;
text-align : inherit;
text-align-last : auto;
text-decoration : none;
text-decoration-color : inherit;
text-decoration-line : none;
text-decoration-style : solid;
text-indent : 0;
text-shadow : none;
text-transform : none;
top : auto;
transform : none;
transform-style : flat;
transition : none;
transition-delay : 0s;
transition-duration : 0s;
transition-property : none;
transition-timing-function : ease;
unicode-bidi : normal;
vertical-align : baseline;
visibility : visible;
white-space : normal;
width : auto;
word-spacing : normal;
z-index : auto;
}
@font-face{
font-family:"Abril_Fatface";
src:url('../fonts/Abril_Fatface/AbrilFatface-Regular.ttf') format('ttf');
src:local('Abril_Fatface'),local('Abril_Fatface'),url('../fonts/Abril_Fatface/AbrilFatface-Regular.ttf');
}
@font-face{
font-family:"adriatica";
src:url('../fonts/adriatica/Adriatica.ttf') format('ttf');
src:local('adriatica'),local('adriatica'),url('../fonts/adriatica/Adriatica.ttf');
}
@font-face{
font-family:"bangers";
src:url('../fonts/bangers/Bangers.ttf') format('ttf');
src:local('bangers'),local('bangers'),url('../fonts/bangers/Bangers.ttf');
}
@font-face{
font-family:"Courgette";
src:url('../fonts/Courgette/Courgette-Regular.ttf') format('ttf');
src:local('Courgette'),local('Courgette'),url('../fonts/Courgette/Courgette-Regular.ttf');
}
@font-face{
font-family:"Didact_Gothic";
src:url('../fonts/Didact_Gothic/DidactGothic-Regular.ttf') format('ttf');
src:local('Didact_Gothic'),local('Didact_Gothic'),url('../fonts/Didact_Gothic/DidactGothic-Regular.ttf');
}
@font-face{
font-family:"DRIVE-TH";
src:url('../fonts/drive/DRIVE-TH.TTF') format('ttf');
src:local('drive'),local('drive'),url('../fonts/drive/DRIVE-TH.TTF');
}
@font-face{
font-family:"FontLabSource";
src:url('../fonts/Font Lab Source/Lobster 1.4 merged and optimized.vfb') format('vfb');
src:local('FontLabSource'),local('FontLabSource'),url('../fonts/Font Lab Source/Lobster 1.4 merged and optimized.vfb');
}
@font-face{
font-family:"Indie_Flower";
src:url('../fonts/Indie_Flower/IndieFlower-Regular.ttf') format('ttf');
src:local('Indie_Flower'),local('Indie_Flower'),url('../fonts/Indie_Flower/IndieFlower-Regular.ttf');
}
@font-face{
font-family:"Lighthouse";
src:url('../fonts/Lighthouse/Lighthouse_PersonalUse.ttf') format('ttf');
src:local('Lighthouse'),local('Lighthouse'),url('../fonts/Lighthouse/Lighthouse_PersonalUse.ttf');
}
@font-face{
font-family:"Lobster";
src:url('../fonts/Lobster/Lobster-Regular.ttf') format('ttf');
src:local('Lobster'),local('Lobster'),url('../fonts/Lobster/Lobster-Regular.ttf');
}
@font-face{
font-family:"Lobster_Two";
src:url('../fonts/Lobster_Two/Lobster-Regular.ttf') format('ttf');
src:local('Lobster_Two'),local('Lobster_Two'),url('../fonts/Lobster_Two/LobsterTwo-Regular.ttf');
}
@font-face{
font-family:"MonteCarlo";
src:url('../fonts/MonteCarlo/MonteCarlo-Regular.ttf') format('ttf');
src:local('MonteCarlo'),local('MonteCarlo'),url('../fonts/MonteCarlo/MonteCarlo-Regular.ttf');
}
@font-face{
font-family:"Orbitron";
src:url('../fonts/Orbitron/Orbitron-VariableFont_wght.ttf') format('ttf');
src:local('Orbitron'),local('Orbitron'),url('../fonts/Orbitron/Orbitron-VariableFont_wght.ttf');
}
@font-face{
font-family:"Passion_One";
src:url('../fonts/Passion_One/PassionOne-Regular.ttf') format('ttf');
src:local('Passion_One'),local('Passion_One'),url('../fonts/Passion_One/PassionOne-Regular.ttf');
}
@font-face{
font-family:"Permanent_Marker";
src:url('../fonts/Permanent_Marker/PermanentMarker-Regular.ttf') format('ttf');
src:local('Permanent_Marker'),local('Permanent_Marker'),url('../fonts/Permanent_Marker/PermanentMarker-Regular.ttf');
}
@font-face{
font-family:"remarcle";
src:url('../fonts/remarcle/remarcle.ttf') format('ttf');
src:local('remarcle'),local('remarcle'),url('../fonts/remarcle/remarcle.ttf');
}
@font-face{
font-family:"Special_Elite";
src:url('../fonts/Special_Elite/SpecialElite-Regular.ttf') format('ttf');
src:local('Special_Elite'),local('Special_Elite'),url('../fonts/Special_Elite/SpecialElite-Regular.ttf');
}
@font-face{
font-family:"teamspirit";
src:url('../fonts/Teamspirit/teamspirit.ttf') format('ttf');
src:local('teamspirit'),local('teamspirit'),url('../fonts/Teamspirit/teamspirit.ttf');
}
@font-face{
font-family:"Yellowtail";
src:url('../fonts/Yellowtail/Yellowtail-Regular.ttf') format('ttf');
src:local('Yellowtail'),local('Yellowtail'),url('../fonts/Yellowtail/Yellowtail-Regular.ttf');
}
.Abril_Fatface{
    font-family:"Abril_Fatface";
}
.adriatica{
    font-family:"Abril_Fatface";
}
.Arial{
    font-family:"Arial";
}
.ArialBlack{
    font-family:"Arial black";
}
.Bangers{
    font-family:"bangers";
}
.BookmanOldStyle{
    font-family:"Bookman Old Style";
}
.ComicSansMS{
    font-family:"Comic Sans MS";
}
.Courgette{
    font-family:"Courgette"; 
}
.CourierNew{
    font-family:"Courier New";
}
.Didact_Gothic{
    font-family:"Didact_Gothic";
}
.DRIVE-TH{
    font-family:"DRIVE-TH";
}
.FontLabSource{
    font-family:"FontLabSource";
}
.Garamond {
    font-family:"Garamond";
}
.Georgia{
    font-family:"Georgia";
}
.Helvetica{
    font-family:"Helvetica";
}
*, *:after, *:before { box-sizing: border-box; }
body, html { font-size:medium; padding: 0px; margin: 0px;}


.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

.flou{
filter: blur(3px);
}
i{
font-style:italic;
}
b{
font-weight:bold;
}
h1{
    font-size:xxx-large;
}
h2{
    font-size:xx-large;
}
h3{
    font-size:x-large;
}
h4{
    font-size:large;
}
h5{
    font-size:medium;
}
p{
    font-size:medium;
    text-align:justify;
    text-indent:15px;
}
label{
    font-size:large;
}
span{
    font-size:medium;
}
a {
color:inherit;
border:none;
text-decoration: none;
}
.paragraphe{
    text-align:justify;
    text-indent:1.5em;
}
@media screen and (max-width: 500px) {

}
#box_log{
    width:80%;
    margin: auto;
    text-align:center;
    background-color:#222;
    border-radius:10px;
    padding:10px;
    border:2px solid #000;
    color:#efefef;
}
#box_log h1{
    font-size:xx-large;
    color:#0b7603;    
}
#box_log input[type=pseudo],#box_log input[type=nom], #box_log input[type=prenom]{
padding: 8px 10px;
font-size: medium;
border: 3px solid #0b7603;
background-color: #000;
color: white;
margin:0px auto;
border-radius:50px;
text-align: center;
display:block;
}
#box_log input::placeholder{
    color:#FFF;
}
/*------------------------------------------------*/
/*----------------BLOQUEUR DE PUB-----------------*/
/*------------------------------------------------*/
#blocadds{
    position: fixed;
    z-index: 1000;
    top: 40%;
    text-align: center;
    height: 150px;
    padding: 30px;
    background-color: #000;
    color: red;
    font-weight: bold;
    border:2px solid #0b7603;
    border-radius: 5px; 
}
/*------------------------------------------------*/
/*--------------------LOADER----------------------*/
/*------------------------------------------------*/


.background-loader{
    display: block;
    margin: auto;
    position: fixed;
    z-index: 5;
    width:10vw;
    margin:45vh 45vw;
}
.lds-ring {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-ring div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 35px;
  height: 35px;
  border: 8px solid #0b7603;
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: #0b7603 transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
  animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
  animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
  animation-delay: -0.15s;
}
@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}










#loader_line{
display:block;
position:relative;
margin:auto;
padding:0px;
width:100%;
}
#loader_line span{
display: none;
vertical-align:middle;
}
#loader_center{
    display:block;
    width:100%;
    height:100vh;
}
.loader{
position: fixed;
width: 50vw;
left: 0;
top:0;
margin:60vh 25vw;
z-index: 5000;
justify-content: center;
align-items: center;
text-align:center;
overflow:hidden;
}
.loader span{
line-height:1;
vertical-align:middle;
display:inline-block;
position:relative;
height:80px;
font-size: xxx-large;
color:#0b7603;
}


#point:after{
color:white;
}
.horizontal_effet{
color:#0b7603;
animation: horizontal 5s infinite;
}
@keyframes horizontal {
    from, to { color: #0b7603; }
    10%      { color: #90B808 }
    20%      { color: #FFD100; }
    30%      { color: #FF0000; }
    40%      { color: #FF0074; }
    50%      { color: #BD00FF; }
    60%      { color: #4600FF; }
    70%      { color: #006CFF; }
    80%      { color: #00D4FF; }
    90%      { color: #00FF8F; }
}




.effet {
display: block;
vertical-align:middle;
position: relative;
width: 80px;
height: 80px;
margin:auto;
}
.effet:after {
content: " ";
display: block;
border-radius: 50%;
width: 0px;
height: 0px;
margin: 8px;
box-sizing: border-box;
border: 32px solid #0b7603;
border-color: #0b7603 transparent #0b7603 transparent;
animation: effet 5s infinite;
}

@keyframes effet {
from,to{color:#0b7603;}
0% {
transform: rotate(0);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
10%      { border: 32px solid #90B808; border-color: #90B808 transparent #90B808 transparent;}
20%      { border: 32px solid #FFD100; border-color: #FFD100 transparent #FFD100 transparent;}
30%      { border: 32px solid #FF0000; border-color: #FF0000 transparent #FF0000 transparent;}
40%      { border: 32px solid #FF0074; border-color: #FF0074 transparent #FF0074 transparent;}
50% {
border: 32px solid #BD00FF; border-color: #BD00FF transparent #BD00FF transparent;
transform: rotate(900deg);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
60%      { border: 32px solid #4600FF; border-color: #4600FF transparent #4600FF transparent; }
70%      { border: 32px solid #006CFF; border-color: #006CFF transparent #006CFF transparent; }
80%      { border: 32px solid #00D4FF; border-color: #00D4FF transparent #00D4FF transparent; }
90%      { border: 32px solid #00FF8F; border-color: #00FF8F transparent #00FF8F transparent; }
100% {
transform: rotate(1800deg);
}
}
.lettre{
color:#0b7603;
font-size:80px;
letter-spacing:15px;
margin-bottom:150px;
animation:flash 1.2s linear infinite;
}
@keyframes flash{
0%{
color :chartreuse;
text-shadow: 0 0 7px chartreuse;
}
90%{
color:#484848;
text-shadow:none;
}
100%{
color :chartreuse;
text-shadow: 0px 0px 7px chartreuse;
}
}
.lettre:nth-child(1){
animation-delay:0.1s;
}
.lettre:nth-child(2){
animation-delay:0.2s;
}
.lettre:nth-child(3){
animation-delay:0.3s;
}
.lettre:nth-child(4){
animation-delay:0.4s;
}
.lettre:nth-child(5){
animation-delay:0.5s;
}
.lettre:nth-child(6){
animation-delay:0.6s;
}
.lettre:nth-child(7){
animation-delay:0.7s;
}
.lettre:nth-child(8){
animation-delay:0.8s;
}
.lettre:nth-child(9){
animation-delay:0.9s;
}
.lettre:nth-child(10){
animation-delay:1s;
}
.fondu-out{
opacity:0;
transition: opacity 0.4s ease-out;
}
#space-editeur .button_close{
    border:1px solid #666;
    right: 0px;
    z-index: 5;
    position:fixed;
    margin-left:-3px;
    height:35px;
    background-color:#000;
    color:white;
    font-size:medium;
    position:fixed;
    margin-top:-40px;
    border-bottom:0;
}
#colorchange_space{
    width:100%;
    display: block;
    background-color: #000;
    border: 1px solid #666;
    position: fixed;
    top: 50px;
    z-index: 4;
    max-height:90vh;
    overflow-y:scroll;
    padding:5px;
}
#colorchange_space .button_close{
    border:1px solid #666;
    right: 0px;
    z-index: 5;
    position:fixed;
    margin-left:-3px;
    height:35px;
    background-color:#000;
    color:white;
    font-size:medium;
    position:fixed;
    margin-top:-40px;
    border-bottom:0;
}
/*---------------------Fin du loader---------------------------------- */

/*---------------------NUANCIER & IMG ---------------------------------*/
#titrenuancier {
    width: 100%;
    text-align: center;
    padding-top:5px;
}
#titrenuancier h1
{
text-decoration:underline;
line-height: initial;
color:#0b7603;
font-size: x-large;
text-align:center;
}
#divnuancier-der{
    color:white;
    border:1px solid #666;
    border-radius:10px;
    height: auto;
    overflow: hidden;
    display:inline-block;
    width:100%;
    margin: 0 0 -4px -4px;
    padding: 15px;
    margin: 10px auto;
}
#divnuancier-der h2
{
font-size:100%;
text-decoration:underline;
line-height: initial;
color:#0b7603;
text-align:center;
}
#divnuancier
{
color:white;
border: 1px solid #666;
border-radius:10px;
border-collapse:collapse;
overflow: hidden;
font-size:medium;
width:100%;
display:inline-block;
margin: 0;
padding: 15px;
margin: 10px auto;
}
#divnuancier h1
{
text-decoration:underline;
line-height: initial;
color:#0b7603;
text-align:center;
font-size:x-large;
}
#divnuancier h2
{
text-decoration:underline;
line-height: initial;
color:#0b7603;
font-size:large;
text-align:center;
}
#divnuancier h3
{
text-decoration:underline;
line-height: initial;
color:#0b7603;
font-size:medium;
text-align:left;
}
#divnuancier select{
    background-color: #555;
    font-size: medium;
    color: #FFF;
    border: 1px solid #FFF;
}

/*---------------------QCM---------------------*/
#qcm{
    position: fixed;
    top: 190px;
    padding:30px;
    width: 100%;
    margin: 0px;
    z-index: 4; 
}
#form_qcm input{
    font-size:medium;
}
/*----------------------CARROUSEL-------------*/
#carrousel{
    position: fixed;
    top: 190px;
    width: 100%;    
    margin: 0;
    padding:10px;
    z-index: 4;
    height:auto;
    overflow:scroll;
}
#img_carrousel{
    overflow: scroll;
    display: inline-flex;
    height: 450px;
}
/* Animation */
@keyframes scroll {
	0% { transform: translateX(0); }
	100% { transform: translateX(calc(-337.5px * 6))}
    from{ margin-left:-20%;}
    to{ margin-left: calc(337.5px * 6)}
}
@-webkit-keyframes move {
  0% {
    margin-left: -400px;
  }
  100% {
    margin-left: 800px;
  }
}
#img_carrousel_infini,#img_carrousel_infini_cadre,#img_carrousel_infini_cadre2,
#img_carrousel_infini_cadre3,#img_carrousel_infini_cadre4,#img_carrousel_infini_cadre5,
#img_carrousel_infini_cadre6,#img_carrousel_infini_cadre7,#img_carrousel_infini_cadre8,
#img_carrousel_infini_cadre9,#img_carrousel_infini_cadre10,#img_carrousel_infini_cadre11,
#img_carrousel_infini_cadre12,#img_carrousel_infini_cadre13,#img_carrousel_infini_cadre14,
#img_carrousel_infini_cadre15,#img_carrousel_infini_cadre16,#img_carrousel_infini_cadre17,
#img_carrousel_infini_cadre18,#img_carrousel_infini_cadre19,#img_carrousel_infini_cadre20{
    width: 100%; max-width: 1000px;overflow:hidden;margin:0px;
}
#img_carrousel_infini figure,#img_carrousel_infini_cadre figure,#img_carrousel_infini_cadre2 figure,
#img_carrousel_infini_cadre3 figure,#img_carrousel_infini_cadre4 figure,#img_carrousel_infini_cadre5 figure,
#img_carrousel_infini_cadre6 figure,#img_carrousel_infini_cadre7 figure,#img_carrousel_infini_cadre8 figure,
#img_carrousel_infini_cadre9 figure,#img_carrousel_infini_cadre10 figure,#img_carrousel_infini_cadre11 figure,
#img_carrousel_infini_cadre12 figure,#img_carrousel_infini_cadre13 figure,#img_carrousel_infini_cadre14 figure,
#img_carrousel_infini_cadre15 figure,#img_carrousel_infini_cadre16 figure,#img_carrousel_infini_cadre17 figure,
#img_carrousel_infini_cadre18 figure,#img_carrousel_infini_cadre19 figure,#img_carrousel_infini_cadre20 figure
{
  position: relative; 
  width: 500%;
  max-height:450px;
  margin: 0px;
  padding: 0px;
  font-size: 0px;
  text-align: left;
  animation: 30s slidy infinite;
  display:inline-flex;
}

#img_carrousel_infini figure a,#img_carrousel_infini_cadre figure a,#img_carrousel_infini_cadre2 figure a,
#img_carrousel_infini_cadre3 figure a,#img_carrousel_infini_cadre4 figure a,#img_carrousel_infini_cadre5 figure a,
#img_carrousel_infini_cadre6 figure a,#img_carrousel_infini_cadre7 figure a,#img_carrousel_infini_cadre8 figure a,
#img_carrousel_infini_cadre9 figure a,#img_carrousel_infini_cadre10 figure a,#img_carrousel_infini_cadre11 figure a,
#img_carrousel_infini_cadre12 figure a,#img_carrousel_infini_cadre13 figure a,#img_carrousel_infini_cadre14 figure a,
#img_carrousel_infini_cadre15 figure a,#img_carrousel_infini_cadre16 figure a,#img_carrousel_infini_cadre17 figure a,
#img_carrousel_infini_cadre18 figure a,#img_carrousel_infini_cadre19 figure a,#img_carrousel_infini_cadre20 figure a
{
    width:20%;
    display:inline-flex;
    max-height:450px;
}

#img_carrousel_infini figure a img,#img_carrousel_infini_cadre figure a img,#img_carrousel_infini_cadre2 figure a img,
#img_carrousel_infini_cadre3 figure a img,#img_carrousel_infini_cadre4 figure a img,#img_carrousel_infini_cadre5 figure a img,
#img_carrousel_infini_cadre6 figure a img,#img_carrousel_infini_cadre7 figure a img,#img_carrousel_infini_cadre8 figure a img,
#img_carrousel_infini_cadre9 figure a img,#img_carrousel_infini_cadre10 figure a img,#img_carrousel_infini_cadre11 figure a img,
#img_carrousel_infini_cadre12 figure a img,#img_carrousel_infini_cadre13 figure a img,#img_carrousel_infini_cadre14 figure a img,
#img_carrousel_infini_cadre15 figure a img,#img_carrousel_infini_cadre16 figure a img,#img_carrousel_infini_cadre17 figure a img,
#img_carrousel_infini_cadre18 figure a img,#img_carrousel_infini_cadre19 figure a img,#img_carrousel_infini_cadre20 figure a img
{
    width: 100%; max-height: 450px;margin:0px;padding:0px;float:center;position:relative;z-index:1;
}
#img_carrousel_infini_cadre figure a img { border:5px solid #FFF}
#img_carrousel_infini_cadre2 figure a img { background-image: url('../img/cadre/grass-dew-plant-sunlight-leaf-flower-1018212-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre3 figure a img { background-image: url('../img/cadre/nature-forest-grass-snow-plant-field-1294575-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre4 figure a img { background-image: url('../img/cadre/nature-grass-abstract-plant-lawn-texture-593466-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre5 figure a img { background-image: url('../img/cadre/tree-nature-grass-abstract-plant-field-1358084-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre6 figure a img { background-image: url('../img/cadre/coffee-texture-coffee-bean-produce-natural-fresh-3030-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre7 figure a img { background-image: url('../img/cadre/texture-floor-wall-stone-wall-brick-material-99030-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre8 figure a img { background-image: url('../img/cadre/plant-deck-texture-plank-leaf-fall-95-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre9 figure a img { background-image: url('../img/cadre/sea-water-ocean-horizon-texture-wave-461-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre10 figure a img { background-image: url('../img/cadre/tree-nature-grass-abstract-plant-field-1358084-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre11 figure a img { background-image: url('../img/cadre/water-texture-pattern-line-swimming-pool-blue-1130496-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre12 figure a img { background-image: url('../img/cadre/light-sky-night-star-milky-way-texture-1268143-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre13 figure a img { background-image: url('../img/cadre/coffee-black-and-white-white-photography-texture-hole-1120543-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre14 figure a img { background-image: url('../img/cadre/black-and-white-texture-tube-floor-pattern-line-874842-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre15 figure a img { background-image: url('../img/cadre/light-texture-skyscraper-pattern-line-green-83401-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre16 figure a img { background-image: url('../img/cadre/computer-man-forest-light-technology-sunlight-742594-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre17 figure a img { background-image: url('../img/cadre/tree-branch-pine-evergreen-holiday-christmas-1417898-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre18 figure a img { background-image: url('../img/cadre/leather-texture-floor-pattern-line-black-497039-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre19 figure a img { background-image: url('../img/cadre/abstract-advertismet-arrangement-art-art-and-craft-artwork-1438011-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre20 figure a img { background-image: url('../img/cadre/texture-leaf-flower-underwater-colourful-macro-569459-pxhere.com.jpg'); padding:30px;}


#img_carrousel_infini figure .oneshot,#img_carrousel_infini_cadre figure .oneshot,#img_carrousel_infini_cadre2 figure .oneshot,
#img_carrousel_infini_cadre3 figure .oneshot,#img_carrousel_infini_cadre4 figure .oneshot,#img_carrousel_infini_cadre5 figure .oneshot,
#img_carrousel_infini_cadre6 figure .oneshot,#img_carrousel_infini_cadre7 figure .oneshot,#img_carrousel_infini_cadre8 figure .oneshot,
#img_carrousel_infini_cadre9 figure .oneshot,#img_carrousel_infini_cadre10 figure .oneshot,#img_carrousel_infini_cadre11 figure .oneshot,
#img_carrousel_infini_cadre12 figure .oneshot,#img_carrousel_infini_cadre13 figure .oneshot,#img_carrousel_infini_cadre14 figure .oneshot,
#img_carrousel_infini_cadre15 figure .oneshot,#img_carrousel_infini_cadre16 figure .oneshot,#img_carrousel_infini_cadre17 figure .oneshot,
#img_carrousel_infini_cadre18 figure .oneshot,#img_carrousel_infini_cadre19 figure .oneshot,#img_carrousel_infini_cadre20 figure .oneshot
{
    width:20%;
    display:inline-flex;
    max-height:450px;
}

#img_carrousel_infini figure .oneshot img,#img_carrousel_infini_cadre figure .oneshot img,#img_carrousel_infini_cadre2 figure .oneshot img,
#img_carrousel_infini_cadre3 figure .oneshot img,#img_carrousel_infini_cadre4 figure .oneshot img,#img_carrousel_infini_cadre5 figure .oneshot img,
#img_carrousel_infini_cadre6 figure .oneshot img,#img_carrousel_infini_cadre7 figure .oneshot img,#img_carrousel_infini_cadre8 figure .oneshot img,
#img_carrousel_infini_cadre9 figure .oneshot img,#img_carrousel_infini_cadre10 figure .oneshot img,#img_carrousel_infini_cadre11 figure .oneshot img,
#img_carrousel_infini_cadre12 figure .oneshot img,#img_carrousel_infini_cadre13 figure .oneshot img,#img_carrousel_infini_cadre14 figure .oneshot img,
#img_carrousel_infini_cadre15 figure .oneshot img,#img_carrousel_infini_cadre16 figure .oneshot img,#img_carrousel_infini_cadre17 figure .oneshot img,
#img_carrousel_infini_cadre18 figure .oneshot img,#img_carrousel_infini_cadre19 figure .oneshot img,#img_carrousel_infini_cadre20 figure .oneshot img
{
    width: 100%; max-height: 450px;margin:0px;padding:0px;float:center;position:relative;z-index:1;
}
#img_carrousel_infini_cadre figure .oneshot img { border:5px solid #FFF}
#img_carrousel_infini_cadre2 figure .oneshot img { background-image: url('../img/cadre/grass-dew-plant-sunlight-leaf-flower-1018212-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre3 figure .oneshot img { background-image: url('../img/cadre/nature-forest-grass-snow-plant-field-1294575-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre4 figure .oneshot img { background-image: url('../img/cadre/nature-grass-abstract-plant-lawn-texture-593466-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre5 figure .oneshot img { background-image: url('../img/cadre/tree-nature-grass-abstract-plant-field-1358084-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre6 figure .oneshot img { background-image: url('../img/cadre/coffee-texture-coffee-bean-produce-natural-fresh-3030-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre7 figure .oneshot img { background-image: url('../img/cadre/texture-floor-wall-stone-wall-brick-material-99030-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre8 figure .oneshot img { background-image: url('../img/cadre/plant-deck-texture-plank-leaf-fall-95-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre9 figure .oneshot img { background-image: url('../img/cadre/sea-water-ocean-horizon-texture-wave-461-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre10 figure .oneshot img { background-image: url('../img/cadre/tree-nature-grass-abstract-plant-field-1358084-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre11 figure .oneshot img { background-image: url('../img/cadre/water-texture-pattern-line-swimming-pool-blue-1130496-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre12 figure .oneshot img { background-image: url('../img/cadre/light-sky-night-star-milky-way-texture-1268143-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre13 figure .oneshot img { background-image: url('../img/cadre/coffee-black-and-white-white-photography-texture-hole-1120543-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre14 figure .oneshot img { background-image: url('../img/cadre/black-and-white-texture-tube-floor-pattern-line-874842-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre15 figure .oneshot img { background-image: url('../img/cadre/light-texture-skyscraper-pattern-line-green-83401-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre16 figure .oneshot img { background-image: url('../img/cadre/computer-man-forest-light-technology-sunlight-742594-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre17 figure .oneshot img { background-image: url('../img/cadre/tree-branch-pine-evergreen-holiday-christmas-1417898-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre18 figure .oneshot img { background-image: url('../img/cadre/leather-texture-floor-pattern-line-black-497039-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre19 figure .oneshot img { background-image: url('../img/cadre/abstract-advertismet-arrangement-art-art-and-craft-artwork-1438011-pxhere.com.jpg'); padding:30px;}
#img_carrousel_infini_cadre20 figure .oneshot img { background-image: url('../img/cadre/texture-leaf-flower-underwater-colourful-macro-569459-pxhere.com.jpg'); padding:30px;}



@keyframes slidy {
  0% { left: 0%; }
  20% { left: 0%; }
  25% { left: -100%; }
  45% { left: -100%; }
  50% { left: -200%; }
  70% { left: -200%; }
  75% { left: -300%; }
  95% { left: -300%; }
  100% { left: -400%; }
}
#img_carrousel img{
    max-width:100%;
    height:450px;
}

/*-------------------CHECKBOX------------------------*/
.checkbox{
    margin: 0px;
    padding: 0px;
    display: inline-block;
    top: 40%;
    float: left;
    }
    span.checkbox::before {
    width: 27px;
    height: 27px;
    background: linear-gradient(45deg, black, transparent);
    left: -35px;
    box-sizing: border-box;
    border: 1px solid #0b7603;
    box-shadow: 2px 1px 1px #0b7603;
    border-radius: 50px;
    transition: border-color .2s;
    }
    span.checkbox:hover::before {
    background-color:#0b7603;
    border-radius:50px;
    }
    span.checkbox::after {
    content: '\f00c';
    font-family: 'FontAwesome';
    left: -31px;
    top: 2px;
    color: transparent;
    transition: color .2s;
    }
    input[type="checkbox"]:checked + label span.checkbox::after {
    color: #FFF;
    padding: 6px 0px 0px 2px;
    }





 /*----------------------MYWORD---------------------*/   
    #myword{
    position: fixed;
    top: 190px;
    width: 100%;
    left:0;
    z-index: 11;
    background-color: rgb(51, 51, 51);
    border-top:0;
    border:2px solid #999;
    overflow-y: scroll;
    height: 70vh;
    }
    #editeurdyna{
    position: fixed;
    top: 170px;
    padding-top:5px;
    width: 100%;
    z-index: 4;
    }
    #space-editeur{
    display: block;
    position: fixed;
    top: 100px;
    left:0;
    width: 100%;
    z-index: 11;
    margin:auto;
    background-color:#000;
    border:2px solid #999;
    max-height: 80vh;
    overflow: scroll;
    overflow-x: hidden;
    border-radius: 15px;
    }
    .buttonmyword
    {
    width:35px;
    font-size:medium;
    height:35px;
    display: table-cell;
    vertical-align: middle;
    margin:0 2px;
    }
    .buttonmyword i{
    font-size:21px;
    }
    input[type="color"] {
    -webkit-appearance: none;
    border: none;
    width: 35px;
    height: 35px;
    }
    input[type="color"]::-webkit-color-swatch-wrapper {
    padding: 0px;
    }
    input[type="color"]::-webkit-color-swatch {
    border: none;
    }
    .myword
    {
    background-color:#000;
    width:100%;
    padding: 5px;
    position:relative;
    z-index:200;
    }
    .mywordedit
    {
    width:90%;
    margin:auto;
    height:25vh;
    background-color:white;
    border:1px solid black;
    padding:50px 0;    
    overflow: hidden;
    overflow-y: scroll;
    color:#000;
    font-size:1.5em;
    text-align:left;
    padding:10px;
    }
    #edit-myword{
    margin:0;
    border-collapse:collapse;
    border-top:0;
    border-bottom:0;
    }
    #edit-myword button{
        color:black;
        padding:0;
        background-color:whitesmoke;
        padding: 0 5px;
        display: table-cell;
        vertical-align: middle;
        margin:0 2px;
    }
    .label-colorpicker{
    color: #000;
    background-color: #efefef;
    font-size: x-large;
    font-weight: bold;
    width:35px;
    height:35px;
    border:1px solid #767676;
    margin:0 2px;
    display:block;
    text-align: center;
    }
    .label-colorpicker img{
        margin:0 10%;
        padding:2px 0;
    }
    .label-colorpicker i{
        padding:4px 0;
    }
    #share button{
        width:35px;
        height:35px;
        display:block;
        padding:0 5px;
        font-size:25px;
        border-radius:inherit;
        background-color:#efefef;
        display:table-cell;
        vertical-align:middle;
    }
    #choice_fonts{
        display:table;
        margin:auto;        
    }
    #choice_fonts button{
        height:35px;
        display:block;
        display:table-cell;
        vertical-align:middle;
    }
    #choice_fonts button b{
        font-size:medium;
    }
    #container-colorpicker{
    position: relative;
    overflow: hidden;
    width: 35px;
    height: 35px;
    padding:0px;
    }
    #container-colorpicker button{
        width:35px;
        height:35px;
    }
    .colorpicker{
    position: absolute;
    border: none;
    width:25px;
    height:25px;
    padding:0px;
    margin:0px;
    }
/*----------------COOKIES----------------*/
.flou{
    filter: blur(3px);
    }
    #cookies{
    z-index: 1000;
    width: 90%;
    background-color: #222;
    border-radius: 2%;
    position: fixed;
    text-align: center;
    font-size:1.5em;
    box-shadow: 2px 2px 9px #000;
    margin: 0 5%;
    top: 15px;
    max-height: 90vh;
    overflow: scroll;
    }
    #cookies p{
        text-align:justify;
    }
    @media screen and (min-width:0px) and (max-width:400px) {
        #liste_cookie{
        max-width: 90%;
        }
    }
    @media screen and (min-width:400px) and (max-width:500px) {
        #liste_cookie{
        max-width: 80%;
        }
    }
    @media screen and (min-width:500px) and (max-width:600px) {
        #liste_cookie{
        max-width: 70%;
        }
    }
    @media screen and (min-width:600px) and (max-width:700px) {
        #liste_cookie{
        max-width: 60%;
        }
    }
    @media screen and (min-width:700px) and (max-width:800px) {
        #liste_cookie{
        max-width: 50%;
        }
    }
    #liste_cookie{
        margin:auto;
        display:block;
        position:relative;
        margin-bottom:25px;
    }
    #button-cookies{
    display:table;
    margin:auto;
    }
    #container_button-cookies{
        position:absolute;
        bottom:0;
        background-color:#333;
        width:100%;
        height:90px
    }
    #cookies_desc{
        display:block;
        overflow:scroll;
        max-height: 90vh;
        position: relative;
        padding:0 15px;
        padding-bottom:90px;
    }
    #cookies button{
    border:0px;
    height:57px;
    display:table-cell;
    vertical-align:middle;
    width:40%;
    }
    #cookies button span{
    margin-top:-.4em;
    }
    #cookies button .material-icons{
    font-size:1.1em;
    }
    #cookiesperso{
    position: fixed;
    height:80vh;
    top: 50px;
    z-index: 1001;
    background-color: white;
    color: #111;
    border:2px solid #999;  
    }
    #cookiesperso p{
    font-size: medium;
    text-align:justify;
    text-indent:1.5em;
    padding:15px;
    width:100%;
    }
    #cookiesperso button .material-icons{
    font-size:1.1em;
    }
    .prese-cookie-perso{
    background-color:#111;
    color:#FFF;
    margin:0px;
    text-align:center;
    padding-top:1.4em;
    }
    .prese-cookie-perso p{
        font-size:large;
    }
    .prese-cookie-perso h2{
    color:#111;
    text-align:left;
    }
    .fermercookie{
    background-color:#111;
    color:#FFF;
    position:fixed;
    border:2px solid #999;
    border-bottom:0;
    right:-5px;
    height:45px;
    font-size:1.2em;
    padding:5px;
    margin-top:-45px;
    border-radius: 0;
    }
    .cookie-presentation p{
    width:70%;
    }
    .align-cookie-perso{
    display:block;
    position:relative;
    width: 100%;
    margin: 0px;
    padding: 15px 0;
    background-color: rgb(220,220,220);
    }
    .align-cookie-perso h2{
    width:70%;
    }
    .align-cookie-perso button{
    margin:15px auto;
    font-weight:bold;
    }
    .cookie-presentation button{
    margin-right:5px;
    height:30px;
    margin-top:7px;
    background-color:rgb(160,160,160);
    border:0px;
    }
    .cookie-presentation h3{
    background-color:#111;
    color:#FFF;
    width:70%;
    padding:5px;
    }



    #nav-left{
        width:100%;
        margin:1px solid #999;
        margin-left:0;
        margin-right:0;
    }
    #my_leftnav{
        margin:0;
        padding:0;
        overflow-y: scroll;
    }


    #my_leftnav .desc{
        display:none;
    }
    #my_leftnav .active{
        display:block;
        margin-top: 10px;
    }
    #my_leftnav .active_lien{
        color:#0b7603;
        border-bottom:2px solid #0b7603;
    }
    #my_leftnav .lien{
        border-bottom:2px solid #999;
    }
    .prese-cookie-perso{
        font-size:x-large;
    }



    /*---------------Fin COOKIES--------------------*/
    .clear{
    background:none;
    color:#940000;
    border:none;
    position:relative;
    z-index:1;
    }
    .clear p{
        text-indent:0;
    }
    .retrait{
    margin-top:-25px;
    margin-left:22px;
    font-size: 50px;
    z-index: 2;
    }
    
    button p{
        text-indent:0;
    }
    
    /*-----------------PROGRESS-BAR----------------*/    
    
    /*---------------FIN-PROGRESS-BAR---------------*/
    
    .inputcomments{
            border-radius:0;
        }

/*-----------------NOTIFICATIONS----------------*/
#container_notifs{

}
#notifications{
    border-bottom:1px solid #FFF;
}#notifications h1{
    color:#FFF;
    font-size:large;
    margin:0;
}#notifications h2{
    font-size:medium;
    color:#FFF;
    margin:0;
}
.bandeau_notifications{
    border-bottom:2px solid #FFF;
    background-color:#000;
}
#mess_notif{
    display:table;
    text-align:center;
    width:auto;
    margin:auto;
}
#mess_notif img{
    display:table-cell;
    vertical-align:middle;
}
#mess_notif p{
    display:table-cell;
    vertical-align:middle;
}
.message_notif{
    display:inline-flex;
}
.title_notification{
    font-size:medium;
}
/*---------------FIN-NOTIFICATION---------------*/

/*--------------MODE EN LIGNE NEWS--------------*/
#radioclass{
width:auto;
margin:0 auto;
display:inline-flex;
}
#radioclass span{
font-size:11px;
color:#000;
}
.inputradio{
width:60px;
}
.label {
display: block;
text-align: center;
-webkit-tap-highlight-color: transparent;
}
.label:first-child .inputradio {
border-radius: 0.5em 0px 0px 0.5em;
box-shadow:
0.1em 0 0 #2726267f inset,
-0.1em 0 0 #27262600 inset,
0 0.1em 0 #afa490 inset,
0 -0.1em 0 #ffffff3f,
0 0.2em 0.5em #0000007f,
0 -0.1em 0 #a0c19d inset,
-0.1em -0.2em 0 #ffffff7f inset,
0.2em 0 0 #ffffff7f inset;
}
.label:last-child .inputradio{
border-radius: 0px 0.5em 0.5em 0px;
box-shadow:
0 -0.1em 0 #a0c19d inset,
0.1em 0 0 #2726267f inset,
-0.1em 0 0 #2726267f inset,
0 0.1em 0 #afa490 inset,
-0.1em 0 0 #afa490 inset,
0 -0.1em 0 #ffffff3f,
0 0.2em 0.5em #0000007f,
-0.1em -0.1em 0 0.1em #ffffff7f inset;
}
.label:first-child .inputradio:checked {
box-shadow:
0.1em 0 0 #272626af inset,
-0.1em 0 0 #272626 inset,
0 0.1em 0 #847a62 inset,
0 -0.1em 0 #ffffff3f,
0 0.1em 0 #ffffff7f,
0 -0.1em 0 #0b7603 inset,
-0.1em -0.2em 0 #ffffff7f inset,
0.2em 0 0 #ffffff7f inset;
}
.label:last-child .inputradio:checked {
box-shadow:
0.1em 0 0 #272626af inset,
-0.1em 0 0 #272626 inset,
0 -0.1em 0 #0b7603 inset,
0 0.1em 0 #847a62 inset,
-0.1em 0 0 #847a62 inset,
0 -0.1em 0 #ffffff3f,
0 0.1em 0 #ffffff7f,
-0.1em -0.1em 0 0.1em #ffffff7f inset;
}
.inputradio{
background-image: linear-gradient(#111111 33%,#b58a8a 58%,#e17575,#ff0000,#ffffff);
border-radius: 0px;
box-shadow:
0.1em 0 0 #2726267f inset,
-0.1em 0 0 #27262600 inset,
0 0.1em 0 #afa490 inset,
0 -0.1em 0 #ffffff3f,
0 0.2em 0.5em #0000007f,
0 -0.1em 0 #a0c19d inset,
-0.1em -0.2em 0 #ffffff7f inset;
cursor: pointer;
display: block;
margin-bottom: 0.5em;
width: 100%;
height: 1em;
transition: box-shadow var(--transDur) ease-in-out;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width:50px;
margin:0px;
}
.inputradio:checked {
background-image: linear-gradient(#0b7603 33%,#666666 58%,#0b7603,#a0c19d,#ffffff);
box-shadow:
0.1em 0 0 #272626af inset,
-0.1em 0 0 #272626 inset,
0 0.1em 0 #847a62 inset,
0 -0.1em 0 #ffffff3f,
0 0.1em 0 #ffffff7f,
0 -0.1em 0 #0b7603 inset,
-0.1em -0.2em 0 #ffffff7f inset;
}
.inputradio:checked + span {
opacity: 1;
}
.inputradio:focus {
outline: transparent;
}
.inputradio + span {
opacity: 0.65;
transition: opacity var(--transDur) ease-in-out;
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
:root {
--bg: #5c6270;
--fg: #e3e4e8;
}
.label:first-child .inputradio{
box-shadow:
0.1em 0 0 #2726267f inset,
-0.1em 0 0 #27262600 inset,
0 0.1em 0 #afa490 inset,
0 -0.1em 0 #0000001f,
0 0.2em 0.5em #0000007f,
0 -0.1em 0 #a0c19d inset,
-0.1em -0.2em 0 #ffffff7f inset,
0.2em 0 0 #ffffff7f inset;
}
.label:last-child .inputradio{
box-shadow:
0 -0.1em 0 #a0c19d inset,
0.1em 0 0 #2726267f inset,
-0.1em 0 0 #2726267f inset,
0 0.1em 0 #afa490 inset,
-0.1em 0 0 #afa490 inset,
0 -0.1em 0 #0000001f,
0 0.2em 0.5em #0000007f,
-0.1em -0.1em 0 0.1em #ffffff7f inset;
}
.label:first-child .inputradio:checked {
box-shadow:
0.1em 0 0 #272626af inset,
-0.1em 0 0 #272626 inset,
0 0.1em 0 #847a62 inset,
0 -0.1em 0 #0000007f,
0 0.1em 0 #0000007f,
0 -0.1em 0 #0b7603 inset,
-0.1em -0.2em 0 #ffffff7f inset,
0.2em 0 0 #ffffff7f inset
}
.label:last-child .inputradio:checked {
box-shadow:
0.1em 0 0 #272626af inset,
-0.1em 0 0 #272626 inset,
0 -0.1em 0 #0b7603 inset,
0 0.1em 0 #847a62 inset,
-0.1em 0 0 #847a62 inset,
0 -0.1em 0 #0000001f,
0 0.1em 0 #0000007f,
-0.1em -0.1em 0 0.1em #ffffff7f inset;
}
.inputradio {
box-shadow:
0.1em 0 0 #2726267f inset,
-0.1em 0 0 #27262600 inset,
0 0.1em 0 #afa490 inset,
0 -0.1em 0 #0000001f,
0 0.2em 0.5em #0000007f,
0 -0.1em 0 #a0c19d inset,
-0.1em -0.2em 0 #ffffff7f inset;
}
.inputradio:checked {
box-shadow:
0.1em 0 0 #272626af inset,
-0.1em 0 0 #272626af inset,
0 0.1em 0 #847a62 inset,
0 -0.1em 0 #0000007f,
0 0.1em 0 #0000007f,
0 -0.1em 0 #0b7603 inset,
-0.1em -0.2em 0 #ffffff7f inset;
}
}

/*--------------FIN MODE EN LIGNE NEWS-----------*/




/*---------------------------------------------------------------------*/
    /*--------------------- MESSAGERIE-------------------------------------*/
    /*---------------------------------------------------------------------*/
#mess{
width: 100%;
line-height: 1;
color: white;
background-color:#222;
width: 100%;
margin: auto;
position: absolute;
top: 0px;
border:1px solid #666;
}
#mess button{
cursor: pointer;
display: block;
position: relative;
margin: 0;
padding: 0;
color:#000;
font-size: 25px;
border-radius: inherit;
background-color: #efefef;
display: table-cell;
vertical-align: middle;
}
#mess select{
appearance: auto;
background-color:#efefef;
border:2px solid #767676;
font-size:medium;
}
#mess label{
color:#000;
font-size:x-large;
}
#mess label p{
    font-size:x-large;
    font-weight:bold; 
    padding:10px 0;       
}
#mess label img{
    width:50px;
    height:50px;
}
.notificationmess{
    color:red;
    position: absolute;
    top: 28px;
    right: 0px;
    display: block;
    background-color: red;
    width: 10px;
    height: 10px;
    border-radius: 25px;
    }
    .enligne{
    color:#0b7603;
    position: absolute;
    float:right;
    margin-top: -15px;
    right:0;
    bottom:0;
    display: block;
    background-color: #0b7603;
    width: 15px;
    height: 15px;
    border-radius: 25px;
    }
    #message{
    width:100%;
    height:150px;
    color:white;
    background-color:#333;
    }

    
    #oldmess button{
    cursor: pointer;
    display: table-cell;
    position: relative;
    margin: 0;
    padding: 0;
    color:#000;
    font-size: medium;
    border-radius: inherit;
    background-color: #efefef;
    }
    .messaddpoto{
    display: inline-block;
    width: 100%;
    line-height: 1;
    max-height: 150px;
    border-bottom:0;
    color: white;
    overflow: hidden;
    background-color: #222;
    text-align:left;
    border-collapse: collapse;
    }
    #ancrevalid{
    padding:15px;
    font-size:15px;
    }
    #datemess{
    width:100%;
    display:inline-flex;
    }
    #datemess p{
    font-size:1.5em;
    padding-top:5px;
    }
    .coress{
    display:inline-flex;
    margin:auto;
    width:50px;
    }
    .profil{
    display:block;
    font-weight:bold;
    width:100%;
    height:50px;
    margin:0;
    }
    .liste_profil li select{
        max-width:190px;
    }
    #datemess button{
    display:block;
    position:absolute;
    right: 0;
    margin: 0;
    z-index: 0;
    }
    #contenumess{
    display: inline-flex;
    width: 100%;
    max-height: 200px;
    }
    .contenu-mess{
    width:100%;
    font-size:1.5em;
    }
    .date{
    font-family: ComicFighter, Georgia; /* on spécifie une autre police standard, au cas où... */
    font-weight:bold;
    font-size:11pt;
    position:relative;
    }
    .messlive mess{
    font-family: ComicFighter, Georgia; /* on spécifie une autre police standard, au cas où... */
    font-weight:bold;
    font-size:11pt;
    position:relative;
    top:26px;
    }
    #arrow_inner{
    width: 0px;
    color: #FFF;
    display: block;
    position: relative;
    height: 0;
    line-height: 0;
    top:20px;
    margin:auto;
    left: -30px;
    border-bottom: 30px solid transparent;
    border-left: 30px solid transparent;
    border-right: 30px solid #0b7603;
    }
    .form-mess{
    width:100%;
    background:#333;
    }
    #oldmess{
    line-height: 1;
    color: white;
    width: 100%;
    line-height: 1;
    background-color:#000;
    position:absolute;
    top:25px;
    display:block;
    z-index:5;
    width:100%;
    margin:auto;
    }
    #oldmess select{
    appearance : auto;
    background-color:#999;
    margin-right:5;
    }
    .messfriends mess{

    font-family: ComicFighter, Georgia; /* on spécifie une autre police standard, au cas où... */
    font-weight:bold;
    font-size:11pt;
    position:relative;
    top:26px;
    }
    #datesupmess{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    }
    #datesupmess :first-child{
    width: 50%;
    margin: 0px 0px 0px 25%;
    }
    #datesupmess p{
    padding-top:5;
    }
    .messdroite{
    width:80%;
    float:left;
    margin: 0 30;
    }
    .messgauche{
    width:80%;
    float:left;
    margin: 0 30;
    }
    #containermessage{
    width: 100%;
    display: inline-block;
    position: relative;
    margin:0;
    padding:0 0 10 0;
    font-size:1.5em;
    }
    #containermessage label{
    display:inline-flex;
    white-space:normal;
    padding: 10 0 0 5;
    max-width:80%;
    margin:0;
    }
    .datemultimess{
    border-top:1px solid #555;
    width:80%;
    margin-left:10%;
    font-size:1.5em;
    }
    .boutonaddmess{
    cursor: pointer;
    position: relative;
    margin: 0 10%;
    padding: 5px 15px;
    font-size: 20px;
    color:#000;
    font-weight:bold;
    font-size:large;
    background-color: #0b7603;
    border: 2px solid #111111;
    border-radius: 20px;
    }
    .boutonaddmess::before{
    content: ' ';
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    }
    .boutonaddmess:hover{
    color:#FFF;
    border: 2px solid #111111;
    background-color: #333;
    }
    .boutonaddmess span{
    font-size:25px;
    }
    .liste_profil li{
        display:table;
    }
    .liste_profil li i{
        display:table-cell;
        vertical-align:middle;
    }
    .tablemess
    {
    width:100%;
    text-align:center;
    }
    .tablemess .messprofil{
    width:20%;
    }
    .tablemess .tabmessmess{
    width:80%;
    }
    .messprofil .imgprofilcom{
    width:50px;
    height:50px;
    border-radius:50px;
    overflow:hidden;
    margin-top:10px;
    }
    .containerselectpoto{
    margin:0;
    padding:5px 0;
    height:auto;
    position:relative;
    background-color:#000;
    display:-webkit-box;
    overflow-y:scroll;
    }
    #oldmess .close{
        display:block;
        position:absolute;
        width:35px;
        height:35px;
        top:-35px;
        float:left
        ;background-color:#000;
        border:1px solid #666;
        border-bottom:0;color:#FFF;
        z-index:2;
    }
    #mess .close{
        display:block;
        position:absolute;
        width:35px;
        height:35px;
        float:left;
        z-index:2;
        border: 0;
        margin-top: -35px;
        margin-left:-1px;
        background-color: #222;
        color: #FFF;
        border: 1px solid #666;
        border-bottom:0;
    }
    .messaddpoto a{
    margin-right: 15px;
    display: table-cell;
    vertical-align: middle;
    }
    .messaddpoto #poto2{
    display: table-cell;
    vertical-align: middle; 
    }
    .selectfriend{
    position: relative;
    display:block;
    text-align:center;
    font-size:medium;
    height:120px;
    width:100px;
    }
    .selectfriend label{
    display:table-cell;
    vertical-align:middle;
    }
    
    .selectfriend input[type="checkbox"]{
    display:none;
    }
    .selectfriend span{
    
    font-size:medium;
    font-weight:bold;
    color: #efefef;
    margin:auto;
    width:100px;
    display:block;
    }
    .selectfriend img{
    display:block;
    vertical-align:middle;
    margin:auto;
    float:none;
    }
    .selectfriend span::before,
    .selectfriend span::after {
    content: '';
    position: absolute;
    bottom: 10px;
    margin: auto;
    }
    .selectfriend span.checkbox::before {
    width: 27px;
    height: 27px;
    background: linear-gradient(45deg, black, transparent);
    box-sizing: border-box;
    border: 1px solid #0b7603;
    box-shadow: 2px 1px 1px #0b7603;
    border-radius: 50px;
    transition: border-color .2s;
    display:block;
    margin:auto;
    left:auto;
    margin-left:35px;
    }
    .selectfriend span.checkbox:hover::before {
    background-color:#0b7603;
    border-radius:50px;
    }
    .selectfriend span.checkbox::after {
    content: '\f00c';
    font-family: 'FontAwesome';
    top:82px;
    left:38px;
    color: transparent;
    transition: color .2s;
    }
    input[type="checkbox"]:checked + label span.checkbox::after {

    color: #FFF;
    padding: 6px 0 0 2px;
    }
    .bouton_invite{
    display: inline-flex;
    height: 40px;
    padding: 25 0 0 5;
    margin: 0;
    width: 20%;
    font-size:medium;
    color:#0b7603;
    }



/*-------------------------FIN MESSAGERIE----------------------------------*/
/*-------------------------------------*/
/*--------------Video------------------*/
/*-------------------------------------*/
.videoyoutube
{
width:100%;
height:50vh;
}
#twitter-widget-0 #document{
    width:100%;
}
#embed-video-container div{
    max-width:auto;
}
.videotiktok{
width:100vw;
min-height:590px;
}
.videotiktok html body{
overflow: hidden;
}
#root{
overflow: hidden;    
}
#reddit-embed{
width:100vw;
min-height:80vh;
}
.count_bt{
padding:7px;
}
.instagram-media{
    margin:auto;
    max-height:80vh;
}

/*--------------------------------------*/
/*-------------FIN VIDEO----------------*/
/*--------------------------------------*/



#del-notif{
    margin:10px auto;
}

.optionbox{
position: absolute;
left: 50%;
transform: translate(-50%,-50%);
}

.optionbox select {
  background: #0b7603;
  color: #fff;
  padding: 10px;
  width: 250px;
  height: 50px;
  border: none;
  font-size: 20px;
  box-shadow: 0 5px 48px rgb(5,68,2);
  -webkit-appearance: button;
  outline: none;
}

.optionbox:before{
content: '\f358';
font-family: "Font Awesome 5 free";
position: absolute;
top: 0;
right: 0;
height: 50px;
width: 50px;
background: #0b7603;
text-align: center;
line-height: 50px;
color:#fff;
font-size: 30px;
pointer-events: none;
}

.optionbox:hover:before{ 
  background: #61C759;
}
#main{
    height:500px;
    display:block;
    overflow:hidden;
}
