@font-face {
    font-family: 'icomoon';
    src: url('squirrel/icomoon.eot?i508sk');
    src: url('squirrel/icomoon.eot?#iefixi508sk') format('embedded-opentype'), url('squirrel/icomoon.woff?i508sk') format('woff'), url('squirrel/icomoon.ttf?i508sk') format('truetype'), url('squirrel/icomoon.svg?i508sk#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="icosq-"],
[class*=" icosq-"] {
    font-family: 'icomoon';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icosq-uniE603:before {
    content: "\e603";
}

@font-face {
    font-family: 'geosanslightregular';
    src: url('squirrel/geosanslightwebfont.eot');
    src: url('squirrel/geosanslightwebfont.eot?#iefix') format('embedded-opentype'), url('squirrel/geosanslightwebfont.woff2') format('woff2'), url('squirrel/geosanslightwebfont.woff') format('woff'), url('squirrel/geosanslightwebfont.ttf') format('truetype'), url('squirrel/geosanslightwebfont.svg#geosanslightregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'avenirbook';
    src: url('squirrel/avenir-b-webfont.eot');
    src: url('squirrel/avenir-b-webfon t.eot?#iefix') format('embedded-opentype'), url('squirrel/avenir-b-webfont.woff2') format('woff2'), url('squirrel/avenir-b-webfont.woff') format('woff'), url('squirrel/avenir-b-webfont.ttf') format('truetype'), url('squirrel/avenir-b-webfont.svg#avenirbook') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'avenirmedium';
    src: url('squirrel/avenir-m-webfont.eot');
    src: url('squirrel/avenir-m-webfont.eot?#iefix') format('embedded-opentype'), url('squirrel/avenir-m-webfont.woff2') format('woff2'), url('squirrel/avenir-m-webfont.woff') format('woff'), url('squirrel/avenir-m-webfont.ttf') format('truetype'), url('squirrel/avenir-m-webfont.svg#avenirmedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'avenirblack';
    src: url('squirrel/avenir01-webfont.eot');
    src: url('squirrel/avenir01-webfont.eot?#iefix') format('embedded-opentype'), url('squirrel/avenir01-webfont.woff2') format('woff2'), url('squirrel/avenir01-webfont.woff') format('woff'), url('squirrel/avenir01-webfont.ttf') format('truetype'), url('squirrel/avenir01-webfont.svg#avenirblack') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Conv_DINPro-Medium_13936';
    src: url('squirrel/DINPro-Medium_13936.eot');
    src: local('☺'), url('squirrel/DINPro-Medium_13936.woff') format('woff'), url('squirrel/DINPro-Medium_13936.ttf') format('truetype'), url('squirrel/DINPro-Medium_13936.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Conv_DINPro-Regular_13937';
    src: url('squirrel/DINPro-Regular_13937.eot');
    src: local('☺'), url('squirrel/DINPro-Regular_13937.woff') format('woff'), url('squirrel/DINPro-Regular_13937.ttf') format('truetype'), url('squirrel/DINPro-Regular_13937.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

html body {
    margin: 0;
    padding: 0;
    font-weight: normal;
    font-style: normal;
    height: 100%;
    font-family: 'Conv_DINPro-Regular_13937', 'geosanslightregular';
}

html,
body {
    height: 100%;
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

.clearfix {
    display: inline-block;
}


/* start commented backslash hack \*/

* html .clearfix {
    height: 1%;
}

.clearfix {
    display: block;
}

hr {
    border: solid 1px #636362;
}

a {
    text-decoration: none;
    color: white;
}

a:hover {
    text-decoration: none;
}


/* Contenu du Menu à Gauche */


/*Liste des Clients*/

.list {
    float: left;
    height: 40px;
    background-color: #909090;
    font-size: 1.3em;
    color: white;
    padding-left: 10px;
    padding-right: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.list.active {
    background-color: #636362;
}

.list a {
    color: white;
}

.trianglee {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 16px 40px 0px;
    border-color: transparent transparent #909090 transparent;
    float: left;
    padding: 0;
}

.trianglee.active {
    border-color: transparent transparent #636362 transparent;
}

.content {
    float: left;
    margin-top: 10px;
}

#contentfourni {
    margin-top: 10px;
    float: left;
}

#contentvalid {
    margin-top: 10px;
    width: 850px;
    float: left;
}

#content-fourvalid {
    width: 30%;
    float: left;
    border-bottom: solid 4px #636362;
    padding-bottom: 25px;
    margin-top: 59px;
    background: #F6F6F6;
}

#content-fourvalid1 {
    margin-top: 3%;
    width: 28%;
    float: left;
    margin-left: 0;
    border-bottom: solid 14px #636362;
    padding-bottom: 25px;
}

#content-fourvalid1 .title1validefourni {
    margin-right: 40px;
}

#content-fourvalid1 table {
    /*font-family: 'helvetica';
*/
}

#data {
    height: 550px;
    overflow-y: scroll;
    width: 890px;
}

#data-alerte {
    height: 550px;
    overflow-y: scroll;
    width: 890px;
}

#datavalid {
    height: 550px;
    overflow-y: scroll;
    width: 1337px;
}

#data1 {
    height: 550px;
    overflow-y: scroll;
    /*width: 845px;*/
}

#data2 {
    height: 550px;
    overflow-y: scroll;
    width: 1292px;
}

.content table,
#contentfourni table {
    border-collapse: collapse;
    background-color: #BEBEBE;
    color: white;
    font-weight: normal;
    font-style: normal;
    font-size: 14pt;
    z-index: 850;
    width: 828px;
}

#contentfourni table {
    border-collapse: collapse;
    background-color: #BEBEBE;
    color: white;
    font-weight: normal;
    font-style: normal;
    font-size: 14pt;
    z-index: 850;
    width: 1275px;
}

#contentvalid table {
    border-collapse: collapse;
    background-color: #BEBEBE;
    color: white;
    font-weight: normal;
    font-style: normal;
    font-size: 14pt;
    z-index: 850;
    width: 874px;
}

#content-compta table {
    border-collapse: collapse;
    background-color: #BEBEBE;
    color: white;
    font-weight: normal;
    font-style: normal;
    font-size: 14pt;
    z-index: 850;
    width: 874px;
}

th {
    font-size: 1.1em;
    font-weight: normal;
    background: #BEBEBE;
    color: white;
    text-align: left;
    line-height: 10px;
}

.col1 {
    max-width: 165px;
    min-width: 165px;
    height: 45px;
    padding-left: 10px;
}

.col-alerte {
    max-width: 138px;
    min-width: 138px;
    height: 45px;
    padding-left: 10px;
}

.col2 {
    max-width: 196.5px;
    min-width: 196.5px;
    height: 45px;
    padding-left: 10px;
}

.col1Ref {
    padding-left: 10px;
    max-width: 165px;
    min-width: 165px;
    height: 45px;
    word-wrap: break-word;
}

.content th.col1:nth-child(4),
#contentfourni th.col1:nth-child(4),
#contentvalid th.col1:nth-child(4),
,
#content-compta th.col1:nth-child(4) {}

.content tr,
#contentfourni tr,
#contentvalid tr {
    border-bottom: 1px solid white;
    cursor: pointer;
}

.content tr:nth-child(odd),
#contentfourni tr:nth-child(odd),
#contentvalid tr:nth-child(odd),
#content-compta tr:nth-child(odd),
#contentvalid tr:nth-child(odd) {
    background: #D6D6D4;
    color: #4A4949;
    font-size: 0.9em;
    padding-right: 25px;
}

.content tr:nth-child(even),
#contentfourni tr:nth-child(even)#contentfourni tr:nth-child(even),
#contentfourni tr:nth-child(even),
#content-compta tr:nth-child(even),
#contentvalid tr:nth-child(even) {
    background: white;
    color: grey;
    font-size: 0.9em;
}

.content tr:nth-child(odd):hover,
#contentfourni tr:nth-child(odd):hover,
#contentvalid tr:nth-child(odd):hover,
#content-compta tr:nth-child(odd):hover {
    background: #636362;
    color: white;
    font-size: 0.9em;
}

.content tr:nth-child(even):hover,
#contentfourni tr:nth-child(even):hover,
#contentvalid tr:nth-child(even):hover,
#content-compa tr:nth-child(even):hover {
    background: #636362;
    color: white;
    font-size: 0.9em;
}

#test {
    color: #636362;
}

.popover {
    left: 232px;
    top: 14.5px;
}

.sortTable {
    width: 20px;
    font-size: 20px;
    color: white;
}

.text-sortTable {
    width: 87%;
    line-height: 14px;
    float: right;
    padding-top: 3%;
}

body {
    float: left;
    width: 100%;
    padding-left: 120px;
    padding-right: 120px;
}


/*Detail Box*/

#CloseDetailOrder {
    font-size: 1.4rem;
    float: right;
    margin-right: 4%;
    color: #636362;
    cursor: pointer;
}

#detailbox {
    width: 450px;
    float: left;
    margin-left: 30px;
    padding-left: 15px;
    padding-top: 30px;
    transition: All 0.3s ease;
    -webkit-transition: All 0.3s ease;
    -moz-transition: All 0.3s ease;
    -o-transition: All 0.3s ease;
}

#detailbox.ng-hide {
    transition: All 0s ease;
    -webkit-transition: All 0s ease;
    -moz-transition: All 0s ease;
    -o-transition: All 0s ease;
    display: none;
    transform: scale(0.226);
    -webkit-transform: scale(0.226);
    -moz-transform: scale(0.226);
    -o-transform: scale(0.226);
    -ms-transform: scale(0.226);
}

#detailbox .detailbox-error {
    width: 95%;
    margin-left: 5%;
    clear: left;
}

#detailboxwf {
    width: 450px;
    float: left;
    margin-left: 30px;
    padding-left: 15px;
    padding-top: 30px;
    height: 550px;
}

h1.title-detail {
    /*font-size: 2.5em;
    margin-top: 15px;
    padding-left: 25px;
    padding-right: 25px;
    padding-bottom: 10px;;*/
    color: #7B7B7A;
    border-bottom: 2px solid grey
}

#detailbox hr {
    width: 100%;
    margin: 0;
    color: #7B7B7A;
    border: solid 1px grey;
}

#location {
    min-height: 35px;
    padding-top: 14px;
}

#location .marker {
    color: #7B7B7A;
    margin-left: 30px;
    float: left;
    width: 30px;
}

#location .adress {
    font-size: 1.6em;
    color: #7B7B7A;
    padding-left: 15px;
    width: 395px;
    margin-left: 50px;
    line-height: 25px;
}

#prices {
    width: 73%;
    float: left;
    margin: 0;
    padding: 0;
    margin-right: 2%;
}

.prix {
    color: white;
    width: 100%;
    line-height: 20px;
}

#totalprix {
    clear: left;
    margin-top: 15px;
}

.price-label {
    font-size: 1.1em;
    padding: 2px;
    padding-left: 8px;
    padding-right: 8px;
    color: white;
    width: 55%;
    float: left;
    margin-bottom: 2.5px;
}

.price-value {
    padding: 2px 10px 2px 2px;
    color: #FFF;
    width: 40%;
    float: left;
    text-align: right;
    margin-bottom: 2.5px;
    font-size: 1.1em;
}

.green {
    background-color: #A9C756;
}

.grey {
    background-color: #D4D4D3;
}

#marge {
    width: 25%;
    height: 107px;
    color: white;
    font-size: 1.9em;
    text-align: center;
    line-height: 50px;
    /*---*/
    margin-left: 75%;
}

#textmarge {
    height: 55px;
    background-color: #A9C756;
}

#nummarge {
    height: 49px;
    background-color: #D4D4D3;
}

#product {
    color: #7B7B7A;
    clear: left;
    margin-top: 15px;
    margin-bottom: 25px;
}

#headproduct {
    font-size: 16px;
    line-height: 40px;
    border-right: 1px solid #d4d4d3;
    width: 20%;
    float: left;
}

.headproduct1 {
    width: 100%;
    font-size: 18px;
    line-height: 33px;
    background-color: #636362;
    color: white;
    margin-bottom: 10px;
}

.produit {
    float: left;
    width: 50%;
    padding-left: 4%;
}

.quantite {
    margin-left: 50%;
    padding-left: 12%;
}

.nameproduct1 {
    color: #636362;
    font-size: 14px;
    line-height: 21px;
    width: 100%;
    cursor: pointer;
}

.nameproduct1:hover {
    background-color: #D4D4D3;
}

#nameproduct {
    font-size: 14px;
    line-height: 40px;
    border-right: 1px solid #d4d4d3;
    padding-left: 8px;
    width: 60%;
    cursor: pointer;
    float: left;
}

#weightproduct {
    padding-top: 10px;
    margin-left: 82%;
    font-size: 14px;
    line-height: 40px;
}

#weightproduct i {
    font-size: 20px;
}

.weightproduct {
    font-size: 14px;
    color: #636362;
}

ul a:hover {
    color: white;
}

#comment {
    color: #7B7B7A;
    float: left;
    width: 100%;
}

#feedbacks .headproduct1 {
    padding-left: 4%;
}

#feedbacks .feedback .supplier {
    float: left;
    padding-left: 15px;
}

#feedbacks .feedback .star {
    float: right;
    padding-right: 15px;
}

#feedbacks .feedback .text {
    clear: both;
    padding-left: 30px;
}

#feedbacks .feedback .date {
    clear: both;
    text-align: right;
    font-size: 12px;
    padding-bottom: 10px;
    padding-right: 15px;
}

.graduation {
    float: left;
}

#clip {
    color: white;
    background-color: #A9C756;
    height: 25px;
    width: 25px;
    font-size: 1.2em;
    text-align: center;
    line-height: 30px;
    position: relative;
    left: 94%;
    bottom: 2px;
    float: left;
}

#footer {
    clear: left;
    background-color: #636362;
    padding-right: 35px;
    padding-top: 6px;
    padding-bottom: 6px;
    text-align: right;
}

#comment ul {
    display: inline-block;
    margin: 0;
    padding: 0;
    padding-left: 5px;
}

#comment li:hover {
    color: black;
    background-color: transparent;
}

.link {
    color: white;
    float: left;
    font-size: 1.2em;
    margin-top: 4px;
    cursor: pointer;
}

.link.paperclip {
    margin-left: 15px;
}

.link.feedback {
    margin-left: 60%;
}

#link {
    color: white;
    float: left;
    font-size: 1.4em;
    margin-left: 67%;
    cursor: pointer;
}

#document {
    cursor: pointer;
    color: white;
    border-left: solid 1px white;
    font-size: 1.4em;
    padding-left: 10px;
    width: 25%;
    margin-left: 75%;
}

#ditails {
    color: white;
    text-align: left;
    font-size: 1.4em;
    padding-left: 10px;
    cursor: pointer;
}

#login {
    width: 402px;
    height: 338px;
    background-image: url('img/backlogin1.png');
    margin: 0 auto;
    float: left;
}

#detailproduct1 {
    width: 100%;
    /*    border-right: solid 1px grey;*/
    margin-top: 25px;
    color: #7B7B7A;
    clear: left;
    margin-top: 90px;
}

#detailproduct {
    width: 100%;
    padding-top: 15px;
}

#detailproduct1 ul {
    padding: 0;
    font-size: 1.2em;
}

#detailproduct1 ul li {
    list-style-type: none;
    /* padding-left: 10px;*/
}

#detailproduct1 .title {
    font-size: 1.6em;
}

.workflowName {
    font-size: 1.3em;
    text-align: center;
    height: 5px;
}

#workflow {
    width: 50%;
    margin-left: 40%;
    padding-left: 2.5px;
    background: url('img/backgroundwf.png') repeat-y 50px;
}

#descript-prod #workflow {
    width: 45%;
    margin-left: 0%;
}

#contentleft {
    width: 47%;
    float: left;
    margin-right: 10px;
    min-height: 320px;
}

.circle {
    width: 30px;
    height: 30px;
    border-radius: 88888px;
    margin: 0 auto;
    background-color: #A9C756;
    margin-left: 35px;
    margin-top: 38px;
    margin-bottom: 38px;
    color: white;
    font-size: 10px;
    padding: 10px;
    /* COPY FA */
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.circle.current {
    -moz-transform: scale(2);
    -webkit-transform: scale(2);
    font-size: 20px;
    padding: 5px;
}

.circle.Validation:before {
    content: "\f00c";
}

.circle.Email:before {
    content: "\f0e0";
}

.texte-circle {
    position: absolute;
    margin-left: 85px;
    float: right;
    width: auto;
    font-size: 13px;
    color: #636362;
    width: 260px;
    /* font-family: arial;*/
}

.texte-circle .error {
    color: red;
    font-weight: bold;
}

#alertmessage {
    max-width: 40px;
    min-width: 40px;
    background: #636362;
    border-bottom: 1px solid white;
}

#alertmessage span {
    color: white;
    font-size: 20pt;
    padding-left: 5px;
}

#form-erreur {
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 15px;
    color: #7B7B7A;
    font-size: 14px;
}

#form-erreur h2 {
    padding-bottom: 5px;
    margin-bottom: 20px;
    border-bottom: 2px solid grey;
}

#form-erreur textarea {
    width: 300px;
    height: 150px;
    margin-top: 5px;
}

.titre-form {
    color: #636362;
    font-size: 1.4em;
    margin-bottom: 10px;
    margin-top: 10px;
    clear: left;
}

#warning {
    float: left;
    margin-right: 10px;
    margin-top: 10px;
    margin-bottom: 20px;
}

#message-erreur {
    width: 90%;
    padding-left: 30px;
    list-style: none;
}

#close {
    width: 15px;
    height: 15px;
    position: absolute;
    top: 4px;
    right: 4px;
    color: #636362;
    cursor: pointer;
}

.wrapper {
    clear: left;
}

#checkbox1 {
    margin-left: 50px;
}

.wrapperfourni {
    clear: left;
    padding-left: 0;
}

#titlevalidefourni {
    font-size: 1.6em;
    margin-bottom: 14px;
    background: #A9C756;
    color: white;
    width: 100%;
    padding-left: 25px;
}

.title1validefourni {
    font-size: 1.2em;
    float: left;
    margin-right: 5%;
    width: 42%;
}

.inputValideFourni {
    width: 53%;
    margin-left: 47%;
}

.inputValideFourni .input-group {
    width: 75%;
}

.title1validefourni.montantLine {
    padding-left: 7px;
}

#formvalidfourni {
    width: 100%;
    padding-left: 5%;
    padding-top: 3%;
    margin-top-top: 6%;
    background: #F3F3F3;
    border-top: 2px solid #636362;
    padding-bottom: 5%;
}

.col-md-67 {
    width: 261px;
    margin-left: 114px;
}

.lignefourni {
    width: 100%;
    margin-bottom: 10px;
    color: #636362;
    clear: left;
}

.lignefourni.border {
    border-left: 4px #636362 solid;
    margin-top: 40px;
}

.lignefourni1 {
    width: 435px;
    margin-bottom: 2%;
    color: #636362;
    width: 50%;
    text-align: justify;
}

.results {
    color: #636362;
    font-size: 1.2em;
}

.lignecolis {
    /*border-left: 4px #636362 solid;*/
}

.ligneformat {
    width: 45%;
    margin-left: 47%;
}

.ligneformat .results {
    width: 100%;
}

.lignepoids {
    clear: left;
    border-bottom: 1px #636362 solid;
    padding-top: 5px;
    padding-bottom: 10px;
    /*width: 90%;*/
}

.lignepoids .results {
    margin-top: 17px;
}

.row.lignefourni .col-md-5 {
    width: 28%;
    padding: 0;
}

.form-control.ng-isolate-scope.ng-pristine.ng-valid.ng-valid-required.ng-valid-date {
    /*font-family: 'helvetica';
*/
    font-size: 1.3em;
}

#uploadbtn {
    border: 0;
}

#datetimepicker1 {
    width: 150px;
    height: 20px;
}

.col-md-67 .form-control {
    height: 25px;
}

.col-md-67 .btn.btn-default {
    height: 25px;
    width: 31px;
}

.col-md-67 .btn.btn-default i {
    top: -2px;
}

#charte {
    color: #636362;
    font-size: 1.1rem;
}

#InnerContentFourvalid {
    margin-left: 5px;
}

.title1validefourni.validation {
    font-size: 1.2em;
    margin-bottom: 2%;
    margin-left: 3%;
}

#nbexemple {
    color: #A9C756;
    font-size: 1.2em;
    text-decoration: underline;
}

#modeleimp {
    font-size: 1.3em;
    color: #636362;
    padding-top: 2%;
    margin-bottom: 0%;
}

#pdf {
    width: 51%;
    height: 687.85px;
    margin-top: 1%;
    margin-left: 9%;
}

#pdf1 {
    width: 52%;
    height: 687.85px;
    margin-top: 1%;
    margin-left: 30px;
}

#pdf3 {
    width: 56%;
    height: 687.85px;
    margin-top: 0px;
    margin-left: 16px;
}

#content-fourvalid table {
    font-family: 'helvetica';
    color: #626263;
}

.btn.btn-sm.btn-info.ng-binding {
    background-color: #636362;
}

.btn-info {
    background-image: linear-gradient(to bottom, #636362 0px, #636362 100%);
    background-repeat: repeat-x;
    border-color: #636362;
}

.btn-danger {
    background-image: linear-gradient(to bottom, #D4D4D3 0px, #D4D4D3 100%);
    background-repeat: repeat-x;
    border-color: #D4D4D3;
    background-color: #D4D4D3;
    border-radius: 0;
}

.btn-danger:hover {
    background-image: linear-gradient(to bottom, #D4D4D3 0px, #D4D4D3 100%);
    background-repeat: repeat-x;
    border-color: #D4D4D3;
    background-color: #D4D4D3;
    border-radius: 0;
}

.btn-success {
    background-image: linear-gradient(to bottom, #A9C756 0px, #A9C756 100%);
    background-repeat: repeat-x;
    border-color: #A9C756;
    background-color: #A9C756;
    border-radius: 0;
}

.btn-info:active,
.btn-info.active {
    background-color: transparent;
    ;
    border-color: #A9C756;
    color: #A9C756;
    border-radius: 0;
}

.text-info {
    color: #A9C756;
}

.col-md-6 {
    width: 70%;
}

#wrap {
    width: 1500px;
    padding: 0;
    margin: 0;
}

.btn.btn-success.fileinput-button.addfiles {
    padding: 8px 11px;
    background-color: #A9C756;
    border: 0;
    font-size: 1em;
    margin-left: 0px;
    cursor: pointer;
}

.btn.btn-success.fileinput-button.addfiles i {
    font-size: 1.2rem;
}

#docname {
    color: #636362;
    position: relative;
    top: 2px;
    right: ;
}


/*Style Page : Validation-facture */

.text-validation {
    font-size: 1.9em;
    float: left;
    clear: left;
    color: #636362;
}

#nomclient-validation {
    font-size: 2.1em;
    float: left;
    clear: left;
    color: #272725;
}

#ref-validation {
    font-size: 1.9em;
    float: left;
    clear: left;
    color: #636362;
    margin-bottom: 10px;
}

#content-validtc {
    width: 465px;
    float: left;
    border-left: 6px solid #636362;
    border-right: 6px solid #636362;
    font-size: 0.8em;
    margin-top: 5%;
    background: #F3F3F3;
}

#paravalid {
    width: 280px;
    padding-left: 25px;
    height: 180px;
    float: left;
}

#prixtotal {
    width: 170px;
    height: 80px;
    background: grey;
    margin-left: 282px;
}

.text-prixtotal {
    height: 40px;
    width: 100%;
    color: #636362;
    background: #D0D0CF;
    font-size: 2.3em;
    text-align: center;
}

.text-prixtotal.num {
    color: white;
    background: #636362;
}

#info-valid {
    width: 630.5px;
    height: 150px;
}

#comment-valid {
    width: 280px;
    padding-left: 25px;
    height: 115px;
    float: left;
    padding-top: 30px;
}

#boite-motif textarea {
    width: 250px;
    height: 70px;
    font-size: 1.3em;
    font-family: 'helvetica';
}

#motif-valid {
    color: #636362;
    font-size: 0.9em;
}

#btns-valid {
    width: 32px;
    height: 70px;
    margin-left: 280px;
    margin-top: 78px;
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#btnyes-valid {
    width: 32px;
    height: 32px;
    background: #A9C756;
    padding-left: 6px;
    padding-top: 6px;
}

#btnyes-valid:before {
    content: "\f00c";
    color: white;
    font-size: 1.4em;
    cursor: pointer;
}

#btnno-valid {
    width: 32px;
    height: 32px;
    background: #DD525D;
    margin-top: 6px;
    padding-left: 8px;
    padding-top: 6px;
}

#btnno-valid:before {
    content: "\f00d";
    color: white;
    font-size: 1.4em;
    cursor: pointer;
}


/*compta*/

#datacompta {
    height: 550px;
    overflow-y: scroll;
    width: 1314px;
}

.sortTable-compta {
    width: 17px;
    font-size: 0.9em;
    margin-right: 0px;
    color: white;
    float: right;
}

.text-sortTable-compta {
    width: 73%;
    line-height: 14px;
    float: left;
    padding-top: 7px;
    font-size: 1em;
}

#content-compta th {
    font-size: 0.8em;
    font-weight: normal;
    background: #BEBEBE;
    color: white;
    text-align: left;
    line-height: 10px;
}

.col1Ref-compta {
    padding-left: 10px;
    max-width: 138px;
    min-width: 108px;
    height: 45px;
    word-wrap: break-word;
}

.fa.fa-arrow-right.compta {
    position: relative;
    right: 13px;
    top: 10px;
    float: left;
    font-size: 0.4em;
    color: #BFD467;
}

.fa.fa-file.compta {
    float: left;
    padding-top: 5px;
    padding-left: 11px;
    color: white;
    font-size: 1.5rem;
}

#wrap-content {
    width: 1276px;
    float: left;
}

#content-compta {
    width: 1400px;
    margin-top: 10px;
}

.buttonActiontext-right {
    font-family: "avenirblack";
    font-size: 1.5rem;
    color: white;
    background: none repeat scroll 0% 0% #A9C756;
    padding: 4.1px;
    border-radius: 0px 6px 7px 0px;
    white-space: nowrap;
    opacity: 1;
    cursor: default;
    float: right;
}

.buttonActiontext-left {
    color: white;
    font-family: "avenirblack";
    font-size: 1.5rem;
    background: none repeat scroll 0% 0% #A9C756;
    padding: 4.1px;
    border-radius: 6px 0px 0px 7px;
    white-space: nowrap;
    opacity: 1;
    cursor: default;
    float: right;
}

.buttonsAction {
    float: right;
    margin-right: 1%;
}

#buttonAction-icon {
    left: 5px;
    color: #FFF;
    top: -6px;
    font-size: 1.7rem;
    cursor: pointer;
    position: relative;
}

.buttonAction-icon.off {
    color: #BFD467;
    font-size: 1.7rem;
    position: relative;
    padding-left: 7px;
    padding-top: 3px;
}

.buttonAction-icon.on {
    color: white;
    font-size: 1.7rem;
    position: relative;
    padding-left: 7px;
    padding-top: 3px;
}


/*Recherches avancées*/

#research-a {
    border-left: 1px solid #d2d2d2;
    border-right: 1px solid #d2d2d2;
    border-bottom: 1px solid #d2d2d2;
    width: 380px;
    left: 14px;
    top: 115px;
    padding-left: 16px;
    position: absolute;
    background: white;
    z-index: 1;
    -webkit-transition: all linear 0.2s;
    -moz-transition: all linear 0.2s;
    transition: all linear 0.2s;
    max-height: 505px;
    opacity: 1;
    height: 505px;
}

#research-a.ng-hide {
    max-height: 0px;
    opacity: 0;
}

.label-research {
    color: #636362;
    font-size: 1.1em;
    margin-bottom: 2px;
}

.textinput-research {
    width: 95%;
    margin-bottom: 7px;
}

.form-control.research {
    height: 28px;
    font-size: 0.8em;
}

.btn.btn-default.research {
    font-size: 14px;
    padding: 3px 8px;
}

.text-date {
    font-size: 1em;
    font-family: 'helvetica';
    width: 118px;
    padding-left: 5px;
    color: #636362;
    height: 20px;
}

#research-a select {
    font-family: 'helvetica';
    float: left;
    color: #636362;
}

.col-md-7 {
    width: 40%;
}

.date-row {
    width: 320px;
    margin-bottom: 7px;
    margin-top: 7px;
}

.label-research.time {
    float: left;
    padding-left: 17px;
}

#refdate {
    clear: left;
}

#cog {
    color: #636362;
    float: left;
    margin-right: 15px;
    font-size: 1em;
    width: 100%;
    margin-bottom: 3px;
}

#cog i {
    float: right;
    padding-right: 10px;
    padding-top: 10px;
    cursor: pointer;
}


}
.label-research {
    margin-bottom: 3px;
}
.glyphicon.glyphicon-calendar.date {
    font-size: 0.9em;
    color: #636362;
}
#loupe1 {
    float: right;
    color: #BFD467;
    margin-right: 23px;
    margin-top: 20px;
    font-size: 1.3em;
    background: #FFF;
    border: none;
}

/*Facture Achat/Compta*/
.title-achat-compta {
    font-size: 1.7em;
    float: left;
    margin-right: 30px;
}
.results-achat-compta {
    font-family: 'helvetica';
    color: #636362;
    font-size: 1.6em;
}
#content-achat-compta {
    width: 28%;
    float: left;
    margin-left: 0;
    border-bottom: solid 4px #D4D4D3;
    padding-bottom: 25px;
}
.ligne-achat-compta {
    width: 100%;
    margin-bottom: 8px;
    color: #636362;
}
#title-achat-compta {
    font-size: 2.7em;
    float: left;
    margin-right: 30px;
}
#results-achat-compta {
    font-family: 'helvetica';
    color: #636362;
    font-size: 2.6em;
}
#montants {
    border-top: 1px solid #D4D4D3;
    margin-top: 20px;
    padding-top: 20px;
    background: #BFD467;
    padding-bottom: 10px;
}
.title-achat-compta.montant {
    color: white;
    padding-left: 18px;
}
.results-achat-compta.montant {
    color: white;
}
#comptabiliser {
    float: right;
    margin-right: 51px;
    width: 174px;
    font-size: 1.6em;
    padding-top: 8px;
    color: #636362;
}

/*Documents in Order*/
#docbox {
    width: 450px;
    float: left;
    margin-left: 30px;
    padding-left: 15px;
    padding-top: 65px;
    height: 550px;
}
#sous-docbox {
    width: 100%;
    margin-bottom: 25px;
}
#doc-title {
    font-size: 3.1em;
    color: #636362;
    margin-bottom: 15px;
    border-bottom: 5px solid #A9C756;
}
#doc-title1 {
    color: #636362;
    font-size: 22px;
}
#doc-title i {
    font-size: 0.7em;
    color: #d4d4d3;
    position: relative;
    bottom: 5px;
}
.doc-lines {
    padding-left: 9px;
    font-size: 22px;
    color: #70706F;
    margin-bottom: 10px;
    cursor: pointer;
    border-left: 2px solid #D4D4D3;
}
.doc-lines a {
    padding-left: 9px;
    font-size: 22px;
    color: #70706F;
    margin-bottom: 10px;
    cursor: pointer;
}
.doc-lines:hover {
    background: #D4D4D3;
    color: white;
}
.doc-lines i {
    font-size: 17px;
    color: #636362;
}

/*HEADER LOGIN*/
#contact-us {
    color: white;
    background: #636362;
    font-size: 2.4rem;
    font-family: "avenirmedium";
    padding: 15px 25px;
    position: absolute;
    top: 0;
    right: 50px;
    text-align: center;
}
#contact-us:hover {
    text-shadow: 2px 2px 2px #494949;
}
#top {
    width: 100%;
}
#add-content,
#bann-header {
    margin: auto;
    width: 1050px;
}
#footer-home-page {
    width: 100%;
    height: 25px;
    background: #ddd;
    margin-top: 25px;
    text-align: right;
    padding-top: 2px;
    padding-right: 10px;
}
#bann-header {
    font-family: 'avenirmedium';
    font-weight: normal;
    font-style: normal;
    font-size: 2.6rem;
    color: #636362;
    border-bottom: 5.5px solid #D4D4D3;
    height: 95px;
    margin-bottom: 25px;
    margin-top: 60px;
}
#bann-header a {
    font-family: 'avenirmedium';
    font-weight: normal;
    font-style: normal;
    font-size: 2.6rem;
    color: #636362;
}
#logo-eproc {
    width: 260px;
    float: left;
    margin-left: 10px;
}
#bann-header i {
    color: #BFD467;
}
#bann-header ul {
    margin-left: 270px;
    padding-top: 48px;
}
#bann-header ul li {
    list-style-type: none;
    display: inline-block;
    margin-right: 25px;
}
#bann-img {
    background-image: url('img/background.png');
    width: 100%;
    height: 345px;
    background-repeat: no-repeat;
    clear: left;
}
#slogan {
    width: 492px;
    height: 113px;
    background: #636362;
    color: white;
    font-family: 'avenirmedium';
    font-size: 4rem;
    float: left;
    margin-top: 35px;
    padding-top: 14px;
    padding-left: 25px;
    line-height: 46px;
}
#slogan span {
    font-family: 'avenirblack';
}
#menu-slogan {
    background: #BFD467;
    width: 325px;
    margin-bottom: 15px;
    padding: 5px 0 5px 5px;
}
#menu-slogan img {
    margin-right: 10px;
}
#nav-slogan {
    float: right;
    color: white;
    font-size: 2.6rem;
    font-family: 'avenirmedium';
    margin-top: 150px;
}
#menu-slogan:hover {
    width: 300px;
}
#nav-slogan a:hover {
    color: white;
}
.ligne {
    clear: left;
    width: 100%;
    min-height: 278px;
}
.elpev-comm {
    width: 22%;
    float: left;
    margin-right: 1.5%;
    margin-left: 1.5%;
    font-family: "avenirmedium";
    padding-top: 1.5%;
    height: 278px;
}
.elpev-comm img {
    width: 100%;
}
.elpev-comm.service {
    border-bottom: 15px solid #636362;
}
.elpev-comm.transport {
    border-bottom: 15px solid #BFD467;
}
.elpev-comm.e360 {
    border-bottom: 15px solid #D4D4D3;
}
.elpev-comm.login {
    border-bottom: 15px solid #A9C756;
}
.elpev-comm h1,
.elpev-comm a {
    font-size: 2.6rem;
    color: #636362;
    margin-top: 0;
    padding-top: 5px;
    margin-bottom: 0;
    padding-bottom: 0;
}
.elpev-comm p {
    font-size: 1.4rem;
    color: #757575;
    float: left;
    margin-bottom: 0;
    padding-bottom: 0;
}
.savoir-plus {
    color: #636362;
    font-size: 2.5rem;
    font-family: 'geosanslightregular';
    float: right;
}
.savoir-plus.forget-password,
.savoir-plus.forget-password a {
    font-family: 'avenirmedium';
    font-size: 1.1rem;
    color: #929292;
    text-decoration: underline;
    padding-top: 1%;
}
.savoir-plus.forget-password {
    margin-top: 0px;
    clear: left;
    float: left;
}
.savoir-plus img {
    padding-bottom: 5px;
    padding-right: 5px;
    width: 16%;
}
.elpev-comm form {
    color: #7B7B7A;
}
.champ {
    width: 83%;
    padding-left: 5px;
    font-size: 15px;
    margin-top: 5%
}
#send {
    background: #A9C756;
    border: none;
    color: white;
    margin-top: 4%;
    padding: 3%;
    padding-left: 10%;
    padding-right: 10%;
    margin-bottom: 4%;
}
#send:active {
    -moz-box-shadow: 1px 1px 0px #BFD467;
    -webkit-box-shadow: 1px 1px 0px #BFD467;
    box-shadow: 1px 1px 0px #BFD467;
}
#send1 {
    font-size: 1.2rem;
    margin: 0 auto;
    background: #A9C756;
    border: none;
    color: white;
    min-width: 73px;
    height: 30px;
}
#refus {
    font-size: 1.2rem;
    margin: 0 auto;
    background: #DD525D;
    border: none;
    color: white;
    min-width: 73px;
    height: 30px;
    margin-left: 2%;
}
#valide {
    font-size: 1.2rem;
    margin: 0 auto;
    background: #00CC85;
    border: none;
    color: white;
    min-width: 73px;
    height: 30px;
    margin-left: 2%;
}
.info {
    width: 100%;
    margin-bottom: 4.5%;
}
.info-check {
    float: left;
    margin-top: 0;
    color: #636362;
    font-family: 'avenirmedium';
}
.info-check label {
    font-weight: 100;
    margin: 0;
}
.info i {
    height: 16px;
    margin-top: 21px;
    margin-left: 8px;
    position: absolute;
}
.info input {
    height: 32px;
    font-size: 15px;
    width: 100%;
    padding-left: 28px;
    padding-right: 5px;
}
#flux {
    width: 68.5%;
    margin-left: 1.5%;
    font-family: 'avenirmedium';
    font-size: 2.0rem;
    color: #414142;
    padding-top: 35px;
}
#pub {
    float: right;
    padding-top: 80px;
    width: 30%;
}
#canalblog {
    float: left;
    border-right: 3px solid #BFD467;
    padding-right: 5px;
    margin-right: 5px;
    height: 25px;
}
#canalblog span {
    font-family: 'avenirblack'
}
#text-flux {
    width: 100%;
    border-bottom: 3px solid #D4D4D3;
    padding-bottom: 5px;
    margin-bottom: 5px;
}
#text-flux2 {
    padding-top: 2px;
}
#content-flux {
    width: 100%;
    height: 250px;
    border-bottom: 2px #ddd solid;
    overflow-y: scroll;
}
.element-flux {
    width: 100%;
    margin-bottom: 20px;
    float: left;
    padding-bottom: 20px;
}
.element-flux h2 a {
    color: #636362;
    font-size: 2.0rem;
    font-family: 'avenirblack';
}
.element-flux h2 {
    margin-top: 0;
}
.description-flux {
    font-size: 1.4rem;
    font-family: 'avenirmedium';
    width: 48%;
    margin-left: 5%;
    float: left;
    padding-right: 3%;
    margin-right: 3%;
}
.img-flux img {
    width: 165px;
    float: left;
}
.categorie-flux {
    font-size: 1.0rem;
    color: #636362;
}
.categorie-flux span {
    font-size: 2.0rem;
    color: #757575;
}
.categorie-flux a {
    color: #A9C756;
    font-size: 1.2rem;
}
#error-message {
    width: 200px;
    background-color: #dd525d;
    position: absolute;
    color: white;
    padding: 10px;
    text-shadow: 2px 2px 2px #b73747;
}
#error-message:hover {
    text-shadow: 5px 5px 5px #b73747;
}
#error-message .icone {
    color: white;
    height: 45px;
    padding-right: 10px;
    padding-top: 2px;
    position: absolute;
}
#error-message .texte {
    padding-left: 16px;
}
.error-color {
    color: #e74c3c;
    font-weight: bold;
}
#arrow-error {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0px 5px 5px 5px;
    border-color: transparent transparent #dd525d transparent;
    position: relative;
    left: 53px;
    bottom: 0px;
}
.error {
    -webkit-animation: cssAnimation 0.015s 1 linear;
    -moz-animation: cssAnimation 0.015s 1 linear;
    -o-animation: cssAnimation 0.015s 1 linear;
}
@-webkit-keyframes cssAnimation {
    from {
        -webkit-transform: rotate(0deg) scale(0.1) skew(1deg) translate(0px);
    }
    
    to {
        -webkit-transform: rotate(0deg) scale(1.009) skew(1deg) translate(0px);
    }
}
@-moz-keyframes cssAnimation {
    from {
        -moz-transform: rotate(0deg) scale(0.1) skew(1deg) translate(0px);
    }
    
    to {
        -moz-transform: rotate(0deg) scale(1.009) skew(1deg) translate(0px);
    }
}
@-o-keyframes cssAnimation {
    from {
        -o-transform: rotate(0deg) scale(0.1) skew(1deg) translate(0px);
    }
    
    to {
        -o-transform: rotate(0deg) scale(1.009) skew(1deg) translate(0px);
    }
}
.spinner {
    width: 20px;
    height: 20px;
    position: relative;
    float: right;
    bottom: 35px;
    right: 26px;
}
.container1 > div,
.container2 > div,
.container3 > div {
    width: 6px;
    height: 6px;
    background-color: #333;
    border-radius: 100%;
    position: absolute;
    -webkit-animation: bouncedelay 1.2s infinite ease-in-out;
    animation: bouncedelay 1.2s infinite ease-in-out;
    /* Prevent first frame from flickering when animation starts */
    
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.spinner .spinner-container {
    position: absolute;
    width: 100%;
    height: 100%;
}
.container2 {
    -webkit-transform: rotateZ(45deg);
    transform: rotateZ(45deg);
}
.container3 {
    -webkit-transform: rotateZ(90deg);
    transform: rotateZ(90deg);
}
.circle1 {
    top: 0;
    left: 0;
}
.circle2 {
    top: 0;
    right: 0;
}
.circle3 {
    right: 0;
    bottom: 0;
}
.circle4 {
    left: 0;
    bottom: 0;
}
.container2 .circle1 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
}
.container3 .circle1 {
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
}
.container1 .circle2 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}
.container2 .circle2 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}
.container3 .circle2 {
    -webkit-animation-delay: -0.7s;
    animation-delay: -0.7s;
}
.container1 .circle3 {
    -webkit-animation-delay: -0.6s;
    animation-delay: -0.6s;
}
.container2 .circle3 {
    -webkit-animation-delay: -0.5s;
    animation-delay: -0.5s;
}
.container3 .circle3 {
    -webkit-animation-delay: -0.4s;
    animation-delay: -0.4s;
}
.container1 .circle4 {
    -webkit-animation-delay: -0.3s;
    animation-delay: -0.3s;
}
.container2 .circle4 {
    -webkit-animation-delay: -0.2s;
    animation-delay: -0.2s;
}
.container3 .circle4 {
    -webkit-animation-delay: -0.1s;
    animation-delay: -0.1s;
}
@-webkit-keyframes bouncedelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(0.0)
    }
    
    40% {
        -webkit-transform: scale(1.0)
    }
}
@keyframes bouncedelay {
    0%,
    80%,
    100% {
        transform: scale(0.0);
        -webkit-transform: scale(0.0);
    }
    
    40% {
        transform: scale(1.0);
        -webkit-transform: scale(1.0);
    }
}
#loading-bar .bar {
    background: #636363;
    position: fixed;
    top: 8%;
    width: 88%;
    margin-left: 12%;
    z-index: 1000;
}
#loading-bar-spinner .spinner-icon {
    border-top-color: #636363;
    border-left-color: #636363;
    position: fixed;
    top: 9%;
    right: 1%;
}
#bonCommande {
    float: left;
    margin-top: 0;
    margin-left: 15%;
}
#bonCommande h2 {
    font-size: 22px;
    color: #636362;
    padding: 0;
    margin: 0;
    margin-top: 1%;
}
.btn-primary,
.btn-primary:hover,
.btn-primary:active {
    background-image: linear-gradient(to bottom, #A9C756 0px, #A9C756 100%);
    background-repeat: repeat-x;
    border-color: #A9C756;
    background-color: #A9C756;
}
#refus-box {
    padding: 15px;
}
#refus-box .dismiss {
    float: right;
    cursor: pointer;
}
#refus-title {
    font-size: 1.5rem;
    border-bottom: 4px solid #DD525D;
    margin-bottom: 15px;
    padding-bottom: 10px;
    color: #636362;
    padding-top: 3px;
}
#refus-box textarea {
    width: 361px;
    height: 191px;
    margin-bottom: 15px;
    max-width: 400px;
}
#refusBbox {
    margin: 0 auto;
    background: #B73747;
    border: none;
    color: white;
    width: 90px;
    height: 30px;
    position: absolute;
    bottom: 34px;
    right: 81px;
}
#refus-box img {
    width: 25px;
    margin-right: 5px;
    float: left;
}
#contact-repertory {
    width: 33%;
    float: left;
}
#calculator-filters {
    width: 27%;
    float: left;
}
#calculator-filters div.form-group {
    margin-bottom: 10px;
}
.header-repertory {
    background: none repeat scroll 0% 0% #D4D4D3;
    color: #636362;
    font-size: 2.5rem;
    width: 100%;
    padding: 0.5%;
    margin-top: 15px;
}
.header-repertory:first-child {
    margin-top: 0px;
}
.header-repertory img {
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 5px;
}
.btn-repertory {
    width: 32px;
    padding: 16px;
    float: right;
    cursor: pointer;
}
.btn-repertory:active {
    transform: scale(0.892);
    -webkit-transform: scale(0.892);
    -moz-transform: scale(0.892);
    -o-transform: scale(0.892);
    -ms-transform: scale(0.892);
}
.btn-actions {
    width: 32px;
    text-align: center;
    float: right;
    border-radius: 5px;
    color: #DDD;
    background: #CCC;
}
.btn-actions.active {
    color: #FFF;
    background: #DDD;
    cursor: pointer;
}
.btn-actions.active .desactive {
    color: #DDD;
    cursor: default;
}
.btn-actions.btn-zoom {
    color: #636362;
    background: none;
    margin-right: 10px;
}
.list-repertory {
    /*font-size: 2rem;*/
    
    border-bottom: 2px solid #636362;
    width: 100%;
}
.list-repertory:hover > .list-item {
    background: #DDD;
}
.list-repertory.active > .list-item {
    background: #636362;
    color: white;
}
.list-repertory.box {
    overflow-y: scroll;
    border-bottom: none;
    height: 333px;
}
.list-repertory span {
    color: #636362;
}
.list-repertory.box.Products,
.list-repertory.product-type.box,
.list-repertory.product-group.box,
.list-repertory.box.UserRightProfile {
    transition: All 0.3s ease;
    -webkit-transition: All 0.3s ease;
    -moz-transition: All 0.3s ease;
    -o-transition: All 0.3s ease;
}
.list-repertory.box.Products {
    height: 215px;
}
.list-repertory.box.Prices {
    height: 256px;
}
.list-repertory.box.UserRightProfile {
    height: 144px;
}
.list-repertory.product-type.box,
.list-repertory.product-group.box {
    height: 115px;
}
.list-repertory.box.Products.extend,
.list-repertory.product-type.box.extend,
.list-repertory.product-group.box.extend {
    height: 560px;
}
.list-repertory.box.UserRightProfile.extend {
    height: 576px;
}
.list-repertory.box.masq {
    height: 0px;
}
.header-repertory.product-type,
.header-repertory.product-group {
    font-size: 18px;
    margin-top: 25px;
}
.list-repertory.product-type,
.list-repertory.product-group {
    font-size: 16px;
}
.list-repertory .list-item {
    float: left;
    min-width: 15%;
    padding: 2px;
    padding-bottom: 4px;
    cursor: pointer;
}
.list-repertory .list-item:first-child {
    text-align: right;
    padding-right: 10px;
}
.list-repertory .list-item:first-child {
    text-align: right;
    padding-right: 10px;
}
.list-repertory.product-type .list-item:first-child,
.list-repertory.product-group .list-item:first-child,
.list-repertory.Prices .list-item:first-child,
.list-repertory.UserRightProfile .list-item:first-child {
    text-align: left;
}
.list-repertory.Prices .list-item:first-child {
    min-width: 70%;
}
.list-repertory .list-item:last-child {
    float: none;
    text-align: right;
    padding-right: 5px;
}
.list-repertory .list-item {
    color: #636362;
}
.hoverElement {
    background: #eee;
    padding: 1px 5px;
}
.hoverElement:hover {
    background: #ccc;
}
#reseach-repertory {
    font-size: 1.5rem;
    background: #636362;
    width: 160px;
    max-width: 160px;
    border: none;
    height: 28px;
    float: right;
    margin-right: 13px;
    margin-top: 4px;
    -webkit-transition: all linear 0.1s;
    -moz-transition: all linear 0.1s;
    transition: all linear 0.1s;
}
#research-repertory.ng-hide {
    max-width: 0px;
    min-width: 0px;
    width: 0px;
}
.contact-detail {
    width: 60%;
    margin-left: 35%;
    background-color: rgba(246, 246, 246, 1);
    min-height: 500px;
    padding-bottom: 46px;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-right: 1px solid #ddd;
    transition: All 0.3s ease;
    -webkit-transition: All 0.3s ease;
    -moz-transition: All 0.3s ease;
    -o-transition: All 0.3s ease;
    overflow-y: auto;
}
.contact-detail.client {
    min-height: 800px;
}
.contact-detail.supplier {
    min-height: 600px;
}
.contact-detail.price {
    min-height: 700px;
}
.contact-detail.ng-hide {
    transition: All 0s ease;
    -webkit-transition: All 0s ease;
    -moz-transition: All 0s ease;
    -o-transition: All 0s ease;
    display: none;
    transform: scale(0.226);
    -webkit-transform: scale(0.226);
    -moz-transform: scale(0.226);
    -o-transform: scale(0.226);
    -ms-transform: scale(0.226);
}
.header-contact-detail {
    background: #636362;
    color: white;
    font-size: 3rem;
}
.contact-address {
    padding-bottom: 3%;
    padding-top: 2%;
}
.top-info-text {
    font-size: 1.7rem;
    font-style: normal;
    font-weight: normal;
}
.top-info-text .fa {
    width: 32px;
    text-align: center;
}
.top-info-text .client-address {
    float: left;
    width: 16px;
    padding-top: 1px
}
.top-info-text .client-address.ligne1 {
    height: 23px;
}
.top-info-text .client-address.ligne2 {
    height: 46px;
}
.top-info-text .client-address.ligne3 {
    height: 69px;
}
.top-info-text .client-address.ligne4 {
    height: 92px;
}
.top-info-text h3 {
    font-size: 2rem;
    margin: 0;
    margin-bottom: 5px;
    text-transform: capitalize;
}
.top-info-text .label-address {
    padding-top: 1px;
}
.top-info-text .label-address.text {
    line-height: 23px;
}
#top-info {
    padding: 2%;
    width: 48%;
    color: #636362;
}
#top-info .fa {
    margin-right: 2%;
    color: #636362;
}
#top-info .fa.fa-user {
    color: #FFF;
    background: #BFD467;
    padding: 4px;
    border-radius: 41px;
}
#top-info .fa.fa-envelope,
#top-info .fa.fa-phone {
    font-size: 1.8rem;
}
#eclient {
    width: 12.5%;
    padding-bottom: 1%;
    padding-right: 2%;
}
.down-info h2 {
    font-size: 2rem;
    margin: 0;
    padding: 0;
    padding-bottom: 2%;
}
#down-info {
    width: 45%;
    color: #fff;
    padding: 1%;
    font-size: 1.6rem;
    margin-top: 2%;
    padding-left: 3.1%;
    float: right;
    margin-right: 5%;
}
#down-infoSupp {
    width: 45%;
    /*padding: 1%;*/
    
    font-size: 1.8rem;
    margin-top: 2%;
    padding-left: 3.1%;
    float: right;
    margin-right: 5%;
}
#down-infoSupp .encart-sombre {
    background: #636362;
    color: #fff;
}
.down-info {
    background: #c4c4c4;
    color: #222;
    padding: 3%;
    margin-bottom: 5%;
}
.down-info.CentralInfo .fa {
    margin-right: 2%
}
.down-info.CentralInfo {
    background: #636362;
    color: #fff;
}
.down-info .export {
    margin-top: 10px;
    clear: both;
}
.down-info .export > div {
    display: inline-block;
}
.down-info .export > div:last-child {
    float: right;
}
.down-info-text i {
    margin-left: 1%;
}
.down-info.ModeEnvoi .blackbackground {
    background: none repeat scroll 0% 0% #636362;
    padding: 1%;
    color: #F3F3F3;
    border-radius: 37px;
}
.down-info.ModeEnvoi .expeditionMode {
    border: 2px #636362 dotted;
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 5px;
}
.down-info.ModeEnvoi .expeditionMode.principal {
    color: #000;
}
.btnContact {
    float: left;
    height: 62px;
}
.btnContact:last-child {
    float: none;
}
.btnContact .icon {
    display: inline-block;
    background-color: grey;
    color: #636362;
    height: 62px;
    width: 62px;
    font-size: 30px;
    text-align: center;
    cursor: pointer;
}
.btnContact .title {
    display: none;
    margin-right: 15px;
    height: 62px;
}
.btnContact .icon,
.btnContact .title {
    padding-top: 7px;
}
.btnContact:first-child.active .icon {
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-left: none;
}
.btnContact.active .icon {
    background-color: #F6F6F6;
    border-left: 1px solid #ddd;
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
}
.btnContact.active .title {
    display: inline-block;
}
#clientInfo {
    width: 100%;
    padding-left: 2%;
    /*min-height: 781px;*/
}
#clientInfoProduit {
    width: 100%;
    min-height: 1051px;
    /*max-height: 850px;
*/
    
    padding-left: 2%;
}
.informations-list .padding {
    padding-left: 15px;
}
#productList,
.informations-list {
    width: 90%;
    margin: auto;
    overflow-y: scroll;
    height: 400px;
    max-height: 400px;
    padding-bottom: 25px;
}
.ProductDetail {
    width: 96%;
    background: none repeat scroll 0% 0% #D4D4D3;
    font-size: 1.7rem;
    margin: auto;
    text-align: center;
    margin-bottom: 0px;
    margin-top: 10px;
    cursor: pointer;
}
.ProductDetail:hover {
    background: none repeat scroll 0% 0% #636362;
    color: white;
}
.ProductDetail i {
    font-size: 1.3rem;
    position: relative;
    bottom: 2px;
}
#ProductInformation {
    width: 45%;
    float: left;
}
#descript-prod {
    width: 100%;
    /*max-height: 2000px;*/
    
    background: #f6f5f5;
    color: #636362;
    padding: 15px;
}
#descript-cart {
    width: 100%;
    background: #f6f5f5;
    padding: 15px;
}
#Product-Name {
    font-size: 2.9rem;
    line-height: 26px;
    margin-bottom: 10px;
}
.ProductDescript {
    font-size: 1.8rem;
    clear: left;
}
.ProductDescript.Type-Groupe {
    float: left;
}
.ProductDescript.DateQuant {
    font-size: 2.0rem;
    color: #333333;
    padding-top: 3px;
}
#ProductPrice {
    margin-top: 8px;
    float: right;
    width: 113px;
    background: #636362;
    color: white;
    font-size: 1.714rem;
    text-align: center;
}
#ProductPriceNumb {
    background: #515150;
    clear: left;
}
#ProductDescription {
    color: #636362;
    text-align: justify;
    border-top: solid 2px #636362;
    margin-top: 6px;
    padding-top: 4px;
}
#descript-prod table {
    width: 100%;
    padding-bottom: 15px;
    background: #D4D4D3;
    font-size: 1.3rem;
    color: white;
    /*   text-align: center;*/
    /*margin-top: 16px;
*/
}
#descript-prod table td {
    padding-left: 2%;
}
#descript-prod table th {
    background: #c9c9c9;
    color: #636362;
    /* text-align: center;*/
    
    padding-left: 2%;
    height: 35.333px;
}

/*ACCOUNT*/
#mon-compte {
    width: 36%;
    font-family: 'Conv_DINPro-Regular_13937';
    font-weight: normal;
    font-style: normal;
    border-bottom: 14px solid #636362;
    padding-bottom: 1%;
    margin: 0 auto;
    margin-top: 25px;
    background: #F3F3F3;
    padding: 2%;
}
#mon-compte h1 {
    color: #636362;
    font-size: 30pt;
    border-bottom: 7px solid #BFD467;
    margin: 0px;
    padding: 0px 0px 3%;
    font-weight: bold;
    ;
}
#mon-compte h1 span {
    font-size: 3.5rem;
    position: relative;
    bottom: 6px;
    margin-right: 5px;
}
#mon-compte h2 {
    color: #3a3a3a;
    font-size: 20pt;
    /*A convertir en REM*/
    
    margin: 0;
    padding: 0;
    padding-top: 3%;
}
#lines-compte {
    color: #636362;
    font-size: 15pt;
    /*A convertir en REM*/
    
    margin-bottom: 5px;
}
#lines-compte span {
    font-size: 1.5rem;
    margin-left: 3%;
    color: #BFD467;
    cursor: pointer;
}
#lines-compte span:hover {
    color: #A9C756;
    font-size: 1.7rem;
}
#sous-line-compte {
    font-size: 12pt;
    /*A convertir en REM*/
    
    color: #636362;
    margin: 0 auto;
}
#sous-line-compte p {
    margin: 0 auto;
    padding: 0;
}
#var-prices {
    width: 100%;
    padding-top: 2px;
}
#var-prices h1 {
    font-size: 1.9rem;
    font-weight: bold;
    color: #636362;
    margin-top: 0;
}
.var-lines {
    font-size: 1.5rem;
    color: #636362;
}
.var-lines .masque {
    color: #F3F3F3;
}
.var-lines:hover {
    color: #fff;
    background: #A9C756;
    cursor: pointer;
}
.var-lines:hover .masque {
    color: #A9C756;
}
.var-lines.active {
    color: #636362;
    background: #E6F6B8;
    cursor: pointer;
}
.var-lines.active .masque {
    color: #E6F6B8;
}
.var-lines > span, .sub-var-lines > span {
    display: inline;
    float: right;
    padding-right: 5%;
}
.var-globale {
    width: 49%;
    margin-left: 50%;
}
.var-globale.intervale {
    width: 49%;
}
.var-globale h1 {
    font-size: 1.9rem;
    font-weight: bold;
    border-bottom: 3px solid #e0e0e0;
    margin-bottom: 0;
    padding-bottom: 1px;
}
#descript-prod .var-globale table,
#PriceInfo table {
    width: 100%;
    padding-bottom: 15px;
    background: none repeat scroll 0% 0% #D4D4D3;
    font-size: 1.3rem;
    color: #636362;
    /*text-align: center;*/
    
    margin-top: 16px;
}
#descript-prod .var-globale table tr,
#PriceInfo table tr {
    border-bottom: 2px #e0e0e0 solid;
}
#clientInfo table.tab-activity-accounts {
    width: 96%;
    margin-left: 15px;
}
#clientInfo table.tab-activity-accounts td,
#clientInfo table.tab-activity-accounts th {
    text-align: left;
    padding-left: 20px;
    height: 35px;
}
#clientInfo table.tab-activity-accounts td {
    padding-top: 5px;
    padding-bottom: 5px;
}
#clientInfoProduit .var-globale h1 {
    padding-top: 20px;
}
.var-globale input {
    margin-right: 3%;
}
.calculator {
    margin-top: 3%;
    width: 100%;
    font-size: 1.6rem;
    float: left;
    background: #D3D3D3;
    padding-left: 2%;
}
#leftCalculator {
    float: left;
    margin-right: 8%;
}
.calculateIcon {
    float: left;
    padding-top: 4px;
    font-size: 2rem;
    margin-right: 2%;
}
#variationPrice {
    width: 100%;
    min-height: 350px;
}
.informations-btn {
    width: 96%;
    background: none repeat scroll 0% 0% #D4D4D3;
    font-size: 1.7rem;
    margin: auto;
    text-align: center;
    margin-bottom: 0px;
    margin-top: 10px;
    cursor: pointer;
}
.ProductDetail.Btn,
.informations-btn {
    background: #BFD467;
    color: white;
}
.ProductDetail.Btn:hover,
.informations-btn:hover {
    background: #A9C756;
    color: white;
}
#boutonProduit {
    margin-left: 82%;
    font-size: 1.8rem;
    color: #636362;
    margin-bottom: 10px;
}
#boutonProduit span {
    margin-right: 15px;
    cursor: pointer;
}
.form-group.ClientProduit select {
    width: 80%;
    float: left;
}
.form-group.ClientProduit.top .fa.fa-plus {
    font-size: 1.7rem;
    background: #BFD467;
    padding: 1.5%;
    border-radius: 4px;
    color: #FFF;
    margin-left: 5%;
    cursor: pointer;
}
.form-group.ClientProduit label {
    width: 100%;
}
#lilMenu {
    display: none;
}
.S360CIRCLE {
    display: none;
}
#infoProdTOP {
    /* min-height: 202px;
*/
}
#list-product-detail.minimumHeight {
    min-height: 550px;
}

/*#list-product-detail tafble {
    margin-left: 50%;
}
*/
#list-product-detail #workflow .texte-circle {
    width: 308px;
}
.line-OptionProduct {
    border-bottom: 4px solid #F6F6F6;
    color: #636362;
}
.S360LOGOUTOFF {
    display: none;
}
#closeContact-Detail {
    display: none;
}

/*Prices PAGE*/
.infoPrizes {
    font-size: 1.5rem;
    color: #636362;
}
#descript-prod h3 {
    font-size: 24px;
    margin-top: 5px;
    /* clear: left;*/
}
.infoPrizes span {
    color: white;
    background: #A9C756;
    padding: 1px 5px 1px 19px;
}
#leftBlocPrices {
    width: 45%;
    float: left;
    clear: left;
}
#leftBlocPricesPage {
    width: 47%;
    float: left;
}
#AllVar {
    min-height: 295px;
    width: 100%;
    margin-top: 10px;
}
#clientInfoProduit #boutonProduit,
#clientInfo #boutonProduit {
    color: #636362;
    margin-top: 1%;
}
.linkProductListClientSupplier {
    display: none;
}
.linkProductListClientSupplier.active {
    display: block;
    background: none repeat scroll 0% 0% #c4c4c4;
    width: 95%;
    margin: 0px auto;
    color: #FFF;
    text-align: center;
    font-size: 1.8rem;
    cursor: pointer;
}
.linkProductListClientSupplier.active i {
    padding: 0.5%;
    color: #F6F6F6;
}
.linkProductListClientSupplier.active:hover {
    background: #636362;
}
.btnContact span {
    float: right;
    padding-top: 2%;
    padding-right: 2%;
    font-size: 1.5rem;
    cursor: pointer;
    color: #F3F3F3
}
#PriceInfo {
    padding: 1%;
}
#PriceInfo table {
    width: 100%;
    padding-bottom: 15px;
    background: none repeat scroll 0% 0% #D4D4D3;
    font-size: 1.5rem;
    color: #636362;
    /*text-align: center;*/
    
    margin-top: 16px;
}
#PriceInfo table th {
    padding: 1%;
    line-height: 20px;
    text-align: center;
}
#produitInfo,
.informations {
    transition: All 0.5s ease;
    -webkit-transition: All 0.5s ease;
    -moz-transition: All 0.5s ease;
    -o-transition: All 0.5s ease;
    -ms-transition: All 0.5s ease;
}
.informations {
    padding: 5px 25px;
}
#produitInfo.ng-hide,
.informations.ng-hide {
    display: none;
    transition: All 0s ease;
    -webkit-transition: All 0s ease;
    -moz-transition: All 0s ease;
    -o-transition: All 0s ease;
    -ms-transition: All 0s ease;
    transform: translate(1300px, 0);
    -webkit-transform: translate(1300px, 0);
    -moz-transform: translate(1300px, 0);
    -o-transform: translate(1300px, 0);
    -ms-transform: translate(1300px, 0);
}
.TitlePagePrice {
    margin: 0px;
    padding-left: 21px;
    background: none repeat scroll 0% 0% #C4C4C4;
    width: 100%;
    color: #FFF;
    padding: 0.5%;
    margin-bottom: 1%;
}
.content-List {
    padding-top: 15px;
}
.LimitTabList {
    height: 155px;
    overflow-y: scroll;
    width: 53%;
    margin-left: 47%;
}
.LimitTabList td,
.LimitTabList th {
    padding-left: 10px;
}
#descript-prod h4 {
    /* clear: left;*/
}
.alignTableLeft {
    text-align: left;
}
.alignTableRight {
    text-align: right;
    padding-right: 5%;
}
.alignTableRight.END {
    padding-right: 0;
}
.btn-info:hover,
.btn-info:active,
.btn-info.active {
    background-image: linear-gradient(to bottom, #636362 0px, #636362 100%);
    background-repeat: repeat-x;
    border-color: #636362;
    background-color: #636362;
    border-radius: 0;
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary:visited,
.btn-primary:link,
.btn-primary:focus,
.btn-success:hover,
.btn-success:active,
.btn-success:visited,
.btn-success:link,
.btn-success:focus,
.btn-success.active {
    background-image: linear-gradient(to bottom, #A9C756 0px, #A9C756 100%);
    background-repeat: repeat-x;
    border-color: #A9C756;
    background-color: #A9C756;
    border-radius: 0;
    border-radius: 0;
}
.btn-danger:hover,
.btn-danger:active,
.btn-danger:visited,
.btn-danger:link,
.btn-danger:focus,
.btn-danger.active {
    background-image: linear-gradient(to bottom, #D4D4D3 0px, #D4D4D3 100%);
    background-repeat: repeat-x;
    border-color: #D4D4D3;
    background-color: #D4D4D3;
    border-radius: 0;
}
.btn-info {
    border-radius: 0;
}

/*WORKFLOW DATES*/
.DatesTntWf {
    width: 100%;
    min-height: 110px;
    margin-bottom: 12px;
    clear: left;
    color: #636362;
}
.DatesTntWf .DatesTntWfContent {
    padding-left: 15px;
    padding-right: 15px;
    min-height: 90px;
}
.DatesTntWfLeft {
    float: left;
    margin-right: 15px;
}
.DatesTntWf i {
    font-size: 1.8rem;
    margin-right: 3px;
}
.DatesTntWfFollowing i {
    font-size: 1.4rem;
}
.DatesTntWfFollowing,
.DatesTntWfFollowing a {
    color: #A9C756;
    clear: left;
}
.DatesTntWfFollowing a:hover,
.DatesTntWfFollowing:hover {
    color: #BFD467;
}
.DatesTntWf h3 {
    padding: 5px;
    background: #f6f6f6;
}
#Btn-RestartWf {
    background: #A9C756;
    color: white;
    padding: 5px;
    border: none;
    margin-top: 10%;
}
#Wf-errorText {
    color: #DD525D;
    font-size: 1.7rem;
}
.MarkerWf {
    float: left;
    min-height: 40px;
    width: 4%;
    min-width: 10px;
}
.DatesTntWfAddress {
    width: 58%;
    float: left;
}
.DatesTntWfDates {
    width: 35%;
    margin-left: 62%;
}
#BacktoOrderList {
    padding-bottom: 10px;
}
#BacktoOrderList,
#BacktoOrderList a {
    color: #636362;
}
#BacktoOrderList i {
    margin-right: 5px;
    margin-top: 10px;
}
#Bon_commande {
    width: 100%;
    font-size: 4.5rem;
    padding: 0px;
    margin: 0px;
    padding-left: 85%;
    color: #636362;
}
#Bon_commande a {
    color: #636362;
}
#Bon_commande a:hover {
    color: #A9C756;
}
.cursor {
    cursor: pointer;
}
button.action {
    background: none repeat scroll 0 0 #303030;
    border: 0 none;
    color: #f3f3f3;
    cursor: pointer;
    height: 30px;
    padding: 0 10px;
    font-size: 10px;
    transition: all ease 1s;
}
button.action:hover,
button.action:focus {
    background-color: #505050;
    border: 0 none;
}
.spaces {
    margin-top: 20px;
    margin-bottom: 20px;
}
a.black {
    color: #444;
}
a.black:hover {
    text-decoration: underline;
}
.width-auto {
    width: auto !important;
}
.margin-left-right {
    margin: 0px 12px 0px 6px;
}
.mg-bt-40 {
    margin-bottom: 40px;
}
.margin-bottom-20 {
    margin-bottom: 20px;
}
.full-textarea {
    width: 100%;
    resize: none;
}
#calculator-results {
    width: 66%;
    margin-right: 2%;
    float: right;
}
#cart-details {
    width: 58%;
    margin-right: 2%;
    float: right;
}
.cursor {
    cursor: pointer;
}
.mg-tp-40 {
    margin-top: 40px;
}
.mg-tp-20 {
    margin-top: 20px;
}
button.no-rounded {
    border-radius: 0px;
}
.mg-bt-20 {
    margin-bottom: 20px;
}
.mg-left-20 {
    margin-left: 20px;
}
.empty-pdf-mathieu {
    width: 150px;
}
hr.both {
    border: none;
    width: 0px;
    clear: both;
}
.min-width-180 {
    min-width: 180px;
}
.foundCalculator {
    border: 2px solid #A9C756;
}
#div-calculator-results {
    overflow-x: scroll;
}
#div-calculator-results table {
    min-width: 1300px;
    margin-bottom: 0px;
}
#div-calculator-results table tbody tr.oldSelect {
    background-color: #92c7eb;
}
#div-calculator-results table tbody tr:first-child {
    background-color: #dde8b1;
}
a.black {
    color: #444444;
}
a.black:hover {
    text-decoration: underline;
}
div.text-area {
    background: #EEEEEE;
    border: 1px solid #CCCCCC;
    padding: 20px;
}
.div-overflow {
    width: 100%;
    max-height: 250px;
    overflow-y: scroll;
}
.calculator-modal .modal-dialog {
    width: 90%;
}
.calculator-modal .modal-footer {
    border: none;
}
.btn-wd-320 {
    text-align: left;
    width: 320px;
    margin-right: 10px;
}
.mr-10 {
    margin-right: 10px;
}
.table-order-supplier:hover {
    background-color: #636363 !important;
    color: #FFF;
}
.div-danger {
    background-color: #d9534f;
    color: #FFF;
    padding: 5px 10px;
}
sbpagination {
    margin-top: 10px;
    margin-bottom: 10px;
    width: 100%;
    float: left;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
sbpagination > div {
    display: inline-block;
    text-align: center;
    margin-right: 5px;
    margin-left: 5px;
    padding: 5px;
    cursor: pointer;
}
sbpagination > div.sbpage {
    background-color: #909090;
    color: white;
    border-radius: 2px;
}
sbpagination > div.sbpage.current {
    background-color: #636362;
}
sbpagination > div.sbnopage {
    cursor: auto;
}
