/* ========================================
    GENERAL
======================================== */

/* All */
*{ font-family:Roboto,sans-serif; user-select:none; -webkit-user-select:none; -moz-user-select:none; }

/* Html Body{ width:100%; height:100%; overflow:hidden; -webkit-overflow-scrolling:auto; margin:0px; padding:0px; box-sizing:border-box; background-color:rgb(245,245,245); box-sizing:border-box; } */
html,body{ position:relative; margin:0px; padding:0px; background-color:/* rgb(244,245,246) */white; box-sizing:border-box; width:100%; height:100%; overflow:hidden; }
body{ transition:padding 0.5s; }

/* Colors */
.gkit-blue{ color:rgb(0,160,220); }
.gkit-red{ color:rgb(255,150,150); }
.gkit-green{ color:rgb(67,160,71); }
.gkit-grey{ color:rgb(130,130,130); }

/* Custom hr */
gkit_hr{ display:block; height:2px; background-color:rgb(0,160,220); }

/* Bounce effect */
.gkit-anim-bounce-effect{ animation-name:anim_bounce_effet; animation-duration:0.4s; animation-iteration-count:1; transition-timing-function:cubic-bezier(0, 1, 0, 1); }

/* Container */
.gkit-container{ display:block; width:100%; max-width:1150px; margin:auto; padding:0px 20px; box-sizing:border-box; transition:0.6s; }
@media (max-width:500px){ .gkit-container{ padding:0px 10px; } }

/* Content */
.gkit-content{ background-color:transparent; margin-bottom:100px; }

/* Bottom spacer */
.gkit-bottom-margin{ display:block; height:0; margin-bottom:100px; }

/* Brackets */
.gkit-bracket{ font-size:50px; font-weight:600; }
@media (max-width:1000px){  .gkit-bracket{ font-size:40px; }  }
@media (max-width:800px){   .gkit-bracket{ font-size:30px; }  }
@media (max-width:600px){   .gkit-bracket{ font-size:30px; }  }
@media (max-width:400px){   .gkit-bracket{ font-size:30px; }  }

/* Clearfix (wraping) */
.clearfix{ clear:both; }

.error {
    color: red;
}



/* ========================================
    LOADING
======================================== */
apploading{ display:block; position:absolute; z-index:+100; top:0; left:0; width:100%; height:100%; background-color:transparent; padding:0px; box-sizing:border-box; background-color:white; pointer-events:none; }
apploading .box{ display:block; width:100%; margin:auto; margin-top:45vh; transform:translateY(-50%); box-sizing:border-box; padding:0px 20px; }
apploading .box .img-container{ display:block; margin:0 auto 10px auto; width:50px; height:50px; }
apploading .box .img-container img{ width:100%; height:100%; object-fit:cover; }
apploading .box .description-container{  }
apploading .box .description-container .description{ display:block; width:100%; color:#4D5455; font-family:sans-serif; font-size:20px; font-weight:300; text-align:center; }



/* ========================================
    CONTENT
======================================== */
/* General */
content{ display:block; position:relative; height:100%; text-align:left; padding-top:0px; box-sizing:border-box; margin-top:0px; overflow-x:hidden; overflow-y:auto; -webkit-overflow-scrolling:touch; background-color:transparent; }
content button{ -webkit-appearance:none; border:none; border-radius:50px; background-color:rgb(116,167,255); color:white; height:auto; line-height:30px; padding:0px 10px; font-size:15px; }
/* Title */
content h3{ font-size:30px; color:rgb(64,142,211); margin-top:0px; }
@media (max-width:1000px){  content h3{ font-size:30px; }  }
@media (max-width:800px){  content h3{ font-size:20px; }  }
/* List */
content list{ display:block; width:100%; height:100%; margin:0px; padding:0px; box-sizing:border-box; overflow-x:hidden; overflow-y:auto; }
content list .list_infos{ margin:20px 0px; margin-bottom:40px; text-align:justify; font-family:'Poppins'; text-transform:italic; }
content .gkit-infos{ margin:20px 0px; margin-bottom:40px; text-align:justify; font-family:'Poppins'; text-transform:italic; }



/* ========================================
    LOADING
======================================== */
loading{ opacity:0; pointer-events:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:100; background-color:rgba(245, 245, 245, 0.9); transition: opacity 0.4s; }
loading .box{ position:absolute; top:50%; left:50%; width:90%; transform:translate(-50%,-50%); text-align:center; }
loading .box .smooth_loader_animation_container{ display:block; width:100%; max-width:300px; margin:auto; height:5px; margin-bottom:20px; }
loading .box .smooth_loader_animation { width:0%; height:100%; background-color:rgb(0,160,220); border-radius:50px; animation-name:animation_spring_ltr_custom; animation-duration:2s; animation-iteration-count:infinite; }
loading .box span{ display:block; width:100%; color:#4D5455; font-size:20px; font-weight:300; text-align:center; }



/* ========================================
    NOTIFICATIONS
======================================== */
notifications{ display:block; position:absolute; z-index:+15; bottom:100%; left:0; width:100%; height:200px; transform:translateY(0px); transition: transform 0.4s, background-color 0s; box-sizing:border-box; overflow:hidden; background-color:transparent; pointer-events:none; }
notification{ display:block; height:auto; max-height:100px; width:90%; max-width:400px; margin:auto; margin-top:25px; font-family:'Poppins'; font-size:16px; color:rgb(64, 142, 211); background-color:rgb(255, 255, 255); padding:10px 20px; border:1px solid rgb(220,220,220); border-radius:3px; line-height:20px; box-sizing:border-box; pointer-events:initial; box-shadow: 0 1px 5px rgba(0,0,0,0.1); word-break:break-word; overflow:auto; }



/* ========================================
    POPUP
======================================== */
popup{ opacity:0; pointer-events:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:100; background-color:rgba(0,0,0,0.2); transition: opacity 0.4s; }
popup .box{ position:absolute; width:auto; min-width:400px; max-width:90%; height:auto; top:50%; left:50%; transform:translate(-50%,-50%); padding:0px; background-color:white; box-shadow:0px 3px 6px #00000029; border:1px solid #EAE7E7; border-radius:5px; text-align:center; }
popup .box .content{ padding:50px 50px 0px 50px; font-family:Roboto; font-size:16px; line-height:19px; font-weight:400; color:#393D3D; text-align:center; margin-bottom:25px; }
popup .box button{ display:inline-block; font-family:Roboto; width:auto; margin:5px; padding:0px 20px; line-height:50px; text-align:center; background:#65D4E6; border-radius:4px; border:none; font-size:15px; color:white; -webkit-appearance:none; -moz-appearance:none; cursor:pointer; }
popup .box actions{ display:block; padding:0px 10px 50px 10px; text-align:center; }



/* ========================================
    OVERLAY
======================================== */
view div.overlay-opacity{ display:none; }



/* ========================================
    OFFLINE BANNER
======================================== */
offlinebanner{ display:block; position:absolute; top:0; left:0; right:0; z-index:+10; background-color:rgb(202,84,88); }
offlinebanner .currentworkspace{ height:40px; background-color:rgb(189,76,80); text-align:center; padding:0 10px; overflow:auto; white-space:nowrap; }
offlinebanner .currentworkspace h2{ display:inline-block; vertical-align:middle; padding:0; margin:0; font-size:16px; font-weight:300; color:white; line-height:39px; }
offlinebanner .off-container{ padding:10px 10px; width:100%; max-width:800px; margin:auto; }
offlinebanner .left{  display:inline-block; vertical-align:middle; box-sizing:border-box; width:50px; }
offlinebanner .left .imgcontainer{ width:100%; }
offlinebanner .left .imgcontainer img{ width:100%; object-fit:cover; }
offlinebanner .right{ display:inline-block; vertical-align:middle; box-sizing:border-box; width:calc(100% - 50px); }
offlinebanner .right p{ color:white; font-family:'Roboto'; font-size:14px; margin:0; }



/* ========================================
    LANG
======================================== */
/* CUSTOMIZE GKIT LANG SPANS */
gkit_lang{ font-family:inherit; font-size:inherit; font-weight:inherit; text-align:inherit; }
body.lang_fr      gkit_lang:not(.gkit_lang_fr){      display:none;  }
body.lang_en      gkit_lang:not(.gkit_lang_en){      display:none;  }
body.lang_custom  gkit_lang:not(.gkit_lang_custom){  display:none;  }



/* ========================================
    SEGMENTED CONTROL
======================================== */
/* GENERAL */
/*
segmented_control{ display:block; height:30px; border-radius:100px; padding:2px; background-color:rgb(244,245,246); white-space:nowrap; overflow:hidden; box-sizing:border-box; }
segmented_control segment{ display:inline-block; position:relative; width:33.33%; height:100%; border-radius:100px; padding:0px; background-color:transparent; transition: background-color 200ms linear, color 200ms linear; box-sizing:border-box; -webkit-tap-highlight-color:rgba(0,0,0,0); overflow:hidden; text-overflow:ellipsis; }
segmented_control segment span{ display:block; position:absolute; width:100%; height:auto; left:0%; top:50%; transform:translateY(-50%); text-align:center; font-family:'Poppins', sans-serif; color:rgb(130,130,130); font-size:16px; font-weight:500; overflow:hidden; text-overflow:ellipsis; }
segmented_control segment.segment_checked{ background-color:white; }
segmented_control segment.segment_checked span{ color:rgb(0,160,220); }
segmented_control segment.segment_w0p{ display:none; }
segmented_control segment.segment_w20p{ width:20%; }
segmented_control segment.segment_w25p{ width:25%; }
segmented_control segment.segment_w33p{ width:33.33%; }
segmented_control segment.segment_w50p{ width:50%; }
segmented_control segment.segment_w100p{ width:100%; }
@media (max-width:600px){  segmented_control segment span{ font-size:14px; }  }
*/



/* ========================================
    SEARCH BAR
======================================== */
search_bar{ display:block; height:40px; border-radius:100px; padding:2px; background-color:rgb(235,235,235); white-space:nowrap; overflow:hidden; box-sizing:border-box; }



/* ========================================
    TOGGLE SWITCH
======================================== */
.switch{ position:relative; display:inline-block; width:60px; height:34px; }
.switch input{ opacity:0; width:0; height:0; }
.slider{ position:absolute; cursor:pointer; top:0; left:0; right:0; bottom:0; background-color:rgb(220,220,220); -webkit-transition:.4s; transition:.4s; }
.slider:before{ position:absolute; content:""; height:26px; width:26px; left:4px; bottom:4px; background-color:white; -webkit-transition:.4s; transition:.4s; }
input:checked + .slider{ background-color:#2196F3; }
input:focus + .slider{ box-shadow: 0 0 1px #2196F3; }
input:checked + .slider:before{ -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform:translateX(26px); }
/* Rounded sliders */
.slider.round{ border-radius:34px; }
.slider.round:before{ border-radius:50%; }



/* ========================================
    GKIT OPTIONS
======================================== */
.gkit-options{ margin:0px; margin-top:20px; margin-bottom:20px; padding:10px 0px; overflow:auto; background-color:transparent; text-align:left; transition: background-color 1s, background-image 1s; }

/* rows */
.gkit-options .gkit-options-row{ display:table; width:100%; position:relative; }
@media(max-width:800px){ .gkit-options .gkit-options-row{ display:block; } }

/* sides */
.gkit-options .gkit-options-side-left{  display:table-cell; vertical-align:bottom; width:auto; box-sizing:border-box; }
.gkit-options .gkit-options-side-right{ display:table-cell; vertical-align:bottom; width:auto; box-sizing:border-box; text-align:right; }
@media(max-width:800px){ .gkit-options .gkit-options-side-left{ display:block; width:100%; } }
@media(max-width:800px){ .gkit-options .gkit-options-side-right{ display:block; width:100%; margin-top:20px; } }
/*  */
.gkit-options .gkit-options-row .gkit-options-filters{ display:inline-block; vertical-align:bottom; width:100%; max-width:200px; box-sizing:border-box; margin-left:30px; margin-top:30px; }
.gkit-options .gkit-options-row .gkit-options-orderby{ display:inline-block; vertical-align:bottom; width:100%; max-width:200px; box-sizing:border-box; margin-left:30px; margin-top:30px; }
.gkit-options .gkit-options-row .gkit-options-filters:first-child{ margin-left:0px; }
@media(max-width:800px){ .gkit-options .gkit-options-row .gkit-options-filters{ width:100%; max-width:initial; margin-left:0px; } }
@media(max-width:800px){ .gkit-options .gkit-options-row .gkit-options-filters:first-child{ /* padding-right:40px; */ } }
@media(max-width:800px){ .gkit-options .gkit-options-row .gkit-options-orderby{ width:100%; max-width:initial; margin-left:0px; } }
/**/
.gkit-options .gkit-options-row .gkit-options-filters .block{ white-space:nowrap; }
.gkit-options .gkit-options-row .gkit-options-orderby .block{ white-space:nowrap; }
/* elements */
.gkit-options h2{ font-size:35px; color:#393D3D; margin:0; margin-bottom:5px; text-transform:uppercase; }
.gkit-options h3{ font-size:16px; font-weight:300; color:#BCB7B7; margin:0px!important; }
.gkit-options h5{ font-family:Roboto; font-size:12px; font-weight:400; color:#4d5455; margin:0; margin-bottom:10px; }
.gkit-options select{ display:inline-block; vertical-align:middle; width:100%; max-width:200px; height:40px; box-sizing:border-box; background-color:white; border:1px solid rgb(230,230,230); border-radius:5px; font-family:Roboto,sans-serif; font-size:15px; font-weight:400; margin:0px; padding:2px 10px; padding-right:50px; color:#4D5455; -webkit-appearance:none; line-height:30px; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; overflow:hidden; text-overflow:ellipsis; cursor:pointer; }
.gkit-options select:focus{ outline:none; }
.gkit-options input{ display:inline-block; vertical-align:middle; width:100%; max-width:200px; height:40px; box-sizing:border-box; background-color:white; border:1px solid rgb(230,230,230); border-radius:5px; font-family:Roboto,sans-serif; font-size:15px; font-weight:400; margin:0px; padding:2px 10px; padding-right:50px; color:#4D5455; -webkit-appearance:none; line-height:30px; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; overflow:hidden; text-overflow:ellipsis; }
.gkit-options input:focus{ outline:none; }
@media(max-width:800px){ middle .gkit-options select{ width:100%; max-width:initial; } }
.gkit-options span.caret{ pointer-events:none; display:inline-block; vertical-align:middle; margin-left:-40px; width:40px; height:40px; line-height:40px; padding:0; box-sizing:border-box; padding:2px 10px; background-color:#4A4D4D; border-radius:5px; text-align:center; font-size:15px; font-weight:300; color:rgb(26,174,196); }
.gkit-options span.caret *{ pointer-events:none; }
.gkit-options span.caret span{ display:block; line-height:40px; padding:0; text-align:center; font-size:15px; font-weight:300; color:rgb(26,174,196); text-transform:uppercase; transform:scale(1.5,0.6); transition:transform 0.2s; }
/* buttons */
.gkit-options .options-btn{               position:relative; display:inline-block; padding:0px 20px; width:auto; height:auto; margin:0; margin-left:12px; margin-bottom:12px; border-radius:3px; box-shadow:0 3px 7px 0 rgba(0,0,0,0.1); cursor:pointer; }
.gkit-options .options-btn span{          display:inline-block; vertical-align:middle; line-height:50px; font-family:'Poppins'; font-size:16px; }
.gkit-options .options-btn img{           display:inline-block; vertical-align:middle; height:20px; width:20px; margin-left:10px; }
.gkit-options .options-btn-add{           background-color:rgb(101,212,231); }
.gkit-options .options-btn-add span{      color:white!important; }
.gkit-options .options-btn-download{      background-color:rgb(101,212,231); }
.gkit-options .options-btn-download span{ color:white!important; }
.gkit-options .options-btn-export{        background-color:#4d5455; }
.gkit-options .options-btn-export span{   color:white!important; }
.gkit-options .options-btn-sendmail{      background-color:#4d5455; }
.gkit-options .options-btn-sendmail span{ color:white!important; }
.gkit-options .options-btn-edit{          background-color:#65D4E6; }
.gkit-options .options-btn-edit span{     color:white!important; }
.gkit-options .options-btn-validate{      background-color:#65D4E6; }
.gkit-options .options-btn-validate span{ color:white!important; }
.gkit-options .options-btn-save{          background-color:#65D4E6; }
.gkit-options .options-btn-save span{     color:white!important; }
.gkit-options .options-btn-cancel{        background-color:#4d5455; }
.gkit-options .options-btn-cancel span{   color:white!important; }
.gkit-options .options-btn-remove{        background-color:#D77165; }
.gkit-options .options-btn-remove span{   color:white!important; }
.gkit-options .options-btn-delete{        background-color:#D77165; }
.gkit-options .options-btn-delete span{   color:white!important; }



/* ========================================
    GKIT-HEADER
======================================== */

/* General */
.gkit-header{ position:sticky; top:0; z-index:+5; display:block; padding:10px 0; background-color:rgba(255,255,255,0.9); }

/* Actions */
.gkit-header .actions{ display:flex; align-items:flex-end; }

/* Actions - Left */
.gkit-header .actions .left{ flex-grow:1; display:inline-block; vertical-align:middle; text-align:left; white-space:nowrap; overflow:hidden; }
.gkit-header .actions .left h1{ display:inline-block; vertical-align:middle; width:100%; overflow:hidden; text-overflow:ellipsis; line-height:40px; margin:0; font-size:20px; font-weight:600; color:#4D5455; text-transform:uppercase; }
.gkit-header .actions .left .btn{ position:relative; display:inline-block; vertical-align:top; padding:0; width:35px; height:35px; box-sizing:border-box; margin:0; margin-left:20px; margin-top:5px; border-radius:5px; border:1px solid #C72E2E; cursor:pointer; }
.gkit-header .actions .left .btn img{ width:100%; height:100%; object-fit:cover; }

/* Actions - Right */
.gkit-header .actions .right{ display:inline-block; vertical-align:middle; position:sticky; top:0; z-index:+1; height:auto; padding:0px; box-sizing:border-box; text-align:right; white-space:nowrap; }

/* Actions - Buttons */
.gkit-header .actions .options-btn{ display:inline-block; vertical-align:middle; margin-left:10px; width:40px; height:40px; padding:10px; box-sizing:border-box; background-color:white; border:1px solid rgb(225,225,225); border-radius:5px; transition:0.5s; cursor:pointer; }
.gkit-header .actions .options-btn img{ display:block; margin:auto; width:100%; height:100%; object-fit:contain; }
.gkit-header .actions .options-btn span{ display:none; text-align:center; font-family:'Poppins', sans-serif; color:rgb(130,130,130); line-height: 15px; font-size:10px; font-weight:300; overflow:hidden; text-overflow:ellipsis; }

.gkit-header .actions .options-btn-delete{ margin-left:20px; }
/*
.gkit-header .actions .options-btn{               position:relative; display:inline-block; vertical-align:middle; padding:0px 20px; width:auto; height:30px; margin:0; margin-left:20px; border-radius:3px; box-shadow:0 3px 7px 0 rgba(0,0,0,0.1); cursor:pointer; }
.gkit-header .actions .options-btn span{          display:inline-block; vertical-align:middle; line-height:30px; font-family:'Poppins'; font-size:16px; }
.gkit-header .actions .options-btn img{           display:inline-block; vertical-align:middle; height:20px; width:20px; margin-left:10px; }

.gkit-header .actions .options-btn-add{           background-color:rgb(101,212,231); }
.gkit-header .actions .options-btn-add span{      color:white!important; }
.gkit-header .actions .options-btn-download{      background-color:rgb(101,212,231); }
.gkit-header .actions .options-btn-download span{ color:white!important; }
.gkit-header .actions .options-btn-export{        background-color:#4d5455; }
.gkit-header .actions .options-btn-export span{   color:white!important; }
.gkit-header .actions .options-btn-sendmail{      background-color:#4d5455; }
.gkit-header .actions .options-btn-sendmail span{ color:white!important; }
.gkit-header .actions .options-btn-edit{          background-color:#65D4E6; }
.gkit-header .actions .options-btn-edit span{     color:white!important; }
.gkit-header .actions .options-btn-validate{      background-color:#65D4E6; }
.gkit-header .actions .options-btn-validate span{ color:white!important; }
.gkit-header .actions .options-btn-save{          background-color:#65D4E6; }
.gkit-header .actions .options-btn-save span{     color:white!important; }
.gkit-header .actions .options-btn-cancel{        background-color:#4d5455; }
.gkit-header .actions .options-btn-cancel span{   color:white!important; }
.gkit-header .actions .options-btn-remove{        background-color:#D77165; }
.gkit-header .actions .options-btn-remove span{   color:white!important; }
.gkit-header .actions .options-btn-delete{        background-color:#D77165; }
.gkit-header .actions .options-btn-delete span{   color:white!important; }
*/



/* ========================================
    LIST
======================================== */

/* General */
.list{ display:block; }

/* List actions */
.list .list-actions{ display:inline-block; vertical-align:top; width:100%; margin-bottom:10px; text-align:left; }
.list .list-actions h1{ display:inline-block; vertical-align:top; line-height:30px; margin:0; font-size:20px; font-weight:600; color:#4D5455; text-transform:uppercase; }
.list .list-actions .btn{ position:relative; display:inline-block; vertical-align:top; padding:5px; width:30px; height:30px; box-sizing:border-box; margin:0; margin-left:20px; border:1px solid rgb(4,161,218); border-radius:5px; cursor:pointer; }
.list .list-actions .btn span{ color:white; }
.list .list-actions .btn img{ width:100%; height:100%; object-fit:cover; }
.list .list-actions .btn input{ position:absolute; top:0; right:0; bottom:0; left:0; opacity:0; height:0; padding-top:100%; cursor:pointer; }

/* List filters */
.list .list-filters{ display:flex; align-items:flex-end; width:100%; margin-bottom:10px; height:auto; padding:0px; box-sizing:border-box; }
.list .list-filters .left{ flex-grow:1; display:inline-block; vertical-align:middle; text-align:left; white-space:nowrap; overflow:hidden; }
.list .list-filters .right{ display:inline-block; vertical-align:middle; position:sticky; top:0; z-index:+1; height:auto; padding:0px; box-sizing:border-box; text-align:right; white-space:nowrap; }

.list .list-filters input{ display:inline-block; vertical-align:top; width:100%; line-height:37px; padding:0 10px; box-sizing:border-box; border:1px solid rgb(227,227,227); border-radius:100px; outline:none; font-size:14px; color:#4D5455; -webkit-appearance:none; -moz-appearance:none; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; }
.list .list-filters input.search{ background-color:rgb(244,245,246); border:none; border-radius:5px; margin:0; }

.list .list-filters .btn-group{ margin-left:10px; border-radius:5px; overflow:hidden; border:1px solid rgb(225,225,225); }
.list .list-filters .btn-group .btn:not(:first-child){ border-left:1px solid rgb(225,225,225); }

.list .list-filters .btn{ position:relative; display:inline-block; vertical-align:top; padding:7px; width:35px; height:35px; box-sizing:border-box; margin:0; background-color:rgb(244,245,246); border-radius:0; border: 1px solid transparent; cursor:pointer; transition:0.3s; }
.list .list-filters .btn img{ width:100%; height:100%; object-fit:cover; }
.list .list-filters .btn.selected{ background-color:white; }



/* List head */
.list .list-head{ display:block; padding:10px 0; border-bottom:1px solid #e3e3e3; display:none; }
.list .list-head span{ display:inline-block; vertical-align:top; box-sizing:border-box; width:20%; font-size:14px; font-weight:500; line-height:20px; color:#4D5455; }
.list .list-head span:nth-child(1){ width:40px;             padding-left:0px;  }
.list .list-head span:nth-child(2){ width:calc(40% - 40px); padding-left:20px; }
.list .list-head span:nth-child(3){ width:20%;              padding-left:20px; }
.list .list-head span:nth-child(4){ width:20%;              padding-left:20px; }
.list .list-head span:nth-child(5){ width:20%;              padding-left:20px; }

/* List group */
.list .list-elements .list-group{ display:block; padding:0; margin:10px 0; margin-bottom:20px; }
.list .list-elements .list-group .list-group-head{ display:block; padding:0; background-color:transparent; text-align:left; line-height:30px; font-size:15px; font-weight:600; color:#4D5455; }
.list .list-elements .list-group > *:not(.list-group-head){ padding-left:10px; }

/* List elements */
.list .list-elements{ display:block; }

/* List el */
.list .list-elements .list-el{ display:block; padding:5px 0px; box-sizing:border-box; border-bottom:2px solid rgb(244,245,246); }
.list .list-elements .list-el:last-child{ border-bottom:none; }

/* List empty */
.list .list-elements empty{ display:block; text-align:left; padding:10px 0; margin:0; color:grey; font-size:14px; font-weight:300; }



/* ========================================
    SHEET
======================================== */
.sheet{ background-color:white; border:none; border-radius:0px; padding:10px 0; overflow:hidden; }



/* ========================================
    SLIDER
======================================== */
slider{ position:relative; display:block; width:100%; height:auto; overflow:visible; /* white-space:nowrap; DONT SET WHITE-SPACE NOW. USER JAVASCRIPT sliderShow(). Bug fix : prevent login card disappear immediatly after loading */ }
slider slide{ position:relative; display:inline-block; vertical-align:top; opacity:1; width:100%; height:auto; white-space:initial; overflow:hidden; padding:0px; margin-bottom:40px; transition:transform 0.6s, opacity 0.4s; will-change:transform; }
slider slide:not(:first-child){ height:0px; opacity:0; pointer-events:none; }



/* ========================================
    COPYRIGHTS
======================================== */
copyrights{ display:block; height:auto; line-height:2em; background-color:transparent; color:rgb(0,160,220); padding:20px; margin:0px; box-sizing:border-box; overflow:hidden; text-align:center; }



/* ========================================
    FIELDS
======================================== */
fields{ display:block; box-sizing:border-box; overflow:hidden; padding:0 5px; background-color:rgb(244,245,246); border-radius:10px;  }
/* fields field:first-child{ border-top-left-radius:10px; border-top-right-radius:10px; overflow:hidden; }
fields field:last-child{ border-bottom-left-radius:10px; border-bottom-right-radius:10px; overflow:hidden; } */
fields field{ display:block; padding:5px 0; box-sizing:border-box; border-bottom:2px solid white; }
fields field:last-child{ border-bottom:none; }

fields field *{ pointer-events:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; }
fields h5{ position:relative; z-index:+1; display:block; box-sizing:border-box; width:auto; min-width:auto; max-width:auto; padding:0px; font-family:Roboto; font-size:12px; font-weight:400; line-height:initial; color:rgb(200,200,200); text-transform:initial; border:none; border-radius:0px; margin:0; margin-bottom:5px; pointer-events:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; resize:none; transition:background-color 0.6s; }
fields h6{ position:relative; z-index:+1; display:block; box-sizing:border-box; width:auto; min-width:auto; max-width:auto; padding:0px; font-family:Roboto; font-size:13px; font-weight:600; line-height:initial; color:#4D5455; text-transform:uppercase; border:none; border-radius:0px; margin:0; margin-bottom:10px; pointer-events:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; resize:none; transition:background-color 0.6s; }
fields h5.required:after{ content:"*"; position:absolute; left:100%; color:red; font-size:10px; }
fields h6.required:after{ content:"*"; position:absolute; left:100%; color:red; font-size:10px; }

fields field>div{
    position:relative; display:block; vertical-align:initial; box-sizing:border-box; width:100%; min-width:100%; max-width:100%; height:auto; padding:0 5px; font-family:Roboto; font-size:16px; font-weight:400; line-height:30px; background-color:transparent; color:#4D5455; text-transform:none; border:none; border-radius:0px; margin:0; outline:none; pointer-events:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; resize:none; transition:background-color 0.6s;
}
fields field>span{
    position:relative; display:block; vertical-align:initial; box-sizing:border-box; width:100%; min-width:100%; max-width:100%; height:auto; padding:0 5px; font-family:Roboto; font-size:16px; font-weight:400; line-height:30px; background-color:transparent; color:#4D5455; text-transform:none; border:none; border-radius:0px; margin:0; outline:none; pointer-events:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; resize:none; transition:background-color 0.6s;
}
fields field>input{
    position:relative; display:block; vertical-align:initial; box-sizing:border-box; width:100%; min-width:100%; max-width:100%; height:auto; padding:0 5px; font-family:Roboto; font-size:16px; font-weight:400; line-height:30px; background-color:transparent; color:#4D5455; text-transform:none; border:none; border-radius:0px; margin:0; outline:none; pointer-events:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; resize:none; transition:background-color 0.6s; -webkit-appearance:none;
}
fields field>textarea{
    position:relative; display:block; vertical-align:initial; box-sizing:border-box; width:100%; min-width:100%; max-width:100%; height:auto; padding:0 5px; font-family:Roboto; font-size:16px; font-weight:400; line-height:25px; background-color:transparent; color:#4D5455; text-transform:none; border:none; border-radius:0px; margin:0; outline:none; pointer-events:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; resize:none; transition:background-color 0.6s; -webkit-appearance:none;
}
fields field>button{
    position:relative; display:block; vertical-align:initial; box-sizing:border-box; width:100%; min-width:100%; max-width:100%; height:auto; padding:0 5px; font-family:Roboto; font-size:16px; font-weight:400; line-height:30px; background-color:transparent; color:#4D5455; text-transform:none; border:none; border-radius:0px; margin:0; outline:none; pointer-events:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; resize:none; transition:background-color 0.6s; -webkit-appearance:none;
}
fields field>select{
    position:relative; display:inline-block; vertical-align:middle;  box-sizing:border-box; width:100%; height:auto; padding:0 5px; font-family:Roboto; font-size:16px; font-weight:400; line-height:30px; background-color:transparent; color:#4D5455; text-transform:none; border:none; border-radius:0px; margin:0; outline:none; pointer-events:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; resize:none; transition:background-color 0.6s; cursor:pointer; overflow:hidden; text-overflow:ellipsis; -webkit-appearance:none; -moz-appearance:none;
}

fields field>span.caret{ pointer-events:none; display:inline-block; width:auto; min-width:0; vertical-align:middle; box-sizing:border-box; position:relative; margin:0px; margin-left:-40px; width:40px; height:25px; padding:2px 10px; line-height:22px; text-align:center; color:rgb(64,142,211); font-size:14px; background-color:transparent; border-radius:50px; }


:not(.editmode) fields field>div{      pointer-events:none; }
:not(.editmode) fields field>span{     pointer-events:none; }
:not(.editmode) fields field>input{    pointer-events:none; }
:not(.editmode) fields field>textarea{ pointer-events:none; }
:not(.editmode) fields field>button{   pointer-events:none; }
:not(.editmode) fields field>select{   pointer-events:none; }
:not(.editmode) fields field>span.caret{ display:none; }
.editmode fields field>div{      background-color:white; pointer-events:initial; }
.editmode fields field>span{     background-color:white; pointer-events:initial; }
.editmode fields field>input{    background-color:white; pointer-events:initial; }
.editmode fields field>textarea{ background-color:white; pointer-events:initial; }
.editmode fields field>button{   background-color:white; pointer-events:initial; }
.editmode fields field>select{   background-color:white; pointer-events:initial; }



/* ========================================
    BOXE TEAM
======================================== */
/* CARD */
team.card { display:block; margin:0px; width:75%; max-width:250px; height:auto; padding:0px 5px; background-color:rgb(250,250,250); border:1px solid rgb(220,220,220); border-radius:10px; box-sizing:border-box; }
team.card *::-webkit-scrollbar{ display:none; }
/*@media (max-width:600px){ view[data-view="teams"]  team.card { width:100%; }  }*/
/* LINES */
team.card .card-line-name{         display:block; width:100%; height:auto; padding:5px; color:black; box-sizing:border-box; border-bottom:none; overflow-x:auto; overflow-y:hidden; white-space:nowrap; }
team.card .card-line-members{      display:block; width:100%; height:auto; padding:5px; color:black; box-sizing:border-box; border-bottom:none; overflow-x:auto; overflow-y:hidden; white-space:nowrap; }
team.card .card-line-localisation{ display:block; width:100%; height:auto; padding:5px; color:black; box-sizing:border-box; border-bottom:none; overflow-x:auto; overflow-y:hidden; white-space:nowrap; }
team.card .card-line-options{      display:block; width:100%; height:auto; padding:5px; color:black; box-sizing:border-box; border-bottom:none;                       overflow-x:auto; overflow-y:hidden; white-space:nowrap; }
/* TEAM NAME SPAN */
team.card .team-name { font-family:sans-serif; font-weight:600; }
/* MEMBER CIRCLE */
team.card .card-teammember-cell {   display:inline-block; vertical-align:top; position:relative; width:auto; height:100%; color:black; box-sizing:border-box; }
team.card .card-teammember-circle { display:block; width:30px; height:30px; border-radius:50px; text-align:center; padding:5px; margin-right:5px; background-color:rgb(210,210,210); color:white; font-weight:600; box-sizing:border-box; text-transform:uppercase; }
team.card .card-line-members .card-teammember-cell:first-child .card-teammember-circle{ background-color:rgb(79,195,247); }
/* OPTIONS -> BUTTONS */
team.card .card-line-options span.team-planned{ float:left;  width:auto; padding:2px 10px; background-color:rgb(220,220,220); color:white; border-radius:50px; font-weight:normal; font-size:14px; }
team.card .card-line-options span.team-edit{    float:right; width:auto; padding:2px 10px; background-color:rgb(79,195,247); color:white; border-radius:50px; font-weight:normal; font-size:14px; }
team.card .card-line-options span.team-delete{  float:right; width:auto; padding:2px 10px; background-color:rgb(255,150,150); color:white; border-radius:50px; font-weight:normal; font-size:14px; }



/* ========================================
    SETTINGS
======================================== */
/* GENERAL */
.settings-content{ display:block; padding:0px 0px; }
.settings-content-left{ display:inline-block; vertical-align:top; width:40%; margin-bottom:40px; }
.settings-content-right{ display:inline-block; vertical-align:top; width:60%; }
.settings-content-right h3:first-child{ margin-top:0px; }

/* OPTIONS */
settings{ display:block; background-color:rgb(245,245,245); border-radius:10px; padding:0px 5px; }
settings .line{ display:block; height:auto; padding:5px 10px; border-top:1px solid rgb(230, 230, 230); }
settings .line:first-child{ border-top:none; }

settings .line .line-side-titleswitch{ display:inline-block; vertical-align:middle; width:calc(100% - 60px); }
settings .line .line-side-titleswitch span{ font-family: poppins-regular; font-size:14px; line-height:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; }
settings .line .line-side-switch{ display:inline-block; vertical-align:middle; width:60px; }

settings .line .line-side-titleinput{ display:inline-block; vertical-align:middle; width:45%; }
settings .line .line-side-titleinput span{ font-family: poppins-regular; font-size:14px; line-height:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; }
settings .line .line-side-input{ display:inline-block; vertical-align:middle; width:55%; padding-left:2%; border-left:1px solid rgb(230, 230, 230); box-sizing:border-box; }
settings .line .line-side-input input{ width:100%; height:auto; box-sizing: border-box; background-color:transparent; border:none; border-bottom:1px solid rgb(0, 160, 220); border-radius:0px; -webkit-appearance:none; font-family: poppins-regular; font-size:14px; line-height:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; }

settings .line .line-side-titletextarea{ display:inline-block; vertical-align:middle; width:45%; }
settings .line .line-side-titletextarea span{ font-family: poppins-regular; font-size:14px; line-height:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; }
settings .line .line-side-textarea{ display:inline-block; vertical-align:middle; width:55%; padding-left:2%; border-left:1px solid rgb(230, 230, 230); box-sizing:border-box; }
settings .line .line-side-textarea textarea{ width:100%; height:auto; transition:height 0.4s; box-sizing: border-box; background-color:transparent; border:none; border-bottom:1px solid rgb(0, 160, 220); border-radius:0px; -webkit-appearance:none; font-family: poppins-regular; font-size:14px; line-height:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; }

/* TRANSLATIONS */
translations{ display:block; background-color:rgb(245,245,245); border-radius:10px; padding:0px 5px; }
translations .line{ display:block; height:auto; padding:5px 10px; border-top:1px solid rgb(230, 230, 230); }
translations .line:first-child{ border-top:none; }
translations .line .line-side-default{ display:inline-block; vertical-align:middle; width:45%; }
translations .line .line-side-custom{ display:inline-block; vertical-align:middle; width:55%; padding-left:5%; border-left:1px solid rgb(230, 230, 230); box-sizing:border-box; }
translations .line span{ font-family: poppins-regular; font-size:14px; line-height:initial; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; }

@media(max-width:800px){
    .settings-content-left{ width:100%; }
    .settings-content-right{ width:100%; }
}


/* ========================================
    INPUTS
======================================== */
input[type="email"] { padding: 1em; border: 1px solid #65D4E6; border-radius: 5px; color: #555 }



/* ========================================
    SLIM SELECT
======================================== */
.ss-main .ss-single-selected{ position:relative; display:block; height:43px; padding:0; box-sizing:border-box; border:none; background-color:transparent!important; }
/**/
.ss-main .ss-single-selected .placeholder{ width:100%; padding:0; box-sizing:border-box; background-color:transparent; border-radius:5px; padding:0px 5px; line-height:43px; }
.ss-main .ss-single-selected .placeholder button{ display:none; }
.ss-main .ss-single-selected .placeholder .left{  display:inline-block; vertical-align:middle; width:35px;              box-sizing:border-box; padding:0 0 0 0;       }
.ss-main .ss-single-selected .placeholder .right{ display:inline-block; vertical-align:middle; width:calc(100% - 35px); box-sizing:border-box; padding:0 10px 0 10px; }
.ss-main .ss-single-selected .placeholder .left .logo{ display:block; width:35px; height:35px; }
.ss-main .ss-single-selected .placeholder .left .logo img{ object-fit:contain; width:100%; height:100%; }
.ss-main .ss-single-selected .ss-deselect{ display:none; }
.ss-main .ss-single-selected .ss-arrow{ display:block; vertical-align:middle; height:43px; line-height:43px; width:10px; margin:0; position:absolute; right:0; top:0; }
/**/
.ss-main .ss-content{ position:absolute; left:-5px; width:calc(100% + 10px); max-width:350px; padding:10px; box-shadow:0 3px 7px 0 rgba(0,0,0,0.16); border:1px solid #EAE7E7; border-radius:10px; margin-top:-5px; }
.ss-main .ss-content h2{ display:block; font-family:Roboto; font-size:23px; font-weight:600; color:#393D3D; margin:0; margin-bottom:10px; }
.ss-main .ss-content h3{ display:block; font-family:Roboto; font-size:16px; font-weight:400; color:#4D5455; margin:0; margin-bottom:10px; }
/**/
.ss-main .ss-content .ss-search{ display:block; padding:0; margin-bottom:10px; background-color:transparent; }
.ss-main .ss-content .ss-search input{ width:100%; height:40px; line-height:40px; background-color:#F5F5F5; border:none; border-radius:4px; user-select:initial; -webkit-user-select:initial; -moz-user-select:initial; }
.ss-main .ss-content .ss-search .ss-addable{ width:40px; height:40px; margin-left:-40px; background-color:#4A4D4D; color:#65D4E6; border:none; border-radius:4px; font-size:14px; font-weight:400; text-transform:uppercase; font-family:Roboto; }
.ss-main .ss-content .ss-search input:focus{ outline:none; box-shadow:none; }
/**/
.ss-main .ss-content .ss-list{ float:left; width:100%; }
.ss-main .ss-content .ss-list .ss-option{ padding:10px 0px; border-bottom:1px solid #D8D8D8; }
.ss-main .ss-content .ss-list .ss-option:hover{ background-color:rgb(233, 252, 255); color:#666; }
.ss-main .ss-content .ss-list .ss-option:last-child{ border-bottom-color:transparent; }
.ss-main .ss-content .ss-list .ss-option.ss-disabled{ /*color:rgb(200,200,200);*/ opacity:0.5; }
/* .ss-main .ss-content .ss-list .ss-option.ss-disabled *{ color:rgb(200,200,200); }
.ss-main .ss-content .ss-list .ss-option.ss-disabled:hover{ background-color:transparent; } */
/**/
.ss-main .ss-content .ss-list .ss-option .left{  display:inline-block; vertical-align:middle; width:35px; box-sizing:border-box; padding:0 0 0 0; }
.ss-main .ss-content .ss-list .ss-option .left .logo{ display:block; width:35px; height:35px; }
.ss-main .ss-content .ss-list .ss-option .left .logo img{ object-fit:contain; width:100%; height:100%; }
.ss-main .ss-content .ss-list .ss-option .right{ display:inline-block; vertical-align:middle; width:calc(100% - 35px); box-sizing:border-box; padding:0 0 0 10px; }
.ss-main .ss-content .ss-list .ss-option .right .name{ color:#4D5455; }
.ss-main .ss-content .ss-list .ss-option.ss-disabled .right .name{ color:rgb(200,200,200); }
/**/
.ss-main .ss-content .ss-list .ss-option span{ display:inline-block; vertical-align:middle; width:calc(100% - 80px); line-height:20px; font-family:Roboto; font-size:15px; font-weight:500; color:#4D5455; }
.ss-main .ss-content .ss-list .ss-option:hover span{  }
.ss-main .ss-content .ss-list .ss-option button{ display:inline-block; vertical-align:middle; width:80px; padding:0; margin:0; line-height:20px; color:#65D4E6; text-decoration:underline; background-color:transparent; border-radius:0; border:none; cursor:pointer; }