/* 
 bleu : #009EE0
*/

#logo a {
background:transparent url('/images/marques/hotzic-380x80.png') no-repeat top left;
}

#connexion img {
    width: 40px;
}

.text-orange{
    color: #009EE0 !important;
}

h1, h2, h3, h4, h1.titre, h1 span.text-orange{
    color: #444444 !important;
}

.h1, .titre_etape, .infotitle, .blocaccueil:not(p){
    color: #009EE0 !important;
}

#fil_ariane a{
    color: #009EE0;
}

div #connexion p a,div #connexion a {
    color:#D1E013;
}

.alert-success, .alert-danger{
    color: #009EE0;
    border-color: #009EE0;
}

.nos_services h2{
    color: #009EE0 !important;
}

a{
    color: #009EE0;
}

a:hover{
    color: #BAC919;
}

/* accueil */
.blocaccueil:not(p):hover{
    color: #BAC919 !important;
}

.button_bg_orange{
    background-color: #D1E013 !important;
}

#accueil_blocdevis h2{
    background: transparent url(../images/hotzic/temps.png) no-repeat top center;
    background-size: contain;
}

#accueil_annuaire h2{
    background: transparent url(../images/hotzic/cout.png) no-repeat top center;
    background-size: contain;
}

#accueil_question h2{
    background: transparent url(../images/hotzic/quest.png) no-repeat top center;
    background-size: contain;
}

#accueil_annuaire h2, #accueil_question h2, #accueil_blocdevis h2{
    padding-top: 100px;
}

#accueil_blocdevis a, #accueil_annuaire a, #accueil_question a{
    color: #009EE0;
    border-color: #009EE0;
}

div.row.text-left label{
    color: #444444 !important;
}

/* header */
div#loginContainer span, div #connexion p a, div #connexion a, div #connexion p a, div #connexion a{
    color: #009EE0 !important;
}

/* boutons */
.button_bg_orange{
    background-color: #009EE0 !important;
}

#accueil_annuaire a.moyenbouton, #accueil_question a.moyenbouton, #accueil_blocdevis a.moyenbouton{
    padding: 5px;
}

a.moyenbouton, #regForm ul li.choixdevis a{
    color: #009EE0 !important;
    border-color: #009EE0 !important;
}

a.moyenbouton:hover, #regForm ul li.choixdevis a:hover{
    color: white !important;
    background-color: #009EE0 !important;
}

.btn:not(button.btn.button_bg_orange.orange, .btn-tel, div.float-left a.btn, .btn-outline-grey, .btn.btn-grey, .btn.rdvsuppression, .btn-link, .btn.mx-2, .btn-choixrecherche){
    background-color: #009EE0 !important;
    border-color: #009EE0 !important;
    color: white !important;
}

.btn:hover:not(.button_bg_orange, .btn-outline-light, .btn-tel, div.float-left a.btn, .btn-outline-grey, .btn.btn-grey, .btn.rdvsuppression,.btn-link, .btn.mx-2, .btn-choixrecherche){
    background-color: white !important;
    border-color: #009EE0 !important;
    color: #009EE0 !important;
    text-decoration: none !important;
}

.nextBtn.btn.btn-choixrecherche{
    border-color: #009EE0 !important;
    color: #009EE0 !important;
}

.nextBtn.btn.btn-choixrecherche:hover{
    background-color: #009EE0 !important;
    color: white !important;
}

.btn.button_bg_orange:hover{
    background-color: #BAC919 !important;
}

/* footer */
.fa-circle{
    color: white;
}

.page-footer a:hover{
    color: #BAC919 !important;
}

/* trouver mon pro */
div.card.card-body.bloc-entreprise:hover{
    border-color: #BAC919;
}

div.card.card-body.bloc-entreprise small:hover{
    border-color: #009EE0;
}

#sort-links li.active a{
    background-color: #009EE0;
}

#Layer_1 > g > g > g > path, #Capa_1 > path{
    fill: #009EE0 !important;
}

.card--container-body-coordinates-radius-marker path.active-path{
    fill: #009EE0 !important;
}

#fiche-annuaire .localisation {
    background: url(../images/hotzic/svg/trier_par_localisation_orange.svg) no-repeat;
    background-position: left top;
    background-size: 20px;
}

#fiche-annuaire .listeavis{
    background: url(../images/hotzic/svg/etoile_pleine.svg) no-repeat;
    background-position:left center;
    background-size: 23px;
}

#fiche-annuaire .experience{
    background: url(../images/hotzic/svg/noun_expert.svg) no-repeat;
    background-position: left center;
    background-size: 35px;
}

#fiche-annuaire .horaire.pt-1{
    background: url(/images/hotzic/svg/annuairehoraires.svg) no-repeat left center;
    background-size: 18px;
}

#fiche-annuaire .reponseforum{
    background: url(/images/hotzic/svg/annuairequestion.svg) no-repeat;
    background-position: left top;
    background-size: 23px;
}

.annuairedescription #description .titrepresentation{
    color: #009EE0 !important;
}

.btn-outline-orange, .btn-choixrecherche{
    color: white !important;
}

.btn-outline-orange:hover, .btn-choixrecherche:hover{
    color: #009EE0 !important;
}

.carousel-control-next-icon, .carousel-control-prev-icon{
    filter: invert(77%) sepia(16%) saturate(5234%) hue-rotate(19deg) brightness(80%) contrast(85%);
    -webkit-filter: invert(77%) sepia(16%) saturate(5234%) hue-rotate(19deg) brightness(80%) contrast(85%);
}

svg.card--badge-icon.heart path.active-path{
    fill: #009EE0;
}

svg.card--badge-icon.rechercheavis path{
    fill: #009EE0 !important;
}

/* https://codepen.io/sosuke/pen/Pjoqqp */
.avis .note img{
    filter: invert(77%) sepia(16%) saturate(5234%) hue-rotate(19deg) brightness(80%) contrast(85%);
    -webkit-filter: invert(77%) sepia(16%) saturate(5234%) hue-rotate(19deg) brightness(80%) contrast(85%);
}

button.linknepassuivre a{
    color: #009EE0;
}

button.linknepassuivre a:hover{
    color: #BAC919;
}

#fiche-annuaire .bandeauenteteannuaire{
    background-image: url(/images/hotzic/fond2.jpg);
}

/* questions */
#questions-reponses textarea::placeholder, #questions-reponses input::placeholder, #questions-reponses select, input::placeholder{
    color: #009EE0;
}

#questions-reponses.container > .row > .col-12:first-child{
    border-right: 1px solid #009EE0;
}

div.question{
    background-color: #009EE0;
}

div.question, .reponse{
    border: 1px solid #009EE0;
}

div.question::before{
    border: 1px solid #009EE0;
    color: #009EE0;
}

div.question::after{
    border-left: 1px solid #009EE0;
    border-bottom: 1px solid #009EE0;
    background-color: #009EE0;
}

p.text-left.text-orange{
    color: #009EE0 !important;
}

.list-group-item span.titre, .list-group-item a{
    color: #009EE0 !important;
}

.list-group-item span.titre:hover, .list-group-item a:hover{
    color: #BAC919 !important;
}

.custom-form hr{
    border-top: 1px solid #009EE0;
}

input#new_titre.form-control:focus, select#famille_metier.form-control.browser-default:focus, textarea#new_contenu.form-control:focus, input#new_email_internaute.form-control:focus, input#new_captcha.form-control:focus, .form-control:focus, .form-control:active{
    border-color: #009EE0;
}

.ui-widget-header{
    border: 1px solid #009EE0 !important;
    background:#009EE0 url("images/ui-bg_gloss-wave_35_f6a828_500x100.png") 50% 50% repeat-x !important;
}

.inforeponse{
    color: #009EE0;
}

.row .col {
    margin-top: 10px;
}

/* services footer */
.navigationmetier a:hover h3{
    background-color: rgba(0,158,224,0.80);
    color: white !important;
}

#home_page .nos_services h2, #home_page .titre_orange{
    color: #009EE0 !important;
}

/* connexion */
input[type=email]::placeholder{
    color: #009EE0;
}

/* vous êtes pro ? */
.card .card-header .btn-link, .fa-caret-down{
    color: #009EE0 !important;
}
.card .card-header .btn-link:hover, .fa-caret-down:hover{
    color: #BAC919 !important ;
}

.bandeau-pro2{
    background-image: url(/images/hotzic/fond4.jpg);
}
.bandeau-pro2 .bloc_texte {
    background-color: #009EE0;
}

.bandeau-pro2 .bloc_texte #signup{
    background-color: white !important;
    color: #009EE0 !important;
}

.bandeau-pro2 .bloc_texte #signup:hover{
    color: #BAC919 !important;
    text-decoration: none !important;
}

.content-section-b .btn{
    color: white !important;
}

.content-section-b .btn:hover{
    color: #009EE0 !important;
}

.bandeau.bandeau-3 .bloc_texte{
    background-color: rgba(0,158,224,0.80);
}

div.modal-header .modal-titre, div.modal-header h5{
    color: #009EE0 !important;
}

.modal-content input[type=email]::placeholder{
    color: #495057 !important;
}

legend{
    color: #009EE0;
}

@media all and (min-width: 1010px){
    #header {height: 130px;background-color: #FFF;}
.header {background-color: #FFF;}
#zonerecherche img, #connexion img {height: 40px;}

/*Menu de navigation */
#menu {background-color: #444444; color: #FFF;}
#menu > ul >  li > a {color: #FFF; font-size: 14px; font-weight: bold;}
#menu ul  li a.menuactif , #menu ul li a:hover {background-color: #009EE0;}

#loginContainer{
    cursor: pointer;
}

#espace_particulier {
    background-color: rgb(60, 184, 215);
    padding: 20px 0px;
}
#espace_particulier .container > h1 {
    text-align: center;
    font-weight: normal;
    padding-bottom: 0px;
    padding-top: 0 !important;
    color: #fff;
}
#home_page #recherche_plateforme {
    position: absolute;
    width: 360px;
    top: 200px;
    right: 20px;
    
}   
    .preheader span{
        color: #D1DE14;
    }
    
    button.btn.button_bg_orange.orange{
        background-color: #D1DE14 !important;
    }
    
    div.row.text-left label{
        color: #D1DE14;
    }
    
    /* header */
    #header{
        max-width: 100%;
    }
    
    #header #logo{
        padding-left: 20%;
    }
    
    #header #connexion{
        padding-right: 20%;
    }
    
    #loginForm{
        margin-right: 350px;
    }
    
    body.scroll div#header{
        height: 100px;
    }
    
    body.scroll div#header #connexion{
        top: 15px;
    }
    
    .preheader .btn{
        margin-top: 3px;
    }
    
    #espace_particulier, #site_espace .large_accueil {
        background-color: rgb(60, 184, 215);
        padding: 20px 0px;
    }
    #espace_particulier .container > h1 {
        text-align: center;
        font-weight: normal;
        padding-bottom: 0px;
        padding-top: 0 !important;
        color: #fff;
    }
    #home_page #recherche_plateforme {
        position: absolute;
        width: 360px;
        top: 200px;
        right: 20px;
        
    }

    /* 404 */
    .bandeau.bandeau-1 {
        background-image: url(/images/hotzic/fond1.jpg);
    }

    .large_accueil{
        background-color: white !important;
    }

    .bandeau.bandeau-1 .bloc_texte{
        background-color: #009EE0;
    }
}