﻿*
{
    margin: 0;
    padding: 0;
}

html, body 
{
    height: 99%;
}

body {
    background-color: var(--bg65);
    font-size: .85em;
    font-family: nunito_regular, Arial;
    margin: 0;
    padding: 0;
    color: var(--color216);
}

.sticky {
    position: fixed;
    top: 0;
    width: 100%
}

.textMainColor {
    color: var(--color216)!important;
}


.loginlbl
{
    color: White;
    display: inline-block;
    font-weight: bold;
    text-align: left;
    width: 225px;
    }

.noresize
{
    resize : none;
}

.buttonLogout {
    display: inline;
    cursor: pointer;
    width: 30px;
}

.textLoginUser {
    padding-right: 1vw;
}

.logoLayout {
    width: 16vw;
}

#header, #content, #footer {
    width: 100%;
    float: left;
}

#content 
{
    color: White;
    min-height: 100%;
    display: table-cell;
    vertical-align: middle;
}

#footer {
   position:fixed;
   bottom:0;
   z-index:1;
   color: Black;
   font-size: medium;
}

#footer table 
{
   background-color: var(--footergreen);
    width: 100%;
}

#footer table tr td
{
    width: 50%;
}

#footer table tr td#left
{
    text-align: left;
}

#footer table tr td#right
{
    text-align: right;
}

.conteneur 
{
	text-align: center;
	color: white;
	vertical-align: top;
}
.validator {
    display: inline-block;
    color: var(--colorvalidation);
    font-family: nunito_bold;
}

.alertyellow {
    display: inline-block;
    color: var(--alertyellow);
    font-family: nunito_bold;
}

.successful {
    display: inline-block;
    color: var(--successgreen);
    font-family: nunito_bold;
}

.qtywarn {
    color: var(--warnorange);
    font-weight: bolder;
}

.jobcomment {
    color: var(--commentred);
    font-weight: bolder;
    font-size: 1.4em;
}

.jobmessageko {
    color: var(--colorvalidation);
    font-weight: bolder;
    font-size: 1.1em;
}

.jobmessageok {
    color: var(--successgreen);
    font-weight: bolder;
    font-size: 1.1em;
}

.bloc 
{
    display: inline-block;
}

table.table 
{
    margin: auto;
}

table.table tr td
{
    vertical-align: middle;
}

.login
{
    width: 200px;
    margin: 0 0 0 auto;
}

.logintable tr td
{
    vertical-align: middle;
    text-align: left;
    padding-bottom: 0px;
    padding-top: 0px;
}

.logintable tr
{
    margin-bottom : 2px;
    padding-bottom : 0px;
}
table tr#footer
{
   background-color: var(--footergreen);
   width: 100%;
   border: 1px solid white;
}

table tr#footer td
{
    border : 1px solid black;
}

.blockBC {
    display: inline-block;
    vertical-align: text-top;
}

.imageMenu {
    max-height: 40px;
    margin: 0px 10px 0px 10px;
/*    margin: 0px 20px 5px 20px;
*/}

.inlineFlex {
    display: inline-flex;
}

.flex {
    display: flex;
}

.fitcontents {
    width: fit-content;
}

.flexColumn {
    flex-direction: column;
}

.alignItemsCenter {
    align-items: center;
}

.contentEnd {
    margin-left: auto;
}

.contentUp {
    margin-bottom: auto;
}

.contentDown {
    margin-top: auto;
}

.pageTitre {
    display: inline-block;
    font-family: nunito_bold;
    width: 125px;
}

.pageTitreNoSize {
    display: inline-block;
    font-family: nunito_bold;
}

.pageTitre100 {
    width: 100px;
}

.pageTitre150 {
    width: 150px;
}

.pageTitre250 {
    width: 250px;
}

.pageTitreBig {
    width: 225px;
}

.pageTitre300 {
    width: 300px;
}

.pageContents {
    display: inline-block;
    width: 150px;
    margin-bottom: 5px;
}


.marginTop1 {
    margin-top: 1px;
}

.marginTop5 {
    margin-top: 5px;
}

.marginTop15 {
    margin-top: 15px;
}

.marginTop25 {
    margin-top: 25px;
}

.marginBot1 {
    margin-bottom: 1px;
}

.marginBot5 {
    margin-bottom: 5px;
}

.marginBot8 {
    margin-bottom: 8px;
}

.marginBot20 {
    margin-bottom: 20px;
}

.marginLeft5vw {
    margin-left: 5vw!important;
}

.marginleft5 {
    margin-left: 5px;
}

.marginleft15 {
    margin-left: 15px;
}

.marginleft30 {
    margin-left: 30px;
}

.marginLeft75 {
    margin-left: 75px;
}

.marginLeft100 {
    margin-left: 100px;
}

.marginLeft240 {
    margin-left: 240px;
}

.noMarginLeft {
    margin-left: unset!important;
}

.marginBot18 {
    margin-bottom: 18px;
}

.marginBottom1vw{
    margin-bottom:1vw;
}

.block300px {
    width: 300px;
}

.block400px {
    width: 400px;
}

.block600px {
    width: 600px;
}

.block800px {
    width: 800px;
}

.block50px {
    width: 50px;
}

.width70pct {
    width: 70%;
}

.width50pct {
    width: 50%;
}

.widthFillAvailable {
    width: -webkit-fill-available;
    width: -moz-available;
}

.heightFillAvailable {
    height: -webkit-fill-available;
    height: -moz-available;
}

.padding2 {
    padding: 2px;
}

.padding5 {
    padding: 5px;
}

.padding10 {
    padding: 10px;
}

.paddingTop3 {
    padding-top: 3px;
}

.paddingTop10 {
    padding-top: 10px;
}

.paddingTop15 {
    padding-top: 15px;
}

.paddingTop45 {
    padding-top: 45px;
}

.paddingBot20 {
    padding-bottom:20px;
}

.paddingBot51 {
    padding-bottom: 51px;
}

.paddingbot5 {
    padding-bottom: 5px;
}

.paddingBot8 {
    padding-bottom: 8px;
}

#FTAnamRbl label {
    padding-left: 5px;
}

.paddingLeftNone {
    padding-left: 0px !important;
}

.paddingLeft3imp{
    padding-left:3px!important;
}

.paddingLeft10 {
    padding-left: 10px;
}

.paddingLeft15 {
    padding-left: 15px;
}

.paddingLeft20 {
    padding-left: 20px;
}

.paddingLeft55 {
    padding-left: 55px;
}

.paddingLeft175 {
    padding-left: 175px;
}

.paddingRight5{
    padding-right:5px;
}

.paddingRight15 {
    padding-right: 15px;
}

.paddingRight30 {
    padding-right: 30px;
}


.blockRightFix {
    margin-left: 100px;
}

@media screen and (min-width:1350px) {
    .blockRight {
        margin-left: 100px;
    }
}

@media screen and (min-width:1450px) {
    .blockBLRight {
        margin-left: 70px;
    }
}

.tabDevis {
    background-color: var(--bg85);
}
    .tabDevis td {
        border: 3px solid var(--bg65);
        border-left: none;
        border-right: none;
    }
.pop-up {
    display: flex;
    align-items: center;
    flex-direction: column;
}

.titrePopup {
    color: var(--titlegreen);
    font-family: nunito_regular, Arial;
    font-weight: 400;
    vertical-align: -webkit-baseline-middle;
}

@media screen and (min-width:492px) {
    .headerPopup {
        text-align: right;
        padding-bottom: 20px;
    }
}

.textOrange {
    color: var(--titlegreen);
}


.tablepopup {
    border: none;
}

.alignRight {
    text-align: right;
}

.alignLeft {
    text-align: left !important;
}

.verticalAlignTop {
    vertical-align: top;
}

.verticalAlignMid {
    vertical-align: middle;
}

.noPaddingLeft {
    padding-left:unset!important;
}

.alignCenter {
    text-align-last: center;
}

.alignCenterWebkit {
    text-align: -webkit-center;
    text-align: -moz-center;
}

.marginRight2vw {
    margin-right: 2vw;
}

.marginRight {
    margin-right: 25px;
}

.marginRight2 {
    margin-right: 2px;
}

.marginRight5 {
    margin-right: 5px;
}

.marginRight15 {
    margin-right: 15px;
}

.marginRight30 {
    margin-right: 30px;
}

.marginRight250 {
    margin-right: 250px;
}

.textValidationpopup {
    text-align: end;
}

.textTabpopup {
    width: 200px;
    display: inline-block;
    margin-bottom: 5px;
}


.inlineTabLeft {
    display: inline-block;
    vertical-align: top;
}

@media screen and (min-width: 665px) {
    .inlineTabRight {
        display: inline-block;
        margin-left: 20px;
    }
}

.inlineCheckBox {
    display: inline-block;
    margin-left: 45px;
}

.pictoWarning {
    width: 30px;
    vertical-align: text-bottom;
}

.logoButton {
    width: 30px;
    vertical-align: middle;
    border:none;
}

.logoMedium {
    width: 25px;
}

.logoSmall{
    width: 20px;
}

.logoLarge {
    width: 40px;
}


.logoBig {
    width: 50px;
}

.labelSmall {
    background-color: var(--bg65);
}

.buttonSmall {
    cursor: pointer;
    border: none;
    background-color: var(--bg65);
    color: var(--color255);
    font-size: 0.8em;
    padding: 0 !important;
}
    .buttonSmall:hover {
        color: var(--color197);
    }

.textHyperLink {
    color: var(--tsblue) !important;
}

.textBox {
    resize: none;
    color: var(--bg65);
}

.marginImageLink {
    margin-bottom: 8px;
}
/*
Checkboxes*/
/* Hide the browser's default checkbox */
input[type="checkbox"] {
    display: contents;
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

    input[type="checkbox"] + label::after {
        content: '';
        border: 2px solid var(--color216);
        padding: 0 0.6rem;
        margin-right: 0.3rem;
    }

    input[type="checkbox"]:checked + label::after {
        background-color: var(--titlegreen);
    }



a:link {

    color: var(--titlegreen);
    text-decoration: none;
}

a:visited {
    color : var(--bg69);
/*    color: #505abc;*/
}

a:hover {
    color : var(--colorCC)!important;
/*    color: #1d60ff;*/
    text-decoration: none;
}

a:active 
{
    color : var(--colorCC);
/*    color: #12eb87;*/
}

p, ul {
    margin-bottom: 20px;
    line-height: 1.6em;
}

header,
footer,
section {
    display: block;
}

/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
    font-size: 15px;
    color: var(--titlegreen);
    font-family: nunito_regular, Arial;
    font-weight: 400;
}

h1 {
    font-size: 1.5em;
    padding-bottom: 0;
    margin-bottom: 0;
}

h2 {
    padding: 0 0 10px 2px;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5, h6 {
    font-size: 1em;
}

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

/* you can specify a greater or lesser percentage for the 
page width. Or, you can specify an exact pixel width. */

.page {
    width: 98%;
    margin-left: auto;
    margin-right: auto;
}

header, .header {
    position: relative;
    margin-bottom: 0px;
    color: #000;
    padding: 0;
}

header h1, .header h1 {
    font-weight: bold;
    padding: 5px 0;
    margin: 0;
    color: #fff;
    border: none;
    line-height: 2em;
    font-size: 32px !important;
    text-shadow: 1px 1px 2px #111;
}

.main 
{
   /*Possibilité de changer la div principale ici*/
}


footer, 
.footer {
    color: #999;
    padding: 10px 0;
    text-align: center;
    line-height: normal;
    margin: 0 0 30px 0;
    font-size: .9em;
    -webkit-border-radius: 0 0 8px 8px;
    -moz-border-radius: 0 0 8px 8px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    clear:both;
}

/* Upload page 
----------------------------------------------------------*/
table.snrtable td input[type="text"] {
    width: 50px;
}

table.snrtable td.snrname
{
    text-align: left;
}

table.snrtable td.snrtitle
{
    text-align: left;
}

#snruploadtable
{
    color : White;
}

.filesgvupload th
{
    background-color:var(--color3b);
}

table tr td span.rfoot
{
    -moz-transform:rotate(-180deg);
    -webkit-transform:rotate(-180deg);
    -o-transform:rotate(-180deg);
    -ms-transform : rotate(-180deg);
    display : inline-block;
}

span.rleft
{
    -moz-transform:rotate(-90deg);
    -webkit-transform:rotate(-90deg);
    -o-transform:rotate(-90deg);
    -ms-transform : rotate(-90deg);
    display : inline-block;
}

span.rright
{
    -moz-transform:rotate(90deg);
    -webkit-transform:rotate(90deg);
    -o-transform:rotate(90deg);
    -ms-transform : rotate(90deg);
    display : inline-block;
}

.menu
{
    margin-left: 0px;
}

div.menu ul {
    position: relative;
    margin: 0;
    text-align: right;
}

div.menu ul li:first-child 
{
/*    width : 150px;*/
    text-align : center;
}

div.menu ul li {
    display: inline;
    list-style: none;
    margin-left: 1px;
}

    div.menu ul li a {
        padding: 10px 20px;
        font-weight: bold;
        text-decoration: none;
        display: block;
        line-height: 1.35em;
        background-color: var(--bg85);
        margin-bottom: 5px;
        color: var(--color172);
    }

        div.menu ul li a.highlighted {
            background-color: var(--bg80);
            /*    background-color: #f2f4ff;*/
            text-decoration: none;
        }

        div.menu ul li a.selected {
            text-decoration: none;
            border-bottom-color: #fff;
            color: var(--navmenucolor);
        }

    div.menu ul li ul {
        margin-top: -5px;
        z-index: 2;
    }

        div.menu ul li ul li {
            text-align: center;
        }

            div.menu ul li ul li a {
                border: 1px solid var(--color172);
                margin-bottom: 0px;
            }

.submenu {
    margin-left: 0px;
}

div.submenu ul {
    position: relative;
    margin: 0;
    text-align: right;
}

    div.submenu ul li:first-child {
/*        width: 150px;*/
        text-align: center;
    }

    div.submenu ul li {
        display: inline;
        list-style: none;
        margin-left: 1px;
    }

        div.submenu ul li a {
            padding: 10px 20px;
            font-weight: bold;
            text-decoration: none;
            display: block;
            line-height: 1.35em;
            background-color: var(--color125);
            margin-bottom: 5px;
            color: var(--color201);
        }

            div.submenu ul li a.highlighted {
                background-color: var(--color105);
                /*    background-color: #f2f4ff;*/
                text-decoration: none;
            }

            div.submenu ul li a.selected {
                text-decoration: none;
                border-bottom-color: #fff;
                /*  color: rgba(253, 195, 71, 1); orange*/
                color: var(--navmenucolor);
            }

/* Home left menu
----------------------------------------------------------*/

.homebtn {
    margin-bottom: 15px;
}

.homeserviceimg {
    margin-bottom: 15px;
    display:block;
    max-width:400px;
}

.homeserviceimg {
    margin-bottom: 15px;
    display: block;
    max-width: 400px;
}

.homelogos
{
    margin-bottom : 0px;
    max-height: 120px;
    max-width: 200px;
    margin-right: 15px;
}

.homemain 
{
    padding: 0px 0px 0px 0px;
    background-color: #fff;
    margin-bottom : 15px;
    min-width : 1150px;

    border-radius: 0px 12px 12px 12px;
    -webkit-border-radius: 0px 12px 0px 0px;
    -moz-border-radius: 0px 12px 0px 0px;
}

.homemaincontent 
{
    background-color : var(--color3b);
    color : White;
    font-style : italic;
    width : 100%;
    height : 85%;
    max-height : 950px;
    margin : 0px 15px 15px 15px;
    padding : 25px 20px 25px 20px;
    overflow-y : auto;

    border-radius: 12px 12px 12px 12px;
    -webkit-border-radius: 12px 12px 12px 12px;
    -moz-border-radius: 12px 12px 12px 12px;
}

.HomeClientWrapper {
    min-height: 770px;
    min-width: 975px;
    max-width: 100%;
}

.homenews {
    background-color: var(--color3b);
    color: var(--homegreen);
    font-style: italic;
    width: 100%;
    height: 700px;
    margin: 15px 15px 15px 15px;
    padding: 2px 20px 30px 20px;
}

.homenewsnested 
{
    background-color : #FFF;
    color : var(--color3b);
    height : 96%;
    margin-top : 2px;
    padding : 10px 0px 0px 10px;
    overflow : auto;
}

.HomeBanners {
    margin-left: 70px;
    padding-top: 30px;
}

.spanwhite 
{
    color : #FFFFFF;
    font-style : italic;
    font-family : Arial;
    font-size : 1.1em;
}

.spangray 
{
    color : var(--color3b);
    font-style : italic;
    font-family : Arial;
    font-size : 1.1em;
}

.homeleftmenu 
{
    float:left;
    text-align:center;
    height: 90%;
    min-height: 900px;
    width: 150px;
    padding-top: 25px;
 /*    border-right: 1px solid black;*/
/*    background-color : var(--footergreen);*/
    background-color: var(--footergreen);

    border-radius: 0px 0px 12px 12px;
    -webkit-border-radius: 0px 0px 12px 12px;
    -moz-border-radius: 0px 0px 12px 12px;

 }

.homeleftmenu div
{
    vertical-align:middle;
    font-family : Arial;
}

.homeleftmenu div h3
{
    vertical-align:middle;
    margin-bottom : 10px;
}

.homeleftmenu ul 
{
    position: relative;
    text-align: center;
}

.homeleftmenu ul li
{
    margin-top: 0px;
    list-style: none;
}

.homeleftmenu ul li a
{
    padding: 5px 5px 5px 5px;
    font-weight: bold;
    text-decoration: none;
    display: block;
    line-height: 1.35em;
/*    background-color: #e8eef4;
    color: #034af3;*/
    background-color: var(--footergreen);
    color: var(--color3b);
/*    color: #646567;*/
    font-style : italic;
    
    border-radius: 4px 0 4px 0;
    -webkit-border-radius: 4px 0 4px 0;
    -moz-border-radius: 4px 0 4px 0;
}

.homeleftmenu ul li a:hover {
/*background-color : #4FCF00;*/
color : White;
/*    background-color: #f2f4ff;*/
    text-decoration: none;
}

.homeleftmenu ul li a.selected {

    color : White;
}



/* Job left menu
----------------------------------------------------------*/

.jobleftmenu 
{
    float:left;
    text-align:center;
    height: 90%;
    min-height: 750px;
    width: 10%;
    border:none;
 }

.jobleftmenu div
{
    vertical-align:middle;
}

.jobleftmenu ul 
{
    position: relative;
    text-align: center;
}

.jobleftmenu ul li
{
    margin-top: 30px;
    list-style: none;
}

    .jobleftmenu ul li a {
        padding: 10px 20px;
        font-weight: bold;
        text-decoration: none;
        display: block;
        line-height: 1.35em;
        background-color: var(--bg85);
        margin-bottom: 5px;
        color: var(--color172);
    }

        .jobleftmenu ul li a:hover {
            background-color: var(--bg80);
            /*    background-color: #f2f4ff;*/
            text-decoration: none;
        }

        .jobleftmenu ul li a.selected {
            text-decoration: none;
            border-bottom-color: #fff;
            color: var(--titlegreen);
        }

/* finalcurve table   
----------------------------------------------------------*/

table.finalcurve
{
    text-align : justify;
}

table.finalcurve th
{
    color : White;
    background-color : transparent;
    padding : 0px;
    padding-right : 5px;
    margin : 0px;
}

table.finalcurve td
{
    color : Black;
    background-color : White;
    padding : 0px;
    padding-right : 1px;
    margin : 0px;
}

table.finalcurve td input
{
    width : 120px;
}


/*p.h1 {
    background: linear-gradient(#555555, #2C2C2C) repeat scroll 0 0 transparent;
    border-radius: 8px 8px 8px 8px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5), 0 -1px 0 rgba(255, 255, 255, 0.4);
    color: #000000;
    font-family: Arial,sans-serif;
    font-size: 1.8em;
    height: 43px;
    margin: 100px auto;
    padding-top: 7px;
    text-align: center;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
    width: 200px;
}

p.h1:hover {
    background: -moz-linear-gradient(center top , #777777, #333333) repeat scroll 0 0 transparent;
    color: #222222;
    cursor: pointer;
}

p.h1:active {
    background: linear-gradient(#555555, #2C2C2C) repeat scroll 0 0 transparent;
    box-shadow: 1px 1px 10px black inset, 0 1px 0 rgba(255, 255, 255, 0.4);
    color: #000000;
}
*/

table.finalcurve td select
{
    font-size : smaller;
}

table.finalcurve tr
{
border-color : White;
}

a.fcdefaut
{
    color:White;
}

a.fcselected
{
    color:var(--footergreen);
}

/* final color   
----------------------------------------------------------*/

table.finalcolor
{
    text-align : right;
    border : 2px solid gray;
    padding : 5px;
}

table.finalcolor th
{
    background-color : transparent;
    padding : 0px;
    padding-right : 5px;
    margin : 0px;
}

table.finalcolor td
{
    padding : 0px;
    padding-right : 1px;
    margin : 0px;
}

table.finalcolor td input[type="text"]
{
    width : 70px;
}

table#fccyan td input[type="text"]
{
    color : Cyan;
    font-weight : bold;
}

table#fcmagenta td input[type="text"]
{
    color : Magenta;
    font-weight : bold;
}

table#fcyellow td input[type="text"]
{
    color : #BBBB00;
    font-weight : bold;
}

table#fcblack td input[type="text"]
{
    color : Black;
    font-weight : bold;
}

table.finalcolor td input.result
{
    width : 80px;
    border-style : outset;
    background-color : transparent;
}

table.finalcolor tr
{
border-color : White;
}

.finalcurvebtn
{
/*    border-radius: 12px 12px 12px 12px;
    -webkit-border-radius: 12px 12px 12px 12px;
    -moz-border-radius: 12px 12px 12px 12px;*/
    background-color : transparent;
    color : White;
    cursor:pointer;
}


/* formtest
----------------------------------------------------------*/

.formtest
{
    float: left;
    height: 100%;
    width: 300px;
    background-color: White;
    margin: 0 25px 0 0;
    border-radius: 12px 12px 12px 12px;
    -webkit-border-radius: 12px 12px 12px 12px;
    -moz-border-radius: 12px 12px 12px 12px;
}

.previewformtest
{
    height: 85%;
    background-color : White;
    border-radius: 12px 12px 12px 12px;
    -webkit-border-radius: 12px 12px 12px 12px;
    -moz-border-radius: 12px 12px 12px 12px;
}

.previewformtest table a
{
    padding: 5px 5px 5px 5px;
    font-weight: bold;
    text-decoration: none;
    display: block;
    line-height: 1.35em;
/*    background-color: #e8eef4;
    color: #034af3;*/
    color: black;
/*    color: #646567;*/
}

.previewformtest table a:hover {
    color : var(--color3b);
    text-decoration: none;
}

.previewformtest table a.selected {
/*    background-color: #fff;
    text-decoration: none;
    border: 1px solid var(--footergreen);*/
    text-decoration: underline;
    color : blue;
}

.formtest ul 
{
    text-align: left;
}

.formtest ul li
{
    margin-top: 0px;
    list-style: none;
}

.formtest ul li a
{
    padding: 5px 5px 5px 5px;
    font-weight: bold;
    text-decoration: none;
    display: block;
    line-height: 1.35em;
/*    background-color: #e8eef4;
    color: #034af3;*/
    color: black;
/*    color: #646567;*/
}

.formtest ul li a:hover {
    color : var(--color3b);
    text-decoration: none;
}

.formtest ul li a.selected {
/*    background-color: #fff;
    text-decoration: none;
    border: 1px solid var(--footergreen);*/
    text-decoration: underline;
    color : blue;
}


/* BAG form
----------------------------------------------------------*/

.bag 
{
    border-radius: 12px 12px 12px 12px;
    -webkit-border-radius: 12px 12px 12px 12px;
    -moz-border-radius: 12px 12px 12px 12px;
    border: 2px solid black;
    margin: 5px 4px 5px 4px;
    padding: 6px 6px 6px 6px;
}

tr.inkstr td input[type="text"]
{
    width: 165px;
}

div.bag table tr#inkstr td
{
    width: 5px;
}

/* horizontal drop down lists   
----------------------------------------------------------*/

ul.hddl 
{
    list-style-type: none;
}

ul.hddl li 
{
    display: inline;
    margin-left: 2px;
}
/* FORM LAYOUT ELEMENTS   
----------------------------------------------------------*/


fieldset {
    border: none;
}

.align

/*
legend {
    font-size: 1.2em;
    font-weight: bold;
}
*/

textarea {
    min-height: 75px;
}

input[type="text"],
input[type="password"],
input[type="number"] {
    border: 1px solid #ccc;
    padding: 2px;
    font-size: 12px;
    color: #444;
}

.textTab input[type="text"] {
    width:100px;
}

select {
    background-color: rgba(119, 119, 119, 1);
    color: var(--color255);
    width: 150px;
    text-align-last: left;
    border: none;
    padding-left: 2px;
}

select option:disabled {
    color: var(--color216);
}

input[type="submit"] {
    padding: 5px;
    min-width: 30px;
}

/* TABLE
----------------------------------------------------------*/

table {
}

    table td {
        padding: 5px;
        border:none;
    }

    table th {
        padding: 6px 5px;
        background-color: var(--bg85);
        border: none;
        color: var(--tabletitlecolor) !important;
        text-align: left;
    }

    table th a {
        color: var(--tabletitlecolor) !important;
    }

.tramagetable .lefttable
{
    width: 35%;
}

.tramagetable td 
{
    vertical-align: top;
}

.tramagetable td input[type="text"] 
{
    width: 75px;
}

.tramagevalidatebtntbl td
{
    padding : 0;
    font-size : small;
}

.tramagevalidatetbl td
{
    padding : 5px 0 4px 0;
    font-size : small;
}

.tramagevalidatetbl input[type="text"]
{
    width : 55px;
    font-size : small;
}

.tramagevalidatetbl select
{
    font-size : small;
}


input[type="submit"].approbtn
{
    height: 18px;
    padding: 0 0 0px 0;
}

input[type="submit"].actionbtn
{
    margin-top: 5px;
    padding: 1px 1px 1px 1px;
}

.tablePadding0 td {
    padding: 0px !important;
}

/* Tables BDC DL et FA  
----------------------------------------------------------*/

.BEtable {
    display:contents;
}
.BEtitle {
    font-family: nunito_bold;
    display:inline-block;
}

.inline {
    display: inline-block;
}

.BEDevis {
    margin-top: 20px;
}

.BEButtonPadding {
    padding-bottom: 3px;
}

/*.FAHeader th {
    background-color: var(--footergreen);
    margin-right: 5px;
    font-weight: normal;
    color: Black;
    text-align: center;
    border-left: 3px solid white;
    border-right: 3px solid white;
    border-top: 3px solid white;
    border-bottom: 3px solid DarkGray;
    border-radius: 12px 12px 0 0;
}*/
.textTabDevisDetailView {
    display: block;
}
/* TABLE
----------------------------------------------------------*/
/*.boardtbl
{
    -webkit-border-radius: 8px 8px 8px 8px;
    -moz-border-radius: 8px 8px 8px 8px;
}*/
table.boardtbl tr td {
    color: White;
    background-color: var(--bg9f);
    border: 3px solid white;
}

td.boardtbl_topleft
{
    border-radius: 16px 0 0 0;
    -webkit-border-radius: 16px 0 0 0;
    -moz-border-radius: 16px 0 0 0 ;
}

td.boardtbl_topright
{
    border-radius: 0 16px 0 0;
    -webkit-border-radius: 0 16px 0 0;
    -moz-border-radius: 0 16px 0 0 ;
}

td.boardtbl_botleft
{
    border-radius: 0 0 0 16px;
    -webkit-border-radius: 0 0 0 16px;
    -moz-border-radius: 0 0 0 16px;
}

td.boardtbl_botright
{
    border-radius: 0 0 16px 0;
    -webkit-border-radius: 0 0 16px 0;
    -moz-border-radius: 0 0 16px 0;
}

/* MISC  
----------------------------------------------------------*/
.clear 
{
    clear: both;
}

.error {
    color: var(--colorvalidation);
}

.menucontainer {
    margin-top: 40px;
}


.title
{
    display: block;
    float: left;
    text-align: left;
    width: auto;
    margin-left: 6px;
}

div.title {
    display: block;
    text-align: left;
}

.ChooseLangMasterDdl {
    float: right;
    font-weight: bold;
    text-align: right;
    color: var(--titlegreen);
    margin-left: 10px;
    margin-top: 4px;
}

.ChooseLangMasterDdl div {
/*    width: 50px;
*/}

.ChooseLangDdl {
    font-weight: bold;
    text-align: right;
    margin: 10px;
    color: var(--titlegreen);
    padding-top: 2vw;
}

.ChooseLangDdl div {
/*    width: 50px;
*/}

.loginDisplay {
    font-weight: bold;
    text-align: right;
    margin: 10px;
    color: var(--titlegreen);
    padding-top: 2vw;
}

.logindisplay a:link {
    color: white;
    text-decoration: underline;
}

.logindisplay a:visited {
    color: white;
    text-decoration: underline;
}

.logindisplay a:hover {
    color: white;
    text-decoration: none;
}

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: var(--colorvalidation);
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid var(--colorvalidation);
    background-color: var(--bgvalidation);
}

.validation-summary-errors {
    font-weight: bold;
    color: var(--colorvalidation);
}

.validation-summary-valid {
    display: none;
}

/* Styles for editor and display helpers
----------------------------------------------------------*/

.display-label, 
.editor-label {
    margin: 1em 0 0 0;
}

.display-field, 
.editor-field {
    margin: 0.5em 0 0 0;
}

.text-box {
    width: 30em;
}

.text-box.multi-line {
    height: 6.5em;
}

.tri-state {
    width: 6em;
}

/* Styles for editor and display helpers
----------------------------------------------------------*/

.cleantable tr td
{
    vertical-align: top;
}

/* radio button with images
----------------------------------------------------------*/

.radimage > input{ /* HIDE ORG RADIO & CHECKBOX */
  visibility: hidden;
  position: absolute;
}

.cbimage > input{ /* HIDE ORG RADIO & CHECKBOX */
  visibility: hidden;
  position: absolute;
  color: White;
  font-weight: bold;
}

.cbimage > span > input{ /* HIDE ORG RADIO & CHECKBOX */
  visibility: hidden;
  position: absolute;
  color: White;
  font-weight: bold;
}

/* all image inside label with class cbimage */
label.cbimage > img { /* IMAGE STYLES */
    cursor: pointer;
    border: 2px solid var(--color3b);
}

/* all image adjacent to an input that is child of label with class cbimage with attribute enabled */
label.cbimage:enabled > input + img { /* IMAGE STYLES */
    cursor: pointer;
    border: 2px solid var(--color3b);
}

label.cbimage > input:checked + img { /* (RADIO CHECKED) IMAGE STYLES */
    border: 3px solid var(--homegreen);
}

/* Cb image variant
----------------------------------------------------------*/

.cbimagev2 > input { /* HIDE ORG RADIO & CHECKBOX */
    visibility: hidden;
    position: absolute;
    color: White;
    font-weight: bold;
}

.cbimagev2 > span > input { /* HIDE ORG RADIO & CHECKBOX */
    visibility: hidden;
    position: absolute;
    color: White;
    font-weight: bold;
}

/* all image inside label with class cbimage */
label.cbimagev2 > img { /* IMAGE STYLES */
    cursor: pointer;
    border: none;
    padding: 8px;
}

/* all image adjacent to an input that is child of label with class cbimage with attribute enabled */
label.cbimagev2:enabled > input + img { /* IMAGE STYLES */
    cursor: pointer;
    border: none;
    padding: 8px;
}

label.cbimagev2 > input:checked + img { /* (RADIO CHECKED) IMAGE STYLES */
    padding: 5px;
    border: 3px solid var(--homegreen);
    border-radius: 12px 12px 12px 12px;
    -webkit-border-radius: 12px 12px 12px 12px;
    -moz-border-radius: 12px 12px 12px 12px;
}

/* Cb image variant
----------------------------------------------------------*/

.cbimageNoBorder > input { /* HIDE ORG RADIO & CHECKBOX */
    visibility: hidden;
    position: absolute;
    color: White;
    font-weight: bold;
}

.cbimageNoBorder > span > input { /* HIDE ORG RADIO & CHECKBOX */
    visibility: hidden;
    position: absolute;
    color: White;
    font-weight: bold;
}

/* all image inside label with class cbimage */
label.cbimageNoBorder > img { /* IMAGE STYLES */
    cursor: pointer;
    border: none;
    padding: 2px;
}

/* all image adjacent to an input that is child of label with class cbimage with attribute enabled */
label.cbimageNoBorder:enabled > input + img { /* IMAGE STYLES */
    cursor: pointer;
    border: none;
    padding: 2px;
}

label.cbimageNoBorder > input:checked + img { /* (RADIO CHECKED) IMAGE STYLES */
    cursor: pointer;
    padding: 2px;
    border: none;
}


/* mouse hover pop up in job list
----------------------------------------------------------*/

/*span.thumbpopup {border-bottom: thin dotted; background: #ffeedd;}
span.thumbpopup:hover {text-decoration: none; background: #ffffff; z-index: 6; }
span.thumbpopup span {position: absolute; left: -9999px;
  margin: 20px 0 0 0px; padding: 3px 3px 3px 3px;
  border-style:solid; border-color:black; border-width:1px; z-index: 6;}*/
span.thumbpopup span {
    position: absolute;
    left: -9999px;
    top: 10%;
    margin: 4px 0 0 0px;
    padding: 3px 3px 3px 3px;
    border-style: solid;
    border-color: black;
    border-width: 1px;
}

span.thumbpopup:hover span {
    left: 7%;
    background: #ffffff;
    margin: 20px 0 0 170px;
    z-index: 6;
}

span.left0:hover span {
    left: 0% !important;
    margin: 20px 0 0 450px !important;
}

/* admin adresse livraison
----------------------------------------------------------*/


.addlivgv tr td input[type="text"]
{
    width : 140px;
}

/*Job List specificities*/

.borderRadius12 {
    border-radius: 12px 12px 12px 12px;
    -webkit-border-radius: 12px 12px 12px 12px;
    -moz-border-radius: 12px 12px 12px 12px;
}

.borderSeparator {
    border: 1px solid var(--color216);
}

.buttonCustom {
    cursor: pointer;
    border: none;
    background-color: var(--bg85);
    color: var(--color251);
    font-size: 0.95em;
    padding: 0 !important;
}

    .buttonCustom:hover {
        color: var(--color172);
    }

.textTab {
    color: var(--bg65) !important;
}

.textTabLink {
    color: var(--bg65) !important;
    text-decoration: underline !important;
}

    .textTabLink :hover {
        text-decoration: underline !important;
    }

.sizeChamps {
    display: inline-block;
    width: 70px;
}


.labelBL {
    background-color: var(--bg85);
    padding: 7px;
    cursor:pointer;
}

.buttonValidProd {
    background-color: var(--validprodgreen);
    color: var(--bg65);
}

.labelValidProd {
    background-color: var(--validprodgreen);
    padding: 7px;
    cursor:pointer;
}

.buttonAP {
    background-color: var(--apblue);
    color: var(--bg65);
}

.labelAP {
    background-color: var(--apblue);
    padding: 7px;
}

.buttonValidateDelivery {
    background-color: var(--deliveryblue);
    color: var(--bg65);
}

.labelMargin {
    margin-left: 7px;
}

.bold {
    font-weight: bold;
}

.textShow {
    font-weight: bold;
    padding-bottom: 10px;
    padding-right: 15px;
}

.listJobTab {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
}

.tableDashboard {
    display:contents;
}

    .tableDashboard tr {
        background-color: var(--bg85);
    }

.tabIntern {
    border:none;
}

.tabIntern td {
    border-bottom: none !important;
}

.tabUploadJob th {
    text-align: center;
}

.redimJobList {
    width: 100px;
}

.redimCheckBox {
    width:30px;
}

.listCheckBox {
    display: flex;
}

.tabBorder {
    border: hidden;
}
.tabBorder td {
    height: 20px;
    border: solid 1px black;
    border-right: none;
    border-left: none;
    border-top: none;
}

.stickyHeader {
    position: sticky !important;
    top: 0 !important;
    z-index: 1;
}

.stickyHeaderMiddle {
    position: sticky !important;
    top: 51vh !important;
    z-index: 1;
}

.stickyFooter {
    position: sticky !important;
    bottom: -1px !important;
    background-color: var(--bg85);
    z-index: 1;
}

.tabUnset td {
    height: unset !important;
}

.tabWidthFix {
    width:200px;
}

.tabTramageValidate tr {
    border-right: solid 1px black;
}



.tabTramage tr {
    border-right: solid 1px black;
}

.tabTramage td {
    height: 20px;
    border: solid 1px black;
    border-right: none;
    border-left: none;
    border-top: none;
}


.tabUserList {
    border: none;
}

    .tabUserList td {
        height: 40px;
        border: solid 1px black;
        border-right: none;
        border-left: none;
        border-top: none;
        text-align: -webkit-center;
        text-align: -moz-center;
    }
}
.padding1 {
    padding-left: 1px!important;
}

.padding100 {
    padding-left: 100px !important;
}

.labelFlex {
    display: flex;
    width: unset !important;
}

.checkmarkUnabsolute {
    position: unset !important;
}

.labelEnabledFalse {
    padding-left: 15px;
    width: 150px;
    pointer-events: none;
}

    .labelEnabledFalse input:checked ~ .checkmark {
        background-color: var(--checkboxbackground);
    }


.labelListCheckBox {
    position: relative;
    padding-left: 15px;
    display: flex;
    width: 170px;
}

    .labelListCheckBox:hover input ~ .checkmark {
        background-color: var(--bg80);
    }


    .labelListCheckBox input:checked ~ .checkmark {
        background-color: var(--checkboxbackground);
    }


    .labelListCheckBox:hover .aspNetDisabled input ~ .checkmark {
        background-color: var(--bg80);
    }


    .labelListCheckBox ~ span input:checked ~ .checkmark {
        background-color: var(--checkboxbackground);
    }


/* Style the checkmark/indicator */
    .labelListCheckBox .checkmark:after {
        left: 9px;
        top: 5px;
        width: 5px;
        height: 10px;
        border: solid white;
        border-width: 0 3px 3px 0;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }

/*    Specialize for tab*/

.labelEnabledFalseTab {
    padding-left: 15px;
    width: 150px;
    pointer-events: none;
    cursor: not-allowed;
}



    .labelEnabledFalseTab input:checked ~ .checkmarkTab {
        background-color: var(--checkboxbackground);
    }

.noborder {
    border: none;
}

.widthUnset {
    width: unset!important;
}

.width25 {
    width: 25px;
}

.width30 {
    width: 30px;
}

.width40 {
    width: 40px;
}

.width60 {
    width: 60px;
}

.width400 {
    width: 400px;
}

.width20 {
    width: 20px;
}

.width23 {
    width: 23px;
}

.width50 {
    width: 50px;
}

.width650 {
    width: 650px;
}

.width700 {
    width: 700px;
}

.width780 {
    width: 780px;
}

.width710 {
    width: 710px;
}

.width75 {
    width: 75px;
}

.width89 {
    width: 89px;
}

.width95 {
    width: 95px;
}

.width100 {
    width: 100px;
}

.width105 {
    width: 105px;
}

.width120 {
    width: 120px;
}

.width130 {
    width: 130px;
}

.width140 {
    width: 140px;
}

.width150 {
    width: 150px;
}

.width175 {
    width: 175px;
}

.width200 {
    width: 200px;
}

.width210 {
    width: 210px;
}

.width216 {
    width: 216px;
}

.width220 {
    width: 220px;
}

.width250 {
    width: 250px;
}

.width300 {
    width: 300px;
}

.width350 {
    width: 350px;
}

.width900 {
    width: 900px;
}

.width1000 {
    width: 1000px;
}

.width1-5vw{
    width:1.5vw;
}

.width7vw{
    width:7vw;
}

.widthFitContent {
    width: fit-content;
}

.widthMinContent {
    width: min-content;
}

.maxWidth900 {
    max-width: 900px;
}

.maxWidth1040 {
    max-width: 1040px;
}

.maxWidth1200 {
    max-width: 1200px;
}

.maxWidth890 {
    max-width: 890px;
}

.maxWidth710 {
    max-width: 710px;
}

.maxWidth700 {
    max-width: 700px;
}

.maxWidth300 {
    max-width: 300px;
}

.maxWidth350 {
    max-width: 350px;
}

.maxWidth140 {
    max-width: 140px;
}

.maxWidth150 {
    max-width: 150px;
}

.maxWidth130 {
    max-width: 130px;
}

.maxHeight25 {
    max-height: 25px;
}

.maxHeight30 {
    max-height: 30px;
}

.maxHeight130 {
    max-height: 130px;
}

.maxHeight140 {
    max-height: 140px;
}

.maxHeight27vh {
    max-height: 27vh;
}

.maxHeight40vh {
    max-height: 40vh;
}

.maxHeight39vh {
    max-height: 39vh;
}

.maxHeight50vh {
    max-height: 50vh;
}

.maxHeight70vh {
    max-height: 70vh;
}

.maxHeight79vh {
    max-height: 79vh;
}

.maxHeight80vh {
    max-height: 80vh;
}

.floatLeft {
    float: left;
}

.labelListCheckBoxTab {
    position: relative;
    padding-left: 15px;
    width: 150px;
    padding-right: 30px;
}

.labelListCheckBoxTab + span {
    display: block;
}

    .labelListCheckBoxTab:hover input ~ .checkmarkTab {
        background-color: var(--bg65);
    }


    .labelListCheckBoxTab input:checked ~ .checkmarkTab {
        background-color: var(--checkboxbackground);
    }


    /* Style the checkmark/indicator */
    .labelListCheckBoxTab .checkmarkTab:after {
        left: 9px;
        top: 5px;
        width: 5px;
        height: 10px;
        border: solid white;
        border-width: 0 3px 3px 0;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }

.checkmark {
    position: absolute;
    height: 10px;
    width: 10px;
    border: solid;
    cursor: pointer;
    color: var(--color216);
}

    /* Create the checkmark/indicator (hidden when not checked) */
    .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }

.checkmarkTab {
    position: absolute;
    height: 10px;
    width: 10px;
    border: solid;
    cursor: pointer;
    color: var(--bg65);
}

    /* Create the checkmark/indicator (hidden when not checked) */
    .checkmarkTab:after {
        content: "";
        position: absolute;
        display: none;
    }


.labelAutoPad {
    padding-right: 5px;
}

.labelRLocLbl {
    width: 150px;
    display: inline-block;
}



/*Societe Client specificities*/
.selectLarge {
    width: auto;
    margin-right: 4vw;
    text-overflow: ellipsis;
}

.selectBig {
    width: 175px;
    text-overflow: ellipsis;
}

.selectMedium {
    width: 140px;
    text-overflow: ellipsis;
}

.selectSmall {
    width: 95px;
    text-overflow: ellipsis;
}

.select35 {
    width: 35px;
    text-overflow: ellipsis;
}

.select80 {
    width: 80px;
    text-overflow: ellipsis;
}

.select60 {
    width: 60px;
    text-overflow: ellipsis;
}

.select160 {
    width: 160px;
    text-overflow: ellipsis;
}

.selectTiny {
    width: 50px;
    text-overflow: ellipsis;
}

.select254 {
    width: 254px;
    text-overflow: ellipsis;
}

.select404 {
    width: 404px;
    text-overflow: ellipsis;
}

.selectSocCli {
    margin-bottom: 19px;
    margin-top: 16px;
}


.inlineTab {
    display: inline-block;
    vertical-align: top;
    margin-right: 6vw;
}

.textTabSoc {
    width: 130px;
    display: inline-block;
    margin-bottom: 5px;
}

.textSocClient {
    padding-right:50px;
}

.selectMargin {
    margin-bottom: 15px;
}

.excelButton {
    background-color: var(--bg65);
    border: none;
    color: var(--color172);
    cursor: pointer;
}

    .excelButton:hover {
        color: var(--color255);
    }

/*BL specificities*/

.restrictChamps {
    width:300px;
}

/*Type Point specificities*/

.labelAbsoluteTypePoint {
    position: absolute;
    top: 33vh;
    left: 35vw;
}

/*Tramage specificities*/

.textTitreTramage {
    display: flex;
    margin-left: 230px;
}

.minWidth155 {
    min-width: 155px;
}

.minWidth160 {
    min-width: 160px;
}

.minWidth260 {
    min-width: 260px;
}

.minWidth300 {
    min-width: 300px;
}

.minWidth800 {
    min-width: 800px;
}

.minWidth1220 {
    min-width: 1220px;
}

.minHeight60 {
    min-height: 60px;
}

.minHeight180 {
    min-height: 180px;
}

.minHeight380 {
    min-height: 380px;
}

.Height20 {
    height: 20px;
}

.Height25 {
    height: 25px;
}

.Height30 {
    height: 30px;
}

.Height35 {
    height: 35px;
}

.Height50 {
    height: 50px;
}

.Height90 {
    height: 90px;
}

.Height140 {
    height: 140px;
}

.Height160 {
    height: 160px;
}

.Height509 {
    height: 509px;
}

.Height1vw {
    height: 1vw;
}

.Height30vh {
    height: 30vh;
}

.Height40vh {
    height: 40vh;
}

.Height60vh {
    height: 60vh;
}

.Height66vh {
    height: 66vh;
}

.Height76vh {
    height: 76vh;
}

.Height77vh {
    height: 77vh;
}

.overflowauto {
    overflow: auto;
}

.ModalPopupBg {
    background-color: var(--modalbg);
}

.ModalDivBg {
    min-height: 700px;
    min-width: 1200px;
    display: grid;
    place-content: center;
    padding: 10px;
    background-color: var(--color3b);
    border-radius: 12px 12px 12px 12px;
    -webkit-border-radius: 12px 12px 12px 12px;
    -moz-border-radius: 12px 12px 12px 12px;
}

/* DRAG AND DROP */

.files-label {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100px;
    width: 100%;
    min-width: 450px;
    background-color: #777777;
    color: var(--bg65);
    font-weight: bold;
    font-size: 25px;
    border: 5px dashed var(--bg65);
    margin: 0;
    text-align: center;
}

.files-label-dragstart {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100px;
    width: 100%;
    min-width: 450px;
    background-color: var(--bg85);
    color: var(--bg65);
    font-weight: bold;
    font-size: 25px;
    border: 5px dashed var(--bg65);
    margin: 0;
    text-align: center;
}

.files-label:hover {
    cursor: pointer;
}

.files-field { /* hide the files input field; use files-label to access it */
    display: none;
}

.displaynone {
    display: none;
}

.displayblock {
    display: block;
}

#files-progress {
    width: 0;
    background-color: lightslategray;
    color: white;
    font-weight: bold;
    font-size: 14px;
    line-height: 25px;
    padding: 0 5px;
}

.modal-page {
    visibility: hidden;
    opacity: 0;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    transition: .5s ease;
    background-color: black;
    margin: 0;
    padding: 0;
    overflow: auto;
}

    .modal-page img {
        display: block;
        margin: 0 auto;
        width: 100%;
        height: auto;
    }

    .modal-page:target {
        visibility: visible;
        opacity: 1;
    }

    /*************************************
        AJAX FILE UPLOAD
    *************************************/

.PdfAjaxUpload .ajax__fileupload {
    border: none;
    overflow-x: hidden;
    overflow-y: auto;
    min-height: 230px;
    max-height: 230px; 
    padding: 0px;
}

.PdfAjaxUpload .ajax__fileupload_selectFileContainer {
    height: unset !important;
    line-height: unset !important;
    padding: 7px;
    background-color: var(--bg85) !important;
    font-size: inherit;
    font-weight: bold;
    width: unset !important;
}

    .PdfAjaxUpload .ajax__fileupload_selectFileContainer:hover {
        background-color: var(--bg85) !important;
        color: var(--color172) !important;
    }

    .PdfAjaxUpload .ajax__fileupload_selectFileContainer input {
        height: unset !important;
        font-size: 0.95em;
    }

    .PdfAjaxUpload .ajax__fileupload_selectFileContainer input:hover {
        background-color: var(--bg85) !important;
        color: var(--color172) !important;
    }


.PdfAjaxUpload .ajax__fileupload_selectFileButton {
    background-color: var(--bg85) !important;
    border: none;
    color: var(--color251) !important;
    font-size: inherit;
    padding: 0 !important;
    cursor: pointer;
    height: unset !important;
    line-height: unset !important;
    width: unset !important;
    min-width: 30px;
}

    .PdfAjaxUpload .ajax__fileupload_selectFileButton:hover {
        background-color: var(--bg85) !important;
        color: var(--color172) !important;
    }

.ajax__fileupload_topFileStatus {
    color: rgb(127, 126, 126);
}

.ajax__fileupload_ProgressBarHolder {
    margin-right: 70px;
}

.ajax__fileupload_uploadbutton {
    background-color: #000099;
    color: white;
    cursor: pointer;
    font-weight: bold;
    text-align: center;
    width: 60px;
}

.ajax_fileupload_cancelbutton {
    background-color: var(--bg85) !important;
    color: var(--colorvalidation) !important;
}

.PdfAjaxUpload .ajax__fileupload_dropzone {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100px !important;
    width: unset !important;
    min-width: 650px;
    background-color: #777777;
    color: var(--bg65);
    font-weight: bold;
    font-size: 25px;
    border: 5px dashed var(--bg65);
    margin: 0;
    text-align: center;
    line-height: unset !important;
}

.PdfAjaxUpload .ajax__fileupload_queueContainer {
    border: unset;
}

.ajax__fileupload_progressBar {
    background-color: unset !important;
    padding-left: 4px;
}

.dropzoneHeight20 .ajax__fileupload_dropzone {
    height: 20px !important;
}

.dropzoneHeight20 .ajax__fileupload {
    min-height: unset !important;
}
/*.ajax__fileupload_footer {
    height: 20px;
    line-height: 20px;
    margin-top: 2px;
}
*/
/*.ajax__fileupload_fileItemInfo {
    height: 20px;
    line-height: 20px;
    margin-bottom: 2px;
    overflow: hidden;
    position: relative;
    z-index: 0;
}
*/
/*    .ajax__fileupload_fileItemInfo .filename {
        font-weight: bold;
    }

    .ajax__fileupload_fileItemInfo .uploadstatus {
        font-style: italic;
    }
*/
.ajax__fileupload_fileItemInfo .removeButton {
    background-color: var(--bg85) !important;
    color: var(--colorvalidation) !important;
}

    .ajax__fileupload_fileItemInfo .uploadedState {
        background-color: unset !important;
        color: var(--homegreen) !important;
    }

    .ajax__fileupload_fileItemInfo .uploadingState {
        background-color: unset !important;
        color: #e4b47c !important;
    }

    .ajax__fileupload_fileItemInfo .pendingState {
        background-color: unset !important;
        color: #d99546 !important;
    }

    .ajax__fileupload_fileItemInfo .errorState {
        background-color: unset !important;
        color: var(--colorvalidation) !important;
    }

    .ajax__fileupload_fileItemInfo .cancelledState {
        background-color: unset !important;
        color: var(--colorvalidation) !important;
    }

/*.ajax__fileupload_fileItemInfo div.removeButton {
    position: absolute;
    right: 0;
    top: 0;
}
*/

/*************************************
        AJAX FILE UPLOAD Version Comment
    *************************************/

.VCommAjaxUpload .ajax__fileupload {
    border: none;
    overflow-x: hidden;
    overflow-y: auto;
    min-height: 60px;
    max-height: 400px;
    max-width: 300px;
    padding: 0px;
}

.VCommAjaxUpload .ajax__fileupload_selectFileContainer {
    height: unset !important;
    line-height: unset !important;
/*    background-color: var(--bg85) !important;
*/    font-size: inherit;
    font-weight: bold;
    width: unset !important;
    float: none !important;
}

    .VCommAjaxUpload .ajax__fileupload_selectFileContainer:hover {
/*        background-color: var(--bg85) !important;
*/        color: var(--color172) !important;
    }

    .VCommAjaxUpload .ajax__fileupload_selectFileContainer input {
        height: unset !important;
        font-size: 0.95em;
    }

        .VCommAjaxUpload .ajax__fileupload_selectFileContainer input:hover {
/*            background-color: var(--bg85) !important;
*/            color: var(--color172) !important;
        }


.VCommAjaxUpload .ajax__fileupload_selectFileButton {
/*    background-color: var(--bg85) !important;
*/    border: none;
    color: var(--color251) !important;
    font-size: inherit;
    cursor: pointer;
    line-height: unset !important;
    width: unset !important;
    text-indent: -9999px;
    background: url("../../Images/Tradeshop/Common/b-upload.png") no-repeat;
    width: 40px !important;
    height: 40px !important;
}

    .VCommAjaxUpload .ajax__fileupload_selectFileButton:hover {
        background-color: var(--bg65) !important;
        color: var(--color172) !important;
    }

.VCommAjaxUpload .ajax__fileupload_dropzone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 25px !important;
    width: unset !important;
    min-width: 150px;
    max-width: 150px;
    background-color: #777777;
    color: var(--bg65);
    font-weight: bold;
    font-size: 12px;
    border: 5px dashed var(--bg65);
    margin: 0 15px 0 0;
    vertical-align: top;
    line-height: unset !important;
}

.VCommAjaxUpload .ajax__fileupload_queueContainer {
    border: unset;
}


.userlistcontainer {
    display: grid;
    place-content: center;
    padding: 10px;
}

.flexContentEnd {
    display: flex;
    width: fit-content;
    width: max-content;
    margin-left: auto;
}

/**********  Image dropdownlist  *****************/

.statusImgDropDown {
    position: relative;
    display: inline-block;
}

/******** Horizontal dropdown img *********/
.dropdown-content-h {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    width: fit-content;
    box-shadow: 0px 10px 5px 10px rgba(0,0,0,0.3); /*h-offset v-offset blur spread color*/
    z-index: 3;
}

.statusImgDropDown:hover .dropdown-content-h {
    display: inline-flex !important;
}

/********* Vertical dropdown img **********/
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    width: fit-content;
    box-shadow: 0px 10px 5px 10px rgba(0,0,0,0.3); /*h-offset v-offset blur spread color*/
    z-index: 3;
}

.statusImgDropDown:hover .dropdown-content {
    display: block !important;
}

