
.navbar { margin-bottom: 20px; }


/* footer tip */


html, body { height: 100%; }

#wrap { min-height: 100%; }

#main {
    overflow: auto;
    padding-bottom: 250px;
}

footer {
    clear: both;
    margin-top: -230px;
    min-height: 230px;
    position: relative;
}

/*Opera Fix*/

body:before {
    content: "";
    float: left;
    height: 100%;
    margin-top: -32767px;
    width: 0;
}

/* footer tip end*/

/* desactive le responsive 
------------------------------------------------------------------------------------ */

.container { width: 970px; }

.contactW {
    width: 100%;
    height: auto;
}

@media (min-width: 768px) {
    .container { width: 1000px; }
}

/* param generaux 
------------------------------------------------------------------------------------ */

body {
    background-color: #e7e7e8;
    font-family: 'Raleway', arial, helvetica, sans-serif;
    font-size: 13px;
    font-weight: 400;
}

a, button {
    color: inherit;
    text-decoration: underline;
}

a:hover, a:active, button:hover, button:active {
    color: inherit;
    text-decoration: underline;
}

p { line-height: 1.7; }

strong {
    color: #454545;
    font-weight: 600;
}


/* alertes 
------------------------------------------------------------ */

.alert-success {
    background-color: #96c53a;
    border: 1px solid #7ba22f;
    color: #ffffff;
}

.alert-info {
    background-color: #4386ea;
    border: 1px solid #346abb;
    color: #ffffff;
}

.alert-danger {
    background-color: #ea4b43;
    border: 1px solid #bb3a34;
    color: #ffffff !important;
}

.alert { border-radius: 0; }

.alert strong {
    color: #ffffff;
    font-weight: bold;
}

.text-warning { color: #ff8b0e !important; }

#txt-message-RNVP.text-warning {
    color: #ff8b0e !important;
    text-align: right;
    width: 100%;
}

#txt-message-RNVP.text-danger {
    color: #ea4b43 !important;
    text-align: right;
    width: 100%;
}

#alertContratNonValide {
    background: url('../img/warning.gif') no-repeat 10px center #fff;
    border-left: solid 5px #ddd;
    color: #b94a48;
    display: block;
    height: 47px;
    line-height: 47px;
    margin: 29px 15px 0 0;
    padding-left: 57px;
    position: absolute;
    right: 0;
    text-decoration: none;
    width: 184px;
}

#alertContratNonValide.large { width: 258px; }

#alertContratNonValide span {
    display: inline-block;
    line-height: 14px;
    vertical-align: middle;
}

#alertContratNonValide span + span { margin-left: 20px; }

.caretRight {
    border-color: transparent transparent transparent #fff;
    border-style: solid;
    border-width: 3.5px 0 3.5px 4px;
    display: inline-block;
    height: 0;
    margin-left: 10px;
    vertical-align: middle;
    width: 0;
}

/*souscription*/

/* titres 
------------------------------------------------------------------------------------ */
h1 {
    color: #454545;
    font-size: 24px;
    font-weight: 200;
    margin-bottom: 40px;
    text-align: center;
    text-transform: uppercase;
}

h1 strong { font-weight: 700; }

h1 sub {
    font-size: 14px;
    font-weight: 300;
}

h1 small {
    font-size: 14px;
    font-weight: 300;
    text-transform: initial;
}

.panel-body h3 {
    font-weight: 700;
    margin-top: 0;
}

h3 {
    color: inherit;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
}

h3.panel-title {
    font-size: 17px;
    font-weight: 700;
    text-transform: none;
}


/* panels ( titre bleu + bloc )
------------------------------------------------------------------------------------ */

.panel {
    -moz-box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, .1);
    -o-box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, .1);
    -webkit-box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, .1);
    background-color: transparent;
    border-radius: 0;
    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, .1);
    filter: progid:DXImageTransform.Microsoft.Shadow(color=#d8d8d8, Direction=NaN, Strength=5);
}

.noShadow {
    -moz-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
    -o-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
    -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
    filter: progid:DXImageTransform.Microsoft.Shadow(color=#ffffff, Direction=NaN, Strength=0);
}

.panel-primary { border: none; }

.panel-heading {
    border: none;
    border-radius: 3px;
    padding: 15px 28px;
}

.ListeContrats {
    padding: 20px 20px 40px;
} 

.panel-primary .panel-heading { background-color: #8ed3d7; }

.panel-body {
    background: #ffffff;
    border-radius: 3px;
    color: #666666;
    display: block;
    padding: 24px 28px 14px 28px;
    position: relative;
}

.panel-body.no-padding-bottom { padding-bottom: 0; }

.panel-body.padding-egal { padding-bottom: 24px; }

.photo01 {
    background: url(../img/photos/01.jpg) no-repeat top center #ffffff;
    padding-top: 278px;
}


/* table 
------------------------------------------------------------------------------------ */

table.demat {
    border-collapse: collapse;
    margin: -10px -28px 0 -28px;
    width: calc(100% + 56px);
}

table.alignText label {
   margin-left: 20px
}

table.demat tr { vertical-align: middle; }

table.demat tr:nth-child(even) { background-color: rgba(0, 0, 0, .04); }

table.demat tr { border-bottom: 1px solid #dedede; }

table.demat tr th {
    color: #666666;
    font-weight: 700;
    height: 30px;
    padding-bottom: 5px;
    padding-top: 5px;
    vertical-align: middle;
}

table.alignTh tr th {
    text-indent: 20px
}

table.demat tr td {
    height: 36px;
    padding-bottom: 5px;
    padding-right: 1px;
    padding-top: 5px;
    vertical-align: middle;
}

table.demat tr th + th,
table.demat tr td + td { /*	padding-left: 20px;*/ }

table.demat tr th:first-child,
table.demat tr td:first-child { padding-left: 28px; }

table.demat tr th:nth-child(2),
table.demat tr td:nth-child(2) { padding-left: 10px; }

table.demat tr th:last-child,
table.demat tr td:last-child { }

table.demat tr td.tdGras {
    color: #454545;
    font-weight: 500;
}

table.demat tr td.aLink {
    height: 100%;
    min-height: 100%;
    min-width: 88px; /* 60 + 28 de pad right*/
    padding: 0;
    text-align: center;
    vertical-align: middle;
}

table.demat tr td.aLink button {
    background-color: #666666;
    border: none;
    border-radius: 3px;
    color: #ffffff;
    display: inline-block;
    font-weight: 500;
    margin-right: 20px;
    max-width: 60px;
    padding: 4px 10px;
    text-align: center;
    vertical-align: middle;
    width: 100%;
}

table.demat tr td.aLink button:hover {
    background-color: #ffffff;
    border: 1px solid #666666;
    color: #666666;
}

table.demat tr td.aLink button .glyphicon { color: #ffffff; }

table.demat tr td.aLink button:hover .glyphicon { color: #666666; }

table.demat tr:hover { background-color: rgba(0, 0, 0, .1); }

table.demat tr:first-child:hover { background-color: rgba(0, 0, 0, .0); }

table.demat .tooltip-wrapper {
    display: inline-block;
    margin-right: 4px;
}

table.colFixes { table-layout: fixed; }



/* page commande */
.panel-body.commandeRecap h3 {    margin-top: 30px; margin-bottom: 5px;}
.panel-body.commandeRecap textarea {    min-height: 72px;    margin-bottom: 45px;}
.panel-body.commandeRecap p{line-height: 1.2;}
.panel-body.commandeRecap .ablocBlanc{margin-bottom: 5px;}
.panel-body.commandeRecap .commandFileName{text-align: right; color:#adadad; font-style: italic; }
.panel-body.commandeRecap hr{position:relative; width: calc(100% + 56px); margin-left: -28px;}


/* listes
------------------------------------------------------------------------------------ */

.panel-body dl { width: 100%; }

.panel-body dl dt {
    display: inline-block;
    font-weight: 300;
    padding: 4px 0 0px 0;
    text-align: right;
    vertical-align: top;
}

.panel-body dl dd {
    color: #454545;
    display: inline-block;
    font-weight: 600;
    padding: 4px 0 0px 20px;
    vertical-align: top;
}

.panel-body .dl4col dl dt,
.panel-body .dl4col dl dd {
    display: block;
    padding-left: 0;
    padding-right: 0;
    text-align: center;
}

.panel-body dl.w3070 dt { width: 30%; }

.panel-body dl.w3070 dd { width: 70%; }

.panel-body dl.w4060 dt { width: 40%; }

.panel-body dl.w4060 dd { width: 60%; }

.panel-body dl.w50 dd, .panel-body dl.w50 dt { width: 50%; }

ul.ulBleu {
    list-style: none;
    padding-left: 15px;
}

ul.ulBleu li:before {
    color: #8ed3d7;
    content: '\25cf';
    font-size: 120%;
    margin: 0 10px 0 -15px;
}






/* gros blocs bleux
--------------------------------------------------------------------------------*/

section.watchIt {
    background-color: #8ed3d7;
    margin-bottom: 40px;
    margin-top: 30px;
    padding: 65px;
    text-align: center;
    /* ceux sur toute la largeur */
    width: 100%;
}

section.watchIt .watchItBig {
    color: #ffffff;
    font-size: 24px;
    font-weight: 200;
    margin: 0;
    text-transform: uppercase;
}

section.watchIt .watchItBig strong {
    color: #ffffff;
    font-weight: 700;
}

article .watchIt {
    background-color: #8ed3d7;
    color: #ffffff;
    margin-bottom: 20px;
    margin-top: 20px;
    padding: 35px;
    text-align: center;
    /* ceux contenus dans un article */
    width: 100%;
}

article .watchIt .watchItsmall {
    font-size: 16px;
    font-style: italic;
    font-weight: 500;
    padding-left: 80px;
    text-align: left;
}

article .watchIt .watchItsmall .fa {
    font-size: 200%;
    margin-left: -50px;
    position: absolute;
}

article .strong { }



/* header 
------------------------------------------------------------------------------------ */

header {
    background: url(../img/background-header.png) no-repeat fixed right top transparent;
    height: 211px;
    margin-bottom: 69px;
    background-color: #e2e8ea;
}

.navbar {
    -moz-box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, .1);
    -o-box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, .1);
    -webkit-box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, .1);
    background-color: #ffffff;
    border-bottom: 8px solid #f5f5f5;
    border-radius: 3px;
    box-shadow: 2;
    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, .1);
    filter: progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=5);
    font-weight: 700;
    height: 65px;
    margin: 138px 0 30px 0;
}

.nav > li {
    display: inline-block;
    height: 56px;
    line-height: 56px;
    vertical-align: middle;
}

.nav > li > a {
    color: #666666;
    display: inline-block;
    font-weight: 700;
    line-height: 1.2;
    padding: 0 20px;
    text-decoration: none;
    text-transform: uppercase;
    vertical-align: middle;
}

.navbar-collapse {
    padding-left: 0;
    padding-right: 0;
}

.navbar .container-fluid { padding-left: 0; }

.navbar .caret { margin-bottom: 3px; }

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
    /* li niveau 1 quand il permet de deployer un niveau 2. bref le li titre*/
    background-color: #f5f5f5;
    color: #666666 !important;
}

.navbar-default .navbar-nav li.open { background-color: #f5f5f5; }

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    color: #666666 !important;
    transition: all 0.3s;
}


/* logo  ------------------------------------------------------------- */

.navbar-brand {
    margin-top: 20px;
    position: absolute;
    top: 20px;
}

.defaultLogoHeight {
    height: 53px;
}

.navbar-brand.logoClub {
    background: url(../img/logo-roole.svg) no-repeat center center;
    background-size: contain;
}

.navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand { margin-left: 0; }

/* effet 3D menu
------------------------------------------- */

nav a {
    color: #fff;
    display: inline-block;
    font-size: 1.35em;
    font-weight: 400;
    letter-spacing: 1px;
    margin: 15px 25px;
    outline: none;
    position: relative;
    text-decoration: none;
    text-shadow: 0 0 1px rgba(255, 255, 255, 0.3);
    text-transform: uppercase;
}

/* Effect 11: text fill based on Lea Verou's animation http://dabblet.com/gist/6046779 */

.cl-effect-11 a {
    color: #0972b4;
    padding: 10px 0;
    text-shadow: none;
}

.cl-effect-11 a::before {
    -moz-transition: max-width 0.5s;
    -webkit-transition: max-width 0.5s;
    border-bottom: 2px solid #fff;
    color: #fff;
    content: attr(data-hover);
    left: 0;
    max-width: 0;
    overflow: hidden;
    padding: 10px 0;
    position: absolute;
    top: 0;
    transition: max-width 0.5s;
}

.cl-effect-11 a:hover::before,
.cl-effect-11 a:focus::before { max-width: 100%; }


/* menu se loger --------------------------------------------------------- */

#alertBar {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    padding: 12px 32px;
    background: #0D0D0D;
}

#alertBar-label-container {
    display: flex;
    align-items: start;
    gap: 8px;
}
#alertBar-label-container p {
    color: white;
    font-size: 16px;
    line-height: 25.6px;
    margin: 0;
    padding: 0;
}

#alertBar-toggle-container {
    display: flex;
    align-items: center;
    gap: 8px;
}
#alertBar-toggle-container p {
    color: white;
    font-size: 13px;
    line-height: 1;
    margin: 0;
    padding: 0;
    white-space: nowrap;
}
#toggleInterface {
    width: 40px;
    height: 24px;
    border-radius: 24px;
    background: #EAEAEA;
    position: relative;
}
#toggleInterface div {
    position: absolute;
    left: 2px;
    top: 2px;
    width: 20px;
    height: 20px;
    border-radius: 100px;
    background: white;
}

.seloger { position: relative; }

#seLog, #profil, #adminBtn, .menuTopflotant.btn, #switchWetrak {
    background-color: #ffffff;
    color: #666666;
    display: inline-block;
    float: right;
    font-size: 11px;
    font-weight: 300;
    margin-left: 15px;
    padding: 0;
    right: 0;
    text-align: center;
    text-decoration: none;
    text-transform: inherit;
    top: 0;
}

#adminBtn > .glyphicon,
#adminBtn > .fa,
.menuTopflotant.btn > .glyphicon,
.menuTopflotant.btn > .fa {
    left: 15px;
    position: absolute;
    top: 12px;
}

#adminBtn a.dropdown-toggle,
#profil a.dropdown-toggle,
.menuTopflotant.btn a.dropdown-toggle {
    display: inline-block;
    height: 37px;
    padding: 10px 15px 10px 35px;
    position: relative;
    text-decoration: none;
}

#seLog i,
#profil i {
    font-size: 13px;
    margin-right: 8px;
}

#seLog .glyphicon,
#profil .glyphicon {
    font-size: 12px;
    margin-right: 8px;
}

#seLog:after,
#profil:after { background: #f5f5f5; }

#switchWetrak {
    height: 37px;
    padding: 0;
}

#switchWetrak input {
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    background-image: url('../img/wetrak/switchWetrak.png');
    background-repeat: no-repeat;
    border: 1px solid #666666;
    border-radius: 0;
    padding: 10px 15px 10px 50px;
}

#switchWetrakOn {
    background-position: left top;
    display: block;
}

#switchWetrakOff {
    background-position: left bottom;
    display: none;
}



/* sous menu ------------------------------------------------------------- */

/*
li:hover ul.dropdown-menu {  
	display: block;
}
visible au roll over*/

.navbar-nav > li:hover {
    background-color: #f5f5f5;
    color: #666666;
}

.navbar-nav > li > .dropdown-menu,
#adminBtn .dropdown-menu, #profil .dropdown-menu, .menuTopflotant .dropdown-menu {
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, .175);
    background-color: #f5f5f5;
    border: 0px solid rgba(0, 0, 0, 0);
    border-radius: 3px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .175);
    color: #666666;
    margin-top: 8px;
    padding: 0px 0 0 0;
}

#adminBtn .dropdown-menu, #profil .dropdown-menu, .menuTopflotant .dropdown-menu { margin-top: 0px; }

.navbar-nav > li > .dropdown-menu,
.navbar-nav > li > .dropdown-menu,
#adminBtn .dropdown-menu,
.menuTopflotant .dropdown-menu {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.navbar-nav > li > .dropdown-menu > li > a {
    color: rgba(102, 102, 102, .5);
    font-size: 13px;
    font-weight: 700;
    line-height: 40px;
    text-align: left;
    text-decoration: none;
    text-transform: uppercase;
}

#profil .dropdown-menu > li > a,
#adminBtn .dropdown-menu > li > a,
.menuTopflotant .dropdown-menu > li > a {
    color: rgba(102, 102, 102, .5);
    font-size: 13px;
    line-height: 40px;
    text-align: left;
    text-decoration: initial;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
    background-color: #ffffff;
    color: rgba(102, 102, 102, 1) !important;
}

.dropdown-menu > li:last-child > a:hover,
.dropdown-menu > li:last-child > a:focus {
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

.navbar-nav > li a { text-align: left; }

.blog-nav > .nav li a {
    font-size: inherit;
    letter-spacing: 0;
    margin: 0;
}

.navBarRecherche { margin-right: 0px !important; }

.navbar-nav { margin: 0; }

/* réorga des menus
  .navbar-nav > li > .dropdown-menu > li > a{text-transform: none; line-height: 30px;     font-weight: 600;}
  .dropdown-header{text-transform: uppercase; line-height: 40px;}
  li.subDivider a{padding-left: 33px;}
  .dropdown-menu .divider{margin: 0;}
*/

.navBarRecherche span {
    display: inline-block;
    vertical-align: middle;
}

.navBarRecherche span.glyphicon-search {
    font-size: 24px;
    margin-right: 10px;
}

#menuDistrib {
    left: auto;
    right: 0;
}

#menuDistrib ul li {
    position: relative;
    text-align: right;
}

#menuDistrib ul li a span { display: inline-block; }

#menuDistrib ul li a span:first-child { display: block; }

#menuDistrib span.distriVille { font-weight: 700; }

#menuDistrib li.selection:before {
    border-color: transparent transparent transparent #333;
    border-style: solid;
    border-width: 4px 0 4px 4px;
    content: "";
    display: block;
    height: 0;
    margin: 18px 0 0 10px;
    position: absolute;
    width: 0;
}

#menuDistrib li.selection > a { color: rgba(102, 102, 102, 1) !important; }

/* page profil */

form#formProfil .row { margin-bottom: 20px; }

form#formProfil .libelle {
    font-weight: bold;
    text-align: right;
}

form#formProfil table.distrib {
    border-collapse: collapse;
    margin: 0 0 0 -10px;
    position: relative;
    width: 100%;
}

form#formProfil table.distrib tr {
    border-bottom: 1px solid #dedede;
    border-top: 1px solid #dedede;
    vertical-align: middle;
}

form#formProfil table.distrib tr:last-child { border-bottom: none; }

form#formProfil table.distrib tr td { max-width: 400px; }

form#formProfil table.distrib tr td {
    height: 36px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-top: 5px;
}

form#formProfil table.distrib { }

form#formProfil table.distrib tr:nth-child(even) { background-color: rgba(0, 0, 0, .04); }


/* footer 
---------------------------------------------------------  */

footer { padding: 25px 0; }

footer a:hover,
footer a:hover { text-decoration: none; }

footer a:hover,
footer a:active {
    background-color: #666666;
    color: #f5f5f5;
    padding: 3px 0;
}

footer a:hover,
footer a:active {
    background-color: #ffffff;
    color: #666666;
    padding: 3px 0;
}

footer {
    background-color: #f5f5f5;
    color: #666666;
}

footer {
    background-color: #666666;
    color: #ffffff;
    text-align: justify;
}

footer .container { position: relative; }

footer .container .MentionsCNIL { font-size: 11px; }

footer .container .InfosPratiques { text-align: center; }

footer .container .InfosPratiques { text-align: center; }

footer .container .InfosPratiques div + div { border-left: 1px solid #ffffff; }

p.perspectivefb {
    -moz-perspective: 800px;
    -webkit-perspective: 800px;
    margin: 0 15px 0 0;
    padding: 0;
    perspective: 800px;
    position: absolute;
    right: 0;
    z-index: 1;
}

a#fblogo {
    background: url(../img/fb.png) no-repeat center center transparent;
    height: 35px;
    padding: 0;
    width: 92px;
}

a#fblogo:after { background-color: #2c4370; }

a#fblogo:hover { opacity: 1 !important; }

/* font */

/* content
--------------------------------------------*/

.tr,
fieldset.declaTypeSinistre input[type=radio] + label,
fieldset.declaTypeSinistre input[type=radio] + label:after {
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

nav li {
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.dropdown-menu li a,
table button {
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}




/* effet bouton
----------------------------------------- */

p.perspective {
    -moz-perspective: 800px;
    -ms-perspective: 800px;
    -webkit-perspective: 800px;
    display: inline-block;
    margin: 0;
    padding: 0;
    perspective: 800px;
    position: relative;
    z-index: 1;
}

.btn {
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    background: none;
    border: none;
    border-radius: 0 !important;
    color: inherit;
    cursor: pointer;
    display: inline-block;
    font-family: inherit;
    font-size: inherit;
    font-weight: 700;
    letter-spacing: 1px;
    outline: none;
    padding: 25px 80px;
    position: relative;
    /*margin: 15px 30px;*/
    text-transform: uppercase;
    transition: all 0.3s;
}

.btn:after {
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    content: '';
    position: absolute;
    transition: all 0.3s;
    z-index: -1;
}

.btn-8 {
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    display: block;
    outline: 1px solid transparent;
    transform-style: preserve-3d;
}

.btn-8:active { background: #55b7f3; }

.btn-8b:after {
    -moz-transform: rotateX(-90deg);
    -moz-transform-origin: 0% 0%;
    -ms-transform: rotateX(-90deg);
    -ms-transform-origin: 0% 0%;
    -webkit-transform: rotateX(-90deg);
    -webkit-transform-origin: 0% 0%;
    height: 40%;
    left: 0;
    top: 100%;
    transform: rotateX(-90deg);
    transform-origin: 0% 0%;
    width: 100%;
}

.btn-8b:hover {
    -moz-transform: rotateX(15deg);
    -ms-transform: rotateX(15deg);
    -webkit-transform: rotateX(15deg);
    transform: rotateX(15deg);
}

/* forms formulaire
------------------------------------------------------------------------------------ */

button, input:not([type=file]), select, textarea {
    background-color: #f5f5f5;
    border: none;
    border-radius: 3px;
    color: #454545;
    font-family: inherit;
    font-size: 100%;
    font-size: inherit;
    font-weight: 500;
    line-height: 1.4285;
    padding: 8px;
}

input:not([type=file]), textarea, select { border: 1px solid #dddddd; }

input:focus, /* supprimer le contour bleu au focus safari */
button:focus,
select:focus,
textarea:focus { outline: none; }

input::-webkit-input-placeholder {
    color: #666666;
    font-weight: 300;
}

input::-moz-placeholder {
    color: #666666;
    font-weight: 300;
}

/* firefox 19+ */

input:-ms-input-placeholder {
    color: #666666;
    font-weight: 300;
}

/* ie */

input:-moz-placeholder {
    color: #666666;
    font-weight: 300;
}


select::-webkit-input-placeholder {
    color: #666666;
    font-weight: 300;
}

select::-moz-placeholder {
    color: #666666;
    font-weight: 300;
}

/* firefox 19+ */

select:-ms-input-placeholder {
    color: #666666;
    font-weight: 300;
}

/* ie */

select:-moz-placeholder {
    color: #666666;
    font-weight: 300;
}


textarea::-webkit-input-placeholder {
    color: #666666;
    font-weight: 300;
}

textarea::-moz-placeholder {
    color: #666666;
    font-weight: 300;
}

/* firefox 19+ */

textarea:-ms-input-placeholder {
    color: #666666;
    font-weight: 300;
}

/* ie */

textarea:-moz-placeholder {
    color: #666666;
    font-weight: 300;
}

input.iconError,
input.input-validation-error,
input.ui-autocomplete-input.error,
.immatError { background: url(../img/iconError.png) no-repeat right center #ffd7d5; }

input.iconWarning,
fieldset.createStep2Valide input.danger { background: url(../img/iconWarning.png) no-repeat right center transparent; }

input.iconValid { background: url(../img/iconvalid.png) no-repeat right center transparent; }

fieldset.createStep2Valide input.success,
fieldset.createStep2Valide input.danger.success,
.immatSuccess { background: url(../img/iconvalid.png) no-repeat right center transparent; }

input .disabled { }

input:disabled,
select:disabled { background-color: #cccccc; }

.pttinput {
    display: inline-block;
    width: 50px;
}

/*  positionnement avec retour a la ligne & tailles */

.wb { display: block; }

.wb100 {
    display: block;
    width: 100%;
}

.wb300 {
    display: block;
    width: 300px;
}

.control-nonlabel {
    font-weight: 500;
    margin-bottom: 0;
    padding-left: 0;
    padding-top: 7px;
}

.engras { font-weight: bold; }

.c-disable { cursor: not-allowed; }

/*
positionnement meme ligne 
form-horizontal 		sur le conteneur
control-label 			sur le label si on veut l'aligner a droite
form-control 			
*/



/* btn facebook
------------------------------------------------------------------ */

.fb_iframe_widget {
    margin-right: 15px !important;
    position: absolute !important;
    right: 0 !important;
}


/* color & btn' color
------------------------------------------------------------------ */


.panel-body a:hover {
    background-color: #666666;
    color: #ffffff;
    text-decoration: none;
}

a.ablocBlanc, button.ablocBlanc, .btnLegend.ablocBlanc,
a.ablocBleu, button.ablocBleu, .btnLegend.ablocBleu,
a.ablocCreme, button.ablocCreme, .btnLegend.ablocCreme,
a.ablocRouge, button.ablocRouge, .btnLegend.ablocRouge,
a.ablocVert, button.ablocVert, .btnLegend.ablocVert,
a.ablocBleu2, button.ablocBleu2, .btnLegend.ablocBleu2,
a.ablocRouge2, button.ablocRouge2, .btnLegend.ablocRouge2,
a.ablocGris, button.ablocGris, .btnLegend.ablocGris {
    display: inline-block;
    min-width: 145px;
    padding: 10px 20px;
    text-decoration: none;
}

.btnSmall { min-width: 0 !important; }

a.ablocBlanc, button.ablocBlanc, .btnLegend.ablocBlanc {
    background-color: #ffffff;
    border: 1px solid #dfdfdf;
    color: #666666;
}

a.ablocBlanc:hover, button.ablocBlanc:hover, .btnLegend.ablocBlanc {
    background-color: #ffffff;
    border: 1px solid #dfdfdf;
    color: #454545;
}

a.ablocBlanc:after, button.ablocBlanc:after, .btnLegend.ablocBlanc { background: #dfdfdf; }

a.ablocGris, button.ablocGris, .btnLegend.ablocGris {
    background-color: #f5f5f5;
    border: 1px solid #dddddd;
    color: #666666;
}

a.ablocGris:hover, button.ablocGris:hover, .btnLegend.ablocGris {
    background-color: #f5f5f5;
    border: 1px solid #dddddd;
    color: #454545;
}

a.ablocGris:after, button.ablocGris:after, .btnLegend.ablocGris {
    background: #dfdfdf;
}
button.btnMinuscule{
    text-transform : inherit;
}

a.ablocGrisL, button.ablocGrisL, .btnLegend.ablocGrisL {
    background-color: #f5f5f5;
    border: 1px solid #dddddd;
    color: #666666;
}
    a.ablocGrisL:hover, button.ablocGrisL:hover, .btnLegend.ablocGrisL {
        background-color: #f5f5f5;
        border: 1px solid #dddddd;
        color: #454545;
    }

a.ablocGrisL:after, button.ablocGrisL:after, .btnLegend.ablocGrisL { background: #dddddd; }


a.ablocBleu, button.ablocBleu, .btnLegend.ablocBleu {
    background-color: #8ed3d7;
    border: 1px solid #8ed3d7;
    color: #fff;
}

a.ablocBleu:hover, button.ablocBleu:hover, .btnLegend.ablocBleu {
    background-color: #8ed3d7;
    border: 1px solid #6ca0a3;
    color: #6ca0a3;
}

a.ablocBleu:after, button.ablocBleu:after, .btnLegend.ablocBleu { background: #6ca0a3; }

a.ablocCreme, button.ablocCreme, .btnLegend.ablocCreme {
    background-color: #f5f5f5;
    border: 1px solid #f5f5f5;
    color: #666666;
}

a.ablocCreme:hover, button.ablocCreme:hover, .btnLegend.ablocCreme {
    background-color: #f5f5f5;
    border: 1px solid #dddddd;
    color: #454545;
}

a.ablocCreme:after, button.ablocCreme:after, .btnLegend.ablocCreme { background: #dddddd; }

a.ablocRouge, button.ablocRouge, .btnLegend.ablocRouge {
    background-color: #ae1f30;
    border: 1px solid #750516;
    color: #ffffff;
}

a.ablocRouge:hover, button.ablocRouge:hover, .btnLegend.ablocRouge {
    background-color: #9b061c;
    border-bottom: 1px solid #993c4a;
    color: #dfdfdf;
}

a.ablocRouge:after, button.ablocRouge:after, .btnLegend.ablocRouge { background: #750516; }


a.ablocVert, button.ablocVert, .btnLegend.ablocVert {
    background-color: #96c53a;
    border: 1px solid #80b021;
    color: #ffffff;
}

a.ablocVert:hover, button.ablocVert:hover, .btnLegend.ablocVert {
    background-color: #96c53a;
    border: 1px solid #8db838;
    color: #f5f5f5;
}

a.ablocVert:after, button.ablocVert:after, .btnLegend.ablocVert { background: #80b021; }

a.ablocBleu2, button.ablocBleu2, .btnLegend.ablocBleu2 {
    background-color: #4386ea;
    border: 1px solid #346abb;
    color: #ffffff;
}

a.ablocBleu2:hover, button.ablocBleu2:hover, .btnLegend.ablocBleu2 {
    background-color: #4386ea;
    border: 1px solid #82a1bf;
    color: #f5f5f5;
}

a.ablocBleu2:after, button.ablocBleu2:after, .btnLegend.ablocBleu2 { background: #346abb; }

a.ablocRouge2, button.ablocRouge2, .btnLegend.ablocRouge2 {
    background-color: #ea4b43;
    border: 1px solid #bb3a34;
    color: #ffffff;
}

a.ablocRouge2:hover, button.ablocRouge2:hover, .btnLegend.ablocRouge2 {
    background-color: #ea4b43;
    border: 1px solid #d3846e;
    color: #f5f5f5;
}

a.ablocRouge2:after, button.ablocRouge2:after, .btnLegend.ablocRouge2 { background: #bb3a34; }

a.btnReprendre:hover, button.btnReprendre:hover, .btnLegend.btnReprendre:hover {
    background-color: #4386ea;
    border: 1px solid #82a1bf;
    color: #ffffff;
}

.btn.ablocVert[disabled=disabled] {
    -webkit-box-shadow: none;
    background-color: #fbfbfb;
    border: 1px solid #dfdfdf;
    box-shadow: none;
    color: #666666;
    cursor: not-allowed;
    filter: alpha(opacity=65);
    pointer-events: auto;
    text-shadow: none;
}

.btn.ablocVert[disabled=disabled]:hover {
    -moz-transform: rotateX(0deg);
    -ms-transform: rotateX(0deg);
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
}


.btnBordureFoncee { border: 1px solid #666666 !important; }

button.btn { display: inline-block; }

.btnLegend.btn {
    cursor: auto;
    display: inline-block;
}

.btn + .btn { margin-left: 15px; }

button .glyphicon-ok,
button .glyphicon-pencil { margin-right: -5px; }

#btnViderFichiers {
    height: 40px;
    margin-top: -2px;
    padding: 10px;
    font-weight: 700;
}

p#uploadResult {
    margin-bottom: 10px;
    margin-top: 10px;
}

table.demat tr td .btn {
    font-size: 11px;
    font-weight: normal;
    min-width: 0;
    padding: 5px 10px;
    text-transform: inherit;
}

    table.demat tr td .btn + .btn {
        margin-left: 5px;
    }

/* popover tooltip 
------------------------------------------------------------------------*/

.glyphicon-question-sign {
    bottom: 2px;
    font-size: 110%;
    position: relative;
}

a.glyphicon-question-sign { text-decoration: none; }

a.glyphicon-question-sign:hover {
    background-color: transparent;
    color: #8ed3d7;
}

h3.popover-title {
    font-size: 13px;
    font-weight: 500;
    text-transform: inherit;
}

.popover { min-width: 250px; }

.popover .popover-title { font-weight: 600; }

.popover .popover-content { font-weight: normal; }


/* steps
------------------------------------------------------------------------ */

.theSteps { position: relative; }

.stepWrap {
    display: inline-block;
    font-size: 0;
    height: 80px;
    margin-bottom: 15px;
    text-align: center;
    vertical-align: top;
    width: 100%;
}

.stepLeft,
.stepRight,
.stepMid,
.stepCercleBlanc,
.stepCercleJaune {
    display: inline-block;
    height: 54px;
    text-align: left;
    vertical-align: middle;
}

.stepLeft {
    background: url(../img/stepLeft.png) no-repeat center center transparent;
    width: 27px;
}

.stepRight {
    background: url(../img/stepRight.png) no-repeat center center transparent;
    width: 27px;
}

.stepMid {
    background: url(../img/stepMid.png) no-repeat center center transparent;
    width: 190px;
}

.stepCercleBlanc {
    background: url(../img/stepCercleBlanc.png) no-repeat center center transparent;
    width: 52px;
}

.stepCercleJaune {
    background: url(../img/stepCercleJaune.png) no-repeat center center transparent;
    width: 52px;
}

.stepWrap a, .stepWrap span, .stepWrap button {
    color: #b3b3b3;
    display: inline-block;
    font-family: arial, sans-serif;
    font-size: 18px;
    font-weight: 400;
    height: 52px;
    margin: 1px 0 2px -26px;
    padding-top: 14px;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    width: 52px;
}

.stepWrap a.stepCercleBlanc,
.stepWrap a.stepCercleBlanc div,
.stepWrap span.stepCercleBlanc,
.stepWrap span.stepCercleBlanc div { color: #b3b3b3; }

.stepWrap a.stepCercleJaune,
.stepWrap span.stepCercleJaune { color: #ffffff; }

.stepWrap a.stepCercleJaune div,
.stepWrap span.stepCercleJaune div { color: inherit; }

.stepWrap a:hover {
    background-color: inherit;
    color: #b3b3b3;
}

.stepWrap a.stepCercleBlanc:hover,
.stepWrap a.stepCercleJaune:hover { color: inherit; }

.stepWrap a div,
.stepWrap span div {
    color: #b3b3b3;
    font-size: 13px;
    font-weight: 700;
    margin-left: -30px;
    margin-top: 20px;
    position: absolute;
    width: 120px;
}

.stepWrap button + div {
    color: #b3b3b3;
    font-size: 13px;
    font-weight: 700;
    margin-left: -54px;
    position: absolute;
    text-align: center;
    width: 120px;
}

/*  Pagination
--------------------------------------------------------------------- */

nav ul li.next a,
nav ul li.prev a {
    min-width: 60px;
    text-align: center;
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    background-color: #8ed3d7;
    border-color: #8ed3d7;
}

.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus { color: #666666; }

.pagination > li > a, .pagination > li > span { color: #454545; }

/* MODAL / popin
---------------------------------------------------------------------- */

.modal-header { background-color: #8ed3d7; }


/*
----------------------------------------------------------------------
----------------------------------------------------------------------

						GABARITS DES PAGES
	
----------------------------------------------------------------------
----------------------------------------------------------------------
*/


/* accueil home
---------------------------------------------------- */

#logoOld {
    /*background: url(../img/logoOld.png) no-repeat center center transparent;*/
    background: url(../img/accueil/logos.png) no-repeat center center transparent;
    border: none;
    display: block;
    height: 214px;
    left: 50%;
    margin: -60px auto 0 -60px;
    position: absolute;
    top: 50%;
    /*width: 121px;height: 121px;*/
    width: 415px;
    z-index: 2;
}

.half {
    height: 100%;
    min-height: 100%;
    position: absolute;
    width: 50%;
}

.halfGauche {
    height: 100%;
    min-height: 100%;
    overflow: hidden;
    display: table;
}

.backgroundLogin, .bg404 {
    -moz-background-size: cover;
    -o-background-size: cover;
    -webkit-background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.backgroundLogin {
    background-image: url(../img/accueil/backgroundLogin.png);
    z-index: 50;
}

.bg404 { background: url(../img/404/bg404.jpg) no-repeat center center; }

@-webkit-keyframes bga {
    0% { opacity: 1; }

    16% { opacity: 1; }

    20% { opacity: 0; }

    36% { opacity: 0; }

    40% { opacity: 0; }

    56% { opacity: 0; }

    60% { opacity: 0; }

    76% { opacity: 0; }

    80% { opacity: 1; }

    96% { opacity: 1; }

    100% { opacity: 1; }
}

@keyframes bga {
    0% { opacity: 1; }

    16% { opacity: 1; }

    20% { opacity: 0; }

    36% { opacity: 0; }

    40% { opacity: 0; }

    56% { opacity: 0; }

    60% { opacity: 0; }

    76% { opacity: 0; }

    80% { opacity: 1; }

    96% { opacity: 1; }

    100% { opacity: 1; }
}

@-webkit-keyframes bgb {
    0% { opacity: 1; }

    16% { opacity: 1; }

    20% { opacity: 1; }

    36% { opacity: 1; }

    40% { opacity: 0; }

    56% { opacity: 0; }

    60% { opacity: 0; }

    76% { opacity: 0; }

    80% { opacity: 0; }

    96% { opacity: 0; }

    100% { opacity: 0; }
}

@keyframes bgb {
    0% { opacity: 1; }

    16% { opacity: 1; }

    20% { opacity: 1; }

    36% { opacity: 1; }

    40% { opacity: 0; }

    56% { opacity: 0; }

    60% { opacity: 0; }

    76% { opacity: 0; }

    80% { opacity: 0; }

    96% { opacity: 0; }

    100% { opacity: 0; }
}

@-webkit-keyframes bgc {
    0% { opacity: 1; }

    16% { opacity: 1; }

    20% { opacity: 1; }

    36% { opacity: 1; }

    40% { opacity: 1; }

    56% { opacity: 1; }

    60% { opacity: 0; }

    76% { opacity: 0; }

    80% { opacity: 0; }

    96% { opacity: 0; }

    100% { opacity: 0; }
}

@keyframes bgc {
    0% { opacity: 1; }

    16% { opacity: 1; }

    20% { opacity: 1; }

    36% { opacity: 1; }

    40% { opacity: 1; }

    56% { opacity: 1; }

    60% { opacity: 0; }

    76% { opacity: 0; }

    80% { opacity: 0; }

    96% { opacity: 0; }

    100% { opacity: 0; }
}

@-webkit-keyframes bgd {
    0% { opacity: 1; }

    16% { opacity: 1; }

    20% { opacity: 1; }

    36% { opacity: 1; }

    40% { opacity: 1; }

    56% { opacity: 1; }

    60% { opacity: 1; }

    76% { opacity: 1; }

    80% { opacity: 0; }

    96% { opacity: 0; }

    100% { opacity: 0; }
}

@keyframes bgd {
    0% { opacity: 1; }

    16% { opacity: 1; }

    20% { opacity: 1; }

    36% { opacity: 1; }

    40% { opacity: 1; }

    56% { opacity: 1; }

    60% { opacity: 1; }

    76% { opacity: 1; }

    80% { opacity: 0; }

    96% { opacity: 0; }

    100% { opacity: 0; }
}

@-webkit-keyframes bge {
    0% { opacity: 1; }

    16% { opacity: 1; }

    20% { opacity: 1; }

    36% { opacity: 1; }

    40% { opacity: 1; }

    56% { opacity: 1; }

    60% { opacity: 1; }

    76% { opacity: 1; }

    80% { opacity: 1; }

    96% { opacity: 1; }

    100% { opacity: 0; }
}

@keyframes bge {
    0% { opacity: 1; }

    16% { opacity: 1; }

    20% { opacity: 1; }

    36% { opacity: 1; }

    40% { opacity: 1; }

    56% { opacity: 1; }

    60% { opacity: 1; }

    76% { opacity: 1; }

    80% { opacity: 1; }

    84% { opacity: 1; }

    100% { opacity: 0; }
}

.welcome {
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    height: 275px;
    left: 50%;
    margin: 0 auto;
    margin: -137px 0 0 -208px;
    position: absolute;
    text-align: center;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.15);
    top: 50%;
    width: 355px;
    z-index: 10000;
}

.logos {
    background-color: rgba(255, 255, 255, .4);
    border: 1px solid rgba(255, 255, 255, .47);
    box-sizing: border-box;
    padding: 10px;
    text-align: center;
}

.logos div {
    display: inline-block;
    height: 55px;
    margin: 10px 5px;
    width: 55px;
}

#logo1 {
    -moz-background-size: cover;
    -o-background-size: cover;
    -webkit-background-size: cover;
    background: url(../img/accueil/logo1.png) no-repeat center center;
    background-size: cover;
}

#logo2 {
    height: auto;
    margin: 0;
    width: 239px;
}

#logo3 { max-height: 53px; }

@media (min-width: 1100px) {
    #logo1 { background: url(../img/accueil/logo1-big.png) no-repeat center center; }
}

.tiers23 .logos {
    height: 83px;
    max-width: 520px;
}

.tiers23 .logos div {
    height: 61px;
    margin: 10px 16px;
    width: 61px;
}

.tiers23 #logo1 { background: url(../img/accueil/logo1-big.png) no-repeat center center; }

.tiers23 #logo2 {
    height: auto;
    width: 265px;
}

.tiers23 #logo3 { background: url(../img/accueil/logo3-big.png) no-repeat center center; }

.welcome p {
    font-weight: 200;
    text-shadow: 0px 0px 6px rgba(66, 66, 66, 0.8);
    text-transform: uppercase;
}

p.welcome1 {
    font-size: 22px;
    font-weight: 400;
}

p.welcome2 {
    font-size: 25px;
    font-weight: 400;
}

.halfGauche2 {
    -moz-background-size: cover;
    -o-background-size: cover;
    -webkit-background-size: cover;
    background: url(../img/accueil/backgroundLogin.jpg) no-repeat center center;
    background-size: cover;
}

.halfDroite { left: 50%; }

.tiers1 {
    height: 100%;
    min-height: 100%;
    position: absolute;
    width: 30%;
    display: table;
}

.tiers23 {
    border-left: 1px solid #f5f5f5;
    height: 100%;
    left: 30%;
    min-height: 100%;
    padding-top: 80px;
    position: absolute;
    width: 70%;
}

.full {
    background-color: #e7e7e8;
    color: #454545;
    height: 100%;
    padding: 40px;
    position: relative;
}

.fullBlanc {
    background-color: #f3f3f4;
    height: 100%;
}

.full h2 {
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
}

.demi {
    background-color: #e7e7e8;
    color: #454545;
    height: 50%;
    padding: 40px;
    position: relative;
}

.demi:first-child,
.demiBlanc {
    background-color: #f3f3f4;
    height: 50%;
}

.demi h2 {
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
}

.demi h2 small {
    display: block;
    font-size: 14px;
    font-weight: 300;
}

.demi input { background-color: #fff; }

.baaas {
    bottom: 80px;
    position: absolute;
    width: 420px;
}

.baaas2 {
    bottom: 50%;
    position: absolute;
    width: 420px;
}

.loginFormContainer {
    height: 100%;
    display: table;
    padding-left: 40px;
}

.loginFormContainer .verticalAligned {
    width: 424px;
    display: table-cell;
    vertical-align: middle;
}

.loginFormContainer h2 {
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
}

.loginFormContainer .voidContent {
    height: 30%;
    display: table-row;
}

.loginFormContainer .loginForm {
    height: 40%;
    display: table-row;
}

.loginFormContainer .loginForm .btn.pull-right {
    margin-right: 10px;
}

.loginFormContainer .copyrightContent {
    height: 64px;
    font-size: 11px;
    display: table-row;
}

.loginFormContainer .adminContent {
    height: calc(30% - 64px);
    display: table-row;
}

.labelHome {
    text-align: left !important;
    width: 100px;
}

.inputHome { width: 200px; }

.loginAccueil {
    display: inline-block;
    vertical-align: top;
    width: 210px;
}

.loginAccueil label { font-weight: 500; }

.loginAccueil a {
    display: block;
    margin-top: 5px;
}

.btnLogHome {
    bottom: 0;
    color: #454545;
    margin-bottom: -52px;
    margin-right: 22px;
    position: absolute;
    right: 0;
}

h2#welcomeAccueil {
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    left: 50%;
    margin: 130px auto 0 -171px;
    position: absolute;
    text-align: right;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.15);
    text-transform: uppercase;
    top: 50%;
}

h2#welcomeAccueil big {
    display: block;
    font-size: 44px;
    font-weight: 200;
}

.copyrightAccueil {
    bottom: 0;
    color: #666666;
    font-size: 11px;
    position: absolute;
    width: 420px;
}

.copyrightAccueil a { text-decoration: none; }

.quart {
    background-color: #e7e7e8;
    color: #454545;
    height: 25%;
    overflow: hidden;
    padding-left: 80px;
    position: relative;
    vertical-align: middle;
}

.quart img.imgTitle { vertical-align: middle; }

.bgliiiight { background-color: #f3f3f4; }

.connecAutoCheck {
    display: block;
    margin-top: 10px;
}

.connecAutoCheck input[type=checkbox] {
    display: inline-block;
    margin-top: 0px;
    vertical-align: middle;
}

.ablocBleu span { font-size: 2px; }

.oldThbContrat {
    margin: 15px 0;
    position: relative;
    text-align: center;
}

.oldThbContrat img {
    display: inline-block;
    margin: 15px 2px 0 2px;
    vertical-align: top;
}

.thbRecherche {
    margin: 0 0 5px 0;
    position: relative;
    text-align: center;
}

.panel-imgHeading {
    height: 113px;
    overflow: hidden;
    padding: 0;
    position: relative;
    width: 455px;
}

.panel-imgHeading img {
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    -webkit-transition: all .6s ease;
    height: 113px;
    transition: all .6s ease;
    width: 455px;
}

.panel-imgHeading img:hover {
    height: 124px;
    width: 500px;
}

.panel-imgHeading + .panel-body { min-height: 113px; }

a.oldBtnHome {
    bottom: 0;
    left: 50%;
    margin: 0 0px 0px -70px;
    padding-left: 42px;
    position: absolute;
}

a.oldBtnContrats {
    left: 50%;
    margin: 99px 0px -10px -75px;
    padding-left: 42px;
    position: absolute;
}

img.oldImgContrat {
    left: 132px;
    position: absolute;
    top: -19px;
}

a.oldBtnCommandes {
    left: 50%;
    margin: 68px 0px -10px -78px;
    padding-left: 42px;
    position: relative;
}

img.oldImgCommandes {
    left: 173px;
    position: absolute;
    top: 75px;
}

a.oldImgGarantiesServices {
    left: 50%;
    margin: 90px 0px -10px -70px;
    padding-left: 42px;
    position: relative;
}

img.oldImgGarantiesServices {
    left: 128px;
    position: absolute;
    top: 81px;
}

.imgCommandes { margin-left: 30px; }

.imgContrat { margin-left: 20px; }

.imgGarantiesServices { margin-right: 20px; }

.imgMap { margin-right: 10px; }

.blocRelatif { position: relative; }

img.recherche {
    left: 132px;
    position: absolute;
    top: -19px;
}

a .gly20 {
    font-size: 20px;
    left: 15px;
    position: absolute;
    top: 8px;
}

.homeClaim {
    background: url(../img/logo-roole.svg) no-repeat center center transparent;
    background-size: contain;
    margin-bottom: 30px;
    width: 100%;
}

h3.h3spe {
    color: #454545;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 0;
    margin-top: 15px;
    text-align: center;
    text-transform: uppercase;
}

.rondBg {
    background: url(../img/accueil/rondBg.gif) no-repeat center top transparent;
    min-height: 218px;
}

.homeBlocChallenge, .homeBlocSite, .homeBlocAcp {
    min-height: 145px;
    padding-left: 100px;
}

.homeBlocChallenge { background: url(../img/accueil/kdo.gif) no-repeat 20px center #fff; }

.homeBlocSite { background: url(../img/accueil/nadia.gif) no-repeat 10px bottom #fff; }

.homeBlocAcp { background: url(../img/accueil/diplome.gif) no-repeat 20px center #fff; }

/* BEGIN NEW BLOC BONS PLANS
** Reuse `garanties` accordion with some overrides and 75% size
--------------------------------------------------------------- */

.new-bloc-bons-plans .panel-body.garanties h3 {
    margin-bottom: 24px;
    margin-top: 0px;
}

.new-bloc-bons-plans .panel-body.garanties #accordionBonsPlans {
    padding: 0;
}

.new-bloc-bons-plans .panel-body.garanties h4 {
    margin-bottom: 0;
}

.new-bloc-bons-plans .panel-body.garanties .monContrat .panel-heading,
.new-bloc-bons-plans .panel-body.garanties .monContrat .panel-heading a {
    height: 60px;
    line-height: 60px;
}

.new-bloc-bons-plans .panel-body.garanties .monContrat .panel-heading a:hover {
    background-position: -42px 0;
}

.new-bloc-bons-plans [class^="icon-"]:before,
.new-bloc-bons-plans [class*=" icon-"]:before {
    width: 68px;
    color: #666666;
    font-size: 42px;
    margin: 0px 15px 0 5px;
    vertical-align: middle;
}

.new-bloc-bons-plans .panel-body.garanties .monContrat .panel-heading a .garantieHn span {
    display: block;
    font-size: 13px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.new-bloc-bons-plans .panel-body.garanties .monContrat .panel-heading a .garantieHn span + span {
    font-size: 10px;
    margin-top: 4px;
}

.new-bloc-bons-plans .panel-body.garanties .monContrat .panel-heading a .garantieHn {
    padding-right: 30px;
    width: calc(100% - 160px);
}

.new-bloc-bons-plans .default-content {
    padding: 15px 28px;
}

.new-bloc-bons-plans .default-content + .default-content {
    padding-top: 0;
}

/* END NEW BLOC BONS PLANS
--------------------------------------------------------------- */


/* BEGIN LOGO GROUP
--------------------------------------------------------------- */

.logo-group > * {
    float: left;
    margin: 8px;
    border: none;
}

.welcome-backdrop {
    height: 100%;
    position: relative;
    z-index: 60;
    display: table-cell;
    vertical-align: middle;
    background-color: rgba(0, 0, 0, 0.26);
}

.welcome-backdrop .welcome {
    position: relative;
    margin: 0;
    height: auto;
    width: auto;
    top: unset;
    transform: translateX(-50%);
    display: inline-block;
}

.welcome .logo-group {
    background-color: rgba(255, 255, 255, .4);
    border: 1px solid rgba(255, 255, 255, .47);
    box-sizing: border-box;
    padding: 10px;
}

/* END LOGO GROUP
--------------------------------------------------------------- */


/* BEGIN NEW BLOC SIGN ELEC
** It's using the new EP design
--------------------------------------------------------------- */

.digital-contract dfn {
    font-size: 11px;
}

.method-selection-bloc strong {
    font-weight: 700;
    color: #0d0d0d;
}

.digital-contract .contract-type-wrapper,
.digital-contract.lastProcess .contract-step {
    border-top: none;
    background-color: #dee8e8;
}

.contracts-separator + .lastProcess .contract-type-wrapper {
    border-top: none;
    background-color: inherit;
    padding-top: 0;
}

.contract-type {
    font-weight: bold;
    margin-left: 20px;
    display: inline-block;
}

.contract-type + a.glyphicon {
    cursor: pointer;
}

.contracts-separator + .lastProcess .contract-type {
    margin-top: 0;
}

.digital-contract.lastProcess .contract-step + .contract-step {
    border-top: 1px solid #ffffff;
}

.digital-contract.lastProcess .contract-step .lastProcessNb {
    color: #ffffff;
    font-weight: 300;
    background-color: #0d0d0d;
}

.digital-contract .alert-info {
    width: 80%;
    margin-left: 10%;
    border: none;
    color: inherit;
    background-color: #eedc73;
}

.digital-contract .alert-info strong {
    color: inherit;
}

.digital-contract .alert-info,
.digital-contract .last-step-paragraph {
    margin-top: 20px;
    margin-bottom: 0;
}

.digital-contract .last-step-paragraph strong {
    font-weight: bold;
}

.contracts-separator {
    margin: 20px 0;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
}

.contracts-separator::before,
.contracts-separator::after {
    content: '';
    margin: 0 20px;
    display: inline-block;
    height: 1px;
    background-color: #dddddd;
    vertical-align: middle;
    flex: 1;
}

/* END NEW BLOC SIGN ELEC
--------------------------------------------------------------- */


/* BEGIN SHEPHERD CUSTOM THEME
--------------------------------------------------------------- */

.custom-shepherd-element {
    padding: 24px;
}

.custom-shepherd-element .shepherd-text {
    line-height: 1.7;
    font-size: 16px;
}

.custom-shepherd-element footer {
    clear: none;
    position: static;
    min-height: 0;
    margin-top: 0;
}


/* END SHEPHERD CUSTOM THEME
--------------------------------------------------------------- */


/* page mdp oubli
---------------------------------------------------- */
.logoMdp {
    left: 30% !important;
    top: 100px !important;
}

.forgotPass {
    max-width: 550px;
    min-width: 400px;
    padding: 40px;
    width: 100%;
}

.btnRenvoieMdp { text-align: right; }

.loginMdp {
    margin-right: 20px;
    width: 400px;
}

.inputlogCrea { width: 280px; }

.forgotPass h2 {
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
}

.ulNoStyle ul {
    list-style: none;
    padding-left: 5px;
}

/* page creation de compte
---------------------------------------------------- */

.creaCompte {
    padding: 40px;
    position: absolute;
    top: 30%;
    width: 800px;
}

.creaCompte h2 {
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
}

.form-horizontal .control-labelLeft {
    margin-bottom: 0;
    padding-top: 7px;
}

/* page search
---------------------------------------------------- */


.searchOption {
    padding: 24px 28px 14px 28px;
    text-align: center;
}

.searchOption input {
    border: 1px solid #dddddd;
    padding: 13px;
}

body.policeMenu .searchOption .nav > li > a { padding: 20px 15px; }

.w250 { width: 250px; }

ul.nav-tabsSearch {
    height: 56px;
    width: 100%;
}

ul.nav-tabsSearch li { width: 33.33333333333333%; }

ul.nav-tabsSearch li a {
    height: 56px;
    margin: 0;
    padding: 20px 15px;
    width: 100%;
}

.tab-tabsSearch {
    padding: 30px 10px;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-radius: 0 0 4px 4px;
    margin-bottom: 30px;
}

.wCodePdt {
    display: inline-block;
    width: 25%;
    text-align: left;
    margin-right: 15px;
}

.wNumContrat {
    display: inline-block;
    text-align: left;
    width: 70%;
}

#multiResult { padding: 10px; }

#multiResult button {
    display: inline-block;
    height: 90px;
    margin: 10px;
    padding: 10px 20px;
    text-align: left;
    text-decoration: none !important;
    width: 47%;
}

#multiResult button strong { font-weight: 700; }

#multiResult button span::first-child { display: block; }

#multiResult button span:nth-of-type() { }

#multiResult button:hover { background-color: #cfe3e4; }

/* Only works in IE10 */

@media screen and (min-width: 0\0) {
    /* IE9 and IE10 rule sets go here */
    .searchOption input[type="radio"],
    .searchOption input[type="checkbox"] {
        background-color: inherit;
        border: inherit;
        padding: inherit;
        padding: 0;
    }
}

/* page creation contrat
---------------------------------------------------- */

.accordionCreerContrat {
    display: flex;
    gap: 8px;
    align-items: center;
}

.accordionCreerContrat a:not(.collapsed) + svg {
    transform: rotate(180deg);
}

#creerContratBody .panel-body {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 0;
}

#creerContratBody .panel-body > div {
    padding: 15px 20px 15px 0;
    background: #dee8e8;
}

.gestionBtn { margin: 30px 0; }

h4.h4lastProcess {
    font-size: 32px;
    font-weight: 200;
    margin-bottom: 0;
    text-transform: uppercase;
}

.lastProcess { margin-bottom: 15px; }

.lastProcess > div {
    padding: 15px 0;
}

#container-docusign .lastProcess > div {
    padding: 15px 20px 15px 0;
}

.lastProcess > div .lastProcessNb {
    color: #ffffff;
    background-color: #0d0d0d;
    border-radius: 50%;
    font-size: 38px;
    font-weight: 200;
    height: 60px;
    line-height: 60px;
    margin-left: 20px;
    margin-top: 10px;
    position: absolute;
    text-align: center;
    width: 60px;
}

.lastProcess > div .lastProcessDesc {
    margin-left: 100px;
    min-height: 80px;
}

.pubChallengeWrap {
    background-color: #f7f7f7;
    border-radius: 4px;
    margin-top: 30px;
    padding-bottom: 15px;
    padding-top: 15px;
}

.pubChallengeTitre {
    font-size: 24px;
    font-weight: 200;
    margin-bottom: 0;
    text-transform: uppercase;
}

.pubChallengeWrapImg {
    background: url(../img/challenge.png) no-repeat center center transparent;
    height: 99px;
    margin-left: -100px;
    margin-top: -5px;
    position: absolute;
    width: 80px;
}

.ogone {
    background: url(../img/ogone.png) no-repeat center center transparent;
    display: inline-block;
    height: 38px;
    margin-right: 20px;
    margin-top: 10px;
    width: 135px;
}

.videoWrapper {
    height: 0;
    margin-top: 8px;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    position: relative;
}

.videoWrapper iframe {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

#detailsMontageBalise {
    border-left: 5px solid #dfdfdf;
    padding: 20px 0 0 20px;
}

#detailsMontageBalise ol { position: relative; }

#detailsMontageBalise ol li { margin-top: 20px; }

#detailsMontageBalise ul.spanNb li span {
    background-color: #f4f4f4;
    border: 3px solid #dbdbdb;
    border-radius: 50%;
    color: #8b8b8b;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    height: 20px;
    line-height: 1;
    margin-right: 5px;
    text-align: center;
    vertical-align: middle;
    width: 20px;
}

#detailsMontageBalise ol li ul { list-style: none; }

#detailsMontageBalise img { max-width: 100%; }

img.avecBord { border: 1px solid #ccc; }

img.diodeGauche {
    margin-left: -20px;
    margin-top: 3px;
    position: absolute;
    z-index: 2;
}

#detailsMontageBalise small {
    color: #aaa;
    font-size: inherit;
}

/* page contrat
---------------------------------------------------------------  */

.garanties { text-align: justify; }

.garanties h3 {
    font-size: 16px;
    margin-bottom: 10px;
    margin-top: 20px;
}

.garanties h4 {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
}

.garanties h5 {
    font-size: 13px;
    font-weight: 600;
    padding-left: 15px;
}

.garanties table { margin: 20px 0; }

.garanties table,
.garanties table tr td { border: 1px solid #dddddd; }

.garanties table tr td {
    padding: 5px;
    text-align: inherit;
}

.formAlert {
    display: block;
    margin-top: 10px;
}

div.hr {
    border-bottom: 1px solid #dedede;
    margin: 15px 0;
    width: 100%;
}

.btnChallendge {
    margin-top: -50px;
    position: relative;
    text-align: center;
}

.inputg {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.inputd {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}

img#argu {
    margin-left: -15px;
    position: relative;
}

.panel-body.garanties { padding: 0; }

.panel-body.garanties .monContrat { margin-bottom: 0; }

.panel-body.garanties .monContrat .panel + .panel { margin-top: 0; }

.panel-body.garanties .monContrat .panel-heading {
    background-color: #f5f5f5;
    height: 80px;
    line-height: 80px;
    padding: 0;
    vertical-align: middle;
}

.panel-body.garanties .monContrat .panel-heading a {
    background: url(../img/ico/bg.png) no-repeat left center transparent;
    background-color: #ffffff;
    border-bottom: 1px solid #dddddd;
    display: block;
    height: 80px;
    line-height: 80px;
    text-decoration: none;
    width: 100%;
}

.panel-body.garanties .monContrat .panel-heading a img { margin: 0px 15px 0 5px; }

.panel-body.garanties .monContrat .panel-heading a .garantieHn {
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    color: #666666;
    display: inline-block;
    font-size: 17px;
    font-weight: 600;
    line-height: normal;
    padding-left: 30px;
    text-align: left;
    text-transform: uppercase;
    transition: all 0.3s;
    vertical-align: middle;
    width: 300px;
}

.panel-body.garanties .monContrat .panel-heading a abbr {
    background-color: #ffd100;
    border-radius: 50%;
    color: #0d0D0d;
    display: inline-block;
    height: 30px;
    line-height: normal;
    padding-left: 2px;
    padding-top: 9px;
    text-align: center;
    vertical-align: middle;
    width: 30px;
}

.panel-body.garanties .monContrat .panel-heading a:hover {
    background-color: #fff;
    background-position: -70px 0;
}

.panel-body.garanties .monContrat .panel-heading a:hover .garantieHn { padding-left: 50px; }

.panel-body.garanties .monContrat .panel-heading a:hover abbr {
    -moz-transform: rotate(90deg);
    -moz-transform-origin: center center;
    -o-transform: rotate(90deg);
    -o-transform-origin: center center;
    -webkit-transform: rotate(90deg);
    -webkit-transform-origin: center center;
    background-color: #eec300;
    transform: rotate(90deg);
    transform-origin: center center;
}

.panel-body.garanties .monContrat .panel-body {
    border: 0;
    padding: 14px 28px 24px 28px;
}

.panel-body.garanties .monContrat .panel { border: 0; }

.contratInactif {
    margin-bottom: 40px;
    margin-top: -30px;
}

.panel-body.bonsPlans .monContrat.concess .panel-heading a { background: url(../img/ico/bgConcess.png) no-repeat 0 0px transparent; }

.panel-body.bonsPlans .monContrat.concess .panel-heading a:hover {
    background-color: #fff;
    background-position: -90px 0;
}

.panel-body.bonsPlans .monContrat.concess .panel-heading a img {
    height: 56px;
    margin: 0px 15px 0 60px;
    width: 90px;
}

.panel-body.bonsPlans .monContrat.concess .panel-heading a[class*=" icon-"]:before {
    color: #454545;
    font-size: 50px;
    margin: 0px 15px 0 39px;
    vertical-align: middle;
    width: 90px;
}

.panel-body.bonsPlans .monContrat.concess .panel-heading a .garantieHn {
    margin-bottom: 0;
    width: 710px;
}


/*  page liste contrat
--------------------------------------------------------------- */

table tr td.serre {
    max-width: 90px;
    padding-left: 10px !important;
    padding-right: 0;
}

.cachecache { opacity: 0; }

table tr td.td200 {
    color: #454545;
    /*max-width: 200px;*/
    font-weight: 500;
}

table tr td.td140 { /*max-width: 100px;*/ }

table tr td.td200,
table tr td.td140 {
    line-height: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: center;
}

table tr td.td200:hover,
table tr td.td140:hover {
    overflow: visible;
    text-overflow: inherit;
    white-space: initial;
}

.dataTables_wrapper .dataTables_length { float: right !important; }

#example_filter { float: left !important; }

#example_length { margin-top: 7px; }

#example_length select {
    float: right;
    margin-left: 15px;
    margin-top: -7px;
}

#example_filter input[type=text] { width: 229px; }

#example_filter label,
#example_length label { color: #666666; }

table.dataTable thead .sorting_asc { background: url("../img/sort_asc.png") no-repeat center right; }

table.dataTable thead .sorting_desc { background: url("../img/sort_desc.png") no-repeat center right; }

/* bons plans 
--------------------------------------------------------------- */


.bonsPlans { text-align: justify; }

h1.h1a { line-height: 20px; }

h1 strong.h1b {
    display: inline-block;
    margin-top: 15px;
}

h1 .h1c {
    line-height: 14px;
    margin-top: 0px;
}

.bonsPlans h3 {
    font-size: 20px;
    font-weight: 300;
    margin-bottom: 10px;
    margin-top: 20px;
}

.bonsPlans h4 {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
}

.bonsPlans h5 {
    font-size: 13px;
    font-weight: 600;
    padding-left: 15px;
}

.bonsPlans table { margin: 20px 0; }

.bonsPlans table,
.bonsPlans table tr td { border: 1px solid #dddddd; }

.bonsPlans table tr td {
    padding: 5px;
    text-align: inherit;
}

.panel-body.bonsPlans { padding: 0; }

.panel-body.bonsPlans .monContrat { margin-bottom: 0; }

.panel-body.bonsPlans .monContrat .panel + .panel { margin-top: 0; }

.panel-body.bonsPlans .monContrat .panel-heading {
    background-color: #f5f5f5;
    height: 104px;
    line-height: 104px;
    padding: 0;
    vertical-align: middle;
}

.panel-body.bonsPlans .monContrat .panel-heading a {
    background: url(../img/ico/bg.png) no-repeat left center transparent;
    background-color: #ffffff;
    border-bottom: 1px solid #dddddd;
    display: block;
    height: 104px;
    line-height: 104px;
    text-decoration: none;
    width: 100%;
}

.panel-body.bonsPlans .monContrat .panel-heading a.tr.collapsed { /*	background-color: yellow;*/ }

.panel-body.bonsPlans .monContrat .panel-heading a img {
    height: 90px;
    margin: 0 25px;
    width: 200px;
}

.panel-body.bonsPlans .monContrat .panel-heading a .garantieHn {
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    color: #666666;
    display: inline-block;
    font-size: 20px;
    font-weight: 200;
    line-height: normal;
    text-align: left;
    text-transform: uppercase;
    transition: all 0.3s;
    vertical-align: middle;
    width: 629px;
}

.panel-body.bonsPlans .monContrat .panel-heading a .garantieHn strong,
.panel-body.bonsPlans strong.avantage {
    display: block;
    font-size: 14px;
    font-weight: 700;
    text-align: left;
}

.panel-body.bonsPlans strong.avantage p,
.panel-body.bonsPlans strong.avantage span { text-transform: uppercase; }

.panel-body.bonsPlans .monContrat .panel-heading a abbr {
    background-color: #ffd100;
    border-radius: 50%;
    color: #0d0d0d;
    display: inline-block;
    height: 30px;
    line-height: normal;
    padding-left: 2px;
    padding-top: 9px;
    text-align: center;
    vertical-align: middle;
    width: 30px;
}

.panel-body.bonsPlans .monContrat .panel-heading a:hover {
    background-color: #fff;
    background-position: -70px 0;
}

.panel-body.bonsPlans .monContrat .panel-heading a:hover .garantieHn { padding-left: 20px; }

.panel-body.bonsPlans .monContrat .panel-heading a:hover abbr {
    -moz-transform: rotate(90deg);
    -moz-transform-origin: center center;
    -o-transform: rotate(90deg);
    -o-transform-origin: center center;
    -webkit-transform: rotate(90deg);
    -webkit-transform-origin: center center;
    background-color: #eec300;
    transform: rotate(90deg);
    transform-origin: center center;
}

.panel-body.bonsPlans .monContrat .panel-body {
    border: 0;
    padding: 14px 28px 24px 28px;
}

.panel-body.bonsPlans .monContrat .panel { border: 0; }

.alert-stickerWrap {
    margin: 30px 0 30px 7%;
    width: 85%;
}

.alert-sticker {
    background: url(../img/bonPlans/badge.png) no-repeat 11px center #f4f4f4;
    border: 1px solid #dedede;
    color: #454545 !important;
    display: table-cell;
    height: 150px;
    vertical-align: middle;
    width: 751px;
}

.alert-sticker strong {
    color: #454545 !important;
    vertical-align: middle;
}

.alert-sticker .stickerDesc {
    padding-left: 170px;
    padding-right: 11px;
}

.alert-sticker .stickerDesc h3 {
    margin-bottom: 5px;
    margin-top: 0;
}

.alert-sticker { padding: 40px 0; }

.stick1 { background: url(../img/bonPlans/badge1.png) no-repeat 11px center #f4f4f4; }

.stick2 { background: url(../img/bonPlans/badge2.png) no-repeat 11px center #f4f4f4; }

.stick3 { background: url(../img/bonPlans/badge3.png) no-repeat 11px center #f4f4f4; }

.stick4 { background: url(../img/bonPlans/badge4.png) no-repeat 11px center #f4f4f4; }

.stick5 { background: url(../img/bonPlans/badge5.png) no-repeat 11px center #f4f4f4; }

.panel-body.bonsPlans .imgIllus {
    margin-left: -28px;
    margin-top: -14px;
}

.panel-body.bonsPlans .imgIllusb {
    margin-left: -28px;
    margin-top: 30px;
}

/* Effet JS matt */

#accordionbonsPlans a.tr.ferme { opacity: .2; }

#vinciAp {
    border: 1px solid #dedede;
    float: right;
    margin-bottom: 15px;
    margin-left: 15px;
}


/* modal
--------------------------------------------------------------- */

.imprimVert {
    font-family: inherit;
    font-size: inherit;
}

.imprimVert .modal-header {
    background-color: #96c53a;
    color: #fff;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}

.imprimRouge .modal-header {
    background-color: #ea4b43;
    color: #fff;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}

.imprimBleu .modal-header {
    color: #fff;
    text-transform: uppercase;
}

.imprimVert .modal-footer,
.imprimRouge .modal-footer,
.imprimBleu .modal-footer { text-align: center; }

.modalMessage { font-weight: 700; }

.creaCompteDone { font-weight: 300; }

/*  clases d'ajustement
--------------------------------------------------------------- */


.mr0 { margin-right: 0; }

.mr30 { margin-right: 30px; }

.mr60 { margin-right: 60px; }

.ml15 { margin-left: 15px; }

.ml30 { margin-left: 30px; }

.ml60 { margin-left: 60px; }

.mt5 { margin-top: 5px; }

.mt15 { margin-top: 15px; }

.mt30 { margin-top: 30px; }

.mt50 { margin-top: 50px; }

.mb15 { margin-bottom: 15px; }

.mb30 { margin-bottom: 30px; }



.nml { margin-left: 0; }

.nmb { margin-bottom: 0; }

.npb { padding-bottom: 0; }

.npl { padding-left: 0; }

.npr { padding-right: 0; }


/* DEBUG
------------------------------------------------------- */

.thAction1 { background-image: (''); }

.tableAction { width: 300px; }

.tableAction tr { }

table.demat tr td .tableAction tr td {
    padding: auto 0 auto 10px;
    width: 100px;
}

table.demat tr td .tableAction tr td + td {
    padding: auto 0 auto 10px;
    width: 110px;
}

table.demat tr td .tableAction tr td + td + td {
    padding: auto 0 auto 10px;
    width: 87px;
}

table.demat tr td .tableAction tr td:first-child { padding-left: 0; }

table.demat tr td .tableAction tr td:last-child {
    padding-right: 0;
    text-align: right;
}

.tdListeContrat1 { width: 116px; }


.tdListeContratBalise {
    width: auto;
    padding-right: 10px !important;
}

.tdListeContrat2 { width: 116px; }

.tdListeContrat3 { width: 225px; }

.tdListeContrat4 { width: 68px; }

.tdListeContrat5 { width: 102px; }

.tdListeContrat6 {
    padding-right: 5px;
    width: 302px;
}

table.dataTable thead th, table.dataTable thead td { border-bottom: 0; }

table.demat tr td .tableAction tr {
    background: transparent;
    border-bottom: none;
}

table.validCommande {
    border: none;
    border-collapse: collapse;
    margin: 0;
    width: 100%;
}

table.validCommande tr { border: none; }

table.validCommande tr:nth-child(even) { background-color: rgba(0, 0, 0, .04); }

table.validCommande tr th {
    border-bottom: 1px solid #dedede;
    border-left: none;
    border-right: none;
    border-top: none;
    color: #666666;
    font-weight: 700;
    height: 30px;
    padding-bottom: 5px;
    padding-top: 5px;
    text-align: center;
    vertical-align: middle;
}

table.validCommande tr td {
    border-bottom: 1px solid #dedede;
    border-left: none;
    border-right: none;
    font-weight: 300;
    line-height: 1;
    padding: 5px 0;
    text-align: center;
}

table tr.ligneCommande:last-child { border-bottom: none; }

table tr.ligneCommande input:disabled,
table tr.ligneCommande select:disabled {
    background-color: transparent;
    border: none;
    color: #666666;
    font-weight: 300;
    padding-left: 0;
}
table .produitLibelle label {
    font-weight: normal;
}
table .produitLibelle{width: 260px;}
table .quantiteLot{width: 140px;}
table .quantiteLot span, table .quantiteLotGravage span{color:#adadad; margin-left: 5px;}
table .quantiteLot input[type="hidden"]{width: 30px;}
table .quantiteTotale{width: 60px; text-align: center; }
table .quantiteTotale input{width: 30px; font-weight: 700; text-align: center;}
.produitLibelle strong {font-weight: 700;}
table.demat tr td.ajoutLettre{height: 47px;}
table .quantiteLotGravage{width:130px}
table .choixLettre{width: 60px; }
table .choixLettre + td{color:#adadad;}
table.lettresChiffres .quantiteTotale{width:78px;}
table.lettresChiffres .quantiteLotGravage{width:156px}
table.lettresChiffres .produitLibelle{width:285px;}

table .quantiteLot [readonly]{opacity:.3;}


/* BEGIN "les contrats"
------------------------------------------------------- */

#accordionContrats .panel {
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    border: none;
    box-shadow: none;
    box-shadow: none;
}

#accordionContrats p + h4 {
    margin-top: 20px;
}

#accordionContrats .accordionContratsMenu { text-align: center; }

#accordionContrats .panel-heading { margin-top: 20px; }

#accordionContrats .panel-body {
    border: 0;
    padding: 14px 28px 24px 28px;
}

#accordionContrats .panel-body p { text-align: justify; }

#accordionContrats .panel-body p.txtc { text-align: center; }

#accordionContrats .panel-group .panel { margin-bottom: 20px; }

#lesContratsrrgONE .alertOneFirst { text-align: right; }

#lesContratsrrgONE .alertOne .titre {
    color: #454545;
    font-size: 24px;
    line-height: 1.4;
    text-transform: uppercase;
}

#lesContratsrrgONE .alertOne .titre strong { font-weight: 700; }

#lesContratsrrgONE .alertOne {
    font-size: 14px;
    line-height: 1.6;
}

img#alertOne {
    height: 150px;
    width: auto;
}

#alertOne + .col-xs-3 {
    color: #454545;
    font-size: 24px;
    line-height: 1.4;
    text-transform: uppercase;
}

.elligibiliteOne {
    clear: both;
    font-size: 16px;
    line-height: 1.7;
    margin-top: 20px;
}

.elligibiliteOne h2 { font-size: 24px; }

.elligibiliteOne h2 strong { text-transform: uppercase; }

.elligibiliteOne + img { margin-top: 37px; }

/* END "les contrats"
------------------------------------------------------- */

#ambassadeur {
    width: auto;
}

.contratActionable { 
    display: inline-block; 
}

.contratActionable:hover,
.contratActionable:focus {
    color: inherit;
}

.contratActionable img {
    -webkit-transition: 0.6s;
    border: 5px solid rgba(255, 255, 255, 0);
    display: inline-block;
    margin: 0 10px 10px;
    transition: 0.6s;
}

.contratActionable img:first-child:hover {
    border: 5px solid rgba(255, 255, 255, 1);
    opacity: .8;
    transform: translateY(-10px);
}


/* equipe commerciale
-------------- */

.teamCom {
    border-bottom: 1px solid #454545;
    font-size: 31px;
    font-weight: 300;
    margin-bottom: 50px;
    padding-bottom: 50px;
    text-align: center;
}

.teamCom strong { font-weight: 700; }

.teamComWerak {
    display: table;
    margin-top: 20px;
    table-layout: fixed;
    text-align: center;
    width: 100%;
}

.teamComWerak div { display: table-cell; }

/* css christophe
------------------------------------------------------- */

.inputd[readonly], .inputg[readonly], [readonly] {
    background-color: #eee;
    cursor: not-allowed;
    opacity: 1;
}


fieldset { border: 0; }

.invisible { display: none; }

.form-group span { }

.field-validation-error,
.validation-summary-errors { font-weight: 700; }

#monFocus { }



/* MAJ Nav ------------------------------------------ */

.majjj {
    background-color: #f3f3f4;
    font-family: arial, helvetica, sans-serif;
    left: 50%;
    margin-left: -300px;
    margin-top: -200px;
    padding: 50px;
    position: absolute;
    top: 50%;
    width: 600px;
}

.majjj h1 sub {
    font-weight: 600;
    line-height: 12px !important;
    text-transform: none;
}

.majjj ul {
    border-bottom: 1px solid #ccc;
    list-style: none;
    margin-bottom: 30px;
    padding-left: 0;
}

.majjj ul li {
    display: inline-block;
    margin-left: 42px;
    vertical-align: top;
    width: 47px;
}

.majjj ul li a {
    background: transparent url(../img/browsers.png) 0 top no-repeat;
    display: block;
    height: 90px;
    text-align: center;
    width: 47px;
}

.majjj ul li a span {
    display: block;
    height: 100%;
    margin-top: 40px;
    text-align: center;
}

#navIe { background-position: 0 top; }

#navFF { background-position: -100px top; }

#navCh { background-position: -200px top; }

#navOp { background-position: -300px top; }

#navSaf { background-position: -400px top; }

.majjj p {
    margin-top: 20px;
    text-align: center;
}


/* page aideWetrak*/

#aideWetrak .panel-body { padding: 24px 28px; }

#aideWetrak .panel-video .panel-body { padding-bottom: 10px; }

#aideWetrak .panel-video .videoWrapper { margin-top: 0; }

#aideWetrak .panel-body a:hover strong { color: #fff; }

#aideWetrak ul.aideLinks li { margin: 10px 0; }



/*formation elearning*/

.elearning h5 { font-weight: 700; }

.elearning h4 {
    font-size: 28px;
    font-weight: 300;
}

.calendrier {
    border: 1px solid #dfdfdf;
    border-radius: 10px;
    color: #939191;
    font-size: 1.5em;
    font-weight: bold;
    height: 66px;
    margin: auto;
    text-align: center;
    width: 66px;
}

.calendrierDay {
    background-color: #dfdfdf;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    height: 33px;
    line-height: 33px;
}

.calendrierMonth {
    font-size: 15px;
    height: 33px;
    line-height: 33px;
}

.calendrierYear {
    font-size: 15px;
    line-height: 33px;
}

.encours {
    color: #939191;
    font-size: 1.1em;
    font-style: italic;
    margin-top: 56px;
}

.skillWrap {
    background-color: #dfdfdf;
    border-radius: 5px;
    height: 8px;
}

.skillProgress {
    background-color: #83ba17;
    border-radius: 5px;
    height: 8px;
}


.circle {
    margin: 24px auto 0;
    position: relative;
    text-align: center;
    width: 80px;
    height: 80px
}

.circle strong {
    left: 0;
    top: 50%;
    width: 100%;
    color: inherit;
    position: absolute;
    font-size: 23px;
    font-weight: 700;
    transform: translateY(-50%);
}

.circle strong i {
    font-size: 1em;
    font-style: normal;
    font-weight: normal;
}

/*emojis*/

.oldelearning h4 {
    font-size: 28px;
    font-weight: 300;
}

.imgVeryHappy, .imgHappy, .imgNeutral, .imgSad, .imgWarning {
    background: center center no-repeat;
    background-size: 25px 25px;
    width: 35px;
}

.imgVeryHappy { background-image: url(../img/ico/veryHappy.png); }

.imgHappy { background-image: url(../img/ico/happy.png) }

.imgNeutral { background-image: url(../img/ico/neutral.png) }

.imgSad { background-image: url(../img/ico/sad.png) }

.imgWarning { position: relative; }

.imgWarning:after {
    background: center center no-repeat;
    background-image: url(../img/ico/warning.png);
    background-size: 25px 25px;
    content: "";
    display: block;
    height: 25px;
    margin-left: 25px;
    position: absolute;
    top: 4px;
    width: 25px;
}

/* page balise wetrak */

section#baliseWetrak h4 span { background-color: #acacac; }

section#baliseWetrak .panel-body a:hover { color: #fff; }

/* page Contat Wetrak*/

section#contratWetrak .decouvrirWetrak h4 span { background-color: #acacac; }

section#contratWetrak .decouvrirWetrak #bonPlan1 .panel-body { padding: 24px 0 14px; }

.img100 { max-width: 100%; }

section#baliseWetrak .panel-body a,
section#contratWetrak .decouvrirWetrak a strong,
section#contratWetrak .decouvrirWetrak a span.glyphicon { color: #4c4c4c; }

section#contratWetrak .decouvrirWetrak a:hover strong { font-weight: 600; }

section#contratWetrak .decouvrirWetrak a span.glyphicon { margin-left: 5px; }

section#contratWetrak .decouvrirWetrak a[type='#accordionbonsPlans'] img { opacity: 0.4:; }

section#contratWetrak .decouvrirWetrak a:hover strong {
    background-color: #4c4c4c;
    color: #fff;
}

section#contratWetrak .mentionsLegales { opacity: .65; }


/* cookie alerte --------------------------------- */

#cookie-alert {
    background-color: rgba(0, 0, 0, .8);
    color: #fff;
    position: absolute;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 99999999999999999999999999;
}

#cookie-alert .alert {
    display: inline-block;
    font-size: 11px;
    margin: 5px 0 3px 0;
    max-width: 900px;
    padding: 5px;
    text-align: justify;
}

#cookie-alert .alert form { display: inline-block; }

#cookie-alert .alert input {
    background-color: #fff;
    background-color: rgba(255, 255, 255, .5);
    border: 3px solid #000;
    border: 0px solid #fff;
    border: 1px solid rgba(255, 255, 255, .2);
    color: #666666;
    display: inline-block;
    font-size: 11px;
    margin-left: 10px;
    padding: 4px 8px;
}

#cookie-alert .alert input:hover { background-color: #fff; }


/* decouvrir wetrak
---------------------------------------------- */

.decouvrirWetrak h4 { margin-top: 28px; }

.mt40 { margin-top: 38px !important; }

.decouvrirWetrak h4 span {
    background-color: #243a51;
    border-radius: 3px;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    padding: 3px 5px;
    text-transform: uppercase;
}

.decouvrirWetrak ul#weFonction {
    list-style: none;
    margin-top: 30px;
    padding-left: 0;
}

.decouvrirWetrak ul#weFonction li { margin-bottom: 10px; }

.decouvrirWetrak ul#weFonction li img {
    float: left;
    margin-right: 10px;
}

.decouvrirWetrak ul#weFonction li:after { clear: both; }

.decouvrirWetrak a strong { color: #243a51; }

.decouvrirWetrak div#stores {
    text-align: center;
}

.decouvrirWetrak #stores img {
    border-radius: 3px;
    opacity: .8;
    position: relative;
}

.decouvrirWetrak #stores img:hover {
    margin-top: -8px;
    opacity: 1;
}

.decouvrirWetrak a:hover strong {
    background-color: #243a51;
    color: #fff;
    font-weight: normal;
}

body.policeMenu .nav > li > a {
    font-size: 12px;
    padding: 0 10px;
}



/* declaration de sinistre */

.RappelEvtNonCouvert,
.BoldRed {
    color: #b94a48;
    font-weight: bold;
}

.BoldGreen {
    color: green;
    font-weight: bold;
}

.RappelEvtNonCouvertType {
    color: #454545;
    font-weight: bold;
}

h1.h1d div {
    display: inline-block;
    margin-left: 10px;
    text-align: left;
    vertical-align: middle;
}

h1.h1d span {
    font-size: 30px;
    line-height: 30px;
}

h1.h1d sub { font-size: 20px; }

h1.h1d img {
    display: inline-block;
    height: 96px;
    vertical-align: middle;
    width: 69px;
}

.infoRappel.panel-primary .panel-heading { background-color: #d8d8d8; }

.dlshort { padding-bottom: 24px; }

.dlshort dl { margin-bottom: 0; }


.panel-body dl dd.isActif1 {
    color: green;
    font-weight: bold;
}

.panel-body dl dd.isActif0 {
    color: red;
    font-weight: bold;
}

.panel-body dl dd.isActif1:after { content: "Actif"; }

.panel-body dl dd.isActif0:after { content: "Inactif"; }

.infoRappel table.rappel {
    table-layout: fixed;
    width: 100%;
}

.infoRappel table.rappel tr td { vertical-align: top; }

.infoRappel table.rappel tr td strong {
    color: #454545;
    font-weight: 600;
    vertical-align: top;
}

a.detailContrat {
    float: right;
    font-size: 13px;
    font-weight: normal;
}

a.detailContrat:hover { text-decoration: none; }

.w190 { width: 190px; }

.declaSinistre1 .field-validation-error {
    display: block;
    margin-bottom: 15px;
    text-align: center;
    text-align: center;
}

fieldset.declaTypeSinistre {
    border: 1px solid #dddddd;
    margin-bottom: 24px;
    padding: 14px 0 9px;
    text-align: left;
    width: 100%;
}

fieldset.declaTypeSinistre input[type=radio] + label {
    background-color: #fff;
    font-weight: normal;
    height: 30px;
    line-height: 30px;
    margin-bottom: 0;
    overflow: hidden;
    padding: 0 25px;
    position: relative;
    text-overflow: ellipsis;
    width: 100%;
    font-size:12px;
}

fieldset.declaTypeSinistre input[type=radio] + label:hover {
    background-color: #e5f0ce;
    cursor: pointer;
    height: 100%;
}

fieldset.declaTypeSinistre input[type=radio] + label:before {
    content: "\25CB";
    display: block;
    font-size: 20px;
    left: 7px;
    line-height: 27px;
    opacity: .5;
    position: absolute;
}

fieldset.declaTypeSinistre input[type=radio]:checked + label:before {
    content: "\25CF";
    opacity: 1;
}

fieldset.declaTypeSinistre input[type=radio]:not(:checked) + label:hover:after { border-color: transparent transparent transparent #e5f0ce; }

fieldset.declaTypeSinistre input[type=radio]:checked + label {
    background-color: #96c53a;
    color: #fff;
    height: 100%;
}

fieldset.declaTypeSinistre input[type=radio] + label:after {
    border-color: transparent transparent transparent #fff;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    content: "";
    height: 0;
    position: absolute;
    right: 20px;
    top: 10px;
    width: 0;
}

fieldset.declaTypeSinistre input[type=radio]:checked + label:after { right: 12px; }

fieldset.declaTypeSinistre input[type=radio] {
    left: -9999px;
    position: absolute;
}

fieldset.declaTypeSinistre.fluide { display: inline-block; }

fieldset.declaTypeSinistre.fluide input[type=radio] + label { 
    width: 100%;
    overflow: visible;
}

.accordCaps {
    font-size: 21px;
    font-weight: 300;
    text-transform: uppercase;
}

.accordCaps strong {
    font-size: 24px;
    font-weight: 700;
}

.accordNum {
    font-family: 'arial bold', sans-serif;
    font-size: 23px;
    font-weight: 600;
}

form.formFranchise .row { margin-bottom: 10px; }

form.formFranchise .row.uploadpieces { margin-bottom: 0px; }

form.formFranchise label input[type=radio] { }

form.formFranchise .uploadbtn .col-xs-4 { padding-top: 9px; }

form.formFranchise .uploadbtn p.file-return {
    display: inline-block;
    padding-left: 20px;
}

form.formFranchise .listeFichiersUp > div > span {
    background-color: #eee;
    border-radius: 5px;
    color: #0d0d0d;
    cursor: pointer;
    float: left;
    font-size: 16px;
    height: 30px;
    margin-left: -4px;
    margin-right: 4px;
    margin-top: 3px;
    padding: 7px 8px;
}

form.formFranchise .listeFichiersUp > div > span:hover {
    background-color: #ddd;
    color: #0d0d0d;
}

form.formFranchise .listeFichiersUp > div {
    background-color: #f7f7f7;
    border: 1px dashed #dfdfdf;
    display: inline-block;
    height: 40px;
    line-height: 40px;
    margin: 0px 10px 10px 0;
    padding: 0 18px 0 8px;
    text-align: center;
    vertical-align: top;
}

form.formFranchise .listeFichiersUp > div:after {
    content: attr(data-fichierUp);
    font-style: italic;
}

form.formFranchise .listeFichiersUp > div:before {
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font: normal normal normal 17px/1 FontAwesome;
    height: 30px;
    line-height: 30px;
    margin: 0 10px 0 5px;
    position: relative;
    text-rendering: auto;
    top: 2px;
}

form.formFranchise .listeFichiersUp [data-fichierUp$=".pdf"]::before { content: "\f1c1"; }

form.formFranchise .listeFichiersUp [data-fichierUp$=".jpg"]::before,
form.formFranchise .listeFichiersUp [data-fichierUp$=".jpeg"]::before,
form.formFranchise .listeFichiersUp [data-fichierUp$=".png"]::before,
form.formFranchise .listeFichiersUp [data-fichierUp$=".tiff"]::before { content: "\f1c5"; }

.documentGroup {
    padding: 0;
    margin: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

.documentCard {
   background-color: #EAEAEA; 
   padding: 16px; 
   border-radius: 8px;
}


/*[href$=".pdf"]::after{content: "(pdf)";}*/

.modal-content.modalLoad {
    background-color: none;
    margin: 140px auto auto auto;
    padding-top: 10px;
    position: relative;
    text-align: center;
    width: 221px;
}

.modal-content.modalLoad img {
    display: block;
    margin: auto;
    opacity: .6;
    position: relative;
}

.modal-content.modalLoad .bootbox-close-button { display: none; }

#rappeldateProlong {
    border: 1px solid #e7e7e8;
    color: cecece;
    font-family: arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 10px;
    padding: 10px 20px 10px 20px;
    text-align: center;
    text-transform: uppercase;
}

span.nb {
    background-color: #e7e7e8;
    display: inline-block;
    height: 18px;
    line-height: 18px;
    margin-top: 2px;
    position: relative;
    text-align: center;
    vertical-align: top;
    width: 18px;
}

span.nb + strong {
    display: inline-block;
    padding-left: 10px;
    vertical-align: top;
    width: 169px;
}

.ui-datepicker {
    background-color: #ffffff;
    border: 1px solid #dddddd;
    display: none;
    font-family: arial, sans-serif;
    padding: 0;
    width: 100%;
}

.ui-datepicker .ui-datepicker-header {
    padding: 0;
    position: relative;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    height: 1.8em;
    position: absolute;
    top: 2px;
    width: 1.8em;
}

.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover { top: 1px; }

.ui-datepicker .ui-datepicker-prev { left: 8px; }

.ui-datepicker .ui-datepicker-next { right: 8px; }

.ui-datepicker .ui-datepicker-prev-hover { left: 1px; }

.ui-datepicker .ui-datepicker-next-hover { right: 1px; }

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
    display: block;
    left: 50%;
    margin-left: -8px;
    margin-top: -8px;
    position: absolute;
    top: 50%;
}

.ui-datepicker .ui-datepicker-title {
    line-height: 1.8em;
    margin: 0 2.3em;
    text-align: center;
}

.ui-datepicker .ui-datepicker-header, .ui-datepicker .ui-datepicker-title { border-bottom: 1px solid #ececec; }

.ui-datepicker .ui-datepicker-title select {
    font-size: 1em;
    margin: 1px 0;
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
    font-weight: bold;
    width: 45%;
}

.ui-datepicker table {
    border-collapse: collapse;
    font-size: .8em;
    margin: 0 0 .4em;
    width: 100%;
}

.ui-datepicker th {
    border: 0;
    font-weight: bold;
    padding: .7em .3em;
    text-align: center;
    text-transform: uppercase;
}

.ui-datepicker td {
    border: 1px solid #f1f1f1;
    padding: 1px;
    text-align: center;
}

.ui-datepicker td:first-child { border-left: 0; }

.ui-datepicker td:last-child { border-right: 0; }

.ui-datepicker td span,
.ui-datepicker td a {
    display: inline-block;
    padding: .1em;
    text-align: right;
    text-decoration: none;
}

.ui-datepicker .ui-datepicker-buttonpane {
    background-image: none;
    border-bottom: 0;
    border-left: 0;
    border-right: 0;
    margin: .7em 0 0 0;
    padding: 0 .2em;
}

.ui-datepicker .ui-datepicker-buttonpane button {
    cursor: pointer;
    float: right;
    margin: .5em .2em .4em;
    overflow: visible;
    padding: .2em .6em .3em .6em;
    width: auto;
}

.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float: left; }


/* with multiple calendars */

.ui-datepicker.ui-datepicker-multi { width: auto; }

.ui-datepicker-multi .ui-datepicker-group { float: left; }

.ui-datepicker-multi .ui-datepicker-group table {
    margin: 0 auto .4em;
    width: 95%;
}

.ui-datepicker-multi-2 .ui-datepicker-group { width: 50%; }

.ui-datepicker-multi-3 .ui-datepicker-group { width: 33.3%; }

.ui-datepicker-multi-4 .ui-datepicker-group { width: 25%; }

.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width: 0; }

.ui-datepicker-multi .ui-datepicker-buttonpane { clear: left; }

.ui-datepicker-row-break {
    clear: both;
    font-size: 0;
    width: 100%;
}

/* RTL support */

.ui-datepicker-rtl { direction: rtl; }

.ui-datepicker-rtl .ui-datepicker-prev {
    left: auto;
    right: 2px;
}

.ui-datepicker-rtl .ui-datepicker-next {
    left: 2px;
    right: auto;
}

.ui-datepicker-rtl .ui-datepicker-prev:hover {
    left: auto;
    right: 1px;
}

.ui-datepicker-rtl .ui-datepicker-next:hover {
    left: 1px;
    right: auto;
}

.ui-datepicker-rtl .ui-datepicker-buttonpane { clear: right; }

.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; }

.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group { float: right; }

.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
    border-left-width: 1px;
    border-right-width: 0;
}

.ui-icon-circle-triangle-e {
    background-image: url(../img/declaSinistre/dateNext.png);
    height: 18px;
    width: 18px;
}

.ui-icon-circle-triangle-w {
    background-image: url(../img/declaSinistre/datePrev.png);
    height: 18px;
    width: 18px;
}

.ui-icon { text-indent: -9999999px; }

.ui-datepicker-today { background-color: #f1f3ee; }

.ui-datepicker .ui-datepicker-header, .ui-datepicker .ui-datepicker-title {
    background-color: #fafafa;
    height: 33px;
    line-height: 33px;
}

.ui-datepicker td span, .ui-datepicker td a {
    height: 30px;
    line-height: 30px;
    text-align: center;
    width: 35px;
}

.ui-datepicker td {
    height: 30px;
    padding: 0;
    width: 30px;
}

table.ui-datepicker-calendar {
    margin: 0 11px 12px 11px;
    width: 92%;
}

table.ui-datepicker-calendar tr:last-child td { border-bottom: 0; }

.ui-datepicker-calendar a:hover { background-color: #fafafa; }

.ui-datepicker .ui-datepicker-next-hover {
    cursor: pointer;
    right: 6px;
    top: 2px;
}

.ui-datepicker .ui-datepicker-prev-hover {
    cursor: pointer;
    left: 6px;
    top: 2px;
}

.ui-datepicker td span:hover, .ui-datepicker td a:hover { color: #666666; }

.ui-datepicker td a.ui-state-active {
    background-color: #96c53a;
    border-radius: 50%;
    color: #ffffff;
    font-weight: bold;
    height: 25px;
    line-height: 25px;
    width: 25px;
}

.ui-datepicker td.ui-state-disabled {
    background-color: #fafafa;
    cursor: initial;
    opacity: .5;
}

table.ui-datepicker-calendar .ui-state-default,
.ui-datepicker-calendar .ui-widget-content .ui-state-default,
.ui-datepicker-calendar .ui-widget-header .ui-state-default {
    background: none;
    border: none;
    color: #666;
}

table.ui-datepicker-calendar .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { border-bottom-right-radius: 5px; }

table.ui-datepicker-calendar .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { border-bottom-left-radius: 5px; }

table.ui-datepicker-calendar .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { border-top-right-radius: none; }

table.ui-datepicker-calendar .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { border-radius: none; }

table.ui-datepicker-calendar th {
    color: #666;
    font-size: .8em;
}

#datepicker .ui-datepicker-month { }

#datepicker .ui-widget-header {
    border: none;
    color: #666666;
    font-size: 13px;
    font-weight: normal;
}

#datepicker .ui-widget-header .ui-icon-circle-triangle-e { background-image: url(../img/declaSinistre/dateNext.png); }

#datepicker .ui-widget-header .ui-icon-circle-triangle-w { background-image: url(../img/declaSinistre/datePrev.png); }

#datepicker .ui-icon-circle-triangle-w, #datepicker .ui-icon-circle-triangle-e { background-position: 0 0; }

#datepicker { border-radius: 0; }

#datepicker a.ui-datepicker-next:hover, #datepicker a.ui-datepicker-prev:hover { background-color: #fff; }

.ouuu {
    background-color: #e7e7e8;
    border-radius: 50%;
    height: 65px;
    line-height: 65px;
    margin: -23px auto -23px auto;
    padding: 10px;
    position: relative;
    position: relative;
    text-align: center;
    width: 65px;
    z-index: 2;
}

.ouuu div {
    background-color: #fff;
    border-radius: 50%;
    color: #454545;
    font-size: 13px;
    font-weight: bold;
    height: 45px;
    line-height: 45px;
    margin: 0 auto;
    width: 45px;
}

.ouuu + .panel-body { padding-top: 38px; }

img.disabled {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    img.disabled { opacity: .4; }
}

.hrBottom {
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: 15px;
    padding-bottom: 10px;
}

/* custom select file input */

.input-file-trigger {
    background: url(../img/upload.png) left 15px center no-repeat;
    background-color: #ffffff;
    border: 1px solid #dfdfdf;
    color: #666666;
    display: inline-block;
    min-width: 190px;
    padding: 10px 20px 10px 40px;
}

.input-file-container {
    display: inline-block;
    height: 40px;
    margin-right: 10px;
    position: relative;
    width: 190px;
}

.input-file-trigger-size {
    background: url(../img/upload.png) left 10px center no-repeat;
    background-color: #ffffff;
    border: 1px solid #dfdfdf;
    color: #666666;
    display: inline-block;
    min-width: 190px;
    padding: 10px 0px 10px 30px;
}

a#InfoBulleViderFichiers {
    display: inline-block;
    margin: 0;
}

.js .input-file-trigger {
    cursor: pointer;
    transition: all .4s;
}

.js .input-file {
    cursor: pointer;
    left: 0;
    min-width: 145px;
    opacity: 0;
    padding: 14px 0 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.js .input-file:hover + .input-file-trigger,
.js .input-file:focus + .input-file-trigger,
.js .input-file-trigger:hover,
.js .input-file-trigger:focus {
    background-color: #fafafa;
    ;
    color: #666666;
}

.file-return { margin: 0; }

.file-return:not(:empty) { margin: 0 0 1em 0; }

.js .file-return {
    color: #8db838;
    font-size: .9em;
    font-style: italic;
}

.js .file-return:not(:empty):before {
    content: " ";
    font-style: normal;
    font-weight: normal;
}



/* helpers */

.txtc { text-align: center; }

.txtl { text-align: left; }

.txtr { text-align: right; }

.txtj { text-align: justify; }


/*MODIFICATIONS CCE*/

.tableActionCommande { width: 200px; }

.tableActionCommande tr { }

table.demat tr td .tableActionCommande tr td {
    padding: 0 0 0 0px;
    width: 60px;
}


table.demat tr td .tableActionCommande tr td:first-child { padding-left: 0; }

table.demat tr td .tableActionCommande tr td:last-child {
    padding-right: 0;
    text-align: left;
}


table.demat tr td .tableActionCommande tr {
    background: transparent;
    border-bottom: none;
}

input#SearchString {
    height: 40px;
    margin-bottom: 20px;
    margin-right: 10px;
    position: relative;
    top: 1px;
    width: 200px;
}


/* styles for validation helpers */

.field-validation-error { color: #b94a48; }

.field-validation-valid { display: none; }

input.input-validation-error { border: 1px solid #b94a48; }

input[type="checkbox"].input-validation-error { border: 0 none; }

.validation-summary-errors { color: #b94a48; }

.validation-summary-valid { display: none; }

.invisible { display: none; }

#popOverIdentifiant,
#divLogin { display: inline-block !important; }

#popOverIdentifiant {
    margin-left: 2px;
    margin-top: 0px;
}

.validationMessage {
    margin-left: 10px;
    margin-top: 10px;
    position: absolute;
}

#inputMail { width: 400px; }

/* page indisponibilite / 404 / maintenances */

.p404 { }

.p404 #logo404 {
    bottom: 5%;
    left: 5%;
    position: absolute;
    z-index: 20;
    text-align: center;
}

.p404 p.welcome404 {
    color: #454545;
    font-size: 40px;
    line-height: 40px;
    text-shadow: none;
}

ul#listeContact404 {
    list-style: none;
    padding: 20px 0;
}

ul#listeContact404 li {
    line-height: 41px;
    max-width: 474px;
    text-transform: uppercase;
}

ul#listeContact404 li span {
    border-bottom: 1px solid #c7c7c7;
    display: inline-block;
    vertical-align: middle;
}

ul#listeContact404 li span:first-child { width: 220px; }

ul#listeContact404 li span + span {
    font-weight: 700;
    min-width: 180px;
    text-align: center;
}

ul#listeContact404 li a {
    display: inline-block;
    margin-left: 20px;
    vertical-align: middle;
}

/* page historique de demandes groupe */

#historiqueDgpe em { font-weight: normal; }

#historiqueDgpe input#SearchString { width: 300px; }

#historiqueDgpe form {
    border-bottom: 1px solid #dedede;
    margin-bottom: 20px;
}

#historiqueDgpe .pagination-container { margin-top: 11px; }

#historiqueDgpe .pagination-container,
#historiqueDgpe .legend {
    display: inline-block;
    vertical-align: middle;
}

#historiqueDgpe .legend {
    float: right;
    margin-top: 10px;
}

#historiqueDgpe .legend dfn,
#Historique .legend dfn {
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
}

#historiqueDgpe .btn.disabled, #historiqueDgpe .btn[disabled], .btnLegend.btn[disabled] {
    background-color: #f5f5f5;
    border: 1px solid #dfdfdf;
    color: #666666;
}

#historiqueDgpe .btn:not(.ablocBlanc) {
    font-size: 11px;
    font-weight: normal;
    min-width: 0;
    padding: 5px 10px;
    text-transform: inherit;
}

#historiqueDgpe button .glyphicon-pencil { margin-right: -2px; }

#historiqueDgpe table.demat tr td {
    padding-bottom: 10px;
    padding-top: 10px;
}

#historiqueDgpe label { font-weight: normal; }

#historiqueDgpe div.tooltip-wrapper { display: inline-block; }

#historiqueDgpe .infoSecondPlan { opacity: .5; }

#Historique .legend {
    display: inline-block;
    float: right;
    margin-bottom: 20px;
    vertical-align: middle;
}

#Historique .legend .btn {
    min-width: auto !important;
    padding: 5px 10px;
}

/*Ajout de CCS par CCE afin de customiser le input type='file' sur l'ecran de creation des commandes WP*/

.fileUpload {
    overflow: hidden;
    position: relative;
}

.fileUpload input.upload {
    cursor: pointer;
    filter: alpha(opacity=0);
    font-size: 20px;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

#bonPlanOpodo a img { opacity: 0.7; }

#bonPlanOpodo a img:hover { opacity: 1; }

/*MODIFICATIONS CCE*/

/*MODIFICATIONS KBA*/

#listCentreInfo { padding-left: 170px; }

#listCentre { padding-left: 310px; }

#listCentreConf { padding-left: 380px; }

a#popOverC1 + .popover { max-width: none; }

/*MODIFICATIONS KBA*/




/*MODIFICATIONS MGR*/

.colFixes #thProduit { width: 140px; }

.colFixes #thDesignation { width: 400px; }

.produitLibelle input { width: 100%; }

.etoileAsterisque { font-size: 20px; }

.legendeAsterisque {
    font-size: 10px;
    font-weight: normal;
}

.decalageAsterisque { margin-top: -6px; }

.messageRecherche span {
    font-weight: bold;
    text-decoration: underline;
}

.messageRecherche { width: 490px; }

/*MODIFICATIONS MGR*/

.numTel {
    font-size: 110%;
    font-weight: bold;
}


.btnRechercheHistorique { }

/* Icon when the collapsible content is shown */

.btnRechercheHistorique:after {
    content: "\2212";
    float: right;
    font-family: "Glyphicons Halflings";
    margin-left: 15px;
}

/* Icon when the collapsible content is hidden */

.btnRechercheHistorique.collapsed:after { content: "\2b"; }

#contactsCo .panel-body { height: 342px; }

#contactsCo .ligne1 img { border-radius: 50%; }

#contactsCo p.infoUtil {
    font-weight: 300;
    margin-top: 30px;
}

#contactsCo p.infoUtil:before {
    border-top: 1px solid #ddd;
    content: "";
    display: block;
    left: 50%;
    margin-left: -25px;
    margin-top: -10px;
    position: absolute;
    width: 50px;
}

#contactsCo .callNumber { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; }

#contactsCo .panel-primary .panel-heading { height: 90px; }

#contactsCo .centreVert { display: table; }

#contactsCo .centreVert h4 {
    display: table-cell;
    vertical-align: middle;
}

form.formFranchise .listeFichiersUp > div {
    display: inline-block;
    max-width: 300px;
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
}

form.formFranchise .listeFichiersUp.CreationVr > div { max-width: 300px; }

form.formFranchise .listeFichiersUp.RepriseVr > div { max-width: 190px; }

form.formFranchise .listeFichiersUp.fichiersPKFRC > div { width: 464px; }

form.formFranchise .listeFichiersUp > div.FichierUp { padding-right: 0; }

form.formFranchise .listeFichiersUp > div.FichierUp > div.NomFichierUp {
    font-size: 12px;
    font-style: italic;
    margin-right: 3px;
    overflow: hidden;
    padding-right: 3px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

form.formFranchise .listeFichiersUp > div.FichierUp > div.NomFichierUp:before {
    -webkit-font-smoothing: antialiased;
    font: normal normal normal 17px/1 FontAwesome;
    margin: 0 3px 0 3px;
    text-rendering: auto;
}

form.formFranchise .listeFichiersUp > div.FichierUp[nom-fichierUp$=".pdf"] > div.NomFichierUp:before { content: "\f1c1"; }

form.formFranchise .listeFichiersUp > div.FichierUp[nom-fichierUp$=".jpg"] > div.NomFichierUp:before,
form.formFranchise .listeFichiersUp > div.FichierUp[nom-fichierUp$=".jpeg"] > div.NomFichierUp:before,
form.formFranchise .listeFichiersUp > div.FichierUp[nom-fichierUp$=".png"] > div.NomFichierUp:before,
form.formFranchise .listeFichiersUp > div.FichierUp[nom-fichierUp$=".tiff"] > div.NomFichierUp:before { content: "\f1c5"; }

.row-textarea textarea {
    height: 100px;
    width: 80%;
}

.no-margin-left { margin-left: 0 !important; }

.champs-textarea { margin-bottom: 40px; }

.champs-textarea p { text-align: left; }

.champs-textarea textarea {
    height: 150px;
    width: 100%;
}

.champs-textarea.textareavr textarea { height: 119px; }


.tableaux { margin: 20px 0 20px; }

.tableaux table { width: 48%; }

.tableaux table { float: left; }

.tableaux table.float-right { float: right; }

.tableaux table th {
    background: #e7e7e8;
    padding: 5px 10px;
    text-align: center;
}

.tableaux table th.titre-tableau { background: #dddddd; }


.tableaux table,
.tableaux table th,
.tableaux table td { border: 1px solid #dddddd; }

.tableaux table td {
    /* white-space: nowrap; */
    max-width: 260px;
    overflow: hidden;
    padding: 5px 10px;
    text-overflow: ellipsis;
}

.centrer { text-align: center; }

a#InfoBulleViderFichiers.btnvr { margin-top: 10px; }

.white-background { background-color: #ffffff; }

.telTextbox {
    margin-left: 5px;
    width: calc(16.66666667% - 5px);
}

.indicatifDropdown { padding: 8px 12px; }

.disabled-element {
    background-color: #F5F5F5;
    cursor: not-allowed !important;
}

.underline {
    text-decoration: underline;
}

textarea.autoExpand {
    resize: none;
    padding: 13px;
    display: block;
    overflow: hidden;
}

.inline-flex {
    display: table;
}

.loader {
    border: 5px solid #f3f3f3;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
    border-top: 5px solid #555;
    border-radius: 50%;
    margin-left: 49%;
    width: 30px;
    height: 30px;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.legendeRecherche {
    text-align: left;
    font-size: 12px;
    font-weight: normal;
}

.legendeRecherche > span {
    text-decoration: underline;
}

.label-rounded-box {
    display: flex;
    justify-content: end;
    align-items: center;
}

.label-rounded {
    width: fit-content;
    padding: 10px;
    border-radius: 25px;
}

.alert-default {
    background-color: #ffffff;
    border: 1px solid #ffffff;
}

.alert-in-progress {
    background-color: #FF8000;
    border: 1px solid #FF8000;
    color: #FFFFFF;
}

.new-input-file-trigger {
    background: url(../img/upload-black.png) 40% 50% no-repeat;
    background-color: #ffd100 !important;
    border: 1px solid #ffd100 !important;
    padding: 10px;
    min-width: 100%;
    cursor: pointer;
    text-align: center;
}

.btn-box {
    display: flex;
    justify-content: space-around;
}

.red {
    color: #b94a48;
}

.card-content {
    min-height: 130px;
}

.display-pj {
    background-color: #FFFFFF;
    padding: 10px;
    margin-top: 10px;
}

.border-danger {
    border: 1px solid #bb3a34;
}

.display-pj a {
    text-decoration: none;
}

.display-pj a:hover {
    background-color: #FFFFFF;
    color: #000000;
}

.display-pj a:visited {
    color: #000000;
}

.icon-right {
    float: right;
}