/* Définition des couleurs
 #25663B = Vert foncé de la triade
 #a6895d = Jaune Or   de la triade
 #714799 = Mauve d'origine 
 #e9eaae = Dégradé de vert moins clair
 #f9faeb = Dégradé de vert plus clair

*/

body {
   /*background-color: #5FE58D;*/
    /*background: linear-gradient(to right, #e9eaae, #f9faeb);*/
    /*font-family:omnes, sans sherif;#e9eaae
    font-size:18px;*/ 
    background-image: url(../image/classe58fond.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-attachment: fixed;
    height: 100vh;
    background-color: rgba(255, 255, 255, 0.5); 
    
    
}
.vert-c58 { color:#25663B; }
.or { color: #A6895D; }
.argent { color:silver; }
.bronze { color:#cd7f32; }
.rouge { color:#d9534f;}
.orange { color:#f0ad4e;}
.jaune { color:#ffd500;}
.vert { color:#5cb85c;}
.bleu { color:#0275d8;}
.cyan { color:#5bc0de;}
.rose { color:#ff5b77;}
.violet { color:#714799; }

/* Configuaration pour fineuploader*/
#cameraButtonContainer
{
    position: relative;
    overflow: hidden;
    direction: ltr;
    display: none;
}

#cameraButtonContainer .ios
{
    display: block;
}

#cameraButton
{
    position: absolute;
    right: 0px;
    top: 0px;
    font-family: Arial;
    font-size: 118px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    opacity: 0;
}

.rainbow-text {
  background-image: linear-gradient(to right, red, #FF0900, #FF7F00, #FFEF00, #00F11D, #0079FF);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.card-columns {
    column-count: 1;
}

/* Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) { 
    .card-columns {
        column-count: 2;
    }
}

/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) { 
    .card-columns {
        column-count: 3;
    }
}

/* Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
        .card-columns {
        column-count: 4;
    }
}

/* Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    .card-columns {
    column-count: 4;
}
}

    
.captation {
      margin-top:-80px;
      color:white;
        
    }
.zone {
    border: 2px solid green ;  /* couleur violet*/
    background: white;
}    
    
.carousel-item {
	transition: -webkit-transform 0.5s ease;
	transition: transform 0.5s ease;
	transition: transform 0.5s ease, -webkit-transform 0.5s ease;
	-webkit-backface-visibility: visible;
	        backface-visibility: visible;
}



.owl-prev {
      height: 100%;
      position: absolute;
      top: 0%;
      width: 30px;
      z-index: 1000;
      left: 0%;
      cursor: pointer;
      color: transparent;
    }

.owl-next {
      height: 100%;
      position: absolute;
      top: 0%;
      width: 30px;
      z-index: 1000;
      right: 0%;
      cursor: pointer;
      color: transparent;
    }

.owl-prev:hover,
 .owl-next:hover {
      opacity: 0.5;
    }
.interview-bg{
        background-color:#714799;
        border:1px solid #714799;
        
    }
    
.interview-rotate {
  writing-mode: vertical-lr;
  transform: rotate(180deg);
  
    
}

.paragraphe-prepend {
    width:10rem;
}
.paragraphe-input {
    width:17rem;
}

.bg-odd {
    background-color:#f2f2f2;
}

.rotate90 {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.rotate180 {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.rotate-90 {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
}
/*
.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
  display: flex;
}

.carousel-inner .carousel-item-right.active,
.carousel-inner .carousel-item-next {
  transform: translateX(25%);
}

.carousel-inner .carousel-item-left.active, 
.carousel-inner .carousel-item-prev {
  transform: translateX(-25%);
}
  
.carousel-inner .carousel-item-right,
.carousel-inner .carousel-item-left{ 
  transform: translateX(0);
  
}

*/