/* -----------------------------------------------------le canvas de mes bulles BD   */
 .C_diviCan{
 position:absolute;    /*  :absolute; */
    display: block;
    background-color: rgba(255, 255, 255, 0);
    left:"0px"; 
    top:"0px";
    opacity: 1;
    transition: opacity var(--duree) var(--decal);
}
/* ----------------------------------------------------- le dom img   */
.C_diviImg{
    display: block;
    position:absolute;  
/*  relative  absolute;*/
    background-color: rgba(9, 0, 0, 0);
    width:150px; height:33px;
    border-width: 1px;
    border-style: solid; 
    border-color: #ffffff;
/*    border: 1px  solid #7e7e7e; */
    border-radius: 22px;
/*    margin: 3px;
     padding: 4px;*/
    opacity: 1;
    transition: all 33s ;
}
/* ----------------------------------------------------- les dom cadreimge   */
.C_cadreimge{
    display: block;
    position:absolute;  
    background-color: rgb(0, 0, 0);
    width:250px; height:200px;
    border: 1px  solid #ffffff; 
    border-radius: 11px;
/*     padding: 4px;*/
    opacity: 1;
    transition: all 1s ;
    overflow: hidden;
}
.C_imge_cadreimge{
    display: block;
    position:absolute;  
    background-color: rgba(0, 0, 0, 0);
    /*    width:150px; height:33px;*/
    opacity: 1;
    transition: all 3s ;
}
/* ----------------------------------------------------- le dom video   */
.C_Evideo{
    display: block;
    position: absolute;
   border: 0px solid #ffffff;
    transition: all 3s ;
    left: 0;
    top: 0;
    width: 100;
    height: 100;
    visibility: visible;
    opacity: 0;
    border-radius: 0;
    overflow: hidden;
}
.C_Vvideo{
    /* transition: all 3s ; */
    background-color: #00000000;
 
}
/* ----------------------------------------------------- le TabChoix   */
.C_TabChoix{
     font-size: 16;
        /* line-height: 12; */
    font-weight: 600;
    border: 1px solid #000000;    
   background-color: #000000;
    
/*     width: 33;*/
   
}
.C_TabChoix td{
    padding: 2;
/*
    line-height: 14px;
    padding: 2;
   border: 1px solid #000000;
  vertical-align: middle;
    margin: 0 auto ; 
     text-align: center;
*/
}
.C_TabChoix th{
    background-color: rgb(248, 170, 92);
    height: 15px;width:30%;
    font-size: 14px;
    border: 1px solid #000000;
    padding: 2px;
      text-align: center;
     line-height: 30px;
    font-weight: 900;
}
.C_TabChoix .commentaire{
     width:2000;
      text-align: left;
    background-color: #f2d380;
    height: 15px ;
    font-size: 12px;
      vertical-align: top;
    font-style: italic;
}
.C_TabChoix .cache{
    display: none;
    /*
    width:0px;
    text-align: left;
    background-color: #f2d380;
    height: 15px 
    font-size: 1px;
    vertical-align: top;
    font-style: italic;
    visibility: hidden;
    */
}
/* ----------------------------------------------------- BulMoi   */
.C_BulMoiParole{
 
    background-color: rgba(255, 255, 255,1);
 
 
}
 .C_BulMoiPense{
 
    background-color: rgba(255, 255, 255, 0.5);
 
 
}
/* -----------------------------------------------------  pour les BulCss    */
.C_GrandTexte{
    position:absolute;  
    display: block;
/*filter: blur(2px);
      filter: drop-shadow(   blur(2px )) ;
     -webkit-backdrop-filter: blur(10px);
 -webkitBackdrop-filter: blur(10px);
     filter: backdrop-filter( blur(12px )) ;
    
    
    */
  backdrop-filter: blur(4px); /*  c'est rouge mais ça fonctionne ! yess */
    
/*    border: 2px  solid #000000;*/
    border-width: 2px;
    border-style: solid;
    border-color:  #000000;
    background-color: rgba(0, 0, 0, 0.6);
    color: white;
/*    
    padding: 4px;
    padding-left: 15%;
    padding-right: 100;    
    
    */
     width:99%; height:99%;
    padding-top: 2%;
    padding-bottom: 2%;
     padding-left: 25%;
     padding-right: 25%;
    
/*    border-radius: 33px;*/
    font-size:  3;
    opacity: 1; transition: all 3s ;
/*    margin-left: auto;  margin-right: auto;*/
    font-family: CormorantUpright;
}
.C_TextBullMoi{
    position:absolute;  
    display: block;
    color: #151515;
    font-family: CormorantUpright;
    font-style: italic;
    transition: opacity 3s;
    /*
    transition: opacity 3s;
    font-weight: 600;
    width:150px; height:50px;
    border: 2px  solid #000000; 
    border-width: 2px;
    border-style: solid;
    border-color:  #ffffff;
    background-color: rgb(255, 255, 255);
    padding: 0.2vw;
    padding-left: 1vw;
    padding-right: 0.2vw;
    border-radius: 33px;

    
    font-size: 1.5vw;
    */
    font-size: 12;

    opacity: 1; 
    
    /* ok backdrop-filter: blur(4px); */
}
.C_BulCss01{
    position:absolute;  
    display: block;
    color: #151515;
    width:150px; height:50px;
/*    border: 2px  solid #000000;*/
    border-width: 2px;
    border-style: solid;
    border-color:  #ffffff;
    background-color: rgb(255, 255, 255);
    padding: 0.2vw;
    padding-left: 1vw;
    padding-right: 0.2vw;
    border-radius: 33px;
    font-size: 2;
    opacity: 1; 
    transition: all 3s ;
    font-family: CormorantUpright;
    font-weight: 600;
    /* ok backdrop-filter: blur(4px); */
}
.C_CadreText{
    position:absolute;  
    display: block;
    color: #000000;
    width:47%; height:47%;
    border-width: 1px;
    border-style: solid;
    border-color:  #555555;
    background-color:rgb(199, 199, 199,0.5);
     /*"#ffffff7b"  rgb(199, 199, 199); */
    padding: 0.2vw;
    padding-left: 1%;
    padding-right: 1%;
    border-radius: 0px;
    font-size: 1.6 ;
    /* 1.9vw; 1.9vw  */
    opacity: 1; 
    transition: all 1s ;
    overflow-y: auto;
    overflow-x: hidden;
    backdrop-filter: blur(6px); 
    font-family: Eurosti;
}
.C_BulCssChucho{
    position:absolute;  
    display: block;
    color: #151515;
    width:150px; height:50px;
/*    border: 2px  solid #000000;*/
    border-width: 2px;
    border-style:dashed;
    border-color:  #c2c2c2;
    background-color: #787878d7;
    padding: 0.2vw;
    padding-left: 1vw;
    padding-right: 0.2vw;
    border-radius: 33px;
    font-size: 1.6;
    opacity: 1; 
    transition: all 3s ;
    backdrop-filter: blur(2px);
    font-family: Eurosti; 
}
/* --------------   Narrat et pense   */
.C_BulCssNarat{
    position:absolute;  
    display: block;
    width:150px; height:auto;
    border: 2px  solid #000000;
    background-color: rgb(226, 195, 138);
    padding: 0.1vw;
    font-style: italic;
    font-weight: 600;
    font-size: 1.4;
    opacity: 1; transition: all 3s ;
    font-family: Eurosti;
}
.C_BulCssPens01{
    position:absolute;  
    display: block;
    width:150px; height:auto;
    border-style: dashed;
    border-width: 1px;
    border-color: black;    
    background-color: rgba(255, 255, 255, 0.74);
    padding: 14px;
    border-radius: 33px;
    font-size: 12px;
    opacity: 1; transition: all 3s ;
    font-family: Eurosti;
}
.C_BulCssTitre01{
    position:absolute;  
    display: block;
    width:150px; height:auto;
    border: 12px  solid #afacac;
    background-color: rgb(255, 255, 255);
    padding: 14px;
    border-radius: 33px;
    font-size: 32px;
    
    text-align: center;
    font-weight: 900;
    opacity: 1; transition: all 3s ;
    font-family: Eurosti;
/*    font-size: 2vw;*/
/*    font-family: myfont,fantasy;
    font-family: myfont;    
    
    */
}
.C_BulCssCadreFlou{
    position:absolute;  
    display: block;
    left:25%;top: 25%;
    width:50%; height:50%;
    border: 1px  solid #ffffff;
    background-color: rgb(255, 255, 255,0);
    padding: 0px;
    font-size: 12px;
    text-align: center;
    font-weight: 100;
    backdrop-filter: blur(2px); 
    opacity: 1; transition: all 3s ;
    font-family: Eurosti;
}
.C_BulCssTexteSeul{
    position:absolute;  
    display: block;
    width:150px; height:50;
    /* border: 0px  solid #000000; */
    border: 0px  solid #000000;
    background-color: rgba(56, 203, 181,0);
    padding: 1%;
    font-size:8;
   
    /*    font-size:6.7vw;         5.8vw;   font-family: myfont;*/
    opacity: 1; transition: all 3s ;
    /* la bonne  
    text-shadow: -1px 0 white , 0 1px white, 1px 0 white, 0 -1px white;
    un test (ko?) 
    text-shadow: -3px 0 white , 0 3px white, 3px 0 white, 0 -3px white;
    */
   
     
    text-align: center;
  
    font-family: Eurosti;
/*
    font-family: cursive;
    font-style: italic;
    font-weight: 600;
*/
}
/* -----------------------------------------------------  FONTS    */



@font-face {
    font-family: 'Eurosti';
    src: url("fontsOk/Eurosti.TTF") format('truetype');    
}
@font-face {
    font-family: 'myFontScript';
    src: url("fontsOk/lovelygirl.otf") format('opentype');
    /*    
    src: url("/_prg/PALSCRI.TTF");
    src: url("_prg/PALSCRI.TTF") format('truetype');
    src: url("_prg/lovelygirl.otf") format('truetype');
    src: url("_prg/lovelygirl.otf") format('opentype');
    src: url('source/SourceSansPro-Regular.ttf') format('truetype');   
    */
}
@font-face {
    font-family: 'myFontScript2';
    src: url("fontsOk/PALSCRI.TTF") format('truetype');
}
/*   */
@font-face {
    font-family: 'Jonze';
    src: url("fontsOk/Jonze.ttf") format('truetype');
}

@font-face {
    font-family: 'FrenchScript';
    src: url("fontsOk/FRSCRIPT.TTF") format('truetype');
}
@font-face {
    font-family: 'Edwardian';
    src: url("fontsOk/ITCEDSCR.TTF") format('truetype');
}
@font-face {
    font-family: 'OldEnglish';
    src: url("fontsOk/OLDENGL.TTF") format('truetype');
}
@font-face {
    font-family: 'Ravie';
    src: url("fontsOk/RAVIE.TTF") format('truetype');
}




@font-face {
    font-family: 'Creepster';
    src: url("fontsOk/Creepster-Regular.ttf") format('truetype');
}
@font-face {
    font-family: 'FreckleFace';
    src: url("fontsOk/FreckleFace-Regular.ttf") format('truetype');
}
@font-face {
    font-family: 'MysteryQuest';
    src: url("fontsOk/MysteryQuest-Regular.ttf") format('truetype');
}
@font-face {
    font-family: 'TourCondReg';
    src: url("fontsOk/Tourney_Condensed-Regular.ttf") format('truetype');
}
@font-face {
    font-family: 'TradeWinds';
    src: url("fontsOk/TradeWinds-Regular.ttf") format('truetype');
}
@font-face {
    font-family: 'CormorantUpright';
    src: url("fontsOk/CormorantUpright-Regular.ttf") format('truetype');
}