/**
 *
 * Apply your custom CSS here
 *
*/


body {
    height: 100%;
    /*color:#b62d77*/
    --main-color: #1678b9;
    --main-color-light: #88b0ca;

    --bg-color: #555;
    --text-color: #555;
    --text-color-inverted: #f5f5f5;
  /*font-family: Raleway, 'Helvetica Neue', Arial, Helvetica, sans-serif;*/
}

body.user{
    --main-color: #1678b9;
    --main-color-light: #88b0ca;

    --bg-color: #1EA5FE;
    --bg-color-light: #50b9ff;

    --default-text-color: #555;
    --text-color: #1EA5FE;
    --text-color-inverted: #f5f5f5;
}
body.sec{
    
    --main-color: #892c5e;
    --main-color-light: #88b0ca;

    --bg-color: #9d2163;
    --bg-color-light: #b62d77;
    
    --default-text-color: #555;
    --text-color: #9d2163;
    --text-color-inverted: #f5f5f5;
}

a[disabled], a[disabled]:hover {
   pointer-events: none;
}

a:link {
    text-decoration: none;
	font-size: 1rem;
}

a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

a:active {
    text-decoration: none;
}

.body {
    min-height: calc(100vh - 292px);
}

.fade-in-effect {
    opacity: 0;
    -webkit-transition: opacity 500ms ease-in;
    -moz-transition: opacity 500ms ease-in;
    -ms-transition: opacity 500ms ease-in;
    -o-transition: opacity 500ms ease-in;
    transition: opacity 500ms ease-in;
}

    .fade-in-effect.in {
        opacity: 1;
    }


.login-container {
    max-width: 960px;
    margin: 0 auto;
}

.label.primary {
    background-color: var(--main-color);
    color:var(--text-color-inverted);
}


/* ////////////////////////// Couleurs des interfaces de gestion */
/*.page-header-usr {
    background: var(--bg-color);
    padding: 5rem 0;
}

.page-header-sec {
    padding: 5rem 0;
}*/


.page-header {
    background:  var(--bg-color);
    color: var(--text-color-inverted);
    padding: 5rem 0;
}

.page-header .header{
    color: var(--text-color-inverted);
}

.page-header-usr i.search {
    color: var(--text-color);
}
i.search {
    color: var(--text-color);
}

.sec.text.inverted{
    color:#f5f5f5;
}
.sec.text{
    color:#9d2163;
}
.sec.bg{
    background-color:var(--sec-bg-color);/*#9d2163;*/
    color: #f5f5f5;
}


.ui.segment.page-loading-overlay {
    position: fixed;
    height: 100%;
    width: 100%;
    left: 0px;
    top: 0px;
    border-radius: 0;
    margin: 0px;
    padding: 0px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity 1s ease-in;
    -moz-transition: opacity 1s ease-in;
    -ms-transition: opacity 1s ease-in;
    -o-transition: opacity 1s ease-in;
    transition: opacity 1s ease-in;
    z-index: 50;
}

.ui.dimmer {
    opacity: 0;
    -webkit-transition: opacity 5ms ease-in;
    -moz-transition: opacity 5ms ease-in;
    -ms-transition: opacity 5ms ease-in;
    -o-transition: opacity 5ms ease-in;
    transition: opacity 5ms ease-in;
}

.ui.segment.page-loading-overlay.loading {
    visibility: visible;
    opacity: 1;
}

.hidden {
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 1s ease-in;
    -moz-transition: opacity 1s ease-in;
    -ms-transition: opacity 1s ease-in;
    -o-transition: opacity 1s ease-in;
    transition: opacity 1s ease-in;
}

.visible {
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity 1s ease-in;
    -moz-transition: opacity 1s ease-in;
    -ms-transition: opacity 1s ease-in;
    -o-transition: opacity 1s ease-in;
    transition: opacity 1s ease-in;
}

.ui.segment {
    border: none;
    border-radius: 0;
    box-shadow: 0 10px 50px rgba(27,31,35,0.07) !important;
    /*padding: 3rem;*/
}


.ui.form .no-border {
    border: none !important;
    background: transparent !important;
}

.ui.form .no-border {
    border: none !important;
    background: transparent !important;
}


.ui.k-l-btn {
    background: var(--main-color);
    border: 1px solid var(--main-color);
    border-radius: 2px;
    font-size: 14px;
    color: #fff;
    padding: .9rem 1.5rem;
    outline: 0 !important;
}

    .ui.k-l-btn:hover, .ui.k-l-btn:focus {
        background: var(--main-color);
        font-size: 14px;
        color: #fff;
    }

.no-bg {
    background-color: transparent;
}

.no-padding {
    padding: 0px;
}

.floating.menu{
    position: fixed !important;
    right: 0;
    bottom: 10%;
    margin-right: 3%;
    background-size: 32px 36px;
    width: 65px;
    text-align:center;
}

.floating.menu .item{
    margin:10px;
    display:block;
    background: var(--bg-color);
    width: 65px;
    height: 65px;
    border-radius: 50%;
    line-height: 72px;
    text-align: center;
    outline: none;
    box-shadow: 0 0 5px #666;
    transition: opacity .08s linear,-webkit-transform .16s linear;
    -webkit-transition: opacity .08s linear,-webkit-transform .16s linear;
    transition: transform .16s linear,opacity .08s linear;
    transition: transform .16s linear,opacity .08s linear,-webkit-transform .16s linear;
}


.floating.menu .item.grey{
    background-color:grey;
}

.floating.menu .item i{
    color: #fff; 
    font-size: 25px
}

.btn-group-sm .btn-fab {
    position: fixed !important;
    right: 29px;
}

.btn-group .btn-fab {
    position: fixed !important;
    right: 0;
    bottom: 10%;
    margin-right: 3%;
    background-size: 32px 36px;
    background: var(--bg-color);
    width: 65px;
    height: 65px;
    border-radius: 50%;
    line-height: 72px;
    text-align: center;
    outline: none;
    box-shadow: 0 0 5px #666;
    transition: opacity .08s linear,-webkit-transform .16s linear;
    -webkit-transition: opacity .08s linear,-webkit-transform .16s linear;
    transition: transform .16s linear,opacity .08s linear;
    transition: transform .16s linear,opacity .08s linear,-webkit-transform .16s linear;
    /*z-index: 1;*/
}

/*

        Nav Bar
        */
.navigation .ui.menu a.item:hover {
    background: none;
}

.navigation .ui.menu a.item::before {
    border-radius: 0;
    background: #f4f7f9;
}

.navigation .ui.menu .icon-box.active > i {
    color: #fff;
    background: var(--main-color);
}


.navigation .ui.menu .icon-box > i {
    width: 60px;
    height: 60px;
    line-height: 60px;
    color: var(--main-color);
    font-size: 20px;
    border-radius: 50%;
    background: #fff;
    margin-bottom: .6rem;
}



    .navigation .ui.menu .icon-box > i:hover {
        background:  var(--main-color);
        color:var(--text-color-inverted);
        transition: all .3s ease-in-out;
    }


.navigation .ui.menu .icon-box > img {
    width: 60px;
    height: 60px;
    line-height: 60px;
    color: var(--main-color);
    font-size: 20px;
    border-radius: 50%;
    background: #fff;
    margin-bottom: .6rem;
}
    .navigation .ui.menu a.item.profile:hover {
        background:  var(--text-color-inverted);
    }


.navigation .ui.menu .icon-box .item-desc {
    text-transform: uppercase;
    font-weight: 400;
    font-family: "Segoe UI Semibold", sans-serif;
    color: #555;
    font-size: 12px;
}

.navigation .ui.menu .dropdown.profile .icon-box {
    min-width: 200px;
}


.navigation .ui.menu .icon-box .float-red-lab {
    top: 30%;
    left: auto;
    right: 0;
    z-index: 0;
}

/*----*/

.navigation .ui.menu .user-profile-title span {
    float: right;
    display: inline;
    cursor: pointer;
    margin-right: 15px;
}

.navigation .ui.menu .user-profile-dropdown {
    padding: 15px;
    display: block;
    background-color: rgba(0, 0, 0, 0.03);
    white-space: normal;
    min-width: 400px;
}

    .navigation .ui.menu .user-profile-dropdown .user-profile-dropdown-field {
        padding: 10px;
    }

        .navigation .ui.menu .user-profile-dropdown .user-profile-dropdown-field .nav-multitag-container .multival-container .multival-tag, .nav-multitag-container .multival-container0 .multival-tag {
            margin: 2px;
        }

        .navigation .ui.menu .user-profile-dropdown .user-profile-dropdown-field .nav-multitag-container .devices-id-container {
            border: none;
            margin-top: 8px;
            min-height: 40px;
            width: 100%;
        }

            .navigation .ui.menu .user-profile-dropdown .user-profile-dropdown-field .nav-multitag-container .devices-id-container .input-tags-container {
                width: 100%;
            }

        .navigation .ui.menu .user-profile-dropdown .user-profile-dropdown-field .voir-profil-nav-btn {
            width: 100%;
            margin-top: 10px;
            background-color: rgba(0, 0, 0, 0.08);
        }

            .navigation .ui.menu .user-profile-dropdown .user-profile-dropdown-field .voir-profil-nav-btn:hover {
                background-color: var(--main-color);
            }

        .navigation .ui.menu .user-profile-dropdown .user-profile-dropdown-field .save-profil-nav-btn {
            width: 100%;
            margin-top: 10px;
        }

.navigation .ui.menu .cgu-validate-link {
    color: red;
}

.navigation .ui.menu .profile-view {
    background-color: rgba(0, 0, 0, 0.04);
    cursor: pointer;
}

/*
        Result section
        */

.res-sec {
    border: 1px solid transparent;
}

    .res-sec .ui.container {
        margin: 3rem 0;
        /*box-shadow: 0 10px 50px rgba(27,31,35,0.07) !important;*/
        padding: 2rem;
    }

    .res-sec .ui.grid.pagination .ui.menu {
        border-radius: 0;
        box-shadow: none;
        height: 20px !important;
    }

    .res-sec .ui.grid.pagination .ui.dropdown {
        border-radius: 0;
        width: 10% !important;
        cursor: pointer;
        height: 39.5px !important;
    }

    .res-sec .ui.container {
        margin: 3rem 0;
        padding: 2rem;
    }

.hide {
    display: none;
}

.pagination {
}

    .pagination button {
        display: inline-block;
        float: left;
        padding: 1px 3px;
        background: #f5f5f5;
        border: 1px solid #eee;
        margin: 5px 2px;
    }

.crnt-pagination-btn {
    background: var(--bg-color); !important;
    color: #6a737b;
}

.pagination button {
    padding: 8px 15px;
    border-radius: 2px;
    cursor: pointer;
}

.crnt-pagination-btn {
    color: #fff;
    border: 1px solid var(--bg-color); !important;
}

.no-result {
    text-align: center;
    color: var(--text-color);;
    font-size: 15px;
    padding-bottom: 20px;
}

.lightColor {
    color: #a2a2a2;
}

.ui.search.dropdown {
    width: 20px;
    display: inline;
    border-radius: 3px;
    cursor: pointer;
}

.right-btn-float .btn-float.one {
    position: fixed !important;
    right: 0;
    bottom: 22%;
    margin-right: 3%;
    background-size: 32px 36px;
    background: #fd5c63;
    width: 65px;
    height: 65px;
    border-radius: 50%;
    line-height: 72px;
    text-align: center;
    outline: none;
    box-shadow: 0 0 5px #666;
    transition: opacity .08s linear,-webkit-transform .16s linear;
    -webkit-transition: opacity .08s linear,-webkit-transform .16s linear;
    transition: transform .16s linear,opacity .08s linear;
    transition: transform .16s linear,opacity .08s linear,-webkit-transform .16s linear;
    /*z-index: 1;*/
    cursor: pointer;
}

.right-btn-float .btn-float.two {
    position: fixed !important;
    right: 0;
    bottom: 10%;
    margin-right: 3%;
    background-size: 32px 36px;
    background: var(--bg-color);;
    width: 65px;
    height: 65px;
    border-radius: 50%;
    line-height: 72px;
    text-align: center;
    outline: none;
    box-shadow: 0 0 5px #666;
    transition: opacity .08s linear,-webkit-transform .16s linear;
    -webkit-transition: opacity .08s linear,-webkit-transform .16s linear;
    transition: transform .16s linear,opacity .08s linear;
    transition: transform .16s linear,opacity .08s linear,-webkit-transform .16s linear;
    /*z-index: 1;*/
    cursor: pointer;
}

.res-sec .ui.container .res-options-search {
    padding: 2rem 1.5rem;
    box-shadow: 0 10px 50px rgba(27,31,35,0.07) !important;
}

    .res-sec .ui.container .res-options-search .ui.right.floated.horizontal.list {
        display: none;
    }

    .res-sec .ui.container .res-options-search .ui.horizontal.list .item {
        padding-top: .8rem;
    }

.res-sec .ui.container .res-list ul {
    padding: 0;
}

    .res-sec .ui.container .res-list ul li {
        cursor: pointer;
        border: 1px solid transparent;
        padding: 1rem 2rem;
        list-style: none;
        margin-bottom: 1rem;
        box-shadow: 0 10px 50px rgba(27,31,35,0.07) !important;
    }

.res-sec .ui.container .res-pagination {
    padding: 2rem 1.5rem;
    box-shadow: 0 10px 50px rgba(27,31,35,0.07) !important;
}

.ui.second.coupled.modal.o {
    border-radius: 0;
}

    .ui.second.coupled.modal.o .actions .ui.mini.button.back {
        border-radius: 50%;
        height: 50px;
        width: 50px;
        line-height: 38px;
        float: left;
        background: #1cc7d0;
    }

    .ui.second.coupled.modal.o .actions .ui.mini.button {
        border-radius: 50%;
        height: 50px;
        width: 50px;
        line-height: 38px;
        background: #1cc7d0;
    }


.container-flex-style {
    display: flex;
}

    .container-flex-style label {
        white-space: nowrap;
    }

    .container-flex-style .devices-id-container .input-tag-id input {
        width: 100%;
    }

    .container-flex-style .devices-id-container {
        border: none;
        padding: 5px;
        margin-top: -8px;
        min-height: 40px;
        display: inline;
    }


        .container-flex-style .devices-id-container .multival-tag {
            margin: 0px 5px 5px 0px;
        }

        .container-flex-style .devices-id-container .user-multival-container .input-tags-container {
            width: 100%;
            background-color: red;
        }

/*Ajouter formation*/

.form-user .ui.divider {
    margin: 3rem 0 0 0;
}

#btn-float {
    bottom: 100px;
}

.form-user .ui.segment .ul-custom-style,
.scrolling.content .ul-custom-style {
    list-style: none;
}


/*Image upload*/

.image-upload > input {
    display: none;
}




/* Modal input */

.modal .ui.form input, .modal .ui.form .ui.dropdown {
    height: 40px;
    border-radius: 0;
}

    .modal .ui.form input:focus, .modal .ui.form .ui.dropdown:focus {
        height: 40px;
        border-radius: 0;
    }

/*
      Form
       */

.form-user {
    border: 1px solid transparent;
}

    .form-user .ui.form input {
        border-radius: 0;
        height: 35px;
    }

        .form-user .ui.form input:focus {
            border-radius: 0;
        }

    .form-user .ui.form .ui.search.dropdown {
        border-radius: 0;
    }

/*
    CGU.html SECTION
*/


.cgu-content {
    height: 100%;
    background-color: #f4f7f9;
}



    .cgu-content .pdf-container {
        width: 100%;
        height: 100%;
    }

    .cgu-content .pdf-viewer {
        transition: all linear 0.5s;
        -webkit-transition: all linear 0.5s;
        height: 100%;
    }


    .cgu-content .form-segments {
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        padding: 10px;
        background-color: white;
        margin: 0;
    }

        .cgu-content .form-segments .user-form-content {
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            flex-wrap: wrap;
        }

        .cgu-content .form-segments .user-form-condition {
            margin-left: 18px;
            margin-top: 8px;
            margin-bottom: 8px;
            padding: 0;
            flex-grow: 2;
        }

        .cgu-content .form-segments .usr-form-btn {
            margin-left: 18px;
        }

    .cgu-content .pdf-viewer {
        width: 100%;
    }

.debug {
    border: 1px solid red;
}


/*
    CGU.html CGU_VERSION VIEW SECTION
*/


.preview-cgu-container .btn-view-cgu {
    position: fixed;
    top: 55px;
    left: -48px;
    transform: rotate(90deg);
}

.preview-cgu-container .modal-cgu-view {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    display: flex;
}

    .preview-cgu-container .modal-cgu-view .cgu-display-list {
        width: 15%;
        background-color: white;
        padding: 10px;
        height: 100%;
        display: table;
    }

        .preview-cgu-container .modal-cgu-view .cgu-display-list .display-header-list {
            height: 6%;
            display: table-row;
            text-align: center;
        }

        .preview-cgu-container .modal-cgu-view .cgu-display-list .display-list-show-btn {
            position: absolute;
            top: 8px;
            left: 178px;
            display: none;
            background-color: white;
            border-radius: 2px;
            height: 30px;
            cursor: pointer;
        }

        .preview-cgu-container .modal-cgu-view .cgu-display-list .display-footer-list {
            height: 10%;
            display: table-row;
        }

            .preview-cgu-container .modal-cgu-view .cgu-display-list .display-footer-list button {
                width: 100%;
            }

        .preview-cgu-container .modal-cgu-view .cgu-display-list .divided.list {
            overflow: auto;
            display: table-row;
            margin-top: 10px;
            height: 80%;
        }

        .preview-cgu-container .modal-cgu-view .cgu-display-list .item {
            align-content: center;
        }

            .preview-cgu-container .modal-cgu-view .cgu-display-list .item .ui.segment {
                padding: 0;
                width: 100px;
            }

    .preview-cgu-container .modal-cgu-view .cgu-display-view {
        width: 85%;
    }

        .preview-cgu-container .modal-cgu-view .cgu-display-view .pdf-viewer {
            width: 100%;
            height: 100%;
        }

.show-display-cgu-list {
    left: 0 !important;
}

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

    .preview-cgu-container .modal-cgu-view .cgu-display-list {
        transition: all linear 0.5s;
        -webkit-transition: all linear 0.5s;
        width: 180px;
        position: fixed;
        left: -170px;
    }

    .preview-cgu-container .modal-cgu-view .cgu-display-view {
        width: 100%;
    }

    .preview-cgu-container .modal-cgu-view .cgu-display-list .display-list-show-btn {
        display: block;
    }
}



/*
    Login Partial
*/
.navigation .item.ui.dropdown.profile .label-red {
    background-color: #DB2929;
    color: white;
    padding: 4px;
    border-radius: 3px;
    margin: 3px;
}

.navigation .item.ui.dropdown.profile .label-yellow {
    background-color: #FBBD08;
    color: white;
    padding: 4px;
    border-radius: 3px;
}

.column.k-l-form-footer {
    max-width: 420px;
    background: transparent;
}

.column.k-l-form {
    max-width: 420px;
    background: #fff;
    box-shadow: 0 10px 50px rgba(27,31,35,0.07) !important;
}


    .column.k-l-form .k-l-logo {
        margin: 2.5rem 0;
    }

    .column.k-l-form .content-form {
        margin: 20px 15px;
    }

        .column.k-l-form .content-form .login-field {
            border: 1px solid #e7ecee;
            padding: 6px 10px;
            margin-bottom: 5px;
            border-top-left-radius: 0.25rem;
            border-top-right-radius: 0.25rem;
        }

        .column.k-l-form .content-form .field-login-btn {
            padding-top: 15px;
        }


        .column.k-l-form .content-form p {
            text-align: center;
            padding-top: 15px;
        }

.ui.container .k-l-form-content {
    padding-top: 20px;
}

    .ui.container .k-l-form-content .k-l-form {
        padding: 20px 0;
        background: transparent !important;
    }


/* User Page*/
.ui.form .inline.field > label{
    /*color: var(--main-color);*/
}

.obj.page .form .input[tupe="text"]{
    border-radius: 0px; 
    height: 32px; 
    box-shadow: 0 0 0 1px #0099e5; 
    border: none
}

.obj.page .form .field > label{
    color: var(--main-color);
}

.obj.page .form .inline.field > input,
.obj.page .form .container-flex-style.field > input{
    margin-left:5px;   
}

.obj.page .form .inline.field > span,
.obj.page .form .container-flex-style.field > span{
    margin-left:5px;   
}

.search.results {

}
.search.results .result-item{
    cursor:pointer; 
    width:100%; 
    border: 1px solid transparent; 
    padding: 1rem 2rem; 
    list-style: none; 
    margin-bottom: 1rem;  
    box-shadow: 0 10px 50px rgba(27,31,35,0.07) !important;
}

.search.results .result-item .list{
    width:100%; 
    height:80px;
    margin: 1.5rem
}
.search.results .result-item .list .item .image.accent{
 
    border-radius: 3px;
}
.search.results .result-item .list .item .image.accent{
   background-color: #C0C0C0;
    border-radius: 50%;
    width:80px;
    height:80px;
    text-align:center;
    vertical-align:middle;
    outline:none;
}
    .search.results .result-item .list .item .image img {
        width: 60px;
        text-align:center;
    }


.plan-marker{
    color:var(--text-color-inverted);
    background-color:var(--bg-color-inverted); 
    cursor:pointer;
    /*margin-top:20px; 
    border-radius:50%;
    width:50px;
    height:50px;
    text-align:center;
    vertical-align:middle;
    padding:5px;*/
}
.plan-marker img {
    background-color:var(--text-color-inverted) !important;
    padding:5px;
    
}
.plan-marker i {
    color:red;
    font-size:2em;
}

.visible-modal{
  margin-top: auto !important;
  display: inline-block !important;
  position: relative;

  top: 20%;
  
    -webkit-transition: visibility 500ms ease-in;
    -moz-transition: visibility 500ms ease-in;
    -ms-transition: visibility 500ms ease-in;
    -o-transition: visibility 500ms ease-in;
    transition: visibility 500ms ease-in;
  
    -webkit-transition: top 300ms ease-in;
    -moz-transition: top 300ms ease-in;
    -ms-transition: top 300ms ease-in;
    -o-transition: top 300ms ease-in;
    transition: top 300ms ease-in;

}

.clickable,
.clickable label{
    cursor:pointer;
}


.search.form.solo{
    /*margin-top: 50px;
    -webkit-transition: margin-top 300ms ease-in;
    -moz-transition: top margin-top ease-in;
    -ms-transition: top margin-top ease-in;
    -o-transition: top margin-top ease-in;
    transition: top margin-top ease-in;*/
}
.search.form.solo .field{
    /*background: transparent;*/ 
   
}
.search.form.solo .input{
    /*border-width:1px;
    border-color: var(--bg-color);*/
}

.search.form .field{
    background: var(--bg-color); 
    padding: 5rem 0
}