﻿/* marges avec container-fluid*/


.container-fluid {
    padding: 5px;
}

.contenu-page {
    margin: 95px 0 0 0;
    padding-right: 20px;
    /* marges sur les bords*/
    padding-left: 20px;
}

/* Fil d'ariane pour le référencement */
.filhaut {
    margin: -60px 0 20px 0;
}

/* decale le row*/
.row {
    margin: 0 0 0 50px;
}

.breadcrumb {
    background-color: white;
    font-weight: 700;
    line-height: 1.4;
    font-size: 1.3rem;
}


h1,
h2,
h3,
h4,
h5,
h6 {
    color: darkred;
    font-weight: 700;
    line-height: 1.4;
}

h1 {
    font-size: 3rem;
    text-align: center;
    margin: 0 0 0 0;
    /* marge haute du titre sous la barre*/
}

h1 span.sub {
    color: rgb(182, 3, 3);
    font-size: 1.9rem;
    font-weight: 600;
    font-style: italic;
    display: block;
}

h2 {
    font-size: 2.2rem;
    margin: 15px 0 10px 0px;
}

h2 span.sub2 {
    color: rgb(182, 3, 3);
    font-weight: 600;
    font-size: 1.5rem;
    font-style: italic;
}

/* saut de ligne  display: block; */
h2 span.sub2a {
    color: rgb(182, 3, 3);
    font-size: .75em;
    font-weight: 600;
    font-style: italic;
    display: block;
}

h3 {
    font-size: 1.9rem;
    margin: 15px 0 10px 3px;
}

h3 span.sub3 {
    color: rgb(182, 3, 3);
    font-weight: 600;
    font-size: 1.4rem;
    font-style: italic;
}
/* saut de ligne  display: block; */
h3 span.sub3a {
    color: rgb(182, 3, 3);
    font-size: 1.4rem;
    font-weight: 600;
    font-style: italic;
    display: block;
}

h4 {
    font-size: 1.7rem;
    margin: 15px 0 10px 10px;
}

h4 span.sub4 {
    color: rgb(182, 3, 3);
    font-weight: 600;
    font-size: 1.4rem;
    font-style: italic;
}

h5 {
    font-weight: 700;
    line-height: 1.4;
}

h5 span.sub5 {
    color: rgb(182, 3, 3);
    font-weight: 600;
    font-size: .65em;
    font-style: italic;
}


/* typo  bouton animation hyperliens il suffit de rajouter dans le class btn */



/*bouton animé */
.btn1 {
    cursor: pointer;
    position: relative;
    padding: 10px 20px;
    /*
    background: white;*/
    font-size: 28px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    transition: all 1s;
}

.btn1:after,
.btn1:before {
    content: " ";
    width: 10px;
    height: 10px;
    position: absolute;
    border: 0px solid #fff;
    transition: all 1s;
}

.btn1:after {
    top: -1px;
    left: -1px;
    border-top: 5px solid rgb(215, 8, 8);
    border-left: 5px solid rgb(200, 10, 10);
}

.btn1:before {
    bottom: -1px;
    right: -1px;
    border-bottom: 5px solid rgb(208, 12, 12);
    border-right: 5px solid rgb(216, 13, 13);
}

.btn1:hover {
    border-top-right-radius: 0px;
    border-bottom-left-radius: 0px;
}

.btn1:hover:before,
.btn1:hover:after {
    width: 100%;
    height: 100%;
}

/* hyperlien balise a de base */

/* hyperliens bouton */
.btn-link {
    font-weight: 900;
}

a {
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.2;
    padding-left: 10px;
}

a:hover {
    border-radius: 0px;
    zoom: 110%;/**/
    border-bottom:;
    color: darkblue ;
    background-color:;
    color:;
    padding:;
}








/* taille */
.gros {
    font-size: 1.5em;
}



.declage_txt2 {
    margin-left: 5%;
    margin-top: 0.5%;
    margin-bottom: 0.2em;
}

/*ombrage*/
.shadow1 {
    -moz-box-shadow: 10px 10px 25px #333333;
    -webkit-box-shadow: 10px 10px 25px #333333;
    box-shadow: 10px 10px 25px #333333;
}

.ancre {
    margin-top: 85px;
    /* marge haute du titre sous la barre*/
}




/*  images svg la taille  */
.svg1 {
    max-height: 100px;
    height: 100%;
    width: 100%;
}

.svg2 {
    max-height: 50px;
    height: 100%;
    width: 100%;
}

.logo1 {
    margin: 0;
    max-height: 50px;
    height: 100%;
    width: 100%;
}

/*-----------------------coins arrondis-----------------------*/
.coins_arrondis {
    /* les coins arrondis*/
    -moz-border-radius: 14px;
    -webkit-border-radius: 14px;
    border-radius: 14px;
    behavior: url(/PIE.htc);
}

.coins_arrondis8 {
    /* les coins arrondis*/
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    behavior: url(/PIE.htc);
}

.coins_arrondis24 {
    /* les coins arrondis*/
    -moz-border-radius: 24px;
    -webkit-border-radius: 24px;
    border-radius: 24px;
    behavior: url(/PIE.htc);
}

/*   ---- encadrements lignes ----   */
.p1 {
    border-top: 1px solid blue;
    border-bottom: 2px inset blue;
    padding: 1%;
}

.p2 {
    border-top: 1px solid red;
    border-bottom: 2px inset red;
    padding: 1%;
}

.p4cote {
    border: thick double #32a1ce;
    padding: 0.8%;
}

.p3 {
    border-top: 1px solid red;
    border-bottom: 1px solid red;
    padding: 1%;
    margin-bottom: 3%;
}

.vertical1 {
    border-left: 1px solid red;
    padding: 1%;
}

.vertical2 {
    border-right: 1px solid red;
    padding: 1%;
}

/*  marges  */
.margeBas2 {
    margin-bottom: 3%;
}

.margeHaut2 {
    margin-top: 2%;
}

.margeHaut4 {
    margin-top: 4%;
}

/* retire les marge du row*/
.no-gutter>[class*='col-'] {
    padding-right: 0;
    padding-left: 0;
}

.fond1 {
    background-color: #f0eacc;
    border-radius: 25px;
}

.fond2 {
    background-color: #efeaec;
    border-radius: 25px;
}
.fond3 {
    background-color: #dbefc7;
    border-radius: 25px;
}

/*----------------------------- liste dl   Word    ------------------------------*/
dl.word {
    /*  margin: 2% 2% 2% 5%; */
    padding: 0;
    font-family: georgia, times, serif;
    /*      color: #800000;  */
    margin: -0% 2% 2% 5%;
}

.word dt {
    /* width: 11em; width: 5em;         
    font-size: 1.4em; position: relative;  

    font-size: 1.3em; top: 1.1em;
     */
    left: 0;
    font-weight: bold;
}

.word dd {
    /*  border-left: 1px solid #000;   font-size: 1.1em;    */
    margin: 0.2em 0 0 3em;
    /*margin: 0 0 0 6em; */
    padding: 0 0 .2em .2em;
}

/*-----------------------------   foot    ------------------------------*/
dl .foot {
    /*  margin: 2% 2% 2% 5%; */
    padding: 0;
    font-family: georgia, times, serif;
    /*      color: #800000;  */
    margin: -0% 1% 1% 1%;
}

.foot dt {
    /* width: 11em; width: 5em;         
    font-size: 1.4em; position: relative;  

    font-size: 1.3em; top: 1.1em;
     */
    left: 0;
    font-weight: bold;
    margin: -5px 0px 5px 2px;
}

.foot dd {
    /*  border-left: 1px solid #000;   font-size: 1.1em;    */
    margin: 0em 0 0.4em 2em;
    /*margin: 0 0 0 6em;      margin: 0.3em 0 0 1em;*/
    /*   padding: 0 0 .0em .2em;   */
    font-weight: 700;
}

/* animation avec animate css dans le head*/
.anim1 {
    animation-name: zoomInLeft;
    animation-duration: 3s;
    /* or: Xms */
    animation-iteration-count: 1;
    /* 2fois*/
    animation-direction: normal;
    /*alternate or: normal */
    animation-timing-function: ease;
    /* or: ease, ease-in, ease-in-out, linear, cubic-bezier(x1, y1, x2, y2) */
    animation-fill-mode: forwards;
    /* or: backwards, both, none */
    animation-delay: 3s;
    /* or: Xms */
}

.anim2 {
    animation-name: lightSpeedIn;
    animation-duration: 2s;
    /* or: Xms */
    animation-iteration-count: 1;
    /* 2fois*/
    animation-direction: normal;
    /*alternate or: normal */
    animation-timing-function: linear;
    /* or: ease, ease-in, ease-in-out, linear, cubic-bezier(x1, y1, x2, y2) */
    animation-fill-mode: forwards;
    /* or: backwards, both, none */
    animation-delay: 2s;
    /* or: Xms */
}

.anim3 {
    animation-name: fadeInUpBig;
    animation-duration: 1s;
    /* or: Xms */
    animation-iteration-count: 1;
    /* 2fois*/
    animation-direction: normal;
    /*alternate or: normal */
    animation-timing-function: ease-in-out;
    /* or: ease, ease-in, ease-in-out, linear, cubic-bezier(x1, y1, x2, y2) */
    animation-fill-mode: forwards;
    /* or: backwards, both, none */
    animation-delay: 2s;
    /* or: Xms */
}

/*citations*/
blockquote {
    font-style: italic;
    position: relative;
    font-size: 1.1rem;
    margin: 0 0 0 30px;
}

.blockquote-custom {
    position: relative;
    font-size: 1.1rem;
    margin: 0 0 0 30px;
}

.blockquote-border1 {
    border-style: solid;
    border-bottom-left-radius: 3px;
}






/* scrolltop model 1 retour haut de page */
#myBtn {
    display: none;
    /* Hidden by default */
    position: fixed;
    /* Fixed/sticky position */
    bottom: 20px;
    /* Place the button at the bottom of the page */
    right: 30px;
    /* Place the button 30px from the right */
    z-index: 99;
    /* Make sure it does not overlap */
    border: none;
    /* Remove borders */
    outline: none;
    /* Remove outline */
    background-color: red;
    /* Set a background color */
    color: white;
    /* Text color */
    cursor: pointer;
    /* Add a mouse pointer on hover */
    padding: 15px;
    /* Some padding */
    border-radius: 10px;
    /* Rounded corners */
    font-size: 18px;
    /* Increase font size */
}

#myBtn:hover {
    background-color: #555;
    /* Add a dark-grey background on hover */
}

/* scrolltop  model 2 */
.scrollTop {
    position: fixed;
    z-index: 999999;
    text-align: center;
    text-decoration: none;
    text-indent: 100%;
    padding: 10px;
    height: 40px;
    width: 40px;
    border-radius: 0px;
    bottom: 40px;
    right: 10px;
    background: rgba(30, 115, 190, 0.8)url(https://tutowebdesign.com/wp-content/plugins/brozzme-scroll-top/css/assets/brozzme-scrolltop-arrow.svg) no-repeat center 50%;
}

.scrollTop:hover {
    background: rgba(30, 115, 190, 1) url(https://tutowebdesign.com/wp-content/plugins/brozzme-scroll-top/css/assets/brozzme-scrolltop-arrow.svg) no-repeat center 50%;
}

/* taille icones 
i {
    display: block;
    color: #4494BB;
    font-size: 40px;
    margin: 20px;
    border: 2px solid black;
    border-radius: 100%;
}*/


/* suivant la taille des écrans */
@media(max-width:544px) {
    .navbar .navbar-nav>.nav-item {
        float: none;
        margin-left: .1rem;
    }

    .navbar .navbar-nav {
        float: none !important;
    }

    .navbar .collapse.in,
    .navbar .collapsing {
        clear: both;
    }
}

.pl-perso {
    padding-left: 1rem !important
}

.pl-perso-2 {
    padding-left: 1.5rem !important
}
