/* @import url('https://fonts.googleapis.com/css?family=Quicksand:400,700&display=swap'); */

.avant-footer{
    margin-top: 90px;
}

.myclear{
    margin: 90px;
}

@media only screen and (min-width: 992px){
  .valign {
    align-items: center;
    display: flex;
}  
}


[data-toggle="collapse"]:after {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f054";
    transform: rotate(90deg) ;
    transition: all linear 0.25s;
    float: right;
}
[data-toggle="collapse"].collapsed:after {
    transform: rotate(0deg) ;
}

.card a {
    float: right;
    color: #FFFFFF;
}

#undefined-sticky-wrapper{
    height: 100px!important
}
.slideshow_p{
    margin-left: 10px;
    float:left
}
#slideshow-a
{
    color: #FFFFFF;
    cursor: pointer!important;
    background:#78BA3B; border-color:#78BA3B;
    font-weight: bold;
    border-radius: 50px
}
#slideshow-a:hover{
    box-shadow: 0px 0px 30px 8px rgba(150, 146, 146, 0.44)
}

.page-banner {
    position: relative!important;
    background-size: 100% 100%!important;
    background-repeat: no-repeat!important;
    background-position: center center!important;
    height: 500px;
    padding: 206px 0;
    overflow: hidden;
    text-align: center;
}

.page-banner h1 {
    font-family: Arial, Helvetica, sans-serif;
    color: #FECB00;
    font-weight: bold;
    text-shadow: 2px 2px 1px black;
    font-size: 48px;
    text-align: center;
    /* background: #80808063; */
    /* border: 2px white solid; */
    border-radius: 10px;
    /* padding: 14px 24px; */
    width: 76%;
    margin: auto;
}
.page-banner h1 img{
    width : 50px
}
.page-banner p{
    font-family: arial;
    margin-top: 15px;
    font-size: 19px;
    color: #0458b4;
    font-weight: bold;
    text-shadow: 1px 1px 0.5px black;
}
#services li .icon {
 margin-bottom: 14px !important;
 /* background: #5d5b5b8c!important; */
 background: #F5F5F5
}
#services li h6{
    line-height: 1.6;
    text-transform: unset;
    letter-spacing: 0.2px;
    font-size: 16px
}
.number_span {
    background-color: #fecb00;
    color: #ffffff;
    /* font-size: 19px; */
    padding: 4px 12px;
    line-height: 50px;
    border-radius: 50%;
    margin-right: 15px;
    box-shadow: 0px 0px 18px rgba(32,96,165,0.2);
}
#calcul-form h5,#choix-garanties h5,#personal-form  h5{
    text-transform: unset;
    font-family: Arial, Helvetica, sans-serif;
    letter-spacing: unset;
    font-size: 26px;
}
#calcul-form .row{
    padding-top:13px;
    padding-bottom: 13px;
    border-top:2px solid #eef2f5
}
#calcul-form label{
    margin-top: 4px;
    font-size: 15px;
    font-weight: 500;
    font-family: arial;
    float: left;
    margin-left: 44px;
}
#calcul-form p{
    font-size: 15px;
    font-weight: 500;
    font-family: arial;
    color: #333
}
.radio-inline__label{
    float: unset!important;
    margin-left: 0!important;
    color: #003861;
    border: 2px #003861 solid;
    cursor:pointer;
    width:222px;
    display: inline-block;
    padding: 0.5rem 1rem;
    margin-right: 18px;
    border-radius: 20px;
    transition: all .2s;
    font-weight: bold!important;
}
.radio-inline__label:hover{
    background: #FECB00!important
}
.radio-inline__input {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
}
.radio-inline__input:checked + .radio-inline__label {
    /* background: #B54A4A; */
    
    
    
    /* text-shadow: 0 0 1px rgba(0,0,0,.7); */
}

.radio-inline__input:focus + .radio-inline__label {
    outline-color: #4D90FE;
    outline-offset: -2px;
    outline-style: auto;
    outline-width: 5px;
}
#calcul-form select
{
    float: right;
    width: 222px;
font-family: arial;
font-size: 15px;
padding: 5px 30px;
border-radius: 20px;
color: #003861;
border: 2px solid;
border-color: #003861;
font-weight: bold;}
#calcul-form option{
    color: #003861; 
    font-weight: bold;
}

.display-none{
    display:none
}
#refresher{
    font-size: 26px;
    color: rgb(254, 203, 0);
    /* float: right; */
    animation: fa-spin 2s infinite linear;
    margin-left: 85px;
}
#calcul-form [type="date"]{
font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    line-height: 27px;
float: right;
width: 222px;
color: #003861;
border: 2px solid #003861;
text-align: center;
font-size: 15px;
border-radius: 20px;
}
#calcul-form [type="text"],
#calcul-form [type="number"]
{
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    line-height: 27px;
float: right;
width: 222px;
color: #003861;
border: 2px solid #003861;
text-align: center;
font-size: 15px;
border-radius: 20px;
}
#calcul-form [type="range"]{
    display: inline;
    width: 40%;
}

.rangeslider__handle {
    border-radius: 50%;
    min-width: 62px;
    line-height: 42px;
    text-align: center;
    
    /* &:after {
      background: 0;
    } */
  }

  #calcul-form button,#choix-garanties button{
      padding:14px 122px;
      border-radius: 50px;
      color: #fff;
      font-weight: bold;
      font-size: 17px;
      background: #70AF36;
      font-family: Arial, Helvetica, sans-serif;
  }
  #choix-garanties button{
      margin-top: 30px
  }
  #calcul-form button:hover,#choix-garanties button:hover{
    box-shadow: 0px 0px 30px 8px rgba(150, 146, 146, 0.44)
  }


.formuleButton{
    font-family: Arial, Helvetica, sans-serif;
    color: #8f9dab;
    font-size: 16px;
    cursor: pointer;
    padding: 8px 22px

}
.formuleButton:hover{
    color: #81c840;
    border: none;
    border-bottom: 5px solid #81c840;

}
.formuleButton:hover img{
    filter: grayscale(0%);
}
.formuleButton img{
    filter: grayscale(100%);
    transition: none!important;
}
.formule-contenu{
    border: 3px solid #eef2f5;
    border-radius: 10px;
    margin-top: 20px
}
.formule-contenu .row1{
    border-bottom: 1px solid #e1e5e9;
    margin-left: 0;
    margin-right: 0
}
.formule-contenu .row1 .col-md-6{
    margin-top:20px;
    margin-bottom: 20px
}
.formule-contenu .th{
    color: #03192a;
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    letter-spacing: 0;
}
.formuleRecListe ul{
    padding-top: 20px;
    padding-bottom: 20px
}
.formuleRecListe li{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    letter-spacing: 1px;
    line-height: 2;
    margin-left:12px
}
.formuleRecListe i{
color:#82C93D;
font-size: 20px;
margin-right: 10px;
}
.formuleRecListe img{
    float:right;
    margin-right: 26px;
    cursor:pointer
}
.formuleRecListe sup{
    font-style: italic;
    color :#82C93D
}
.formuleReP h6{
    font-family: Arial, Helvetica, sans-serif;
    letter-spacing: 1.2px
}
.formuleReP h6 img{
    margin-right: 12px
}
.formuleReP p{
    font-family: Arial, Helvetica, sans-serif;
    color:black;
    letter-spacing: 1px;
    text-align: justify;
    font-size:15px;
    line-height: 1.6;
    padding: 20px;
}


.rangeslider,
input[type='range'] {
  max-width: 50%;
  margin:auto;
  margin-top: 16px;
}

.rangeslider__handle {
  border-radius: 22px;
  min-width: 42px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  color: #003861;
  font-weight: bold;
  background: #FECB00;
  line-height: 42px;
  text-align: center;

}
.rangeslider__handle::after{
    content: none;
}
@media only screen and (max-width:992px){
    #row-puissance label {
        margin-top: -30px;
    }
}


.clickFormule{
    color: #81c840 !important;
    border: none!important;
    border-bottom: 5px solid #81c840!important;
}
.clickFormuleImg{
    filter: grayscale(0%)!important;
}
#formuleChoixConetenu li{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    letter-spacing: 1px;
    line-height: 2;
    margin-left:12px
}
#formuleChoixConetenu li img{
    float:right;
    margin-right: 26px;
    cursor:pointer
}
#formuleChoixConetenu  sup{
    font-style: italic;
    color :#82C93D
}
#formuleChoixConetenu h6 i{
    font-size: 19px;
    color: #E0E0E0;
    
    margin-right: 20px
}
#formuleChoixConetenu  i{
    color: #E0E0E0;
}
#formuleChoixConetenu h6 img{
    filter: grayscale(100%);
    margin-right: 12px;
}
#formuleChoixConetenu .text-center{
    cursor: pointer;
}
#formuleChoixConetenu .text-center p{
    font-family: Arial, Helvetica, sans-serif;
    color:black;
    letter-spacing: 0.8px;
    /* text-align: justify; */
    font-size:14px;
    line-height: 1.6;
    padding: 10px 14px;
}
.green{
    color:#82C93D!important
}
.optionAssistance .drop-menu a.collapsed:after,
.optionAssistance .drop-menu a.title:after{
    content:none;
}
.optionAssistance .drop-menu a.collapsed:before{
    content: "\f055"!important;
    /* color: #dfdfdf; */
}
.optionAssistance .drop-menu a.title:before{
    content: "\f056";
    font-family: 'FontAwesome';
    padding: 0px;
    color: #FECC00;
    border-radius: 50%;
    text-align: center;
    font-size: 16px;
    transform: none;
    margin-right: 15px;
    font-size: 20px;
    /* position: absolute; */
    right: 0px;
    top: 0px;
}



#formuleCarteConetenu h6 img{
    filter: grayscale(100%);
    margin-right: 12px;
}
#formuleCarteConetenu p{
    font-family: Arial, Helvetica, sans-serif;
    color:black;
    letter-spacing: 1px;
    /* text-align: justify; */
    font-size:15px;
    line-height: 1.6;
    padding: 20px;
}
#formuleCarteConetenu li{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    letter-spacing: 1px;
    line-height: 2;
    margin-left:12px
}
#formuleCarteConetenu li label{
    font-weight: unset;
    cursor: pointer;
}

#formuleCarteConetenu li img{
    float:right;
    margin-right: 26px;
    cursor:pointer
}
#formuleCarteConetenu  sup{
    font-style: italic;
    color :#82C93D
}


#formuleCarteConetenu  input,.optionAssistance input{
        opacity: 0;
        visibility: hidden;
        position: absolute;}
#formuleCarteConetenu  input:checked ~ span,
.optionAssistance input:checked ~ span{

    border-color: #82C93D;
    box-shadow: 0px 0px 0px 15px #82C93D inset;}

#formuleCarteConetenu  input:checked ~ span ::after
,.optionAssistance input:checked ~ span ::after {
                    opacity: 1;
                    transform: scale(1);
                }


#formuleCarteConetenu   span,.optionAssistance span{
  
        width: 16px;
        height: 16px;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        /* position: relative; */
        border-radius: 100px;
        background-color: #C7C7C7;
        border: 2px solid #C7C7C7;
        box-shadow: 0px 0px 0px 0px #C7C7C7 inset;
        transition: all 0.15s cubic-bezier(0, 1.05, 0.72, 1.07);
}
.optionAssistance span{
    width: 21px;
    height: 21px;
margin-right: 12px}
#formuleCarteConetenu input:checked ~ span::before,
.optionAssistance input:checked ~ span::before
 {
    content: '✔';
     color: #fff
}
    
.optionAssistance{
    border-top: #C7C7C7 1px solid;
    margin-left: 0;
    margin-right: 0;
    margin-top:30px;
    padding-top:20px;
    padding-bottom:10px
}
.optionAssistance p{
    font-weight: bold;
    color: #003861!important;
    font-size: 18px
}
.optionAssistance p a{
    color: #003861!important;
    cursor: pointer
}

.modal{
    top: 30%!important;
}

#choix-garantiesModal .modal-body{
    padding: 25px 40px
}
#choix-garantiesModal .modal-body img{
    margin-top:30px
}
#choix-garantiesModal .modal-body .close{
    font-size: 40px
}
#choix-garantiesModal .modal-body h5{
    color: #2163ab;
    font-weight: bold;
    font-size: 20px;
    margin-top: 30px;
    margin-bottom: 30px

}
#choix-garantiesModal .modal-body p{
    text-align: justify;
    color: #183a5f !important;
    font-family: Arial, Helvetica, sans-serif;
    letter-spacing: 0.8px;
    font-size: 16px;
    margin-top: 10px;
    padding-left:28px;
    padding-right:28px;
    margin-bottom: 30px
}





#personal-form [type="text"]{
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    line-height: 27px;
float: right;
width: 222px;
color: #003861;
border: 2px solid #003861;
text-align: center;
font-size: 15px;
border-radius: 20px;
}
#personal-form  select
{
    float: right;
    width: 222px;
font-family: arial;
font-size: 15px;
padding: 5px 30px;
border-radius: 20px;
color: #003861;
border: 2px solid;
border-color: #003861;
font-weight: bold;}
#personal-form  option{
    color: #003861; 
    font-weight: bold;
}
#personal-form label{
    
        margin-top: 4px;
        font-size: 15px;
        font-weight: 500;
        font-family: arial;
        float: left;
        margin-left: 44px;
   
}
#personal-form .row {
    padding-top: 13px;
    padding-bottom: 13px;
    border-top: 2px solid #eef2f5;
}
#personal-form .row:last-child {

    border-bottom: 2px solid #eef2f5;
}

.input-alert{
    border : 3px red solid !important
}
.label-alert{
    color: red!important;
    font-weight: bold!important
}

#bonneNouvelle{
    margin-top:26px;
    font-family: Arial, Helvetica, sans-serif;
    background: #367DC3;
    padding: 10px 40px;
    
    font-size: 18px;
    border-radius: 14px
}
#bonneNouvelle p{
    text-align: justify;
    color:white!important;
max-width: 612px;
display: inline-block
}
#bonneNouvelle i{
    color:white!important;
    font-size: 58px;
    margin-right: 16px;
}

header .ownmenu ul.dropdown li a{
    letter-spacing: 0.8px!important
}
header .ownmenu ul.dropdown li a:first-child{
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
}
header .ownmenu ul.dropdown li a:last-child{
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
}
header .ownmenu ul.dropdown li a:hover,
header .ownmenu ul.dropdown li a:focus{
    background: #78BA3B!important
}
.devis{

    background: #78BA3B!important;
    font-weight:bold!important;
    color :white!important;
    padding-right: 24px!important;
    text-align: center!important;
    font-size: 18px!important;
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;

}
.ownmenu a{
    cursor:pointer!important
}


.rate {
    float: left;
    height: 46px;
    padding: 0 30px;
}
.rate:not(:checked) > input {
    position: absolute;
    /* top: -9999px; */
    display: none
}
.rate:not(:checked) > label {
    float: right;
    width: 1em;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
    font-size: 30px;
    color: #ccc;
}
.rate:not(:checked) > label:before {
    content: '★ ';
}
.rate > input:checked ~ label {
    color: #ffc700;
}
.rate:not(:checked) > label:hover,
.rate:not(:checked) > label:hover ~ label {
    color: #deb217;
} 
 .rate > input:checked + label:hover,
.rate > input:checked + label:hover ~ label,
.rate > input:checked ~ label:hover,
.rate > input:checked ~ label:hover ~ label,
.rate > label:hover ~ input:checked ~ label {
    color: #c59b08;
}

#formAvis{
    margin-top:0!important
}
#messageEnvoye{
    display:none;
    color: #70AF36!important;
    text-align: center
}
.input-alertAvis{
    border: 1px red solid !important;
}
.alert-contact {
    color: red;
    font-size: 15px;
}

#envoyer{
    margin-top: 18px;
    background: #70AF36;
    padding: 12px 34px;
    border-radius: 20px;
    color: white;
    font-weight: bold;
    font-size: 18px;
    letter-spacing: 1.5px;
}
#envoyer:hover{
    box-shadow: 0px 0px 30px 8px rgba(150, 146, 146, 0.44)

}

.assurance-title{
    margin-bottom: 50px;
    text-align: center
}
.assurance-title h2{
    color: #183a5f
}
.assurance-title p{
    margin-top:20px;
    /* width: 80%;
    margin:auto; */
    color: #183a5f;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 19px;
    letter-spacing: 1px

}
.assurance-content h2{
    color: #183a5f;
    margin-bottom:31px
}
.assurance-content p{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    margin-top: 18px;
    margin-bottom:26px;
    color: #183a5f;
    text-align: justify
}
.assurance-content p a{
    color:white!important;
    font-weight: bold;
    padding: 8px 20px;
    background: #78BA3B;
    border-radius: 20px;
    margin-right: 12px
}
.assurance-content p a:hover,.savoir-plus:hover{
    box-shadow: 0px 0px 30px 8px rgba(150, 146, 146, 0.44);
}
.savoir-plus{
    color:white!important;
    font-weight: bold;
    padding: 9px 21px;
    background: #78BA3B;
    border-radius: 20px;
    font-family: Arial, Helvetica, sans-serif;
    letter-spacing: 1.2px
}
.offres li{
    text-align: center!important
}
.offres li img{
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}
.offres li div{
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    padding: 20px 10px;
    background: #f2f5f8
}
.offres li h5{
    font-family: Arial, Helvetica, sans-serif;
    color: #183a5f;
    font-weight: bold;
    font-size: 20px;
}
.offres li p{
font-family: Arial, Helvetica, sans-serif;
font-size: 16px
}
.line-height{
    height:80px;
}
.avant-footer .box3{
    text-align: center
}

.assurance-moto span{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    font-weight: bold;
    padding: 12px 20px;
    color: #8f9dab;
    cursor: pointer;
    margin: 12px 26px;
    border-bottom: 5px solid #8f9dab
}
.assurance-moto span:hover{
 color: #81c840;
border: none;
border-bottom: 5px solid #81c840;   
}

#avantages-row .col-md-6 div,
#packs-row .col-md-6 div
{
    padding: 24px;
    border: 3px solid #eef2f5;
    border-radius: 10px  ;
    height: 300px;
}
#avantages-row h3,
#packs-row h3{
    display: inline;
    color: #183A5F;
    font-size: 24px ;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif
}
#avantages-row img,
#packs-row img{
    float: left;
    margin-right: 12px
}
#avantages-row p,
#packs-row p{
    margin-top: 22px;
    text-align: justify;
    font-family: Arial, Helvetica, sans-serif;
}
#packs-row p{
    margin-top:32px!important
}
.line-height-40{
    height: 40px;
}

@media only screen and (max-width:992px)
{
    #avantages-row .col-md-6{
        margin-top:20px
    }
    #avantages-row .col-md-6 div{
        height: auto;
    }
}

.service-assistance li{
    color: #666666;
    list-style-type: disc!important;
    font-family: Arial, Helvetica, sans-serif;
    margin-bottom: 12px;
    line-height: 1.6;
    font-size: 15px;
    text-align: left !important;
    margin-left: 20px;
}
.saviez p{
    font-size: 18px;
    letter-spacing: 1px;
    font-family: Arial, Helvetica, sans-serif;
    text-align:left;
    max-width: unset!important
}
.sinistre h3{
    color: #fecb00;
    font-size: 30px;
    padding-top: 20px;
    font-family: 'open_sansbold';
    font-weight: bold;
    line-height: 40px;
    margin-bottom: 10px;
}
.sinistre_p img{
    background: unset;
    width:10%
}
.sinistre_p p{
    display: inline;
    margin-left: 26px;
    font-family: arial;
}
.prevention p{
    color: #183a5f;
    font-size:16px;
    letter-spacing: 1.2px;
    font-family: Arial, Helvetica, sans-serif
}
.prevention-auto h3{
    color: #fecb00!important;
}
.prev h3{
    display: inline;
    font-size: 24px;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
}
.prev p{
    margin-top: 22px;
    text-align: justify;
    font-family: Arial, Helvetica, sans-serif;
}

.prevention-auto span{
 font-size:15px!important
}

@media only screen and (max-width:992px)
{
.assurance-moto span{
    display:block
}
}

.contenu-prevention H3{
    color: #fecb00;
    font-size: 22px;
    padding-top: 20px;
    font-family: 'open_sansbold';
    font-weight: bold;
    line-height: 20px;
    margin-bottom: 20px;
 
    letter-spacing: 1.2px
}
.contenu-prevention P{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    text-align:justify;
    color: black
}
.contenu-prevention ul li{
    color: black!important;
    letter-spacing: 1.2px
}
.sinistre_h h3{
    color: #fecb00;
    margin-bottom: 20px;
    font-weight: bold

}
.sinistre_h p{
    color: black;
    text-align: justify;
    font-size: 15px;
    letter-spacing: 1.2px;
    font-family: Arial, Helvetica, sans-serif
}
.hab2 h4{
    color: white;
    font-weight: bold
}
.hab2 li{
    color: white!important}
.habit h3{
    color: #fecb00;
    font-size: 30px;
    padding-top: 20px;
    font-weight: bold;
    line-height: 40px;
    margin-bottom: 10px; 
    letter-spacing: 0
}

.habit p{
    color: #666666;
    font-family: Arial, Helvetica, sans-serif;
    margin-bottom: 12px;
    line-height: 1.6;
    font-size: 15px;
}
.mot p{
    letter-spacing: 1px
}
.coor h5{
    margin-bottom:24px;
    color: #FECB00;
    font-size : 22px;
}
.coor i{
    font-size : 22px;
    color: #0076BB !important
}
.coor p{
    color:black;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    text-transform:unset;
    margin-top: 6px
}
.boxes-in {
    border: 1px solid #d0d0d0!important;
    border-radius: 8px
}
.saham select{
    margin-bottom:18px;
    height: 40px;
    width:100%;
    border : 1px solid black;
    padding: 6px 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: black
}
.saham input{
    margin-bottom:18px;
    border : 1px solid black;
    font-family: Arial, Helvetica, sans-serif;
    color: black
}
.saham textarea{
    margin-bottom:18px;
    border : 1px solid black;
    font-family: Arial, Helvetica, sans-serif;
    color: black
}
.saham select::placeholder,
.saham input::placeholder,
.saham textarea::placeholder {
    font-style: italic;
    opacity: 0.8;
    color: rgb(66, 66, 66)
  }
  .msg{
      letter-spacing: 1px;
      font-family: Arial, Helvetica, sans-serif  
    }
.msg .close{
    font-size:20px;
    opacity:0.8
}