body {
    background-color:#FAFAFA;
}

.zone-signature {
    border: 2px solid #5398be;
    background-color: #FFFFFF;
    width: 300px;
    height: 180px;
    touch-action: none;
}

.TitreApplication{font-family:'Arial Rounded MT';font-size:24px;font-weight:bold}

.LnkMenu{font-size:22px;font-weight:bold;}

.RubriqueLogon {
    font-family: Arial;
    font-size: 16px;
    font-weight: bold;
}

.BtnLogin {
    font-family: Arial;
    font-size: 14px;
    background-color: #ececec;
    color: #10aa18; /*vert*/
    border: 1px solid #10aa18; /*vert*/
    width: 120px;
    height: 40px;

}

.BtnActionValide {
    font-family: Arial;
    font-size: 14px;
    background-color: #ececec;
    color: #10aa18; /*vert*/
    border: 1px solid #10aa18; /*vert*/
    overflow: hidden;
    white-space: normal;
}
.BtnActionAnnule {
    font-family: Arial;
    font-size: 14px;
    background-color: #ececec;
    color: #ff0000; /*rouge*/
    border: 1px solid #ff0000; /*rouge*/
    overflow: hidden;
    white-space: normal;
}
.BtnActionExport {
    font-family: Arial;
    font-size: 14px;
    background-color: #ececec;
    color: #d71999; /*violet*/
    border: 1px solid #d71999; /*violet*/
    overflow: hidden;
    white-space: normal;
}
.BtnExtraSmall {
    width: 25px;
    height: 25px;
    padding: 1px;
    font-size: 12px !important;
    font-weight: bold;
    border-radius: 1px;
}
.BtnSmall {
    width: 40px;
    height: 25px;
    border-radius: 5px;
}
.BtnSemiSmall {
    width: 30px;
    height: 30px;
    padding: 2px;
    font-size: 13px !important;
    font-weight: bold;
    border-radius: 3px;
}

.BtnMedium {
    width: 80px;
    height: 40px;
    border-radius: 7px;
}
.BtnSemiLarge {
    width: 120px;
    height: 50px;
    border-radius: 10px;
}
.BtnLarge {
    width: 200px;
    height: 60px;
    border-radius: 10px;
}

.DivVisible{
    display:block !important;
}
.DivInvisible {
    display: none !important;
}

.ImgProgress {
    width: 70px;
    margin: 10px;
}
.DivProgress {
    top: 0;
    left: 0;
    position: absolute;
    text-align: center;
    background-color: #FFFFFF;
    opacity: 85%;
    width: 100%;
    height: 100%;
    margin: auto;
    color: #026281;
    padding-top: 50px;
}

.DivSpacerTopSmall {
    margin-top: 5px;
}
.DivSpacerTopMedium {
    margin-top: 10px;
}
.DivSpacerTopLarge {
    margin-top: 20px;
}
.LblPromptOption {
    font-family: Arial;
    font-size: 14px;
    font-weight :bold;
    color: #0a71ef;
}
.LblPrompt {
    font-family: Arial;
    font-size: 14px;
    color:#808080
}
.LblPromptInstructionCorrection {
    font-family: Arial;
    font-size: 14px;
    color: #ff0000
}
.TxtSaisie {
    font-family: Arial;
    font-size: 14px;
    color: #000000;
}
.CboSaisie {
    font-family: Arial;
    font-size: 14px;
    color: #000000;
}

.ChkSaisie {
    margin:5px;
    font-family: Arial;
    font-size: 14px;
    color: #000000;
}
    .ChkSaisie label{padding-left:3px;}

.ChkSaisieOption {
    font-family: Arial;
    font-size: 14px;
    color: #0a71ef;
}
    .ChkSaisieOption label {
        padding-left: 3px;
    }

.LblSmall {
    width: 70px
}
.LblMedium {
    width: 100px
}
.LblLarge {
    width:150px;
}

.TxtSmall {
    width: 70px
}

.TxtMedium {
    width: 100px
}

.TxtLarge {
    width: 250px;
}

.SaisieMedium{height:30px;min-width:100px;}


.DivSaisie {
    margin: 2px;
    padding: 3px
}

.DivAction {
    text-align:right;
    margin: 2px;
    padding: 3px
}

.DivCritereRecherche {
    background-color: #FFFFFF;
    border: none; /* gris */
    border-radius: 10px;
    margin-bottom: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
    box-shadow: 1px 1px 1px 1px #d3d3d3;
}
.DivCritereRechercheItem {
    display:inline-block
}

.DivResultatRecherche {
    background-color: #FFFFFF;
    border: none; /* #808080 gris */
    border-radius: 10px;
    margin-bottom: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
    box-shadow: 1px 1px 1px 1px #d3d3d3;
}

.DivResultatRechercheTitre {
    padding: 3px;
    margin-top: 5px;
    margin-bottom: 5px;
    border-radius: 5px;
    /*background-color: #EEEEEE;*/
}

.DivActionPage {
    width: 100%;
    border-radius: 10px;
    background-color: #DDDDDD;
    min-height: 40px;
    padding: 5px;
    margin-bottom: 5px;
    box-shadow: 1px 1px 1px 1px #d3d3d3;
}
    .DivActionPage div {
        display: inline-block;
        margin-top: 5px;
        margin-bottom: 5px;
        margin-right: 10px;
        margin-left: 10px
    }
    .DivActionPage span {
        display: block;
    }
    .DivActionPage label {
        display: block;
    }


.DivSignatureListeProduit{
    font-size:smaller;
    margin-bottom:10px;
}

/*** Indentification des éléments de filtre ****/
.CBOFiltreEngage {
    background-color: #FFFFFF;
    border: solid 1px #FF6490;
    font-family: Arial;
    font-size: 14px;
    color: #000000;
    height: 35px;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-right: 5px;
}

.CBOFiltreAucun {
    background-color: #FFFFFF;
    border: solid 1px #DDDDDD;
    font-family: Arial;
    font-size: 14px;
    color: #000000;
    height: 35px;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-right: 5px;
}

.TXTFiltreEngage {
    background-color: #FFFFFF;
    border: solid 1px #FF6490;
    padding: 5px;
    margin-top: 2px;
    margin-bottom: 2px;
}

.TXTFiltreAucun {
    border: 1px solid #DDDDDD;
    padding: 5px;
    margin-top: 2px;
    margin-bottom: 2px;
}

.CHKFiltreEngage {
    border: 0px;
    margin: 5px;
    font-family: Arial;
    font-size: 14px;
    color: #000000;
}
    .CHKFiltreEngage input {
        display: inline;
    }
    .CHKFiltreEngage label {
        display: inline-block;
        border: solid 1px #FF6490;
        padding-left: 25px;
        padding-right: 5px;
        padding-top: 7px;
        padding-bottom: 6px;
        margin-left: -20px;
        word-break: keep-all;
    }

.CHKFiltreAucun {
    border: 0px;
    margin: 5px;
    font-family: Arial;
    font-size: 14px;
    color: #000000;
}
    .CHKFiltreAucun input {
        display: inline;
    }

    .CHKFiltreAucun label {
        display: inline-block;
        border: 1px solid #DDDDDD;
        padding-left: 25px;
        padding-right: 5px;
        padding-top: 7px;
        padding-bottom: 6px;
        margin-left: -20px;
        word-break: keep-all;
        /*word-wrap:break-word;*/
    }

.CHKLSTFiltreEngage {
    border: solid 1px #FF6490;
    padding: 5px;
    margin: 5px;
}

    .CHKLSTFiltreEngage input {
        margin-bottom: 15px;
    }

    .CHKLSTFiltreEngage label {
        padding: 5px;
        margin-right: 5px;
    }

.CHKLSTFiltreAucun {
    border: 1px solid #DDDDDD;
    padding: 5px;
    margin: 5px;
}

    .CHKLSTFiltreAucun input {
        margin-bottom: 15px;
    }

    .CHKLSTFiltreAucun label {
        padding: 5px;
        margin-right: 5px;
    }


/*** Style de Texte pour la lecture ou la saisie ****/
.TxtId {
    color: #808080; /* gris */
}
.TxtNormal{}
.TxtImportant {
    font-size:larger;
    font-weight:bold;
}
.TxtTresImportant {
    font-size: x-large;
    font-weight: bold;
}
.TxtDateDocument {
    color: #9c0077; /* violet */
}
.TxtDatePlanningPrev {
    color: #009ccf; /* bleu clair */
}
.TxtDatePlanningReal {
    color: #026281; /* bleu foncé */
}
.TxtMarque {
    color: #808080; /* gris */
    font-weight:bold;
}
.TxtCategorie {
    font-style: italic;
}
.TxtRaisoc {
    font-style: italic;
}
.TxtPrixAchat {
    color: #009ccf; /* bleu clair */
}
.TxtPrixVente {
    color: #026281; /* bleu foncé */
}
.ImgShopify{
    margin:2px;
    width:25px;
}
.BadgeDisponibiliteOK {
    padding:5px; border-radius:10px;
    background-color:#10aa18;/* vert */
    color:#FFFFFF;
}
.BadgeDisponibiliteVendu {
    padding:5px; border-radius:10px;
    background-color: #026281; /* bleu foncé */
    color: #FFFFFF;
}
.BadgeDisponibiliteAlerte {
    padding:5px; border-radius:10px;
    background-color: #f17d00; /* orange */
    color: #FFFFFF;
}
.BadgeDisponibiliteKO {
    padding:5px; border-radius:10px;
    background-color: #ff0000; /* rouge */
    color: #FFFFFF;
}

.BadgeProcessNeutre {
    padding: 5px;
    border-radius: 10px;
    background-color: #BBBBBB; /* gris */
    color: #FFFFFF;
}
.BadgeProcessNew {
    padding: 5px;
    border-radius: 10px;
    background-color: #10aa18; /* vert */
    color: #FFFFFF;
}

.BadgeProcessOK {
    padding: 5px;
    border-radius: 10px;
    background-color: #10aa18; /* vert */
    color: #FFFFFF;
}

.BadgeProcessEnCours {
    padding: 5px;
    border-radius: 10px;
    background-color: #026281; /* bleu foncé */
    color: #FFFFFF;
}

.BadgeProcessAlerte{
    padding: 5px;
    border-radius: 10px;
    background-color: #f17d00; /* orange */
    color: #FFFFFF;
}

.BadgeProcessKO {
    padding: 5px;
    border-radius: 10px;
    background-color: #ff0000; /* rouge */
    color: #FFFFFF;
}

/************************/
/** Articles / produits **/
/************************/

.LblResultatRecherche {
 color:#FF6490;
    padding: 3px;
    font-weight: bold;
    margin-top: 3px;
    margin-bottom: 3px;
}

.LblProduitPanier {
    padding: 3px;
    font-size: 12px;
    font-weight: bold;
    color: #026281; /* bleu foncé */
}
.LblProduitSelection {
    padding: 3px;
    font-size: 12px;
    font-weight: bold;
    color: #f17d00; /* orange */
}

/************************/
/** affichage inventaire **/
/************************/

.DivResultatInventaire {
    margin-top:10px;
}
.DivOptionInventaire {
    padding-left: 25px;
}

.DivResultatScanHaut {
    font-size: 38px;
    font-weight: bold;
    text-align: center;
    width: 300px;
    height: 250px;
    margin: auto;
    display: block;
}

.DivResultatScanBas {
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    width: 300px;
    height: 50px;
    margin: auto;
    display: block;
}

.DivResultatScanOK {
    border-radius:5px;
    background-color: #10aa18; /*vert*/
    color: #FFFFFF; /*blanc*/
}

.DivResultatScanKO {
    border-radius: 5px;
    background-color: #ff0000; /*rouge*/
    color: #FFFFFF; /*blanc*/
}

.DivInfoProduitTrouve {
    color: #0a71ef /*bleu*/
}
.LblTitreInfoProduitTrouve {
    color: #808080;/* gris */
    font-weight:bold;
}
/* vignette produit inventaire */
.DivInventaireVignetteProduit {
    font-family: Arial;
    margin:5px;
    padding:3px;
}
.LblPromptInfoInventaire {
    color: #808080;
    font-size: 12px;
    padding: 3px;
}
.LblInfoInventaireNom {
    padding: 3px;
    font-weight: bold;
}
.LblInfoInventaire {
    font-size: 14px;
    padding: 3px;
    font-weight: bold;
}


/****** Gridview ******/
/****** Gridview ******/
/****** Gridview ******/

.GridViewResponsive {
    Font-Size: 14px;
    width: 100%;
    border:none;
}

.GridViewHeader {
    border-top: solid 1px #5398be; /* #DDDDDD */
    background-color: #5398be; /* même bleu claire que DreamShop */
    color: #FFFFFF; /*#537BAA*/
    text-align: left;
    height: 50px;
}
    .GridViewHeader th {
        font-weight: normal !important;
        font-style:italic;
    }

.GridViewFooter {
    border-top: solid 1px #DDDDDD;
    font-style: italic;
    color: #537BAA;
    text-align: right;
    height: 50px;
}

.GridViewPager {
    border-top: solid 1px #DDDDDD;
    font-weight: bold;
    font-size: larger;
    color: #537BAA;
    height: 40px;
    background-color: #DDDDDD;
}

    .GridViewPager td table {
        text-align: left;
    }

        .GridViewPager td table td {
            height: 20px;
            text-align: left;
            padding-right: 6px;
            padding-left: 6px;
        }

    .GridViewPager a {
        color: #000000;
        font-weight: normal;
        font-size: smaller;
    }



.GridViewRowStyle {
    border-top: solid 1px #5398be; /* même bleu clair que DreamShop ;  #DDDDDD;*/
    color: #000000;
    text-align: left;
    height: 50px;
}
.GridViewAlternatingRowStyle {
    background-color: #FFFFFF;
    color: #000000;
}

.GridViewSelectedRowStyle {
    background-color:#E2DED6;
    font-weight:bold;
    color:#333333;
}

.GridViewEditRowStyle {
    background-color:#999999;
}

.GridViewEmptyDataStyle {
    color: #FF6490;
    text-align: left;
    font-size: 14px;
    font-weight: bold;
    height: 50px;
}

/****** Gridview Recherche PRODUITS ******/
/****** Gridview Recherche PRODUITS ******/
/****** Gridview Recherche PRODUITS ******/

/** En Tête **/

.DivHeaderListingProduit {
}


.DivHeaderListingProduit div {
    margin: 5px;
    padding: 5px;
}

.DivHeaderListingProduitColSelect {
    width: 30px;
    display: inline-block;
}

.DivHeaderListingProduitColDate {
    width: 75px;
    display: inline-grid;
}

.DivHeaderListingProduitColNom {
    width: 400px;
    max-width: 400px;
    display: inline-grid;
}

.DivHeaderListingProduitColPrix {
    text-align: center;
    min-width: 200px;
    display: inline-block;
}

    .DivItemListingProduitColPrix span {
        padding: 3px;
    }

.DivHeaderListingProduitColDispo {
    display: inline-block;
}

.DivHeaderListingProduitColAction {
    min-width: 50px;
    display: inline-block;
}

/** Items **/

.DivItemListingProduit {

}

.GridViewProduitRowStyle :hover {
    background-color:#ECECEC;
}

.DivItemListingProduit div {
    margin: 5px;
    padding: 5px;
}
.DivItemListingProduitColSelect {
    width: 30px;
    display: inline-block;
}
.DivItemListingProduitColDate {
    width: 75px;
    display: inline-grid;
}
.DivItemListingProduitColNom {
    width: 400px;
    max-width: 400px;
    display: inline-grid;
}
.DivItemListingProduitColPrix {
    text-align: center;
    min-width: 200px;
    display: inline-block;
    font-weight: bold;
}
    .DivItemListingProduitColPrix span {
        padding: 3px;
    }
.DivItemListingProduitColDispo {
    display: inline-block;
}
.DivItemListingProduitColAction {
    min-width: 50px;
     width: 100%;
   display: inline-block;
}



/****** Gridview Recherche DOCUMENTS ******/
/****** Gridview Recherche DOCUMENTS ******/
/****** Gridview Recherche DOCUMENTS ******/

/** En Tête **/

.DivHeaderListingDocument{
}


    .DivHeaderListingDocument div {
        margin: 5px;
        padding: 5px;
    }


.DivHeaderListingDocumentColDate {
    width: 75px;
    display: inline-grid;
}

.DivHeaderListingDocumentColNom {
    width: 400px;
    max-width: 400px;
    display: inline-grid;
}


.DivHeaderListingDocumentColDispo {
    display: inline-block;
}

.DivHeaderListingDocumentColAction {
    min-width: 200px;
    display: inline-block;
}

/** Items **/
.GridViewDocumentRowStyle :hover {
    background-color: #ECECEC;
}

.DivItemListingDocument {
}

.DivItemListingDocument div {
    margin: 5px;
    padding: 5px;
}

.DivItemListingDocumentColDate {
    width: 75px;
    display: inline-grid;
}

.DivItemListingDocumentColNom {
    width: 400px;
    max-width: 400px;
    display: inline-grid;
}


.DivItemListingDocumentColDispo {
    max-width: 150px;
    display: inline-block;
}

.DivItemListingDocumentColAction {
    display: inline-block;
}

/****************************************/
/************ Responsive *******************/
/*****************************************/
@media screen and (max-width:400px) {

    .DivItemListingProduitColPrix {
        width: 100%;
        padding-bottom: 5px !important;
    }
    .DivItemListingProduitColDispo {
        padding-bottom: 5px !important;
    }

    .DivItemListingDocumentColDispo {
        padding-bottom: 5px !important;
    }

    .DivCritereRechercheItem{
        margin-top:5px;
    }
}

@media screen and (max-width:500px) {



    .DivItemListingProduit div {
        margin-top: 0px;
        margin-bottom: 2px;
        margin-left: 1px;
        margin-right: 1px;
        padding: 2px;
    }
    .DivItemListingProduitColNom {
        width: 100%;
    }


    .DivItemListingDocument div {
        margin-top: 0px;
        margin-bottom: 2px;
        margin-left: 1px;
        margin-right: 1px;
        padding: 2px;
    }

    .DivItemListingDocumentColNom {
        width: 100%;
    }

}

@media screen and (max-width:768px) {

    .GridViewHeader {
        display: none;
    }

    .DivHeaderListingProduit {
        display: none;
    }

    .DivItemListingProduit {
        padding-bottom: 5px !important;
    }

    .DivItemListingProduitColDate {
        display: inline-flex;
  
    }

        .DivItemListingProduitColDate span {
            margin-right: 15px;
        }

    .DivHeaderListingDocument {
        display: none;
    }

    .DivItemListingDocument {
        padding-bottom: 5px !important;
    }

    .DivItemListingDocumentColDate {
        display: inline-flex;
        width: 100%;
    }

        .DivItemListingDocumentColDate span {
            margin-right: 15px;
        }

    .DivItemListingDocumentColDispo {
        display: inline-block;
        padding-bottom: 5px !important;
    }

    .DivItemListingDocumentColAction {
        display: inline-block;
        padding-bottom: 5px !important;
    }

    .ImgShopify {
        margin: 1px;
        width: 20px;
    }
}