/**
* The base application for website
*
* This file contains the following configurations:
*
* Main Style sheet 
*/

html {
    height: 100%;
}

body {
    font-family: roboto, arial, tahoma, verdana, helvetica;
    color: #000;
    height: 100%;
}

footer {
    position: absolute;
    bottom: 0;
}

div.formajouter {
    border: 1px solid red;
}

.nowrap {
    white-space: nowrap;
}

.highlight {
    color: red;
}


/* Colors */

.white {
    color: #FFF;
}

.yellow {
    color: #D8E000;
}

.doree {
    color: rgb(212, 175, 55);
}

.black {
    color: #000;
}

.dark_grey {
    color: #404040;
}

.light_grey {
    color: #C0C0C0;
}

.valid_color_0,
.valid_color_ {
    color: red;
}

.valid_color_1,
.green {
    color: green;
}

.title-h4,
.title-h5 {
    color: #D4D4D4;
}

.bg_light {
    background-color: red!important;
}


/* /color */

.entete_table {
    line-height: 25px;
    background-color: #c8c8c8;
}

.formaddinline,
tr td.bordertop,
tr th.bordertop {
    border-top: 2px solid #404040;
    background-color: #c8c8c8;
}

.generate:hover,
a input.link {
    cursor: pointer;
}

.w-10 {
    width: 10%;
}

.w-20 {
    width: 20%;
}

.w-25 {
    width: 25%;
}

.w-50 {
    width: 50%!important;
}

.w-60 {
    width: 60%!important;
}

.w-75 {
    width: 75%;
}

.w-80 {
    width: 80%;
}

.w-90 {
    width: 90%;
}

p.statusMsg,
div.nofound,
div.statusMsg {
    padding: 5px;
    background-color: #FF7373;
    border-radius: 5px;
    color: #000;
}

div.statusMsguser {
    background-color: #B1F9B4;
    color: green;
    padding: 5px;
    border-radius: 5px;
    display: none;
}

div.statusMsg {
    position: fixed;
    top: 0px;
    width: 60%;
    margin: 20%;
    background-color: #B1F9B4;
    color: green;
    z-index: 1000;
}

div.statusMsg.error,
input.error:focus {
    background-color: #FF7373;
    color: #FFF;
}

div.nofound {
    display: block;
}

.a {
    font-weight: bold;
}

a.active {
    font-size: 0.80rem!important;
    font-weight: bold!important;
    color: #343A40 !important;
}

a.vsmenu.active,
a.vmenuv2.active {
    font-size: 0.75rem!important;
    font-weight: bold!important;
    color: #343A40 !important;
}

div.menu_contenu {
    /*font-size: 0.75rem!important;*/
}

.a:hover {
    color: red;
    cursor: pointer;
}

.a::before {
    /*  font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f482";padding-left : 2px;*/
}

a.vsmenu.active::before,
a.vmenuv2.active::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f105";
    padding-left: 0px;
    padding-right: 1px;
    font-size: 0.75rem!important;
}

.hidden {
    display: none;
}

div.sidebar {
    background-color: #f8f8f8!important;
}

a.sidebar_titre_2 {
    text-decoration: none;
    color: #343A40!important;
}

a.sidebar_link,
a.sidebar_item,
a.sidebar_subitem {
    display: inline-block;
    color: #343A40!important;
    width: 100%;
    padding-left: 10px;
    text-decoration: none;
}

a.sidebar_subitem {
    padding-left: 20px;
}

a.link:hover {
    color: red!important;
}

div.main_page {
    display: inline-block;
}

.titre_section {
    background-color: #EDEDED;
    color: #686868;
    line-height: 25px;
    font-weight: bold;
}


/* icones*/ //
.address::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0c0";
    padding: 10px;
}

.customer::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0c0";
    padding: 10px;
}

.depart::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f5b0";
    padding: 10px;
}

.arrivee::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f5af";
    padding: 10px;
}


/*.box::before {
   font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f466";padding-left : 2px;
 }
 */

.boxes::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f468";
    padding-left: 2px;
}

.container::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f482";
}

.btn-icones.maritime::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f21a";
}

.btn-icones.aerien::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f5b0";
}

.btn-icones.routier::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0d1";
}

.btn-icones.import::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0a8";
}

.btn-icones.export::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0a9";
}

.btn-icones.lcl::before,
.lcl::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f49e";
}

.btn-icones.ftl::before,
.ftl::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f482";
}

.btn-icones.fcl::before,
.fcl::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f482";
}

.btn-icones.groupage::before,
.groupage::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f468";
}

.btn-icones.plus::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0fe";
}

.import::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0a8";
}

.export::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0a9";
}

.maritime::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f21a";
}

.aerien::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f21a";
}

.routier::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f21a";
}

.status_B::before {
    padding-right: 3px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f5b7";
}

button.btn-icones {
    width: 25px;
    height: 25px;
    display: inline-block;
    font-size: 1rem;
    text-align: center;
    background-color: #c0c0c0;
    border: none;
    border-radius: 3px;
    color: #FFF;
}

button.btn-icones[disabled] {
    background-color: rgb(192, 192, 192, 0.5);
}

div.icones,
button.icones,
img.icones {
    width: 25px;
    height: 25px;
    display: inline-block;
    font-size: 1rem;
    text-align: center;
    background-color: #008CBA;
}

img.icones {
    background-color: #FFF;
}

i.fa-sync-alt {
    font-size: 1.1rem;
    color: #404040;
}

.btn-icones,
.btn-icones-sm {
    width: 25px;
    height: 25px;
    display: inline-block;
    font-size: 1rem;
    text-align: center;
    background-color: green;
    border-radius: 3px;
    color: #FFF;
}

.btn-icones-vsm {
    width: 16px;
    height: 16px;
    font-size: 0.7rem;
    text-align: center;
    background-color: green;
    border-radius: 3px;
    color: #FFF;
    padding: 2px!important;
}

div[disabled],
span[disabled] {
    opacity: 0.5;
}

.btn-icones-sm {
    background-color: #c0c0c0;
    color: #FFF;
}

.selected {
    background-color: #808080;
    color: #000;
}

.selectedGreen {
    background-color: #008C6D;
    color: #FFF;
}

div.import,
div.export {}

div.import {
    /*  transform: rotate(135deg); */
}

div.export {
    /*  transform: rotate(325deg); */
}

input.inline {
    display: inline;
}

input.fixed {}

.bg-x0 {
    background-color: transparent!important;
}

.bx-x {
    border: none;
}


/* border pour div */

.br-0,
.bx-0 {
    border-right: solid white 2px;
}

.br-1,
.bx-1 {
    border-right: solid white 4px;
}

.br-2,
.bx-2 {
    border-right: solid white 6px;
}

.br-3,
.bx-3 {
    border-right: solid white 8px;
}

.br-4,
.bx-4 {
    border-right: solid white 10px;
}

.br-5,
.bx-5 {
    border-right: solid white 12px;
}

.bl-0,
.bx-0 {
    border-left: solid white 2px;
}

.bl-1,
.bx-1 {
    border-left: solid white 4px;
}

.bl-2,
.bx-2 {
    border-left: solid white 6px;
}

.bl-3,
.bx-3 {
    border-left: solid white 8px;
}

.bl-4,
.bx-4 {
    border-left: solid white 10px;
}

.bl-5,
.bx-5 {
    border-left: solid white 12px;
}

.bt-0,
.bx-0 {
    border-top: solid white 2px;
}

.bt-1,
.bx-1 {
    border-top: solid white 4px;
}

.bt-2,
.bx-2 {
    border-top: solid white 6px;
}

.bt-3,
.bx-3 {
    border-top: solid white 8px;
}

.bt-4,
.bx-4 {
    border-top: solid white 10px;
}

.bt-5,
.bx-5 {
    border-top: solid white 12px;
}

.bb-0,
.bx-0 {
    border-left: solid white 2px;
}

.bb-1,
.bx-1 {
    border-left: solid white 4px;
}

.bb-2,
.bx-2 {
    border-left: solid white 6px;
}

.bb-3,
.bx-3 {
    border-left: solid white 8px;
}

.bb-4,
.bx-4 {
    border-left: solid white 10px;
}

.bb-5,
.bx-5 {
    border-left: solid white 12px;
}

.bbcolor-grey {
    border-bottom: 1px solid #c0c0c0;
}


/**/

.factureLine {
    line-height: 1.4rem;
    font-size: 0.8rem;
    border-bottom: 1px solid #c0c0c0;
}

.factureLine i {
    line-height: 1.4rem;
}


/* style button */

a.navbar-brand img.responsive-img {
    max-height: 60px;
}

.bg_light {
    background-color: red!important;
}

#site-logo {
    background: top left no-repeat;
    background-size: auto 100%;
}

span.icon-menu {
    width: 100%;
    display: inline-block;
    color: white;
    text-align: center;
}

.nav-link {
    color: white;
    font-size: 0.9rem;
}

.current {
    color: white!important;
    font-weight: 600;
}

.btnTitle {
    background-color: #808080;
    border-radius: 5px;
    color: #FFF;
}

.btnTitle:hover {
    background-color: #404040;
    border-radius: 5px;
}

tr.table_entete {
    background-color: #404040!important;
    color: #FFF;
}

div.form-group {
    height: 0.7rem!important;
    padding: 0;
    /*  padding-bottom : 2px;*/
    /* margin : 5px; */
}

form label {
    font-size: 0.8rem;
}

form div.h5 {
    font-size: 0.9rem;
    line-height: 1.2rem;
    background: linear-gradient(180deg, #fff, #bacee3);
    padding-left: 2px;
    font-weight: bold;
}

div.form-group label {}

.form-control,
select.form-control {
    line-height: 1.40rem!important;
    height: 1.40rem!important;
    padding: 0px!important;
    font-size: 1rem;
}

textarea.notes {
    width: 100%;
    min-height: 80px;
    height: auto;
    font-size: 0.8rem;
}

.modal-title {
    text-align: left;
}

@media (min-width: 576px) {
    .modal-dialog {
        max-width: 80%;
    }
}

label.obligatoire {
    font-size: 0.8rem;
    color: #D60000;
    font-weight: bold;
}

label.obligatoire.black {
    color: #000000;
}

.obligatoire:before,
.obligatoireblack:before {
    content: '* ';
}

.ui-draggable,
.ui-droppable {
    background-position: top;
}

tr.link,
div.filter,
td.link {
    cursor: pointer;
}

body {
    font-family: Arial, Helvetica, sans-serif;
}

table {
    font-size: 1em;
}

.ui-draggable,
.ui-droppable {
    background-position: top;
}

.button {
    outline: none;
    outline-color: initial;
    outline-style: none;
    outline-width: initial;
    text-align: center;
    font-size: 11px;
    color: #45494a;
    border: 1px solid #6a8299;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    text-shadow: 1px 1px #fff;
    position: relative;
    cursor: pointer;
    background: linear-gradient(180deg, #fff, #bacee3);
}

.button.annuler {
    /*background: linear-gradient(180deg,#fff,#FF2933);  */
}

.button.valider,
.button.validervert {
    /* background: linear-gradient(180deg,#fff,#87FFA9);  */
}

li.autocomplete_list {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
    font-size: 0.8rem!important;
}

ul.pagination,
ul.pagination li {
    display: inline-block;
}

tr.liste td {
    line-height: 1rem!important;
    padding-top: 2px!important;
    padding-bottom: 2px!important;
    background-color: #c0c0c0;
    color: #202020;
}

tr.listItem td {
    font-size: 0.9rem!important;
    line-height: 1.5rem!important;
    padding-top: 2px!important;
    padding-bottom: 2px!important;
}

.point {
    font-size: 1rem;
}

span.point:hover {
    cursor: pointer;
    font-size: 0.8rem;
}

.fiche:hover {
    cursor: pointer;
}

input[type=checkbox].left {
    width: auto;
    text-align: left;
}

input[type=checkbox].right {
    width: auto;
    text-align: right;
}

input[type=checkbox].center {
    width: auto;
    text-align: center;
}

.col-centered {
    float: none;
    margin: 0 auto;
}

.col-right {
    float: right;
    margin-right: 0;
}


/* Example 2 (login form) */

.login_form {
    border-radius: 0;
    line-height: 18px;
    padding: 0;
    font-family: "Lucida Grande", Verdana, sans-serif;
}

.login_form h3 {
    margin: 0;
    padding: 10px;
    color: #fff;
    font-size: 14px;
    background: -moz-linear-gradient(top, #2e5764, #1e3d47);
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #1e3d47), color-stop(1, #2e5764));
}

.login_form.modal p {
    padding: 20px 30px;
    border-bottom: 1px solid #ddd;
    margin: 0;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eee), color-stop(1, #fff));
    overflow: hidden;
}

.login_form.modal p:last-child {
    border: none;
}

.login_form.modal p label {
    float: left;
    font-weight: bold;
    color: #333;
    font-size: 13px;
    width: 110px;
    line-height: 22px;
}

.login_form.modal p input[type="text"],
.login_form.modal p input[type="password"] {
    font: normal 12px/18px "Lucida Grande", Verdana;
    padding: 3px;
    border: 1px solid #ddd;
    width: 200px;
}

.part {
    display: none;
}

.modal p {
    margin: 1em 0;
}

.modal a.close-modal {
    border: none;
}

.jumbotron.vertical-center {
    margin-bottom: 0;
    /* Remove the default bottom margin of .jumbotron */
}

.my-auto {
    margin-top: auto;
    margin-bottom: auto;
}

.fond_page {
    /*  background-image: url(../images/fond_page.jpg);   */
    background-position: left top;
    -webkit-background-size: cover;
    /* pour anciens Chrome et Safari */
    background-size: cover;
    /* version standardisée */
}

.div_login {
    border: 1px solid #c0c0c0;
    box-shadow: 10px 10px 50px grey;
    background-color: rgba(255, 255, 255, 0.7);
    border-radius: 5px;
}

.form_tab {
    border: 1px solid #cecece;
    border-radius: 5px;
    padding: 3px;
}

li.help,
{
    padding-left: 2px;
    height: 1.8rem;
    font-size: 0.8rem;
}

.error li {
    font-size: 0.8rem;
    line-height: 1rem;
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}

.infobulle {
    position: absolute;
    background: #000;
    padding: 2px 5px;
    color: #c0c0c0;
    font-size: 0.8rem;
    border-radius: 2px;
    moz-border-radius: 2px;
    webkit-border-radius: 2px;
    text-align: center;
}

.filtre:hover {
    cursor: pointer;
}

.ui-autocomplete-row {
    padding: 0px;
    background-color: #f4f4f4;
    border-bottom: 1px solid #ccc;
}

.ui-autocomplete-row:hover {
    background-color: #ddd;
}

.ui-autocomplete-row ul {
    position: absolute;
    float: none;
    border-radius: 2px;
    background-color: #c0c0c0;
    width: 100%;
    border: 1px solid #ccc;
    float: left;
    list-style: none;
    padding: 2px 2px 0px 2px;
    margin-top: 0px;
    z-index: 10000;
}

.ui-autocomplete-row ul li:hover {
    background-color: #404040;
    color: #c0c0c0;
}

span.inputfiche:hover {
    cursor: pointer;
}

span[disabled].inputfiche:hover {
    cursor: default;
}

.pointer:hover,
.nav-link {
    color: #334E93;
    font-weight: bold;
    cursor: pointer;
}

div.message_ajax {
    position: absolute;
    top: 10px;
    float: right;
    width: 50%;
    height: 40px;
    line-height: 40px;
    padding-left: 5px;
    background-color: #B1F9B4;
    color: green;
    z-index: 1000;
    border-radius: 3px;
    display: none;
}

div.liste_titre {
    box-sizing: border-box;
    background: rgb(220, 220, 223);
    font-weight: bold;
    color: rgb(0, 0, 0);
    /* font-family: roboto,arial,tahoma,verdana,helvetica;*/
    text-align: left;
    padding: 4px;
    border-right: 10px solid #FFF;
}

.errorSaisie {
    border: 1px solid red;
    color: red;
}

.errorSaisie.focus {
    color: #000;
    background-color: rgba(255, 0, 0, 0.2);
    border: 1px solid red;
}

.errorSaisie.focus:focus {
    color: #000;
    background-color: rgba(255, 0, 0, 0.2);
    border: 1px solid red;
    font-weight: bold;
}

.errorinfo {
    font-size: 0.75rem;
    color: red;
}

.errorinfo .fort {
    font-size: 0.75rem;
    color: green;
}

.form-disabled {
    height: 1.5rem;
    /*border:1px solid red; */
    background-color: #fff!important;
    border: none;
}

.num_facture,
{
    font-size: 1rem;
    line-height: 1.2rem;
    font-weight: bold;
    color: light_grey;
}

hr {
    display: block;
    margin-top: 0.2em;
    margin-bottom: 0.2em;
    margin-left: auto;
    margin-right: auto;
    border-style: inset;
    border-width: 1px;
}

thead.DetailFactures {
    padding-top: 2px;
    font-size: 0.8rem;
    line-height: 1.5rem;
    background: rgb(220, 220, 223);
}

tbody.DetailFactures tr td {
    font-size: 0.8rem;
    line-height: 1rem;
}

button.changeAJX {
    border: 1px solid #c0c0c0;
    font-size: 0.5rem;
    line-height: 0.8rem;
    border-radius: 3px;
    color: #000;
}

div.msg_ajax {
    width: 60%;
    height: 40px;
    line-height: 40px;
    float: right;
    position: absolute;
    top: 30px;
    right: 30px;
    z-index: 1000;
    border-radius: 5px;
}

i.V,
i.P {
    display: none;
}

.liste_titre {
    text-align: center;
}

th.date,
td.date,
th.money,
td.money,
th.code,
td.code,
th.tiers,
td.tiers {
    width: 125px;
}

th.tiers,
td.tiers {
    min-width: 250px;
}

span.link {
    font-size: 0.8em;
    line-height: 0.8rem;
}

span.link:hover {
    text-decoration: none;
    cursor: pointer;
    color: #7B7DDD;
}

ul.pagination,
ul.row_pagination li {
    list-style-type: none;
    display: inline-block;
    margin: 0!important;
    padding: 0!important;
}

span.page-link:hover,
.linkfiche:hover {
    cursor: pointer;
}

.txtedit {
    display: none;
    width: 99%;
    height: 1.4rem;
}

.retour {
    padding: 4px;
    font-size: 0.86rem;
    color: rgb(10, 10, 100);
    font-weight: bolder;
}

.box {
    padding: 0px;
    overflow: hidden;
}

.stat_text {
    font-size: 0.7rem;
}

.canvasjs-chart-credit {
    display: none;
}

div.form-row {
    padding-top: 3px;
    padding-bottom: 3px;
}

div.cadre {
    border: 1px solid #c0c0c0;
    border-radius: 5px;
}

div.titlefield {
    padding: 5px 0px 5px 0px!important;
}

input:disabled.disablednull,
select:disabled.disablednull,
select:disabled,
select.null,
input.null {
    background: none;
    border: none;
}

input:focus.null {
    background-color: #FFF;
    font-weight: bold;
    border-bottom: 1px solid #c0c0c0;
}

select:disabled,
select.null {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.listetotal {
    background-color: #808080;
    color: #FFF;
}

.copyright,
.x-small {
    font-size: 0.6rem;
}

.small {
    font-size: 0.75rem;
}

.page-link,
a.page-link {
    font-size: 0.7rem;
    padding-top: 0.2rem;
    padding-right: 0.5rem;
    padding-bottom: 0.2rem;
    padding-left: 0.5rem;
}

div.cadre {
    border: 1px solid #c0c0c0;
}

thead.thFixed {
    border-width: 1px;
    border-style: solid;
    border-color: red;
}

div.divLine {
    padding-bottom: 6px;
    padding-top: 6px;
    border-bottom: 1px solid #c0c0c0;
}

input.inputdetail {
    padding: 0px;
    border: none;
    background: none;
}

input.inputdetail:focus {
    border-bottom: 1px solid #cecece;
    background: none;
    font-weight: bold;
}

.container-fluid {
    /*padding : 0!important;*/
}

div.entete_table_fixe {
    width: 100%;
    overflow: none;
}

div.data_table_overflow {
    max-height: 700px;
    width: 100%;
    overflow: auto;
}

span.icon-menu {
    display: none;
}

a.nav-link {
    font-size: 0.9rem;
}

a.nav-link.current {
    color: #404040!important;
    font-weight: bold;
}

nav.navbar {
    background-color: #FFF!important;
}


/* v2 */

.border-top-1.grey {
    border-top: 2px solid grey;
}

.linkV2:hover,
.detail:hover {
    cursor: pointer;
}

.menu_titre,
.menu_contenu {
    font-size: 0.72vw;
}

.menu_contenu {
    font-size: 0.68vw;
}

.menu_titre a i {
    padding-left: 2px;
    padding-right: 2px;
}

i.addFile {
    /*background-color: red;*/
}


/* // v2 */

.display-small {
    font-size: 0.75rem;
}

.display-xsmall {
    font-size: 0.5rem;
}

.font-size-1 {
    font-size: 1rem;
}

.font-size-2 {
    font-size: 1.2rem;
}

.font-size-3 {
    font-size: 1.4rem;
}

.font-size-4 {
    font-size: 1.6rem;
}

input[type="text"].visible:disabled {
    background-color: white;
    border: none;
}

label.error {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 2px;
    background-color: rgba(255, 0, 0, 0.2);
    border-left: 2px solid #FFF;
}

.error,
input.error {
    color: #000;
    background-color: rgba(255, 0, 0, 0.2)!important;
}

.errorok {
    color: #000;
    background-color: rgba(0, 255, 0, 0.2)!important;
    font-weight: bold;
}

#mailformdivmessage {
    color: #000;
    position: relative;
    margin: 0px;
    top: 10px;
    left: 0px;
    z-index: 1000;
    /*  opacity:0.75;
filter:alpha(opacity=50); */
    padding-top: 5px;
    padding-bottom: 5px;
}

#tooltip {
    position: absolute;
    z-index: 9999;
    color: #fff;
    font-size: 10px;
    width: 180px;
}

#tooltip .tipHeader {
    height: 8px;
    /*   background:url(images/tipHeader.gif) no-repeat; */
}


/* hack IE */

*html #tooltip .tipHeader {
    margin-bottom: -6px;
}

#tooltip .tipBody {
    background-color: #000;
    padding: 5px;
}

#tooltip .tipFooter {
    height: 8px;
    /*  background:url(images/tipFooter.gif) no-repeat;*/
}

td.minline {
    font-size: 0.75rem;
    padding: 0px;
    line-height: 8px!important;
}

.bordernone {
    border: none;
}

.textedit.online {
    border: none;
    width: 99%;
    height: 1.4rem;
    background-color: transparent;
}

.total_section {
    background-color: #404040;
    color: #FFFFFF;
}

.titre_section,
.total_section {
    line-height: 25px;
    font-weight: bold;
}

input.tdedit {
    border: none;
    background-color: transparent;
    text-align: center;
}

input.tdedit:focus {
    border-bottom: 1px solid #c0c0c0;
    background-color: white;
}

input.tdedit.left {
    text-align: left;
}

div.table-responsive.reload {
    width: 100%;
    height: 40px;
    line-height: 40px;
    padding-left: 5px;
    background-color: #B1F9B4;
    color: green;
    z-index: 1000;
    border-radius: 3px;
    font-weight: bold;
    font-size: 14px;
    text-align: center;
}

.flex-row {
    display: flex;
    flex-wrap: wrap;
}

.flex-row>[class*='col-'] {
    display: flex;
    flex-direction: column;
}

.flex-row.row:after,
.flex-row.row:before {
    display: flex;
}


/*
 Gestion de profil
 */

*:disabled {
    color: #000!important;
    background-color: transparent!important;
    border: none;
}

.lignepaire {
    background-color: #F8F8F8!important;
}

.ligneimpaire {
    background-color: #E9E7E7!important;
}

tr.lignepaire:hover td,
tr.ligneimpaire:hover td {
    background-color: #D0D0D0!important;
}

.lignepaire input:hover,
.ligneimpaire input:hover {}

.pointer:hover {
    cursor: pointer;
}

.table td,
.table th {
    padding: 0.1rem !important;
}

.button {
    background: rgb(225, 231, 225);
    /* background: rgb(230, 232, 239);; */
    ;
    border-radius: 0px!important;
    border: none;
    padding-top: 8px;
    padding-bottom: 8px;
}

.button.annuler {
    background: rgb(230, 232, 239);
}

button.butAction.typeuser {
    /*border-radius: 10px!important;*/
    width: 120px;
}

button.butAction.typeuser.actif {
    background-color: green;
    color: white;
    border: none!important;
}

button.butAction.customer::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f007"!important;
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
    */
}

button.butAction.agent::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f2c1";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

.firstletter span::first-letter {
    text-transform: capitalize;
}

.butAction.reposition {
    border: none!important;
    outline: none;
}

.button.validerPRO::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f138";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

.button.annuler::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f00d";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

.button.valider::before,
.butAction.btnvalider::before,
.button.validerNo::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f00c";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

a.butAction.invoice::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f570";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

a.butAction.sendmail::before,
input.sendmail::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0e0";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

.button.validervert::before,
.button.envoi::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f00c";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

.butAction.ajouter::before,
input.btnajouter::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f067";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

.btnajouter::after {
    /*   content: '15' !important;
    z-index: 1;
    border : 1px solid red;
    */
}

input.btnajouter::before {
    content: "12";
}

span.annuler::before,
.butAction.btnannuler::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f00d";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

.modifier::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f044";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

.terminer::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f00c";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

.button.validervert {
    outline: none;
    outline-color: initial;
    outline-style: none;
    outline-width: initial;
    text-align: center;
    color: #45494a;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    text-shadow: 1px 1px #fff;
    cursor: pointer;
    background: rgb(230, 232, 239);
    border-radius: 0px!important;
    border: none;
    padding-top: 8px;
    padding-bottom: 8px;
    font-weight: bold;
}

input.enabled {
    border: 1px solid #c0c0c0;
}

input:disabled {
    background: none;
    border: 1px solid #FFF;
}

.modifier::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f044";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

.terminer::before,
.status_T::before,
.status_V::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f00c";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
    /* checker*/
}

input>#sendmail::before {
    border: 1px solid red!important;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0e0"!important;
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

a.tabs.general::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f07c";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

a.tabs.adresse::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f015";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 1rem!important;
}

.status_N::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0a3";
    padding-left: 0px;
    padding-right: 5px;
    font-size: 0.90rem!important;
    color: green!important;
    /* certificate */
}

a.status_R::after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f3d1";
    padding-left: 5px;
    padding-right: 0px;
    font-size: 0.90rem!important;
    color: #fff!important;
    /* */
}

tr.status_R td,
tr.status_R a,
select.status_R {
    background-color: green!important;
    color: #FFF!important;
}

select.status_R {
    border: none;
}

#showimg:hover {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    transition: 1s;
}

#showimg {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    transition: 1s;
}

tr.toto td {
    line-height: 12px!important;
    height: 10px!important;
    padding: 0.1rem!important;
}

body.modal-open {
    top: 50%;
    position: relative;
}

.groupage_liste {
    /* font-size : 1vw!important; */
}


/* Icones sens tri */

A.tri::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0dc";
    padding-left: 2px;
}

A.ASC::after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f884";
    padding-left: 2px;
}

A.DESC::after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f160";
    padding-left: 2px;
}

A.ASC,
A.DESC {
    font-weight: bold!important;
}


/* Fin Icones sens tri */


/* flag */

.f16 .flag {
    display: inline-block;
    height: 16px;
    width: 16px;
    vertical-align: text-top;
    line-height: 16px;
    background: url(images/flags16.png) no-repeat
}

.f16 ._African_Union {
    background-position: 0 -16px
}

.f16 ._Arab_League {
    background-position: 0 -32px
}

.f16 ._ASEAN {
    background-position: 0 -48px
}

.f16 ._CARICOM {
    background-position: 0 -64px
}

.f16 ._CIS {
    background-position: 0 -80px
}

.f16 ._Commonwealth {
    background-position: 0 -96px
}

.f16 ._England {
    background-position: 0 -112px
}

.f16 ._European_Union,
.f16 .eu {
    background-position: 0 -128px
}

.f16 ._Islamic_Conference {
    background-position: 0 -144px
}

.f16 ._Kosovo {
    background-position: 0 -160px
}

.f16 ._NATO {
    background-position: 0 -176px
}

.f16 ._Northern_Cyprus {
    background-position: 0 -192px
}

.f16 ._Northern_Ireland {
    background-position: 0 -208px
}

.f16 ._Olimpic_Movement {
    background-position: 0 -224px
}

.f16 ._OPEC {
    background-position: 0 -240px
}

.f16 ._Red_Cross {
    background-position: 0 -256px
}

.f16 ._Scotland {
    background-position: 0 -272px
}

.f16 ._Somaliland {
    background-position: 0 -288px
}

.f16 ._Tibet {
    background-position: 0 -304px
}

.f16 ._United_Nations {
    background-position: 0 -320px
}

.f16 ._Wales {
    background-position: 0 -336px
}

.f16 .ad {
    background-position: 0 -352px
}

.f16 .ae {
    background-position: 0 -368px
}

.f16 .af {
    background-position: 0 -384px
}

.f16 .ag {
    background-position: 0 -400px
}

.f16 .ai {
    background-position: 0 -416px
}

.f16 .al {
    background-position: 0 -432px
}

.f16 .am {
    background-position: 0 -448px
}

.f16 .ao {
    background-position: 0 -464px
}

.f16 .aq {
    background-position: 0 -480px
}

.f16 .ar {
    background-position: 0 -496px
}

.f16 .as {
    background-position: 0 -512px
}

.f16 .at {
    background-position: 0 -528px
}

.f16 .au {
    background-position: 0 -544px
}

.f16 .aw {
    background-position: 0 -560px
}

.f16 .ax {
    background-position: 0 -576px
}

.f16 .az {
    background-position: 0 -592px
}

.f16 .ba {
    background-position: 0 -608px
}

.f16 .bb {
    background-position: 0 -624px
}

.f16 .bd {
    background-position: 0 -640px
}

.f16 .be {
    background-position: 0 -656px
}

.f16 .bf {
    background-position: 0 -672px
}

.f16 .bg {
    background-position: 0 -688px
}

.f16 .bh {
    background-position: 0 -704px
}

.f16 .bi {
    background-position: 0 -720px
}

.f16 .bj {
    background-position: 0 -736px
}

.f16 .bm {
    background-position: 0 -752px
}

.f16 .bn {
    background-position: 0 -768px
}

.f16 .bo {
    background-position: 0 -784px
}

.f16 .br {
    background-position: 0 -800px
}

.f16 .bs {
    background-position: 0 -816px
}

.f16 .bt {
    background-position: 0 -832px
}

.f16 .bw {
    background-position: 0 -848px
}

.f16 .by {
    background-position: 0 -864px
}

.f16 .bz {
    background-position: 0 -880px
}

.f16 .ca {
    background-position: 0 -896px
}

.f16 .cg {
    background-position: 0 -912px
}

.f16 .cf {
    background-position: 0 -928px
}

.f16 .cd {
    background-position: 0 -944px
}

.f16 .ch {
    background-position: 0 -960px
}

.f16 .ci {
    background-position: 0 -976px
}

.f16 .ck {
    background-position: 0 -992px
}

.f16 .cl {
    background-position: 0 -1008px
}

.f16 .cm {
    background-position: 0 -1024px
}

.f16 .cn {
    background-position: 0 -1040px
}

.f16 .co {
    background-position: 0 -1056px
}

.f16 .cr {
    background-position: 0 -1072px
}

.f16 .cu {
    background-position: 0 -1088px
}

.f16 .cv {
    background-position: 0 -1104px
}

.f16 .cy {
    background-position: 0 -1120px
}

.f16 .cz {
    background-position: 0 -1136px
}

.f16 .de {
    background-position: 0 -1152px
}

.f16 .dj {
    background-position: 0 -1168px
}

.f16 .dk {
    background-position: 0 -1184px
}

.f16 .dm {
    background-position: 0 -1200px
}

.f16 .do {
    background-position: 0 -1216px
}

.f16 .dz {
    background-position: 0 -1232px
}

.f16 .ec {
    background-position: 0 -1248px
}

.f16 .ee {
    background-position: 0 -1264px
}

.f16 .eg {
    background-position: 0 -1280px
}

.f16 .eh {
    background-position: 0 -1296px
}

.f16 .er {
    background-position: 0 -1312px
}

.f16 .es {
    background-position: 0 -1328px
}

.f16 .et {
    background-position: 0 -1344px
}

.f16 .fi {
    background-position: 0 -1360px
}

.f16 .fj {
    background-position: 0 -1376px
}

.f16 .fm {
    background-position: 0 -1392px
}

.f16 .fo {
    background-position: 0 -1408px
}

.f16 .fr {
    background-position: 0 -1424px
}

.f16 .bl,
.f16 .cp,
.f16 .mf,
.f16 .yt {
    background-position: 0 -1424px
}

.f16 .ga {
    background-position: 0 -1440px
}

.f16 .gb {
    background-position: 0 -1456px
}

.f16 .sh {
    background-position: 0 -1456px
}

.f16 .gd {
    background-position: 0 -1472px
}

.f16 .ge {
    background-position: 0 -1488px
}

.f16 .gg {
    background-position: 0 -1504px
}

.f16 .gh {
    background-position: 0 -1520px
}

.f16 .gi {
    background-position: 0 -1536px
}

.f16 .gl {
    background-position: 0 -1552px
}

.f16 .gm {
    background-position: 0 -1568px
}

.f16 .gn {
    background-position: 0 -1584px
}

.f16 .gp {
    background-position: 0 -1600px
}

.f16 .gq {
    background-position: 0 -1616px
}

.f16 .gr {
    background-position: 0 -1632px
}

.f16 .gt {
    background-position: 0 -1648px
}

.f16 .gu {
    background-position: 0 -1664px
}

.f16 .gw {
    background-position: 0 -1680px
}

.f16 .gy {
    background-position: 0 -1696px
}

.f16 .hk {
    background-position: 0 -1712px
}

.f16 .hn {
    background-position: 0 -1728px
}

.f16 .hr {
    background-position: 0 -1744px
}

.f16 .ht {
    background-position: 0 -1760px
}

.f16 .hu {
    background-position: 0 -1776px
}

.f16 .id {
    background-position: 0 -1792px
}

.f16 .mc {
    background-position: 0 -1792px
}

.f16 .ie {
    background-position: 0 -1808px
}

.f16 .il {
    background-position: 0 -1824px
}

.f16 .im {
    background-position: 0 -1840px
}

.f16 .in {
    background-position: 0 -1856px
}

.f16 .iq {
    background-position: 0 -1872px
}

.f16 .ir {
    background-position: 0 -1888px
}

.f16 .is {
    background-position: 0 -1904px
}

.f16 .it {
    background-position: 0 -1920px
}

.f16 .je {
    background-position: 0 -1936px
}

.f16 .jm {
    background-position: 0 -1952px
}

.f16 .jo {
    background-position: 0 -1968px
}

.f16 .jp {
    background-position: 0 -1984px
}

.f16 .ke {
    background-position: 0 -2000px
}

.f16 .kg {
    background-position: 0 -2016px
}

.f16 .kh {
    background-position: 0 -2032px
}

.f16 .ki {
    background-position: 0 -2048px
}

.f16 .km {
    background-position: 0 -2064px
}

.f16 .kn {
    background-position: 0 -2080px
}

.f16 .kp {
    background-position: 0 -2096px
}

.f16 .kr {
    background-position: 0 -2112px
}

.f16 .kw {
    background-position: 0 -2128px
}

.f16 .ky {
    background-position: 0 -2144px
}

.f16 .kz {
    background-position: 0 -2160px
}

.f16 .la {
    background-position: 0 -2176px
}

.f16 .lb {
    background-position: 0 -2192px
}

.f16 .lc {
    background-position: 0 -2208px
}

.f16 .li {
    background-position: 0 -2224px
}

.f16 .lk {
    background-position: 0 -2240px
}

.f16 .lr {
    background-position: 0 -2256px
}

.f16 .ls {
    background-position: 0 -2272px
}

.f16 .lt {
    background-position: 0 -2288px
}

.f16 .lu {
    background-position: 0 -2304px
}

.f16 .lv {
    background-position: 0 -2320px
}

.f16 .ly {
    background-position: 0 -2336px
}

.f16 .ma {
    background-position: 0 -2352px
}

.f16 .md {
    background-position: 0 -2368px
}

.f16 .me {
    background-position: 0 -2384px
}

.f16 .mg {
    background-position: 0 -2400px
}

.f16 .mh {
    background-position: 0 -2416px
}

.f16 .mk {
    background-position: 0 -2432px
}

.f16 .ml {
    background-position: 0 -2448px
}

.f16 .mm {
    background-position: 0 -2464px
}

.f16 .mn {
    background-position: 0 -2480px
}

.f16 .mo {
    background-position: 0 -2496px
}

.f16 .mq {
    background-position: 0 -2512px
}

.f16 .mr {
    background-position: 0 -2528px
}

.f16 .ms {
    background-position: 0 -2544px
}

.f16 .mt {
    background-position: 0 -2560px
}

.f16 .mu {
    background-position: 0 -2576px
}

.f16 .mv {
    background-position: 0 -2592px
}

.f16 .mw {
    background-position: 0 -2608px
}

.f16 .mx {
    background-position: 0 -2624px
}

.f16 .my {
    background-position: 0 -2640px
}

.f16 .mz {
    background-position: 0 -2656px
}

.f16 .na {
    background-position: 0 -2672px
}

.f16 .nc {
    background-position: 0 -2688px
}

.f16 .ne {
    background-position: 0 -2704px
}

.f16 .ng {
    background-position: 0 -2720px
}

.f16 .ni {
    background-position: 0 -2736px
}

.f16 .nl {
    background-position: 0 -2752px
}

.f16 .bq {
    background-position: 0 -2752px
}

.f16 .no {
    background-position: 0 -2768px
}

.f16 .bv,
.f16 .nq,
.f16 .sj {
    background-position: 0 -2768px
}

.f16 .np {
    background-position: 0 -2784px
}

.f16 .nr {
    background-position: 0 -2800px
}

.f16 .nz {
    background-position: 0 -2816px
}

.f16 .om {
    background-position: 0 -2832px
}

.f16 .pa {
    background-position: 0 -2848px
}

.f16 .pe {
    background-position: 0 -2864px
}

.f16 .pf {
    background-position: 0 -2880px
}

.f16 .pg {
    background-position: 0 -2896px
}

.f16 .ph {
    background-position: 0 -2912px
}

.f16 .pk {
    background-position: 0 -2928px
}

.f16 .pl {
    background-position: 0 -2944px
}

.f16 .pr {
    background-position: 0 -2960px
}

.f16 .ps {
    background-position: 0 -2976px
}

.f16 .pt {
    background-position: 0 -2992px
}

.f16 .pw {
    background-position: 0 -3008px
}

.f16 .py {
    background-position: 0 -3024px
}

.f16 .qa {
    background-position: 0 -3040px
}

.f16 .re {
    background-position: 0 -3056px
}

.f16 .ro {
    background-position: 0 -3072px
}

.f16 .rs {
    background-position: 0 -3088px
}

.f16 .ru {
    background-position: 0 -3104px
}

.f16 .rw {
    background-position: 0 -3120px
}

.f16 .sa {
    background-position: 0 -3136px
}

.f16 .sb {
    background-position: 0 -3152px
}

.f16 .sc {
    background-position: 0 -3168px
}

.f16 .sd {
    background-position: 0 -3184px
}

.f16 .se {
    background-position: 0 -3200px
}

.f16 .sg {
    background-position: 0 -3216px
}

.f16 .si {
    background-position: 0 -3232px
}

.f16 .sk {
    background-position: 0 -3248px
}

.f16 .sl {
    background-position: 0 -3264px
}

.f16 .sm {
    background-position: 0 -3280px
}

.f16 .sn {
    background-position: 0 -3296px
}

.f16 .so {
    background-position: 0 -3312px
}

.f16 .sr {
    background-position: 0 -3328px
}

.f16 .st {
    background-position: 0 -3344px
}

.f16 .sv {
    background-position: 0 -3360px
}

.f16 .sy {
    background-position: 0 -3376px
}

.f16 .sz {
    background-position: 0 -3392px
}

.f16 .tc {
    background-position: 0 -3408px
}

.f16 .td {
    background-position: 0 -3424px
}

.f16 .tg {
    background-position: 0 -3440px
}

.f16 .th {
    background-position: 0 -3456px
}

.f16 .tj {
    background-position: 0 -3472px
}

.f16 .tl {
    background-position: 0 -3488px
}

.f16 .tm {
    background-position: 0 -3504px
}

.f16 .tn {
    background-position: 0 -3520px
}

.f16 .to {
    background-position: 0 -3536px
}

.f16 .tr {
    background-position: 0 -3552px
}

.f16 .tt {
    background-position: 0 -3568px
}

.f16 .tv {
    background-position: 0 -3584px
}

.f16 .tw {
    background-position: 0 -3600px
}

.f16 .tz {
    background-position: 0 -3616px
}

.f16 .ua {
    background-position: 0 -3632px
}

.f16 .ug {
    background-position: 0 -3648px
}

.f16 .us {
    background-position: 0 -3664px
}

.f16 .uy {
    background-position: 0 -3680px
}

.f16 .uz {
    background-position: 0 -3696px
}

.f16 .va {
    background-position: 0 -3712px
}

.f16 .vc {
    background-position: 0 -3728px
}

.f16 .ve {
    background-position: 0 -3744px
}

.f16 .vg {
    background-position: 0 -3760px
}

.f16 .vi {
    background-position: 0 -3776px
}

.f16 .vn {
    background-position: 0 -3792px
}

.f16 .vu {
    background-position: 0 -3808px
}

.f16 .ws {
    background-position: 0 -3824px
}

.f16 .ye {
    background-position: 0 -3840px
}

.f16 .za {
    background-position: 0 -3856px
}

.f16 .zm {
    background-position: 0 -3872px
}

.f16 .zw {
    background-position: 0 -3888px
}

.f16 .sx {
    background-position: 0 -3904px
}

.f16 .cw {
    background-position: 0 -3920px
}

.f16 .ss {
    background-position: 0 -3936px
}

.f16 .nu {
    background-position: 0 -3952px
}

.countrypicker .inline-flag {
    margin-right: 5px
}

.countrypicker .filter-option.flag {
    padding-left: 20px;
    margin-top: 3px
}

.countrypicker .dropdown-menu.open {
    padding: 0
}

i.statutA::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f187";
    padding: 10px;
    font-style: normal!important;
    color: red;
}

i.statutO::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f49e";
    padding: 10px;
    font-style: normal!important;
    color: green;
}

li.autocomplete_list:hover {
    cursor: pointer;
    background-color: #c0c0c0!important;
}

li.lignepaire {
    background-color: #d0d0d0!important;
}

li.lignepaire {
    background-color: #d0d0d0!important;
}

.notifier {
    position: absolute !important;
    text-align: left;
    min-width: 500px;
    width: auto;
    max-width: 1024px;
    padding-left: 10px !important;
    padding-right: 10px !important;
    padding-top: 3px !important;
    padding-bottom: 3px !important;
    top: 20px;
    right: 10px;
    font-weight: bold;
    word-wrap: break-word;
    z-index: 10000;
    border: 1px solid #FFF;
    border-radius: 5px;
    background-color: #FFFFFF;
    display: none;
    ;
}

.notifier.success {
    border: 1px solid rgb(207, 251, 207);
    background-color: rgb(207, 251, 207);
}

.notifier.error {
    border: 1px solid rgb(255, 128, 128);
    background-color: rgb(255, 128, 128);
}