/******************************************************************************/
/*                                       compAccueil                          */
/******************************************************************************/

.compAccueil {
    margin: 0 auto;
    position: relative;
    /* padding: 10px 20px; */
}

.compAccueil .headerComposants {}

.compAccueil .headerComposants .footerComposants {}

.compAccueil .headerComposants .footerComposants .contentComposants {}

.compAccueil .headerComposants .footerComposants .contentComposants .topContentComposants {
    padding: 0;
    display: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .topContentComposants .titleComposants {
    display: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .topContentComposants .titleComposants span {}

.compAccueil .headerComposants .footerComposants .contentComposants .topContentComposants .titleComposants a {
    position: absolute;
    right: 0;
    color: #115464;
    font-weight: 700;
    width: 95px;
    height: 14px;
    padding-left: 15px;
    padding-top: 2px;
    font-size: 0.9167rem;
    text-align: left;
    text-decoration: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants {}

/******************************************************************************/
/*                     evenementListe/representationListe                     */
/******************************************************************************/

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .accueilFiltre {
    padding-left: 3px;
    width: 100%;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .accueilFiltre dl {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .accueilFiltre dl dd {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl {
    min-height: 112px;
    margin: 0 auto 15px;
    background-color: var(--gray-Primary-color);
    padding: 15px;
    border-radius: 10px;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl:last-child,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl:last-child {
    margin-bottom: 0;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe .unelignesurdeux,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe .unelignesurdeux {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dt,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dt {
    position: relative;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    width: 110px;
    height: 110px;
    display: inline-block;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe.accueilFiltre dl dt img,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe.accueilFiltre dl dt {
    width: 80px;
    height: 80px;
}


.accueilFiltre .bandeauEtat {
    position: absolute;
    top: 122px;
    width: 80px;
    height: 80px;
    background-position: -22px -14px !important;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dt a,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dt a {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dt .evenementNom,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dt .representationNom {
    display: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dt .evenementDate,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dt .representationDate {
    display: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dt .evenementDate .evenementJour,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dt .representationDate .representationJour {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dt .evenementDate .evenementHeure,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dt .representationDate .representationHeure {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dt img,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dt img {
    height: 110px;
    width: 110px;
    border-radius: 10px;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dt .evenementImageCopyright,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dt .representationImageCopyright {
    display: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd {
    display: inline-block;
    vertical-align: top;
    margin-left: 12px;
    min-height: 110px;
    position: relative;
    width: 86%;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd a,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd a {
    display: block;
    text-decoration: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementNom,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationNom {
    color: var(--text-Tertiary-color);
    font-weight: 700;
    font-size: 1.8333rem;
    display: block;
    margin-bottom: 5px;
    overflow: hidden;
    width: 70%;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .accueilFiltre dl dd .evenementDate,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .accueilFiltre dl dd .evenementNom {
    width: 760px;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .accueilFiltre dl dd .evenementInfo {
    background: 700px;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementNom:hover,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationNom:hover {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .etat10 {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .etat10 span {
    display: block !important;
    font-size: 1.3333rem;
    font-family: 'OswaldRegular', Arial, Helvetica, sans-serif;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementDate,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationDate {
    clear: both;
    color: var(--text-Tertiary-color);
    display: block;
    font-size: 1.1667rem;
    font-weight: 700;
    text-overflow: ellipsis;
    margin-bottom: 5px;
    width: 400px;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementDate span,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationDate span {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementDate .evenementJour,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationDate .representationJour {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementDate .evenementHeure,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationDate .representationHeure {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementGenre {
    color: var(--text-Quaternary-color);
    font-size: 1.1667rem;
    display: inline-block;
    vertical-align: top;
    height: 18px;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSousGenre::before {
    content: " / ";
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSousGenre {
    color: var(--text-Quaternary-color);
    display: inline-block;
    font-size: 1.1667rem;
    vertical-align: top;
    height: 18px;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSalle,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationSalle {
    color: var(--text-Quaternary-color);
    display: inline-block;
    vertical-align: top;
    height: 18px;
}

.evenementSalle {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSalle span,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationSalle span {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSalle .evenementSalleNom,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationSalle .representationSalleNom {
    font-size: 1.1667rem;
    text-transform: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSalle .evenementSalleVille,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationSalle .representationSalleVille {
    font-size: 1.1667rem;
    text-transform: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSalle .evenementSalleAdresse,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationSalle .representationSalleVille {
    display: none;
    font-size: 1rem;
    text-transform: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSalle .evenementSalleAdresse span,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationSalle .representationSalleAdresse span {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSalle .evenementSalleAdresse .evenementSalleCodePostal,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationSalle .representationSalleAdresse .representationSalleCodePostal {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSalle .evenementSalleAdresse .evenementSalleVille,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationSalle .representationSalleAdresse .representationSalleVille {
    display: inherit;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementInfo,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationInfo {
    color: #656565;
    padding-bottom: 5px;
    padding-top: 6px;
    clear: left;
    width: 70%;
    font-size: 1.1667rem;
    text-align: justify;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementInfo,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementInfoComp {
    display: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementInfoComp,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationInfoComp {
    width: 70%;
    font-size: 0.9167rem;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementTarifs,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationTarifs {
    font-size: 1rem;
    color: var(--text-Quaternary-color);
    font-style: italic;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementTarifs .evenementTarifsDetails,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationTarifs .representationTarifsDetails {
    margin-top: 16px;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementTarifs .evenementTarifsMontant,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationTarifs .representationTarifsMontant {
    float: left;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementTarifs span,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationTarifs span {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd a.evenementReserver {
    position: absolute;
    width: 165px;
    padding: 10px;
    background: var(--Primary-color);
    border-radius: 10px;
    text-align: center;
    color: var(--text-secondary-color);
    text-transform: uppercase;
    font-size: 1.5rem;
    right: 15px;
    bottom: 27px;
    border: solid 3px var(--Primary-color);
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .etat11 {
    width: 160px;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd a.evenementReserver:hover {
    background: var(--transparent);
    color: var(--Primary-color);
    border: solid 3px var(--Primary-color);
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd a.etat10:hover,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd a.etat40:hover,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd a.etat60:hover {
    color: var(--gray-Tertiary-color);
    border: solid 3px var(--gray-Tertiary-color);
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver span,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationReserver span {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver:hover span,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationReserver:hover span {}


.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .etat11 span {
    font-size: 1.5rem;
    display: block !important;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat12,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationReserver.etat12,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat60,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat10,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat40 {
    background: none repeat scroll 0 0 var(--Primary-color);
    padding: 10px;
    color: var(--Tertiary-color);
    border: solid 3px var(--Primary-color);
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat12:hover,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationReserver.etat12:hover,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat60:hover,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat10:hover,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat40:hover {
    background: none repeat scroll 0 0 var(--transparent);
    color: var(--Primary-color);
    border: solid 3px var(--Primary-color);
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat10 span,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat11 span,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat60 span,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat40 span,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementReserver.etat12 span,
.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationReserver.etat12 span {
    font-size: 1.3333rem;
    background: none;
}

/******************************************************************************/
/*                              accueilFiltre                                 */
/******************************************************************************/

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl {
    background: url('../image/bg_accueilFiltre.gif') no-repeat left top;
    min-height: 143px;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre .unelignesurdeux {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dt {
    height: 90px;
    width: 90px;
    float: left;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dt a {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dt .representationNom {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dt .representationDate {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dt .representationDate .representationJour {
    display: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dt .representationDate .representationHeure {
    font-size: 25px;
    width: 98px;
    font-weight: 700;
    height: 35px;
    overflow: hidden;
    display: block;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd {
    width: 541px;
    float: left;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd a {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationNom {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationDate {
    display: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationDate span {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationDate .representationJour {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationDate .representationHeure {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dt img {
    padding-top: 2px;
    width: 85px;
    height: 85px;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe.accueilFiltre dl dd .evenementGenre {
    display: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe.accueilFiltre dl dd .evenementSousGenre {
    display: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationSalle {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationSalle span {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationSalle .representationSalleNom {
    color: #17599F;
    font-size: 1rem;
    font-weight: 700;
    text-transform: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationSalle .representationSalleVille {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationSalle .representationSalleAdresse {
    color: #17599F;
    font-size: 1rem;
    font-weight: 700;
    text-transform: none;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationSalle .representationSalleAdresse span {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationSalle .representationSalleAdresse .representationSalleCodePostal {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationSalle .representationSalleAdresse .representationSalleVille {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationInfo {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationInfoComp {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationTarifs {
    display: none;
    padding-left: 92px;
    float: left;
    clear: left;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationTarifs .representationTarifsDetails {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationTarifs .representationTarifsDetails .representationTarifsChoix {
    display: block;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationTarifs .representationTarifsDetails .representationTarifsChoix span {
    font-weight: 700;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationReserver {
    clear: both;
    /* background: url("../image/bgBtHome.jpg") no-repeat scroll center 0 var(--transparent); */
    width: 174px;
    height: 36px;
    margin-top: 10px;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationReserver.etat12 {}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationReserver.etat12 span {
    padding: 3px 0;
}

.compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe.accueilFiltre dl dd .representationReserver span {}

/******************************************************************************/

.compAccueil .headerComposants .footerComposants .contentComposants .bottomContentComposants {
    clear: left;
}

.representationAucun {
    color: var(--text-primary-color);
    margin: 20px 0 0 30px;
}

.bandeauEtat {
    width: 110px;
    height: 110px;
    margin: 0;
    position: absolute;
    top: 0;
}

@media screen and (min-width: 981px) {

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSalle {
        max-width: 250px;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSalle::before {
        content: " - ";
    }
}

/* TABLETTE */

@media screen and (min-width: 768px) and (max-width: 980px) {

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd,
    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd {
        width: 80%;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementInfo,
    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationInfo {
        width: 59%;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementInfoComp {
        width: 59%;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd a.evenementReserver {
        right: 0px;
        bottom: 30px;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSalle,
    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationSalle {
        display: block;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementSalle .evenementSalleNom,
    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationSalle .representationSalleNom {
        padding: 5px 0px;
    }
}

/* TELEPHONE */

@media screen and (max-width: 767px) {

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl {
        width: 300px !important;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl:first-child {
        margin-top: 15px;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dt,
    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dt {
        float: none;
        display: block;
        margin: 5px auto 10px;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementNom,
    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationNom {
        width: 100%;
        text-align: center;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementDate,
    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationDate {
        font-size: 1rem;
        width: 100%;
        text-align: center;
    }

    .evenementSalle {
        width: 100%;
        text-align: center;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementTarifs,
    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationTarifs {
        width: 100%;
        text-align: center;
    }

    .evenementGenre,
    .evenementSousGenre {
        display: none !important;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementInfo,
    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationInfo,
    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .evenementListe dl dd .evenementInfoComp,
    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .representationListe dl dd .representationInfoComp {
        width: 90%;
        padding: 10px 20px;
    }

    .evenementReserver {
        position: inherit !important;
        bottom: 0 !important;
        margin: 15px auto;
        width: 90px;
        right: 0 !important;
    }

    .evenementReserver.etat12 {
        width: 150px;
    }

    .evenementListe dl {
        width: 100% !important;
    }

    .compAccueil .headerComposants .footerComposants .contentComposants .dataContentComposants .accueilFiltre {
        width: auto;
    }
}

.typeVenteEvt {
    text-align: center;
    color: #0079bc;
    font-weight: 700;
    font-size: 1.25rem;
}