@import url("base-vhpCCYt.css"); /* Style du template de base */
@import url("accordion-LM_O0kD.css");
@import url("equipe-BZ8toWE.css"); /* Style de la page equipe */
@import url("galerie-Q89xt04.css"); /* Style de la page galerie */
@import url("article-Hf55IBN.css"); /* Style de la page article */
@import url("mention_legal-ivajrxI.css"); /* Style de la page mention_legal */
@import url("ecurie_proprietaire-8ZsLsul.css"); /* Style de la page ecurie_proprietaire */
@import url("tarif-VWRE0lN.css"); /* Style de la page tarif */
@import url("accueil-pZ9IpAP.css"); /* Style de la page accueil */
@import url("forms-RM6LNgr.css"); /* Style des differents formulaires */
@import url("pagination-Tx-aGqE.css"); /* Style de la pagination */

:root {
 --main_color : #E54083;
 --sec_color : #eb5c95;
 --blue_grey : #222c3aea;
 --white : #ffffff;
 --grey : #e4e4e4;
 --harm1 : #BEECF6;
 --harm2 : #F6F1BE;
 --margin : 0px 15% 100px 15%;
}

/* Mouais */
html, body {
    scroll-behavior: smooth;
}

/* ---------- Regles générales des pages ---------- */
section {
    margin: var(--margin);
}

h4 {
    margin: 10px 0 5px 0;
}

.underline_effect {
    background: linear-gradient(to top, #fff 0%, #fff 1.5px, transparent 1.51px) no-repeat;
    background-size: 0 100%;
    transition-property: background-size;
    transition-duration: 0.35s;
}
.underline_effect:hover {
    background-size: 100% 100%;
}

.description_page { /* Les descriptions principales en haut de chaques pages */
    margin: 0 0 75px 0;
}

.sep_rose {
    min-height: 5px;
    background-color: var(--main_color);
    margin-bottom: 50px;
    border-radius: 10px;
}

.min_sep_rose {
    min-height: 3px;
    max-width: 90%;
    background-color: var(--sec_color);
    border-radius: 10px;
    justify-self: center;
    margin: 0 5%;
}

.sep_blanc {
    min-height: 2px;
    background-color: #fff;
    border-radius: 10px;
}

li {
    list-style-type: none;
}

/* ---------- Regles sans bootstrap ---------- */
/*  - - - - - Les alertes - - - - -  */

.alert {
    margin: 15px;
    padding: 15px;
    border-radius: 10px;
    border: solid 2px;
    background-color: rgba(190, 190, 190, 0.4);
    border-color: rgb(190, 190, 190);
}

.alert-success {
    background-color: rgb(0, 255, 0, .3);
    border-color: rgb(0, 204, 0);
}

.alert-danger {
    background-color: rgb(255, 0, 0, .3);
    border-color: rgb(204, 0, 0);
}

.size {
    font-size: large;
}
.size-big {
    font-size: 300%;
}
.size-120 {
    font-size: 120%;
}
.size-150 {
    font-size: 150%;
}
/*  - - - - - Les boutons - - - - -  */

.crud { /* Une div qui englobe plusieurs boutons pour la mise en page */
    display: flex;
}

.btn {
    margin: 15px 5px 5px 5px;
    text-decoration: none;
    color: #000000;
    padding: 10px 20px;
    font-size: medium;
    background: #fff;
    border: solid #000000 2px;
    border-radius: 7px;
    cursor: pointer;
    transition: .3s;
}

.back {
    border: solid #ff0000 2px;
    color: #ff0000;
    transition: .3s;
}
.back:hover {
    color: #ffffff;
    background-color: #ff0000;
}
.new {
    border: solid #5334ff 2px;
    color: #5334ff;
    transition: .3s;
}
.new:hover {
    color: #ffffff;
    background-color: #5334ff;
}
.edit {
    border: solid #4af118 2px;
    color: #4af118;
    transition: .3s;
}
.edit:hover {
    color: #000000;
    background-color: #4af118;
}
.del {
    border: solid #ff0000 2px;
    color: #ff0000;
    transition: .3s;
}
.del:hover {
    color: #ffffff;
    background-color: #ff0000;
}

/*  - - - - - Les regles uniques - - - - -  */

.flex {
    display: flex;
}
.flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}
.block {
    display: block;
}
.none {
    display: none;
}

.relative {
    position: relative;
}
.absolute {
    position: absolute;
}

.marg-top-10 {
    margin-top: 10px;
}
.marg-top-20 {
    margin-top: 20px;
}
.marg-bot-10 {
    margin-bottom: 10px;
}
.marg-bot-20 {
    margin-bottom: 20px;
}
.marg-bot-50 {
    margin-bottom: 50px;
}
.marg-bot-60 {
    margin-bottom: 60px;
}
.marg-bot-70 {
    margin-bottom: 70px;
}
.marg-bot-100 {
    margin-bottom: 100px;
}

.grid-1 {
    display: grid;
    grid-template-columns: 1fr;
}
.grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.grid-3 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}
.grid-4 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}
.grid-5 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}

.top {
    top: 0;
}
.right {
    right: 0;
}
.bottom {
    bottom: 0;
}
.left {
    left: 0;
}

.flx-end {
    justify-content: flex-end;
}

.z-index-n6 {
    z-index: -6;
}
.z-index-n5 {
    z-index: -5;
}
.z-index-n4 {
    z-index: -4;
}
.z-index-n3 {
    z-index: -3;
}
.z-index-n2 {
    z-index: -2;
}
.z-index-n1 {
    z-index: -1;
}
.z-index-1 {
    z-index: 1;
}
.z-index-2 {
    z-index: 2;
}
.z-index-3 {
    z-index: 3;
}
.z-index-4 {
    z-index: 4;
}
.z-index-5 {
    z-index: 5;
}
.z-index-6 {
    z-index: 6;
}
.z-index-7 {
    z-index: 7;
}
.z-index-8 {
    z-index: 8;
}
.z-index-9 {
    z-index: 9;
}
.z-index-10 {
    z-index: 10;
}
.z-index-11 {
    z-index: 11;
}
.z-index-12 {
    z-index: 12;
}
.z-index-13 {
    z-index: 13;
}
.z-index-14 {
    z-index: 14;
}
.z-index-15 {
    z-index: 15;
}
.z-index-16 {
    z-index: 16;
}

.gap-10 {
    gap: 10px;
}
.gap-20 {
    gap: 20px;
}
.gap-30 {
    gap: 30px;
}
.gap-40 {
    gap: 40px;
}
.gap-50 {
    gap: 50px;
}

.text-align {
    text-align: center;
}

/* ---------- Ajax animation (jQuery) ---------- */
.ui-accordion-content { display:none; }
.active > .ui-accordion-content { display:block; }

/*  - - - - - Généralité - - - - -  */
.ui-accordion-trigger { cursor: pointer; }