/*Typographies*/
@font-face { font-family: "Barlow-Thin"; src: url("../typographies/Barlow/Barlow-Thin.otf"); }
@font-face { font-family: "Barlow-Light"; src: url("../typographies/Barlow/Barlow-Light.otf"); }
@font-face { font-family: "Barlow-Regular"; src: url("../typographies/Barlow/Barlow-Regular.otf"); }
@font-face { font-family: "Barlow-Medium"; src: url("../typographies/Barlow/Barlow-Medium.otf"); }
@font-face { font-family: "Barlow-SemiBold"; src: url("../typographies/Barlow/Barlow-SemiBold.otf"); }
@font-face { font-family: "Barlow-Bold"; src: url("../typographies/Barlow/Barlow-Bold.otf"); }
@font-face { font-family: "Barlow-Black"; src: url("../typographies/Barlow/Barlow-Black.otf"); }

:root
{
    --black: #2A2B2B;
    --gray: #D9CCCF;
    --grey: #F0EBEC;
    --cramberry: #9C163C;
    --red: #C7003A;
    --pink: #EB5B84;
    --brown: #B89523;
    --gold: #E3B621;
    --yellow: #FFDE70;

    --block: #f5f5f5;
    --mycontainer: 1320px; /*1320 -> taille container ou 1200*/

    /*--holographique: linear-gradient(90deg, rgb(155, 110, 210) 0%, rgb(221, 99, 147) 25%, rgb(249, 161, 85) 50%, rgb(234, 112, 207) 75%, rgb(98, 218, 251) 100%);*/
    --holographique: linear-gradient(-60deg, rgb(79, 188, 190) 0%, rgb(220, 224, 100) 20%, rgb(223, 178, 212) 40%, rgb(171, 176, 217) 60%, rgb(129, 195, 144) 80%, rgb(93, 195, 240) 100%);

}

.barlow-thin{ font-family: Barlow-Thin; }
.barlow-light{ font-family: Barlow-Light; }
.barlow{ font-family: Barlow-Regular; }
.barlow-medium{ font-family: Barlow-Medium; }
.Barlow-semibold{ font-family: Barlow-SemiBold; }
.barlow-bold{ font-family: Barlow-Bold; }
.Barlow-black{ font-family: Barlow-Black; }

body{background: #EFEFEF; /*#1F2334*/}
.ombre{box-shadow: 0 3px 6px rgba(0,0,0,0.16)}
.mycontainer { max-width: var(--mycontainer) }
.modal-header{
    padding: 0.3rem 1rem !important;
    border-bottom: none !important;
    background: var(--red);
    color: white;
    font-family: Barlow-Medium;

}
.modal-header>h5{font-size: 18px; !important;}
.modal-header>button{font-size: 15px; !important; color: white !important;}

.text-right
{
    text-align: right;
}
.texte-degrade>span
{
    display: inline-block;
    -webkit-text-fill-color: transparent;
    color: transparent;
    /*background: rgba(0, 0, 0, 0) var(--holographique) repeat scroll center center / cover padding-box text;*/
    background: var(--holographique) text;
    font-family: Barlow-Bold;
}

.button-degrade
{
    position: relative;
    width: 200px; /*max-content;*/
    height:  45px;
    min-height: 48px;
    border-radius: 25px;
    font-size: 13px;
    text-transform: uppercase;
    font-family: Barlow-Medium;
    /*padding: 12px 24px;*/

    line-height: 24px;
    text-align: center;
    transition: all 0.3s ease 0s;
    background-color: #5CE5BE; /*#4FBCBE;*/
    color: rgb(255, 255, 255);
    border: none;
    cursor: pointer;
    display: inline-flex;
    outline: 0;
    align-items: center;
    justify-content: center;
}
.button-degrade:hover{
    background-color: white;
    color: black;
}
.button-degrade:hover:before
{
    content: "";
    position: absolute;
    width: 110%; /* 100% */
    height: 110%; /* 100% */
    border-radius: 25px ;
    padding: 5px;
    background-size: 100% 100%;
    background-clip: content-box;
    background-position: center center;
    background-image: var(--holographique);
    z-index: -1;
    display: block;
    filter: blur(15px);
    transform: translate3d(0px, 0px, 0px);
}

.breadcrumb-item, .breadcrumb-item>a
{
    color: #6c757d;
    text-decoration: none;
    font-size: 12px;
    font-family: Barlow-Medium;
}

.form-select
{
    border-color: #CED4DA !important;
    font-family: Barlow-Regular;
    font-size: 14px;
    color: var(--black);
    line-height: 2;
}

.input-text
{
    background: white;
    width: 100%;
    border: 1px solid #CED4DA;
    font-family: Barlow-Regular;
    font-size: 14px;
    color: var(--black);
    border-radius: 0.25rem;
    padding: .375rem 2.25rem .375rem .75rem;
    line-height: 2;
}

.input-text-disable
{
    background: #CED4DA !important;
}

.input-group>.input-group-text
{
    font-family: Barlow-Regular;
    font-size: 12px;
    line-height: 2;
}

.input-group>.btn
{
    font-family: Barlow-SemiBold;
    border: 1px solid #CED4DA;
    color: white;
    font-size: 14px;
    background: var(--pink);
    cursor: pointer;
    transition: 0.3s;
}

.input-group>.btn:hover
{
    background: var(--red);
}

/*----------------------------NAVBAR----------------------------*/
.navbar
{
    font-family: Barlow-Medium;
    padding-top: 5px !important;
    padding-bottom: 5px !important;

    /**/
    max-width: var(--mycontainer);
    margin: auto;
    top: 10px;
    border-radius: 3px;
}

.navbar-black { background: var(--black); }
.navbar-white { background: white; }
.navbar-red { background: var(--red); }

.navbar-white>div>div>ul>li>.link-navbar { color: var(--black); }

.navbar-logotype
{
    max-height: 40px;
}

.navbar-brand {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    /*margin-right: 1rem;
    font-size: 1.25rem;
    text-decoration: none;
    white-space: nowrap;*/
}

.link-navbar
{
    color: white;
    padding-right: .5rem;
    padding-left: .5rem;
    display: block;
    text-decoration: none;
    font-size: 14px;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
}

.navbar-line{
    border-left: 1px solid;
    height: 20px;
    width: 1px;
    margin-right: .5rem;
    margin-left: .5rem;
}
.navbar-white>div>div>ul>.navbar-line { border-color: var(--black); }
.navbar-red>div>div>ul>.navbar-line { border-color: white; }
.navbar-black>div>div>ul>.navbar-line { border-color: white; }
.tag-navbar
{
    position: relative;
    padding: 5px 10px;
    background: lime;
    color: #005e00;
    font-size: 12px;
    font-family: Barlow-Bold;
    text-transform: uppercase;
    border-radius: 3px;
    margin-top: -2px;
}
/*
.tag-navbar:before
{
    position: absolute;
    left: 5px;
    top: 10px;
    content: '';
    background: var(--red);
    width: 7px;
    height: 7px;
    border-radius: 100%;
}*/

.navbar-block
{
    width: var(--mycontainer);
    min-height: 300px;
    background: white;
    position: fixed;
    top: 68px;
    z-index: 7;
    padding-bottom: 7px;
}

.navbar-block-menu>a
{

    text-decoration: none;
}

.navbar-block-menu>a>h4
{
    padding-top: 15px;
    font-family: Barlow-Medium;
    font-size: 16px;
    color: var(--black);
    transition: 0.3s;
}

.navbar-block-menu>a:hover>h4
{
    color: var(--red);
}

.navbar-block-menu>hr
{
    margin-bottom: 4px;
}

.navbar-block-menu>div>div>div
{
    /*line-height: 30px;*/
    padding-left: 10px;
}
.navbar-block-menu>div>div>div>h5
{
    color: var(--black);
    font-family: Barlow-SemiBold;
    font-size: 15px;
}

.navbar-block-menu>div>div>a
{
    color: var(--black);
    text-decoration: none;
    font-size: 13px;
    transition: 0.3s;
    border-radius: 3px;
    /*line-height: 35px;*/
}

.navbar-block-menu>div>div>a:hover
{

    color: var(--pink);
}
.navbar-block-menu-h5
{
    height: 40px;
    display: flex;
    overflow: hidden;
}

.navbar-block-menu>div>div>a>div
{
    height: 40px;
    padding-left: 10px;
    background: transparent;
    display: flex;
    overflow: hidden;
}

.navbar-block-menu>div>div>a:hover>div
{
    background: var(--block);
}
@media screen and (max-width: var(--mycontainer)) {
    .navbar-block
    {
        top: 58px;
    }
}
.navbar-black>div>div>ul>li>.active { color: var(--red); }
.navbar-black>div>div>ul>li>.link-navbar:hover { transition: 0.3s; color: var(--red); }
.navbar-red>div>div>ul>li>.active { color: var(--black); }
.navbar-red>div>div>ul>li>.link-navbar:hover { transition: 0.3s; color: var(--black); }
.navbar-white>div>div>ul>li>.active{ color:var(--red); }
.navbar-white>div>div>ul>li>.link-navbar:hover {transition: 0.3s; color:var(--red); }

/*--------------------------FIN NAVBAR--------------------------*/
/*-----------------------------LOGIN----------------------------*/
.login-cadre
{
    background: var(--black);
    height: 100vh;
    width: 100vw;
    display: flex;
}
.login-cadre>form
{
    margin: auto;
    max-width: 100%;
    display: flex;
    justify-content: center;
}
.login-cadre>form>input
{
    background: none !important;
    height: 50px;
    color: var(--red) !important;
    max-width: calc(100% - 20px);
    font-size: 60px;
    border: none;
    border-left: 2px solid var(--red);
    padding-bottom: 10px;
    text-align: left;
}
/*---------------------------FIN LOGIN--------------------------*/
/*---------------------------DASHBOARD--------------------------*/
.dashboard-main
{
    position: absolute;
    right: 0;
    bottom: 0;
    top: 0;
    overflow: hidden;
    /*z-index: 1;*/
    background: #EBEDEF;
    transition: 0.3s;
}
.dashboard-main-lg { left: 60px; }
.dashboard-main-sm { left: 230px; }

.main-menu-dash{
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    overflow: hidden;
    z-index: 3;
    background: white;
    transition: 0.3s;
}

.main-menu-dash-sm { width: 60px; }
.main-menu-dash-lg { width:  230px; }

.menu-dash-logo
{
    height: 60px;
    display: flex;
}

.menu-dash-logo>img
{
    max-height: 45px;
    margin-left: 11px;
    margin-top: auto;
    margin-bottom: auto;
}

.main-menu-contextual
{
    height: 60px;
    width: 100%;
    background: white;
}

.ctn-dash
{
    height: calc(100vh - 40px); /*calc(100vh - 60px)  ou 100%*/
    width: 100%;
    overflow: auto;
}

.alert-message
{
    background: var(--red);
    border-radius: 30px;
    height: 30px;
    width: 30px;
    color: white;
    font-size: 12px;
    padding: 5px 10px;
    margin-left: 20px;
}

.nav-dash-section-bt
{
    width: 100%;
    height: 60px;
    background: white;
    text-align: right;

}
.nav-dash-section-bt>button
{
    margin: 5px;
    height: 50px;
    width: 50px;
    background: transparent;
    color:var(--black);
    border-radius: 50px;
    border:none;
    transition: 0.3s;
}

.nav-dash-section-bt>button:hover
{
    background: var(--red);
    color: white;
}
.menu-dash-items, .menu-dash-sous-items
{
    width: 210px;
    transition: 0.2s;
    padding-top: 10px;
    padding-bottom: 10px;
    margin: 0px 10px;
    border-radius: 5px;

}

.menu-dash-items:hover, .menu-dash-sous-items:hover
{
    background: var(--block);
    color: var(--pink);
}

.menu-dash-link
{
    text-decoration: none;
    font-size: 15px;
    font-family: Barlow-Medium;
    color: var(--black) !important;
}

.menu-dash-items>i
{
    padding-left: 12px;
    font-size: 15px;
    padding-right: 22px;
    color: var(--pink);
}

.menu-dash-items-card
{
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
}

.menu-dash-sous-items>i
{
    font-size: 15px;
    padding-left: 60px;
    padding-right: 22px;
}

.btn-disconnection
{
    position: fixed;
    height: 30px;
    width: 30px;
    z-index: 1;
    border-radius: 30px;
    background: #EBEDEF;
    border: none;
    right: 10px;
    bottom: 10px;
    text-align: center;
    color: var(--black);
    transition: 0.3s;
}

.btn-disconnection:hover
{
    color: var(--red);
}

@keyframes mytoast {
    0%{
        bottom: -150px;
        opacity: 0;
    }
    20%
    {
        bottom: 25px;
        opacity: 1;
    }
    80% {
        bottom: 25px;
        opacity: 1;
    }
    100%
    {
        bottom: -150px;
        opacity: 0;
    }
}
.mytoast
{
    position: fixed;
    max-height: 100px;
    min-width: 200px;
    border-radius: 3px;
    border: none;
    right: 25px;
    bottom: 25px;
    text-align: left;
    color: white;
    transition: 0.3s;
    background: var(--black);
    padding: 10px;
    z-index: 4;
    animation: 3s mytoast ease-in-out forwards;
}
.mytoast>p
{
    margin: 0;
}

.dashboard-button
{
    background: var(--black);
    border: none;
    border-radius: 3px;
    color: white;
    height: 40px;
    padding: 0 15px;
    cursor: pointer;
    transition: 0.3s;
    font-family: Barlow-SemiBold;
    font-size: 13px;
}
.dashboard-button:hover
{
    background: var(--red);
}

.dashboard-button-fixed
{
    position: fixed;
    z-index: 4;
    top: 10px;
    right: 10px;
    text-decoration: none;
}
.dashboard-button-fixed:hover
{
    color: white; !important;
}
.tags-liste
{
    line-height: 30px;
}

.tags-liste>span
{
    background: var(--block);
    color: var(--black);
    padding: 5px 10px;
    font-family: Barlow-Medium;
    font-size: 14px;
    cursor: pointer;
    border-radius: 3px;
    transition: 0.3s;
    margin-top: 2px;

}

.tags-liste>span:hover
{
    background: var(--red);
    color: white;
}

.pagination-dash>li
{
    font-family: Barlow-Medium;
    font-size: 14px;
    cursor: pointer !important;
    transition: 0.3s;

}
.pagination-dash>li>a
{
    color: var(--black) !important;
}
.pagination-dash>li:hover>a
{
    background-color: var(--pink) !important;
    border-color: var(--pink) !important;
    color: white !important;
}

.pagination-dash>.active>a
{
    background-color: var(--pink) !important;
    border-color: var(--pink) !important;
    color: white !important;
}

.pagination-dash>.disabled>a
{
    background-color: #CED4DA !important;
    border-color: #CED4DA !important;
    color: var(--black) !important;
}

.pagination-dash>.disabled:hover>a
{
    background-color: #CED4DA !important;
    border-color: #CED4DA !important;
    color: var(--black) !important;
}
/*-------------------------FIN DASHBOARD------------------------*/
/*--------------------------DASH ARTICLE------------------------*/
.textarea-article {
    width: 100%;
    height: calc(100vh - 110px);
    border: 1px solid #CED4DA !important;
    font-size: 14px;
    font-family: Barlow-Regular;
    resize: none;
}

.textarea-article-2 {
    width: 100%;
    height: 150px;
    border: 1px solid #CED4DA !important;
    font-size: 14px;
    font-family: Barlow-Regular;
}

.article-button
{
    padding: 10px 20px;
    border: none;
    background: var(--pink);
    color: white;
    font-family: Barlow-Regular;
    font-size: 14px;
    border-radius: 3px;
    cursor: pointer;
    transition: 0.3s;
}

.article-button:hover
{
    background: var(--red);
}

.article-button-outline
{
    padding: 10px 20px;
    border: 1px solid var(--pink);
    background: transparent;
    color: var(--pink);
    font-family: Barlow-Regular;
    font-size: 14px;
    border-radius: 3px;
    cursor: pointer;
    transition: 0.3s;
}

.article-button-outline:hover
{
    background: var(--pink);
    color: white;
}

.cadre-article-dash
{
    width: 100%;
    height: 180px;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
}

.cadre-article-dash-contain
{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 20px;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    overflow: hidden;
}

.cadre-article-dash-contain>div
{
    margin: auto;
}

.cadre-article-dash-contain>div>h3
{
    position: relative;
    text-decoration: none;
    font-family: Barlow-SemiBold;
    font-size: 14px;
    text-transform: uppercase;
    color: var(--pink);
    line-height: 1.7 !important;
}

.cadre-article-dash-contain>span
{
    font-size: 12px;
    padding: 3px 7px;
    border-radius: 3px;
    font-family: Barlow-Medium;
}
.cadre-article-dash-contain>span:nth-child(1)
{
    position: absolute;
    top: 5px;
    right: 5px;
    border-radius: 3px;
}

.cadre-article-dash-contain>span:nth-child(2)
{
    position: absolute;
    top: 5px;
    left: 5px;
    background: var(--black);
    color: white;
    border-radius: 3px;
}

.cadre-article-dash-contain-after
{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 20px;
    background: var(--black);
    padding-left: 2px;
    padding-bottom: 2px;
    overflow: hidden;
}

.cadre-article-dash-contain-after>p
{
   font-family: Barlow-Medium;
    color: white;
    font-size: 12px;
}

.before-cadre-article-dash>div>div>div>h3:after
{
    content: '';
    width: 0;
    height: 2px;
    background: var(--pink);
    display: block;
    margin: auto;
    margin-top: 5px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.before-cadre-article-dash:hover>div>div>div>h3:after
{
    width: 60%;
}

.before-cadre-article-dash>div>div>div:after
{
    content: 'Modifier';
    font-family: Barlow-SemiBold;
    font-size: 12px;
    color: var(--black);
    text-transform: uppercase;
    opacity: 0;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.before-cadre-article-dash:hover>div>div>div:after
{
    opacity: 1;
}

.article-visualisation
{
    color: #6c757d;
    text-decoration: none;
    font-size: 14px;
    font-family: Barlow-SemiBold;
    padding-right: 12px;
}


.article-tags
{
    line-height: 30px;
}

.article-tags>a
{
    padding: 5px 10px;
    font-family: Barlow-Medium;
    font-size: 14px;
    border-radius: 3px;
    transition: 0.3s;
    margin-top: 2px;
    text-decoration: none;
    background-color: var(--pink);
    cursor: pointer;
    color: white;
}

.article-tags>a>i
{
    font-size: 11px;
}

.article-tags>a:hover
{
    background-color: var(--red);
}
/*------------------------FIN DASH ARTICLE----------------------*/
/*--------------------------DASH GALERIE------------------------*/
/*drag n drop*/
.file-upload {
    background: white;
    width: 100%;
    height: 150px;
    /*position: relative;*/
}

.file-upload-input {
    position: absolute;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    outline: none;
    opacity: 0;
    cursor: pointer;
    z-index: 20;
}

.image-upload-wrap {
    margin-top: 20px;
    position: relative;
    height: 100%;
    border: 2px dashed var(--pink);
    /*height: auto;
    margin-bottom: 20px;*/
}

.image-dropping {
    background-color: var(--pink);
    border: 2px dashed var(--pink);
}

.container-before-drop
{
    height: 100%;
    width: 100%;
    color: var(--pink);
    font-size: 16px;
}
.container-drop
{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    background: var(--pink);
    color: white;

}
.container-drop>div, .container-before-drop>div
{
    position: relative;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
}
.container-drop>div>div, .container-before-drop>div>div
{
    position: absolute;
    top: 50%; /* poussé de la moitié de hauteur du référent */
    transform: translateY(-50%); /* tiré de la moitié de sa propre hauteur */
    text-align: center;
}

.container-drop>div>div>i
{
    font-size: 70px;
}

.container-before-drop>div>div>i
{
    font-size: 30px;
}
/*Fin drag n drop*/
.container-img-galerie
{
    background: white;
    padding: 10px 10px 0;
}
/*------------------------FIN DASH GALERIE----------------------*/
/*-------------------------DASH DOCUMENTS-----------------------*/
.nav-folders
{
    width: 100%;
    background: white;
    border: 1px solid #CED4DA;
    position: relative;
}

.nav-folders-content
{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: calc(100% - 40px);
    overflow: auto;
}

.section-documents
{
    height: 100%;
    width: 100%;
    background: white;
    overflow: auto;
    border: 1px solid #CED4DA;
    padding-bottom: 40px;
}

.nav-folders-items
{
    width: calc(100% - 20px);
    transition: 0.2s;
    padding-top: 10px;
    padding-bottom: 10px;
    margin: 0px 10px;
    border-radius: 5px;

}

.nav-folders-items:hover, .nav-folders-links>.active
{
    background: var(--block);
    color: var(--pink);
}


.nav-folders-links
{
    text-decoration: none;
    font-size: 14px;
    font-family: Barlow-Medium;
    color: var(--black) !important;
}

.nav-folders-items>i
{
    padding-left: 12px;
    font-size: 14px;
    padding-right: 22px;
    color: var(--pink);
}

.nav-folders-btn-left
{
    position: absolute;
    bottom: 0;
    left: 0;
    height: 40px;
    text-align: center;
    background: var(--pink);
    color: white;
    font-size: 14px;
    font-family: Barlow-Medium;
    padding-top: 8px;
    transition: 0.3S;
    cursor: pointer;
}

.nav-folders-btn-left:hover
{
    background: var(--red);
    font-size: 15px;
    padding-top: 7px;
}

.nav-folders-btn-right
{
    position: absolute;
    bottom: 0;
    right: 0;
    height: 40px;
    text-align: center;
    background: var(--block);
    color: var(--black);
    font-size: 14px;
    font-family: Barlow-Medium;
    padding-top: 8px;
    transition: 0.3S;
    cursor: pointer;
}

.nav-folders-btn-right:hover
{
    background: var(--pink);
    color: white;
    font-size: 15px;
    padding-top: 7px;
}

.document-line
{
    transition: 0.3s;
}

.document-line:hover
{
    background: var(--block);
}

.document-line>div>div:nth-child(1)>span
{
    font-size: 13px;
    font-family: Barlow-SemiBold;
    background: #FFEAF0;
    padding: 5px 10px;
    text-align: center;
    border-radius: 2px;
    margin-right: 10px;
    color: var(--pink);
}

.document-line>div>div:nth-child(1)>p
{
    font-size: 14px;
    font-family: Barlow-Medium;
    float: right;
    margin-bottom: 0 !important;
    padding-top: 2px !important;
}

.document-line>div>div:nth-child(2)>a{ float: left; text-decoration: none; color: var(--black);}
.document-line>div>div:nth-child(2)>div{ float: right; }
.document-line>div>div:nth-child(2)>a>div
{
    font-size: 11px;
    padding: 3px 10px;
    background: var(--block);
    border-radius: 2px;
    margin-right: 5px;
    height: 23px;
    transition: 0.3s;
    cursor: pointer;

}
.document-line>div>div:nth-child(2)>div>div
{
    line-height: normal; !important;
}

.document-line>div>div:nth-child(2)>div>div>.btn
{
    line-height: normal !important;
    font-size: 11px;
    padding: 5px 10px !important;
    height: 23px;
    border: none !important;
    background: var(--block);
    border-radius: 2px;
    transition: 0.3s;
    cursor: pointer;
}

.document-line:hover>div>div:nth-child(2)>a>div{background: white;}
.document-line:hover>div>div:nth-child(2)>div:nth-child(2)>div>.btn{background: white;}
.document-line>div>div:nth-child(2)>div:nth-child(2)>div>.dropdown-menu{
    font-size: 12px;
    font-family: Barlow-Medium;
}
.document-line>div>div:nth-child(2)>div:nth-child(2)>div>.dropdown-menu>li>.dropdown-item{
    padding: .25rem .5rem;
}

.upload-button
{
    padding: 9px 20px;
    background: white;
    border: 1px solid #CED4DA;
    color: var(--pink);
    font-family: Barlow-Regular;
    font-size: 14px;
    border-radius: 10px;
    cursor: pointer;
    text-align: center;
    width: 100%;
    transition: 0.3s;
}

.upload-button:hover
{
    background: var(--black);
    color: white;
}
/*-----------------------FIN DASH DOCUMENTS---------------------*/
/*-------------------------DASH TYPE LABEL----------------------*/
.table_type_label
{
    max-width: 100%;
}
.table_type_label_item
{

}
/*-----------------------FIN DASH TYPE LABEL--------------------*/
/*-------------------------DASH SERVICES------------------------*/
.nav-pills-services-dash .nav-item
{
    width: calc(100% / 4);
    background: white;
}
.nav-pills-services-dash .nav-link
{
    background: 0 0;
    border: 0;
    border-radius: 0;
    width: 100%;
    display: block;
    padding: .5rem 1rem;
    color: var(--black);
    font-family: Barlow-SemiBold;
    text-decoration: none;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
}

.nav-pills-services-dash .nav-link.active
{
    color: #fff;
    background-color: var(--red);
}

.link-service-plus
{
    text-decoration: none;
}
.link-service-plus>button
{
    background: var(--block) !important;
    color: var(--black);
    transition: 0.3s;
}
.link-service-plus>button:hover
{
    background: var(--pink) !important;
    color: white;
    transition: 0.3s;
}
.section-dash-services
{
    height: calc(100vh - 103px);
    width: 100%;
    overflow-x: auto;
}
.services-dash-block
{
    width: 100%;
    min-height: 100px;
    background-color: white;
    border-radius: 5px;
    box-shadow: rgba(8, 9, 10, 0.1) 0px 0px 0px 1px;
    position: relative;
}
.services-dash-block>.service-dash-switch
{
    position: absolute;
    top: 5px;
    right: 2px;
    z-index: 3;
}
.services-dash-block-container
{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    display: flex;
    border-radius: 5px;
    background: white;
    text-decoration: none;
    text-align: center;
    transition: 0.3s;
    overflow: hidden;
}
.form-check-input:checked
{
    background-color: var(--pink);
    border-color: var(--pink);
}
.services-dash-block-container>h3
{
    margin: auto;
    font-size: 14px;
    color: var(--black);
}

.services-dash-block-container:hover
{
    background: var(--pink);
    cursor: pointer;
}

.services-dash-block-container:hover>h3
{
    color: white;
}
.titre-services
{
    font-size: 16px;
    font-family: Barlow-SemiBold;
    color: var(--black);
}
.input-titre-services
{
    width: 402px;
    max-width: calc(100% - 30px);
    font-size: 16px;
    font-family: Barlow-SemiBold;
    color: var(--black);
    background: transparent;
    border: none;
}
/*-----------------------FIN DASH SERVICES----------------------*/
/*-----------------------------DASH-----------------------------*/
/*BTN Maintenance*/
.slider-toggle {
    display: none;
    visibility: hidden;
}

.slider-button,
.slider-content,
.slider {
    transition: all 500ms ease-in-out;
}

.slider-viewport {
    border: 1px solid #858585;
    display: block;
    height: 30px;
    overflow: hidden;
    width: 90px;
    position: relative;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    float: right;
    user-select:none;
}

.slider {
    height: 100%;
    position: relative;
    width: 200%;
}

.slider-button {
    background-size: 100%;
    background: #e6e6e6;
    box-shadow: 0px 0px 3px #000;
    box-sizing: border-box;
    position: absolute;
    display: block;
    top: 0;
    height: 30px;
    width: 60px;
    cursor: pointer;
    border-radius: 2px;
}

.slider-content {
    box-shadow: rgba(0, 0, 0, 0.2) 0 0 5px inset;
    background: white;
    cursor: pointer;
    display: inline-block;
    float: left;
    height: 100%;
    width: 64px;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    top: 10px;
}
.slider-content span {
    text-shadow: rgba(0, 0, 0, 0.1) 1px 1px 2px;
    height: 100%;
    line-height: 20px;
    float: left;
}

.sl-left {
    background: lime;
    color: #005e00;
    background-size: 100%;
}
.slider-viewport.light .sl-left {
    background: var(--black);
}
.sl-left span {
    margin: 3px 18px;
}

.sl-right {
    background: var(--red);
    color: white;
    background-size: 100%;
}
.sl-right span {
    float: right;
    margin: 3px 18px;
}

.slider-toggle + .slider-viewport > .slider { left: -100%; }
.slider-toggle + .slider-viewport .slider-button { left: 60px;}
.slider-toggle + .slider-viewport .slider-content { width: 88px;}
.slider-toggle + .slider-viewport .sl-left { margin-left: 0; }
.slider-toggle:checked + .slider-viewport > .slider { left: 0; }
.slider-toggle:checked + .slider-viewport .slider-button { left: 60px; }
.slider-toggle:checked + .slider-viewport .sl-left { margin-left: 0;}
/*---------------------------FIN DASH---------------------------*/