/*
* {outline: 2px dashed grey;}
*/



:root {
    --fond-general: #ffffff;

    --couleur-bg: rgb(248, 248, 248);

    --couleur2: #ffffff;
    --couleur3: rgb(182, 170, 149) ;
    --couleur-activite: rgba(226, 240, 255, 0.8);
    --couleur-menu: rgba(226, 240, 255, 0.8);
    --couleur-menu-mobile: rgba(255, 255, 255, 0.9);
    --couleur-border-menu: rgba(255, 255, 255, 1);
    --couleur-hover-menu: rgba(192, 222, 255, 0.8);

    --couleur-rond-logo: rgba(255, 255, 255, 0.4);

    --couleur-text1: #4a91e2;
    --couleur-text2: #e7a87f;
    --couleur-text-footer: #636363;

    --couleur-text-nom: #000;
    --couleur-shadow-nom: #ffffff;

    --couleur-hoverl: rgba(0, 0, 0, 0.05);
    --couleur-hover2: rgb(159, 181, 197);
    --shadow-hover1: #ffa030;

    --police1:  #ffffff;
    --police2: linear-gradient(to bottom, rgb(0, 0, 0), rgb(155, 155, 155), rgb(255, 255, 255));

  }

#sidebar .activ{--tw-bg-opacity: 1;
    background-color: rgb(229 231 235 / var(--tw-bg-opacity));}
.couleur-text1{}
.couleur-text1{color:var(--couleur-text1)}

.couleur-text2{color:var(--couleur-text2); }
.couleur1{background-color:var(--couleur1); }
.couleur2{background-color:var(--couleur2); }
.couleur3{background-color:var(--couleur3); }
.couleur-hover1:hover{ background-color: var(--couleur-hoverl)!important; transition:0.3s;}
.couleur-hover2:hover{ background-color: var(--couleur-hover2)!important; transition:0.3s;}

.hover-underline:hover{text-decoration: underline; color:#808080;}
.shadow-hover2:hover{ box-shadow: 0px 0px 5px var(--shadow-hoverl)!important; transition:0.2s;}
.habillage-site{ background-color: var(--couleur-bg);   }




.breadcrumb-container {
    padding: 0.5rem 0rem;
    margin-bottom: 0.4em;
    padding-left: 0.2em;
    font-size: 0.9rem;
    color: #666;
    border-radius: 6px;
    display: inline-block;
    width:100%;
}

.breadcrumb-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.breadcrumb-item {
    display: flex;
    align-items: center;
}

.breadcrumb-item a {
    color: #ff8800; /* orange discret */
    text-decoration: none;
    transition: color 0.2s;
}

.breadcrumb-item a:hover {
    color: #cc6e00;
    text-decoration: underline;
}

.breadcrumb-separator {
    margin: 0 0.3rem;
    color: #aaa;
}

.breadcrumb-item.active {
    color: #999;
    font-weight: 500;
}

.banniere{
background-position: center   center  ;
background-color:  var(--couleur-bg);
background-repeat: no-repeat;
    background-size: cover;
    height: 350px;}

    @media (max-width:1024px) {
        .banniere{
                background-size: 1000px;}


    }


.nom-company{color:var(--couleur-text-nom); shadow: 0 0 5px var(--couleur-shadow-nom);}

.effet-titre-company{background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 25%, rgba(255,255,255,0.4) 75%, rgba(255,255,255,0) 100%);
    position:absolute; height:10px; left:30%; width:40%;margin-top:59px; z-index:0!important;}
.text-footer{color: var(--couleur-text-footer); text-align: center!important;}
.menu-page{
    background-color:var(--couleur-menu);
    margin-top: -10px;
    text-align: center;
    color:rgb(0, 0, 0);
    transition:0.4s;
    border-radius: 5px;
    outline:2px solid var(--couleur-border-menu);

}
.menu-page a{
padding:1em 2em;
transition:0.4s;
font-size: 1.3em;
font-weight: 600;
text-shadow: 0px 0px 2px rgb(255, 255, 255);
border-radius: 5px;

}
.menu-page a:hover{
color:black;
text-shadow: 0px 0px 5px white;
background-color: var(--couleur-hover-menu);
}

.menu-page-mobile{
    background-color:var(--couleur-menu-mobile);
    text-align: center;
    z-index: 9999;
    color:rgb(0, 0, 0);
    transition:0.4s;
    border-radius: 5px;
    outline:2px solid var(--couleur-border-menu);

}
.menu-page-mobile a{
    padding:1em 2em;

    transition:0.4s;
    font-size: 1.3em;
    font-weight: 600;
    text-shadow: 0px 0px 2px rgb(255, 255, 255);
    border-radius: 5px;
    display:block;
    }
.menu-page-mobile a:hover{
background-color: #fff;
    }
.couleur-rond-logo {
    background-color: var(--couleur-rond-logo);}
.hauteur-logo{
margin-top:-200px!important;
}
.hauteur-nom{

}
.hauteur-nom h1, .hauteur-nom p{
    text-align: left!important;
}

@media (max-width:1024px) {
    .hauteur-nom{ margin-top:-30px!important;}
.hauteur-nom h1, .hauteur-nom p{ text-align: center !important; }
}
.mes-actus{
    text-align: left;
    transition: 0.4s;
    line-height: 3em!important;
    background-color: #ffffff;
}
.autre-activite{ text-align: left;  outline: 1px solid rgb(221, 221, 221);  transition: 0.4s;  background-color:var(--couleur-activite); }

.autre-activite:hover{scale:1.035; background-color:  var(--couleur-hover-menu)!important;}


.entete-yozenco{
  width:100%;
  height:25px;
  background-color: #000;

  display:block;
  a { float:left;
      color:#fff;
      text-align: right;
      font-weight: 600;

  }
}

.actu-item{
  text-align: left;
  font-size: 0.95em;
  p:first-child{font-weight:600;}
  p{text-align:left;}
  h3{
      text-align: left;
      color: #999999;}
}
.actu-item:hover{ background: var(--couleur-hover2); }


footer{
    background-color:var(--couleur-bg);
    height:200px;

}



/* DEBUT Admin */
.admin-habillage-site{ background-color: var(--couleur-bg);   }


 .admin-menu-page{
    background-color:var(--couleur-menu);
    text-align: center;
    color:rgb(0, 0, 0);
    transition:0.2s;
    border-radius: 5px;
    outline:2px solid var(--couleur-border-menu);
    padding-top:0.6em;
}
.admin-menu-page span{

line-height:1em;
}
.admin-menu-page:hover{
color:black;
text-shadow: 0px 0px 5px white;
background-color: var(--couleur-hover-menu);
}
.admin-hauteur-logo{
    margin-top:-100px!important;
    }
    .admin-hauteur-nom{
        margin-top:-55px!important;
    }

.img-size{

    @media (max-width:1024px) {

    }
}


/* FIN Admin */




/* DEBUT Super Admin */


.supAdmin-tableau th{
    background-color: rgb(239, 239, 239);
}
.supAdmin-tableau th:first-child{
    border-radius: 10px 0 0 0;

}
.supAdmin-tableau th:last-child{
    border-radius:0 10px 0 0;
}

.supAdmin-tableau td, th{
    padding:0.8em 2em ;
    border-top:2px solid  rgb(239, 239, 239);
    border-bottom:2px solid  rgb(239, 239, 239);
}
.supAdmin-tableau tr:hover{
    background-color: #9dd79f;
}


.supAdmin-btn-vert-fixe {
    background-color: #82ca85;
    color:#fff;
    margin: 0.5em 2em;
    padding: 0.5em 2em;
    font-weight: 400;
    border-radius: 5px;
}
.supAdmin-btn-rouge-fixe {
    background-color: #fa9393;
    color:#fff;
    margin: 0.5em 2em;
    padding: 0.5em 2em;
    font-weight: 400;
    border-radius: 5px;
}
.supAdmin-btn-orange-fixe {
    background-color: #dcbb75;
    color:#fff;
    margin: 0.5em 2em;
    padding: 0.5em 2em;
    font-weight: 400;
    border-radius: 5px;
}
.supAdmin-btn-vert {
    background-color: #82ca85;
    color:#fff;
    margin: 0.5em 2em;
    padding: 0.5em 2em;
    font-weight: 400;
    border-radius: 5px;
}
.supAdmin-btn-vert:hover {
    background-color: #65af67;
    color:#fff;
    margin: 0.5em 2em;
    padding: 0.5em 2em;
    font-weight: 600;
}

.supAdmin-btn-rouge {
    background-color: #fa9393;
    color:#fff;
    margin: 0.5em 2em;
    padding: 0.5em 2em;
    font-weight: 400;
    border-radius: 5px;
}
.supAdmin-btn-rouge:hover {
    background-color: #e85252;
    color:#fff;
    margin: 0.5em 2em;
    padding: 0.5em 2em;
    font-weight: 600;
}

.supAdmin-btn-orange {
    background-color: #dcbb75;
    color:#fff;
    margin: 0.5em 2em;
    padding: 0.5em 2em;
    font-weight: 400;
    border-radius: 5px;
}
.supAdmin-btn-orange:hover {
    background-color: #d3af61;
    color:#fff;
    margin: 0.5em 2em;
    padding: 0.5em 2em;
    font-weight: 600;
}

.supAdmin-btn-retour {
    background-color: #77b5ee;
    color:#fff;
    margin: 0.5em 2em;
    padding: 0.5em 2em;
    border-radius: 5px;
}
.supAdmin-btn-retour:hover {
    background-color: #5299db;
    color:#fff;
    margin: 0.5em 2em;
    padding: 0.5em 2em;

}




.supAdmin-btn-rouge tr:hover{
    background-color: #9dd79f;
}



/* FIN Super Admin */

.acc-fond-salon-pub{ background: url("/images/fleur-carre.jpg") bottom center;
    background-size: cover; border-radius:10px;

}
@media (max-width:1024px) {
    .acc-fond-salon-pub{  background-position:   center center;}
}
.acc-fond-salon{ background: url("/images/fleur-carre.jpg") top center;
    background-size: cover;border-radius:10px;

}
.inscription-fond{ background: url("/images/inscription-fond.jpg?eld") top center;
    background-size: cover;

}
.fond-pub-acc{background: url("/images/fond-pub.jpg") top center;
background-size:cover; }
.bandeau-annuaire{background: url("/images/yozenco/salons-home/fond-bandeau-annuaire.jpg?aaav") top center;
background-size: cover; min-height:200px;text-align: center; margin:auto; padding: 50px; border-radius:15px;
        h2 {font-size: 1.5em; }
}
.bg-white-100{background-color: rgba(255, 255, 255, 0.1)!important;}
.bg_white_200{background-color: rgba(255, 255, 255, 0.8)!important;}
.bg-white-300{background-color: rgba(255, 255, 255, 0.3);}

.bg_grey{background-color: #f3f3f3;}.bg_orange{background-color: #ffa030;}.bg_orange2{baRetrouvez moi sur :ckground-color:rgba(255, 230, 202, 0.5);}.bg_orange2:hover{background-color:rgba(255, 193, 121, 1);}
.bg_blue{background-color: #e5dcff;}
.font_black{color:black;}.font_orange{color: #ffa030;}.font_red{color: #f01111;}.font_white{color:#fff;}
.txt08{font-size:0.8rem;}
.hover:hover{background-color: rgb(247, 247, 247)!important; transition:0.3s;}
.hover2:hover{box-shadow: 0px 0px 10px #d7d7d7; transition:0.2s;}
.hover-vignette:hover{box-shadow: 0px 0px 10px #9c9c9c; transition:0.2s;}
.hover3 {opacity: 0.9; transition:0.3s;} .hover3:hover {opacity: 1; transition:0.3s;}
.hover-shadowwhite:hover{box-shadow: 0px 0px 15px #ffffff; transition:0.2s;}

.margintop{margin-top:5px; border:5px solid blue;}
.invisible_border{border-top: 1px solid transparent;}
.font-weight800{font-weight:Z00;}
.line-height1{line-height: 1rem!important;}
.line-height12{line-height: 1.2rem!important;}
.line-height14{line-height: 1.4rem!important;}
.radius{border-radius: 5px;}.radius15{border-radius: 15px;}
.hover_activity{color:#616161}
.hover_activity:hover{box-shadow: 0px 0px 3px rgb(179, 179, 179);}
.max_height120{max-height:120px;}
.width100{min-width: 100px;max-width:100px;}.width150{min-width: 150px;max-width:150px;}.width200{min-width: 200px;max-width:200px;}
.width250{min-width: 250px;max-width:250px;}.width300{min-width: 300px;max-width:300px;}.width500 {min-width: 500px;max-width:500px;}

.max_width1800{max-width:1800px!important; }
.max_width1600{max-width:1600px!important; }
.max_width1200{max-width:1200px;}
.max_width1400{max-width:1400px;}
.max_width2000{max-width:2000px;}
.max_width350{max-width:350px;}
.max_width400{max-width:400px;}
.min_width100{min-width:100px;}

.min-height1000{min-height:1000px;}
.min-height800{min-height:800px;}
.min-height600{min-height:600px;}









/* DEBUT Actu page d'accueil */
.actu-acc-g{
    background: url("/images/fond-actu.jpg?sdf") bottom center;
    background-size: cover;

}
.acc-pub-yozenco{
    background: url("/images/fond-etoile.jpg?eld") bottom center;
    background-size: cover;

}


.actu-acc-vignette{

}

.text-hover{color:rgb(243, 164, 73);font-weight:600;padding:4px 0;}
.text-hover:hover{color:rgb(255 160 48 ); font-weight:700; background-color: #e1e1e1;}

/* FIN Actu page d'accueil */
/* DEBUT a propos */
.text-apropos p{ margin-top:1em;
}
.titre-photo{
background-color: rgba(255, 255, 255, 0.8);
text-align: center;
}
.card-photo .titre-photo:hover{
background-color: rgba(255, 255, 255, 1);

}
/* FIN a propos */
.board-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, 300px);
    grid-auto-rows: 20px;
    grid-row-gap: 10px;
    grid-column-gap: 16px;
  }

  .card-actu {
    grid-row-end: span 10;
    margin-bottom: 10px;
  }

/* DEBUT page Annuaire */

/* FIN page Annuaire */

.aura{ background: url(/images/aura1.png) left -35px  top 5px no-repeat  ;
    background-size: 100% ; opacity:0,4;
     height:500px; width: 500px;
     position:absolute;
     left: 40%;
     z-index: 0;
    img {box-shadow: 0 10px 50px rgb(255, 255, 255); }
}

.radius-top{border-radius: 15px 15px 0 0;}

.bg-white-400{background-color: rgba(255, 255, 255, 0.9);}
.bg-white2{background-color: rgba(255, 255, 255, 0.95);}

.footer-annuaire{

}

.text-shadow-white{text-shadow: 0px 0px 5px white;}
.text-shadow-black{text-shadow: 0px 2px 10px black; }


.max_width200{max-width: 100px;}
.max_width250{max-width: 250px; display:block; margin:0 auto;}
.max_width300{max-width: 300px; display:block; margin:0 auto;}
.max_width400{max-width: 400px; display:block; margin:0 auto;}
.max_width400{max-width: 600px; display:block; margin:0 auto;}

.max_width500{max-width:500px;}.max_width350{max-width:350px;}
.min_width200{min-width: 400px;}
.height25{height:10px;}
.height100{height:100px;}
.height300{height:300px;}
.height400{height:400px;}
.height90{height:60px;}
.height_carrousel{height:350px;}
@media (max-width:1024px) { .height_carrousel{height:600px;}  }
@media (max-width:927px) { .height_carrousel{height:575px;}  }
@media (max-width:768px) { .height_carrousel{height:550px;}  }
@media (max-width:640px) { .height_carrousel{height:550px;}  }
@media (max-width:590px) { .height_carrousel{height:550px;}  }
@media (max-width:480px) { .height_carrousel{height:600px;}  }
@media (max-width:385px) { .height_carrousel{height:650px;}  }

.max_height50{height:50px;}
.rond{width:40px; height:40px; border-radius:20px;}
.max_height{max-height: 300px;}
.border_simple{border:1px solid grey;}
.borderhover{border: 2px solid rgb(230, 230, 230); border-color: transparent; transition:0.5s;}
.borderhover:hover{border: 2px solid rgb(230, 230, 230);}
.transition05{ transition:0.3s;}
.transition05:hover{ transition:0.3s;}
.text_justified{ text-align: justify;}
.border1{border:2px solid rgb(235, 235, 235);}
.border2{border: 5px solid red!important;}
.border3{border: 5px solid green;}
.border_grey{border: 5px solid rgb(231, 231, 231);}
.border_bottom{border-bottom: 2px inset rgb(0, 0, 0); border-color: transparent;}
.border_bottom:hover{border-bottom: 2px solid rgb(168, 168, 168);}
.border_bottom2{border-bottom: 3px inset rgb(248, 155, 49);}

.boxshadow{box-shadow: 0px 0px 5px #f3f3f3;}
.boxshadow2{}
.boxshadow2:hover{box-shadow: 0px 0px 5px #f6f6f6;}
.boxshadow_white{box-shadow: 0px 0px 5px transparent;}
.boxshadow_white:hover{box-shadow: 0px 0px 5px rgb(255, 255, 255);}
.hover_opacity95{opacity:0.9;}
.hover_opacity95:hover{opacity:1;}
.border_hover{border:1px solid white; transition:0.4s;}
.border_hover:hover{border:1px solid rgb(233, 233, 233);transition:0.4s;box-shadow: 0px 0px 3px rgb(219, 219, 219);}
.hover-scale{scale:1; transition: 0.6s;}
.hover-scale:hover{scale:1.04; transition: 0.6s;}

.button_red{background-color: rgb(245, 96, 96); color:white;transition:0.3s;}
.button_red:hover{background-color: rgb(255, 0, 0); color:white; transition:0.3s;}
.button_grey{background-color: rgb(133, 133, 133); color:white;opacity: 0.7; transition:0.3s;}
.button_grey:hover{background-color: rgb(128, 128, 128); color:white;opacity: 1; transition:0.3s;}
.button_green{background-color: rgb(84, 179, 84); color:white; transition:0.3s; }
.button_green:hover{background-color: rgb(66, 155, 66); color:white;transition:0.3s; }

.button_blue{background-color: rgb(139, 166, 240); color:white; transition:0.3s; }
.button_blue:hover{background-color: rgb(101, 132, 216); color:white;transition:0.3s; }

.txt_img{background-color:  rgba(173, 173, 173, 0.4); opacity: 0.7; transition:0.3s;}
.txt_img:hover{background-color:  rgba(173, 173, 173, 0.8);opacity: 1;}
.txt_img2{background-color:  rgba(117, 86, 253, 0.6); opacity: 0.7; transition:0.3s;}
.txt_img2:hover{background-color:  rgba(132, 130, 228, 0.8);opacity: 1;}
.z-index10{z-index: 10;}





.text-center{text-align:center!important;}
.text_left{text-align:left!important;}
.text_right{text-align:right!important;}
.text-center_left{text-align:center;}  @media (max-width:1224px) { .text-center_left{text-align:left!important; } }
.txt_left_center{text-align:left;}  @media (max-width:768px) {.txt_left_center{text-align:center;} }
.opacity{opacity:0.5;}
.scale{scale:1.05;}
.scale08{scale:0.8;}
.scale2{transform: scale(1.4);}
.overflow{overflow: hidden;}
.scrollbar1::-webkit-scrollbar {
    width: 0px;
  }
.scrollbar2::-webkit-scrollbar {border-radius:10px; width:10px;}
.scrollbar2::-webkit-scrollbar-thumb { background-color:rgba(218, 218, 218, 0.8);   border-radius:10px;}
.scrollbar2::-webkit-scrollbar-track  { background-color:rgba(123, 123, 124, 0.8); border-radius:5px;}
header{max-width:1600px; margin: auto;}
nav{}

#menu_salon ul{text-align: center;}

.vignette{border-radius: 5px; text-align:center;}
.vignette:hover{background-color: rgb(247, 247, 247)!important; transition:0.3s}

#horaire tr{text-align:center; border-left:solid rgb(255, 255, 255) 1px; border-right:solid rgb(255, 255, 255) 1px;border-bottom:solid rgb(255, 255, 255) 1px;}

#horaire th, td{padding:1rem; text-overflow: ellipsis; text-align: left;}
#horaire td {padding: 0.25rem  1rem!important;}


#city select{width:100%; border: 0px; margin: 0 auto; border-radius:10px;}
.img_profil{width:210px; height:210px;}
.img_width{min-width: 200px;max-width:200px;}.img_height{min-height: 200px;max-height:200px;}




.large_icon {
  font-size: 32px !important;
}
