﻿/* =========================================================
   Thème Province Nord (aligné sur le site www.province-nord.nc)
   Palette :
   - Bleu primaire : #005c6a
   - Bleu clair    : #007f8c
   - Bleu très clair : #0093a0
   - Orange accent : #f7941d  (actions CTA uniquement)
   - Fond général  : #f5f7fa
   - Texte         : #333333
   - Panneaux      : #e2edf3 / #c9ddeb
   ========================================================= */


/* -----------------------------
   Layout général
------------------------------ */

body {
    min-height: 100%;
    margin: 0;
    padding: 0;
    background-color: #f5f7fa;
    margin-bottom: 120px;
    color: #333333;
    font-family: Arial, sans-serif;
}

#wrapper {
    height: 100%;
}

/* Bandeau haut */
#headerbg {
    width: 100%;
    height: 180px;
    margin: 0;
    padding: 0;
    background-color: #005c6a;
    background-image: none;
    box-shadow: 0 2px 4px rgba(0,0,0,0.15);
}

marquee {
    marquee-speed: fast !important;
}

#headerPopup {
    height: 60px;
    background-color: #004456 !important;
    text-align: center;
    color: #ffffff;
}

.div_popup_simple {
    padding: 15px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 2px inset #ffffff !important;
    background: border-box !important;
}

.Texte_Titre_Popup {
    padding: 5px 10px !important;
    color: #f7941d !important;
    font-family: Arial;
    font-size: 20px !important;
    font-weight: bold !important;
}

#contentbg {
    width: 100%;
    margin: 0;
    padding: 0;
}

.table_recherche_border {
    border: 2px outset #c9ddeb;
}

/* -----------------------------
   Pied de page
------------------------------ */

#footerbg {
    float: left;
    width: 100%;
    height: 120px;
    margin: 0;
    padding: 0;
    background-color: #003846;
    background-image: none;
}

#content {
    margin: 0;
    padding: 0;
}

/* -----------------------------
   Colonnes de contenu
------------------------------ */

#contentleft {
    min-width: 150px;
    width: 15%;
    float: left;
    margin: 0;
    padding-top: 35px;
    padding-bottom: 0;
    padding-left: 20px;
    padding-right: 0;
}

#contentmid {
    width: 70%;
    float: left;
    margin: 0;
    padding-top: 35px;
    padding-bottom: 35px;
    padding-left: 25px;
    padding-right: 0;
    background-image: url(../img/vline.jpg);
    background-repeat: repeat-y;
}

#contentleft_withright {
    min-width: 150px;
    width: 10%;
    float: left;
    margin: 0;
    padding-top: 35px;
    padding-bottom: 0;
    padding-left: 20px;
    padding-right: 0;
}

#contentmid_withright {
    width: 65%;
    float: left;
    margin: 0;
    padding-top: 35px;
    padding-bottom: 35px;
    padding-left: 25px;
    padding-right: 0;
    background-image: url(../img/vline.jpg);
    background-repeat: repeat-y;
}

#contentright {
    min-width: 200px;
    width: 10%;
    float: right;
    margin: 0;
    padding-top: 35px;
    padding-bottom: 0;
    padding-left: 20px;
    padding-right: 0;
    background-image: url(../img/vline.jpg);
    background-repeat: repeat-y;
}

#copyrights {
    margin: 5px 0 0 0;
    padding: 0;
    font-family: Arial;
    font-size: 11px;
    font-weight: bold;
    color: #f5f7fa;
    text-align: center;
}

/* -----------------------------
   RadCaptcha
------------------------------ */

.rcRefreshImage {
    font-family: Arial;
    font-size: 11px;
    color: #005c6a;
    text-decoration: none;
    margin-top: 5px;
    padding-left: 5px;
}

    .rcRefreshImage:hover {
        color: #f7941d;
        text-decoration: underline;
    }

.ruSelectWrap {
    width: 100% !important;
}

/* -----------------------------
   RadComboBox
------------------------------ */

.RadComboBox {
    font-size: 12px !important;
    font-family: Arial !important;
}

    .RadComboBox table td.rcbInputCell {
        font-size: 12px !important;
    }



/* -----------------------------
    MENU SALLES DES MARCHES
------------------------------ */
/* ── Wrapper centré ───────────────────────────────────────────────── */
.sdm-tabs-wrapper {
    width: 70%;
    margin: 0 auto 28px auto;
    font-family: Tahoma, Arial, sans-serif;
}

/* ── Barre d'onglets ──────────────────────────────────────────────── */
.sdm-tabs {
    display: flex;
    border-bottom: 2px solid #C8D8E8;
    gap: 6px;
}

/* ── Onglet de base ───────────────────────────────────────────────── */
.sdm-tab {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px 14px;
    text-decoration: none;
    color: #5A7490;
    background: #F0F5FA;
    border: 1px solid #C8D8E8;
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    position: relative;
    transition: background .18s, color .18s;
    cursor: pointer;
    /* Trait indicateur bas — invisible par défaut */
    border-bottom: 3px solid transparent;
}

    .sdm-tab:hover {
        background: #E2EEF8;
        color: #005BA6;
        text-decoration: none;
    }

/* ── Onglet ACTIF ─────────────────────────────────────────────────── */
.sdm-tab--active,
.sdm-tab--active:hover {
    background: #ffffff;
    color: #003B6E;
    border-color: #C8D8E8;
    border-bottom: 3px solid #005BA6; /* trait bleu Province Nord */
    cursor: default;
    box-shadow: 0 -2px 8px rgba(0, 59, 110, .07);
}

    /* Picto actif */
    .sdm-tab--active .sdm-tab__picto {
        color: #005BA6;
    }

/* ── Picto SVG ────────────────────────────────────────────────────── */
.sdm-tab__picto {
    flex-shrink: 0;
    color: #8AAABF;
    display: flex;
    align-items: center;
    transition: color .18s;
}

.sdm-tab:hover .sdm-tab__picto {
    color: #005BA6;
}

/* ── Textes ───────────────────────────────────────────────────────── */
.sdm-tab__label {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.sdm-tab__title {
    font-size: 11.5pt;
    font-weight: bold;
    line-height: 1.2;
}

.sdm-tab__sub {
    font-size: 8pt;
    color: #8AAABF;
    font-weight: normal;
    line-height: 1.3;
}

.sdm-tab--active .sdm-tab__sub {
    color: #5A7490;
}

/* ── Badge "Nouveau" ──────────────────────────────────────────────── */
.sdm-tab__badge {
    margin-left: auto;
    flex-shrink: 0;
    font-size: 7.5pt;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: .06em;
    padding: 2px 8px;
    border-radius: 20px;
    background: #00C389;
    color: #ffffff;
    align-self: flex-start;
    margin-top: 2px;
}

/* ── Responsive : empilage vertical sous 600px ────────────────────── */
@media (max-width: 600px) {
    .sdm-tabs-wrapper {
        width: 100%;
    }

    .sdm-tabs {
        flex-direction: column;
        border-bottom: none;
        gap: 4px;
    }

    .sdm-tab {
        border-radius: 8px;
        border: 1px solid #C8D8E8;
        border-bottom: 1px solid #C8D8E8;
    }

    .sdm-tab--active {
        border-left: 4px solid #005BA6;
    }
}

</style >
/* -----------------------------
   RadWindow (Popup)
------------------------------ */
.RadWindowSansBordure table .rwTopLeft,
.RadWindowSansBordure table .rwTopRight,
.RadWindowSansBordure table .rwFooterLeft,
.RadWindowSansBordure table .rwFooterRight,
.RadWindowSansBordure table .rwFooterCenter,
.RadWindowSansBordure table .rwBodyLeft,
.RadWindowSansBordure table .rwBodyRight,
.RadWindowSansBordure table .rwTitlebar,
.RadWindowSansBordure table .rwTopResize {
    background-image: none !important;
}

.WarningPopup {
    background-color: #e2edf3;
    vertical-align: middle;
    border: none;
}

/* =====================================================
   RadGrid — thème Province Nord cohérent
   Règle générale : pas d'orange sur les éléments de
   grille. L'orange reste réservé aux boutons CTA.
   Toute la palette tourne autour du bleu #005c6a.
   ===================================================== */

/* En-têtes de colonne */
.RadGrid .rgHeader,
.RadGrid_Silk .rgHeader {
    background: linear-gradient(to bottom, #e2edf3 0%, #d4e5f0 100%) !important;
    border-color: #c1d4e3 !important;
}

    /* Liens dans les en-têtes (tri) */
    .RadGrid .rgHeader a,
    .RadGrid_Silk .rgHeader a {
        color: #005c6a !important;
        font-weight: bold !important;
        text-shadow: none !important;
        text-decoration: none !important;
    }

        .RadGrid .rgHeader a:hover,
        .RadGrid_Silk .rgHeader a:hover {
            color: #007f8c !important;
            text-decoration: underline !important;
        }

/* Colonne triée active */
.RadGrid .rgSorted,
.RadGrid_Silk .rgSorted {
    background: linear-gradient(to bottom, #c9ddeb 0%, #b8d0e2 100%) !important;
}

/* Icônes de tri */
.RadGrid .rgSortAsc,
.RadGrid .rgSortDesc,
.RadGrid_Silk .rgSortAsc,
.RadGrid_Silk .rgSortDesc {
    border-top-color: #005c6a !important;
    border-bottom-color: #005c6a !important;
}

/* Ligne normale */
.RadGrid .rgRow td,
.RadGrid_Silk .rgRow td {
    border-color: #e2edf3 !important;
    color: #333333 !important;
    background-color: #ffffff !important;
}

/* Ligne alternée */
.RadGrid .rgAltRow td,
.RadGrid_Silk .rgAltRow td {
    border-color: #e2edf3 !important;
    color: #333333 !important;
    background-color: #f5f7fa !important;
}

/* Ligne survolée */
.RadGrid .rgHoveredRow td,
.RadGrid_Silk .rgHoveredRow td {
    background-color: #ddeef6 !important;
    color: #005c6a !important;
    cursor: pointer;
}

/* Ligne sélectionnée */
.RadGrid .rgSelectedRow td,
.RadGrid_Silk .rgSelectedRow td {
    background-color: #c9ddeb !important;
    color: #003846 !important;
    font-weight: bold !important;
}

/* Ligne de filtre */
.RadGrid .rgFilter,
.RadGrid .rgFilterRow,
.RadGrid_Silk .rgFilter,
.RadGrid_Silk .rgFilterRow {
    background-color: #e2edf3 !important;
}

    .RadGrid .rgFilterRow input,
    .RadGrid_Silk .rgFilterRow input {
        border: 1px solid #c9ddeb !important;
        border-radius: 3px !important;
        padding: 2px 5px !important;
        font-size: 11px !important;
        color: #333 !important;
        background-color: #ffffff !important;
    }

        .RadGrid .rgFilterRow input:focus,
        .RadGrid_Silk .rgFilterRow input:focus {
            border-color: #007f8c !important;
            outline: none !important;
        }

/* Colonne expand/groupe */
.rgExpandCol,
.RadGrid .rgExpandCol {
    background-color: #e2edf3 !important;
}

/* Sous-tableau détail (hiérarchique) */
.rgDetailTable,
.RadGrid .rgDetailTable {
    border-color: #c1d4e3 !important;
    background-color: #f5f7fa !important;
}

/* Groupe header */
.RadGrid .rgGroupHeader td,
.RadGrid_Silk .rgGroupHeader td {
    background-color: #d4e5f0 !important;
    color: #005c6a !important;
    font-weight: bold !important;
    font-size: 11px !important;
    border-color: #c1d4e3 !important;
}

/* -------  Paginateur  ------- */
.RadGrid .rgPager,
.RadGrid .rgPagerCell,
.RadGrid_Silk .rgPager,
.RadGrid_Silk .rgPagerCell {
    background-color: #e2edf3 !important;
    border-color: transparent !important;
    font-size: 11px !important;
    font-family: Arial !important;
}

/* Masquer les flèches prev/next/first/last (comportement existant conservé) */
.RadGrid .rgPageLast,
.RadGrid .rgPageFirst,
.RadGrid .rgPageNext,
.RadGrid .rgPagePrev {
    display: none !important;
}

/* Numéros de page */
.rgNumPart a {
    color: #333333 !important;
    text-align: center !important;
    border: 1px solid #c9ddeb !important;
    border-radius: 3px !important;
    padding: 1px 5px !important;
    margin: 0 1px !important;
    text-decoration: none !important;
}

    .rgNumPart a:hover {
        background-color: #007f8c !important;
        border-color: #007f8c !important;
        color: #ffffff !important;
    }

    .rgNumPart a.rgCurrentPage {
        background-color: #005c6a !important;
        border-color: #005c6a !important;
        color: #ffffff !important;
        font-weight: bold !important;
    }

.RadGrid .rgNumPart span {
    float: left;
    padding: 0 0 0 5px;
}

.RadGrid .rgPagerLabel {
    padding-left: 100px !important;
    vertical-align: middle !important;
}

.RadGrid .rgPager .RadComboBox {
    margin: 0 4px 0 0 !important;
    vertical-align: middle !important;
}

.RadGrid .rgInfoPart {
    color: #555 !important;
    font-size: 11px !important;
}

/* Encadrement global de la grille */
.RadGrid {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid #c1d4e3;
}

/* -----------------------------
   RadTabStrip (Silk)
------------------------------ */

.RadTabStrip_Silk .rtsLevel {
    background-image: -webkit-linear-gradient(top, #005c6a 0%, #007f8c 100%) !important;
    background-image: -moz-linear-gradient(top, #005c6a 0%, #007f8c 100%) !important;
    background-image: -ms-linear-gradient(top, #005c6a 0%, #007f8c 100%) !important;
    background-image: -o-linear-gradient(top, #005c6a 0%, #007f8c 100%) !important;
    background-image: linear-gradient(to bottom, #005c6a 0%, #007f8c 100%) !important;
    -moz-border-radius: 10px !important;
    -webkit-border-radius: 10px !important;
    border-radius: 10px !important;
    font-family: Arial !important;
    font-size: 12px !important;
    font-weight: bold !important;
    color: #ffffff;
}

.RadTabStrip_Silk .rtsLevel1 .rtsLink {
    border-left: 1px solid transparent !important;
    border-right: 1px solid transparent !important;
    color: #ffffff !important;
}

    .RadTabStrip_Silk .rtsLevel1 .rtsLink:hover {
        background-image: linear-gradient(to bottom, #007f8c 0%, #0093a0 100%) !important;
        color: #ffffff !important;
    }

.RadTabStrip_Silk .rtsLevel1 .rtsSelected,
.RadTabStrip_Silk .rtsLevel1 .rtsSelected:hover {
    background-image: linear-gradient(to bottom, #f7941d 0%, #e07c0a 100%) !important;
    color: #ffffff !important;
}

/* -----------------------------
   RadWindow contenu
------------------------------ */

.RadWindow .rwWindowContent {
    background-color: #f5f7fa !important;
    height: 100% !important;
}

/* -----------------------------
   Boutons
------------------------------ */

/* Bouton standard : bleu Province Nord */
.Bouton_Type_1 {
    -moz-border-radius: 5px !important;
    -webkit-border-radius: 5px !important;
    border-radius: 5px !important;
    border-style: none !important;
    background-color: #005c6a !important;
    background-image: none !important;
    padding: 5px 10px !important;
    color: #ffffff !important;
    text-decoration: none !important;
    font-family: Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: bold !important;
    transition: background-color 0.15s !important;
}

    .Bouton_Type_1:hover {
        background-color: #007f8c !important;
    }

/* Bouton CTA principal : orange accent — cible le <a> généré par RadButton */
.RadButton.Bouton_Type_2 {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    display: inline-block !important;
}

    .RadButton.Bouton_Type_2 .rbDecorated {
        -moz-border-radius: 8px !important;
        -webkit-border-radius: 8px !important;
        border-radius: 8px !important;
        border-style: none !important;
        background: linear-gradient(to bottom, #00C853, #00a344) !important;
        padding: 12px 24px !important;
        color: #ffffff !important;
        text-decoration: none !important;
        font-family: 'Segoe UI', Arial, sans-serif !important;
        font-size: 18px !important;
        font-weight: 800 !important;
        box-shadow: 0 4px 0 #007e33, 0 6px 12px rgba(0,200,83,0.3) !important;
        cursor: pointer !important;
        display: inline-block !important;
        transition: all 0.2s ease !important;
        text-align: center !important;
        min-width: 280px !important;
        height: auto !important;
        line-height: normal !important;
    }

        .RadButton.Bouton_Type_2 .rbDecorated:hover {
            background: linear-gradient(to bottom, #00E55C, #00C853) !important;
            box-shadow: 0 4px 0 #007e33, 0 8px 16px rgba(0,200,83,0.5) !important;
            transform: translateY(-2px) !important;
        }

        .RadButton.Bouton_Type_2 .rbDecorated:active {
            background: linear-gradient(to bottom, #00a344, #008f3b) !important;
            box-shadow: 0 1px 0 #007e33 !important;
            transform: translateY(1px) !important;
        }

    .RadButton.Bouton_Type_2 .rbText {
        color: #ffffff !important;
        font-family: 'Segoe UI', Arial, sans-serif !important;
        font-size: 18px !important;
        font-weight: 800 !important;
        padding: 0 !important;
        margin: 0 !important;
    }

/* Bouton validation inscription (LinkButton — cible le <a> directement) */
a.Bouton_Valider,
.Bouton_Valider {
    display: inline-block !important;
    background: linear-gradient(to bottom, #f7941d, #e07c0a) !important;
    border-radius: 6px !important;
    font-family: Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: bold !important;
    padding: 10px 28px !important;
    color: #fff !important;
    border: none !important;
    box-shadow: 0 3px 0 #b56208 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    vertical-align: top !important;
    line-height: 1.4em !important;
    transition: background 0.15s, box-shadow 0.15s !important;
}

    a.Bouton_Valider:hover,
    .Bouton_Valider:hover {
        background: linear-gradient(to bottom, #ffab3d, #f7941d) !important;
        box-shadow: 0 4px 0 #b56208 !important;
        color: #fff !important;
        text-decoration: none !important;
    }

    a.Bouton_Valider:active,
    .Bouton_Valider:active {
        background: linear-gradient(to bottom, #d97008, #c06005) !important;
        box-shadow: 0 1px 0 #b56208 !important;
        transform: translateY(1px) !important;
    }

/* -----------------------------
   Encadrés
------------------------------ */

.Encadre_fonce {
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background-color: #c9ddeb;
    border-color: #b3cfdf;
    border-style: solid;
    border-width: 1px;
    padding: 10px;
}

/* -----------------------------
   Logo & titres
------------------------------ */

.Texte_Logo {
    color: #ffffff;
    font-size: 40px;
    font-weight: bold;
    padding-top: 40px;
    padding-left: 200px;
    background: transparent url(../img/logo_pn.png) top left no-repeat;
    position: relative;
    height: 148px;
}

.Texte_Logo_Ligne2 {
    color: #ffffff;
    font-size: 20px;
    font-weight: bold;
    padding-top: 40px;
    padding-left: 200px;
}

.Texte_Titre_1 {
    width: 700px;
    float: left;
    margin: 0;
    padding: 0;
    font-family: "Trebuchet MS", Arial, sans-serif;
    font-size: 28px;
    font-weight: bold;
    color: #005c6a;
}

.Texte_Titre_2 {
    font-family: "Trebuchet MS", Arial, sans-serif;
    font-size: 16px;
    font-weight: bold;
    color: #f7941d;
}

/* -----------------------------
   Textes
------------------------------ */

.Texte_Normal {
    font-family: Arial;
    font-size: 12px;
    color: #333333;
}

.Texte_Normal_Italique {
    font-family: Arial;
    font-size: 12px;
    color: #333333;
    font-style: italic;
}

.Texte_Normal_Gras {
    font-family: Arial;
    font-size: 12px;
    font-weight: bold;
    color: #333333;
}

.Texte_Champ_obligatoire {
    font-family: Arial;
    font-size: 10px;
    font-style: italic;
    color: red;
}

.Texte_Menu_Gauche {
    font-family: Arial;
    font-size: 11px;
    color: #005c6a;
}

.Texte_Important {
    font-family: Arial;
    font-size: 12px;
    font-weight: bold;
    color: #005c6a;
}

/* -----------------------------------------------
   RadMenu — item sélectionné (SelectedCssClass)
----------------------------------------------- */

.RadMenu .item_menu_selected,
.RadMenu .item_menu_selected.rmItem {
    background: linear-gradient(to bottom, #e2edf3, #c9ddeb) !important;
    border-bottom: 3px solid #005c6a !important;
}

     Le lien intérieur 
    .RadMenu .item_menu_selected > .rmLink,
    .RadMenu .item_menu_selected .rmText {
        color: #005c6a !important;
        font-weight: bold !important;
    }

 Hover sur un item non sélectionné 
.RadMenu .rmItem:hover > .rmLink {
    background: #e2edf3 !important;
    color: #007f8c !important;
}

/* -----------------------------
   Liens
------------------------------ */

.Lien_Type1 {
    font-family: Arial;
    font-size: 11px;
    color: #005c6a;
    text-decoration: none;
}

    .Lien_Type1:hover {
        color: #f7941d;
        text-decoration: underline;
    }

.Lien_Type2 {
    font-family: Arial;
    font-size: 11px;
    color: #f7941d;
    text-decoration: none;
}

    .Lien_Type2:hover {
        color: #f7941d;
        text-decoration: underline;
    }

/* -----------------------------
   Listes, séparateurs, utilitaires
------------------------------ */

.stylePuce {
    list-style-type: none;
    background-image: url(../img/puce.jpg);
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 20px;
}

hr {
    width: 100%;
    height: 1px;
    background-image: url(../img/hline.jpg);
    background-repeat: repeat-x;
    border: none;
}

.clear {
    clear: both;
    float: none;
}

/* -----------------------------
   Messages
------------------------------ */

.MessageError {
    font-family: Arial;
    font-size: 12px;
    display: block;
    padding: 10px 10px 10px 36px;
    border: 1px solid #fb5766;
    margin-left: 0;
    border-radius: 2px;
    box-shadow: 0 1px 0 rgba(255,255,255,0.5) inset;
    background: url(../img/message/warning.png) 10px center no-repeat #fab;
}

.MessageSuccess {
    font-family: Arial;
    font-size: 12px;
    display: block;
    padding: 10px 10px 10px 36px;
    border: 1px solid #83ba77;
    margin-left: 0;
    border-radius: 2px;
    box-shadow: 0 1px 0 rgba(255,255,255,0.5) inset;
    background: url(../img/message/success.png) 10px center no-repeat #d1feba;
}

.MessageInfo {
    font-family: Arial;
    font-size: 12px;
    display: block;
    padding: 10px 10px 10px 36px;
    border: 1px solid #85a5be;
    margin-left: 0;
    border-radius: 2px;
    box-shadow: 0 1px 0 rgba(255,255,255,0.5) inset;
    background: url(../img/message/info.png) 10px center no-repeat #c4dbec;
}

.MessageWarning {
    font-family: Arial;
    font-size: 12px;
    display: block;
    padding: 10px 10px 10px 36px;
    border: 1px solid #d8d566;
    margin-left: 0;
    border-radius: 2px;
    box-shadow: 0 1px 0 rgba(255,255,255,0.5) inset;
    background: url(../img/message/warning.png) 10px center no-repeat #fef8c4;
}

/* -----------------------------
   Logo de fond
------------------------------ */

.LogoBackground {
    background-position: right bottom;
    background-repeat: no-repeat;
    padding-top: 75px;
    padding-bottom: 20px;
    filter: alpha(opacity=25);
    opacity: 0.25;
    -moz-opacity: 0.25;
    position: relative;
    height: 100px;
}

/* -----------------------------------------------
   Zone drag & drop RadUpload
----------------------------------------------- */

#ctl00_ContentPlaceHolder_Popup_rau_multiples {
    border: 3px dashed #007f8c !important;
    border-radius: 12px !important;
    padding: 20px !important;
    background: #f0f7f9 !important;
}

    #ctl00_ContentPlaceHolder_Popup_rau_multiples:hover {
        border-color: #005c6a !important;
        background: #e2edf3 !important;
    }

    #ctl00_ContentPlaceHolder_Popup_rau_multiples.ruDragOver {
        border-color: #00a344 !important;
        border-width: 4px !important;
        background: #e8f5e9 !important;
    }

#ctl00_ContentPlaceHolder_Mid_rau_multiples {
    border: 3px dashed #007f8c !important;
    border-radius: 12px !important;
    padding: 20px !important;
    background: #f0f7f9 !important;
}

    #ctl00_ContentPlaceHolder_Mid_rau_multiples:hover {
        border-color: #005c6a !important;
        background: #e2edf3 !important;
    }

    #ctl00_ContentPlaceHolder_Mid_rau_multiples.ruDragOver {
        border-color: #00a344 !important;
        border-width: 4px !important;
        background: #e8f5e9 !important;
    }
