/* Style pour les pages EBP */
/* CSS Main File */
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800');
@import url('https://fonts.googleapis.com/css2?family=Courgette&display=swap');
@font-face { font-family: 'azurlog'; src: url("./../fonts/motschcc.ttf"); }
@keyframes shake {
    0% { transform: translate(0, 0) rotate(0); }
    10% { transform: rotate(-20deg); }
    20% { transform: rotate(20deg); }
    30% { transform: rotate(-10deg); }
    40% { transform: rotate(10deg); }
    60%, 100% { transform: none; }
}

@keyframes float {
    0%, 50% { transform: none; }
    60% { transform: translateY(0px); }
    70% { transform: translateY(-4px); }
    80% { transform: translateY(0px); }
    90% { transform: translateY(-2px); }
    100% { transform: none; }
}

* {
    margin: 0;
    padding: 0;
    font-family: 'Open sans', sans-serif;
    cursor: default;
}

body {
    min-height: 100vh;
    color: rgb(0,0,0);
    background: whitesmoke;
    font-family: 'Open sans', sans-serif;
}

header, footer {
    display: block;
    margin: 50px auto 0 auto;
    width: 100%;
}

main {
    display: block;
    margin: 50px auto 0 auto;
    width: 75%;
}

p {
    color: #333333;
    font-family: 'Open sans', sans-serif;
    text-align: justify;
}

a {
    text-decoration: none!important;
    outline: 0;
    cursor: pointer;
}

a:hover {
    color: unset;
}

.main-inner-v2 {
    padding: 8px;
}

h1 {
    font-weight: 700;
    font-size: 25px;
    color: #CCE6F4;
    text-align: center;
    margin-bottom: 28px;
}

h2 {
    font-weight: 600;
}

footer {
    margin-top: 14px;
    text-align: center;
}

footer p {
    color: rgb(250,250,250);
    font-weight: 600;
}

/***PAGE EBP***/

#Brouge {
    background-color: #CE1719;
}
#BCyan {
    background-color: #007988;
}
#BOrange {
    background-color: #EC6009;
}
#BViolet {
    background-color: #9516AA;
}
#BRgb {
    background: linear-gradient(to right, #9516AA, #B40045, #FF7C00);
}

#TRouge {
    border-color: #CE1719;
}
#TCyan {
    border-color: #0ab0c4;
}
#TOrange {
    border-color: #EC6009;
}
#TViolet {
    border-color: #9516AA;
}
#TRgb {
    background: linear-gradient(white, white) padding-box, linear-gradient(to right, #9516AA, #B40045, #FF7C00) border-box;
    border: 2px solid transparent;
}

#EbpSolution {
    background-image: url(../../img/ebp/img/ebp.jpg);
}
#Compta {
    background-image: url(../../img/ebp/img/compta.jpeg);
}
#CRM {
    background-image: url(../../img/ebp/img/crm.jpeg);
}
#Hubbix {
    background-image: url(../../img/ebp/img/hubbix.jpg);
}
#Commerce {
    background-image: url(../../img/ebp/img/commerce.jpeg);
}
#Batiment {
    background-image: url(../../img/ebp/img/bat.jpg);
}
#GestionCo {
    background-image: url('../../img/ebp/img/gestion commerciale.jpg');
}
#Saas{
    background-image: url('../../img/ebp/img/Saas.jpg');
}
#Formation {
    background-image: url('../../img/ebp/img/formation.jpeg');
}
#LogoEbp {
    background-image: url('../../img/ebp/img/logo.svg');
    background-repeat: no-repeat;
    background-size: contain;
    height: 225px;
}

.titre h1 {
    color: #707070!important;
    margin-bottom: 0!important;
}

.ebp {
    background-color: white;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.2);
}

.navbar-nav li{
    font-family: 'Open sans', sans-serif;
    color: #333333;
    margin: auto 20px;
}

li {
    font-family: 'Open sans', sans-serif;
    color: #333333;
}

.bandeau {
    height: 7px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.imageHeader {
    background-repeat: no-repeat;
    background-size: cover;
    width: 50%;
    height: 275px;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2);
}


.titre {
    background-color: #FFFFFF;
    padding-top: 25px;
    padding-bottom: 25px;
    padding-left: 60px!important;
    padding-right: 60px!important;
    border-width: 1px;
    border-style: solid;
    width: 350px;
    border-radius: 10px;
    box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.55);
    margin-top: -75px!important;
    margin-left: 20px;
}

.titre h1 {
    font-size: 30px;
}

h3 {
    text-align: center;
    padding-bottom: 6px;
    border-bottom: 1px solid #c6c6c6;
    letter-spacing: 0.5px;
    font-size: 18px!important;
    font-weight: 600!important;
    margin: 30px 0px 30px 0px!important;
}

.textHautEbp {
    margin-top: 60px;
    padding-left: 30px;
    padding-right: 30px;
}

.textHautEbpp {
    padding-left: 30px;
    padding-right: 30px;
}

.imgPdfPdv {
    width: 110px;
    height: auto;
}

.aPdfPdv {
    width: 110px;
    height: 135px;
    display: block;
    margin: auto;
}

.textBasEbp {
    margin-top: 25px;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 40px;
    /*padding-bottom: 65px;*/
}

.imgPdf {
    width: 85px;
    height: 105px;
    margin-left: -110px;
    margin-top: 225px;
}

.imgPdf2 {
    width: 85px;
    height: 105px;
    /* margin-left: 320px;
    margin-top: -20px; */
}

.imgEbp-solution{
    margin-left: 22px;
    margin-right: 22px;
    height: 200px;
    width: 200px;
}

.cert-qualiopi {
    width: 50%;
    height: auto;
    margin: 0 auto 0 auto;
    display: block;
}

.prixEbp {
    margin-top: -25px;
    padding-left: 10px;
    font-weight: bold;
}

.imageAstucesResponsive {
    width: 65%;
    height: auto;
    margin: 10px auto 20px auto;
    display: block;
}

#Espaces {
    padding-top: 100px;
}

.contact {
    color: #707070!important;
    font-weight: bold;
    text-decoration: underline!important;
}

.zoneIntervention {
    padding-top: 35px;
}
.zoneIntervention li {
    font-size: 26px;
}

h1, h2, h3, h4 {
    padding: 0;
    margin: 0;
    letter-spacing: 0.5px;
}

h2 {
    color: #707070;
}

h2::after {
    content: "";
    background: rgb(4,49,104);
    width: 25px;
    height: 2px;
    margin-top: 10px;
    display: block;
}

@media screen and (max-width: 767px) {
    .bandeau {
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
    }
    .ebp {
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
    }
    .titre {
        margin-right: auto!important;
        margin-left: auto!important;
        margin-top: -90px!important;
    }
    .imgPdf2 {
        width: 85px;
        height: 105px;
        margin-left: 0px;
        margin-top: 0px;
    }
}

#Carte {
    margin-top: auto!important;
    margin-bottom: auto!important;
}

#Carte img{
    width: 100%;
}

.titreTr td {
    background-color: #043267;
    color: whitesmoke;
    font-weight: bold;
    border-color: whitesmoke;
}

.btl {
    border-top-left-radius: 5px;
}

.btr {
    border-top-right-radius: 5px;
}

.bbl {
    border-bottom-left-radius: 5px;
}

.bbr {
    border-bottom-right-radius: 5px;
}

table tr {
    padding-left: 75px!important;
    padding-right: 75px!important;
}

table td {
    box-shadow: 6px -5px 12px rgb(0 0 0 / 9%);
    padding: 25px;
    border-right: solid 1px #b1b1b1;
}

table td:last-child {
    border-right: transparent;
}

@media screen and (max-width: 1199px) {
    .titre h1 {
        font-size: 23px;
    }
    .cert-qualiopi {
        width: 434px;
        height: 636px;
    }
}

@media screen and (max-width: 575px) {
    
    .ebp {
        box-shadow: none;
    }
    #LogoEbp {
        height: 160px;
    }
    table tr {
        padding-left: 20px!important;
        padding-right: 20px!important;
        font-size: 10px;
    }
    .cert-qualiopi {
        width: 239px;
        height: 332px;
    }
}

.textHautEbp-solution {
    margin-top: 60px;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 50px;
}
#titre-solution-ebp{
    padding-left: 30px;
}
.contour-blue{
    border: 2px solid #007A89;
    opacity: 0.99;
}
.contour-orange{
    border: 2px solid #EC6009;
    opacity: 0.99;
}
.contour-red{
    border: 2px solid #CE1719;
    opacity: 0.99;
}
.ebp-titre {
    font-size: 1.4em;
}

#commerce{
    background-image: url(../../img/ebp-solution/commerce.png);
}
#compta{
    background-image: url(../../img/ebp-solution/compta.png);
}
#crm{
    background-image: url(../../img/ebp-solution/crm.png);
}
#batiment{
    background-image: url(../../img/ebp-solution/batiment.png);
}
#vente{
    background-image: url(../../img/ebp-solution/vente.png);
    padding-bottom: 65px;
}

.contour-blue, .contour-orange, .contour-red{
    transition-duration: 0.3s;
}

.ebp-composant:hover .contour-blue,.ebp-composant:hover .contour-orange,.ebp-composant:hover .contour-red {
    box-shadow: 3px 3px 6px rgb(0 0 0 / 20%)!important;
}

.ebp-composant:hover .img-titre-ebp { 
    filter: drop-shadow(3px 3px 6px rgb(0 0 0 / 12%));
}

.img-titre-ebp{
    transition-duration: 0.3s;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    filter: drop-shadow(6px 6px 6px rgb(0 0 0 / 55%));
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
}
@media screen and (max-width: 768px) {
    .img-titre-ebp {
        margin-bottom: 10px;
        width: 83.33333333%;
    }
    .contour-blue, .contour-red, .contour-orange{
        width: 83.33333333%;
        padding-left: 0!important;
        padding-right: 0!important;
    }
}
@media screen and (max-width: 1199px) {
    .contour-blue, .contour-red, .contour-orange{
        margin-left: auto;
        margin-right: auto;
    }
}
.pb-ebp {
    padding-bottom: 65px;
}

.tarifs-contact {
    text-align: center;
    font-weight: bold;
    text-decoration: underline !important;
    color :rgb(4 50 103 / 90%);
}

/****PAGE AVIS*****/

.main-inner-container-avis {

    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    background: white;
    color: #333;
    padding: 20px;
    border-radius: 4px;
    border-top: 5px solid #3c75b5;
    width: 125%;
}

.main-inner-container-col1-5 {

    width: calc(20% - 5px);
}

.main-inner-container-col4-5 {

    width: calc(80% - 30px);
    margin-left: 20px;
}

.row {
    margin: 0!important;
}

.avis {
    display: flex;
    background: #fff;
    margin-bottom: 2%!important;
    padding: 20px;
    color: #000;
    box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%);
    border-radius: 6px;
    transition: 0.2s;
    cursor: pointer;
    border: 2px solid transparent;
    align-items: stretch; /* Ajout de l'alignement stretch */
}

.logo-avis {
    width: 100%;
}

.avis_title {
    width: 100%;
    font-size: 22px;
    font-family: 'gill', sans-serif;
    color: #111;
}

.avis_title > p {
    font-size: 14px;
    color: #838383;
}

.avis:hover {
    color: #111;
    box-shadow: 0 1px 6px rgb(0 0 0 / 12%), 0 1px 6px rgb(0 0 0 / 24%);
}

/*.avis_text:before, .avis_text:after {
    content: "❞";
    font-size: 20px;
}*/

.avis_text {
    color: #111111;
    font-size: 16px;
    letter-spacing: 0.8px;
    cursor: inherit;
    font-family: 'Open sans', sans-serif;
    margin-left: 2%;
}

.avis-date {
    text-align: end;
    font-style: italic;
    color: #707070;
}

/************************ 
PAGE EBPsolution
************************/

.image-container {
    display: flex;
    justify-content: space-evenly;
    margin-bottom: 5%;
  }
  
.imgEbp {
    z-index: 2 !important;
    position: relative;
    cursor: pointer;
    transition: filter 0.3s ease-in-out;
}

.imgEbp img {
    width: 200px; /* Change this to your preferred image size */
    height: 200px; /* Change this to your preferred image size */
    border: 1px solid #ccc; /* Optional border */
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5); /* Optional shadow */
    border-radius: 20%;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0;
    background: rgba(0, 0, 0, 0.7);
    color: #fff;
    transition: opacity 0.3s ease-in-out;
    border-radius: 20%;
    border: 1px solid #ccc; /* Optional border */
}

.overlay-text {
    font-family: 'Open sans', sans-serif;
    font-size: 11px;
}

.pdf-logo {
    width: 80px; /* Adjust size as needed */
    height: 80px; /* Adjust size as needed */
    background: url('../../img/ebp-solution/pdf-icon.png') no-repeat center center;
    background-size: cover;
}

.descriptif-pdf {
    text-align: center;
    font-style: italic;
}

/************************ 
Footer
************************/

.container {
    max-width: 1200px;
    margin: 0 auto;
}

/* Style du footer */
footer {
    padding: 20px 0; /* Ajout d'un espace autour du contenu du footer */
}

/* Style de la liste */
.footer-ul {
    list-style: none; /* Suppression des puces de la liste */
    display: flex; /* Utilisation de Flexbox pour aligner les éléments horizontalement */
    flex-wrap: wrap; /* Permet à la liste de passer à la ligne si l'écran est réduit */
    justify-content: space-around; /* Espace égal entre les éléments */
}

/* Style des éléments de la liste */
.footer-li {
    margin-bottom: 10px; /* Espacement entre les éléments verticalement */
}