@charset "UTF-8";

@keyframes rotating-logo{
    to{
        transform:              rotatey(0deg);
    }
    from{
        transform:              rotatey(180deg);
    }
}

@keyframes rotating-logo-shadow{
    0%{
        opacity:                0;
    }
    50%{
        opacity:                0.5;
    }
    100%{
        opacity:                0;
    }
}

@keyframes pictureeditor-display{
    from{
        opacity: 0;
    }
    to
    {
        opacity: 1;
    }
}

/* GLOBAL
----------------------------------------*/

html, body{
	padding:				        0;
	margin:					        0;
    background:                     #f5f8fb;
    height:                         100%;
}

p, div, fieldset, section, header, menu, header, span, a, img, table, form, td, tr, li, ul, h1, h2, h3, h4, iframe, input, textarea, select{
	padding:				        0;
	margin:                         0;
    box-sizing:                     border-box;
    -o-box-sizing:                  border-box;
    -ms-box-sizing:                 border-box;
    -moz-box-sizing:                border-box;
    -webkit-box-sizing:             border-box;
}

a, a:link, a:active, a:visited{
    cursor:                         pointer;
}

img{
    vertical-align:                 top;
    border:                         0;
}

a img{
    border:                         0;
}

li{
    list-style:                     inside;
}

h1{
	line-height: 					45px;
}

h2{
    margin-bottom:                  15px;
}

.content-image{
    height:                         15px;
    vertical-align:                 middle;
    margin:                         0;
    width:                          auto;
}

.clear{
    clear:                          both;
    height:                         0;
    overflow:                       hidden;
}

.copy-clipboard-input{
    position:                       absolute;
    top:                            0;
    left:                           0;
    height:                         0;
    width:                          0;
    overflow:                       hidden;
    z-index:                        -1;
}

.shadow{
    box-shadow:                     0 0 20px 0 rgba(0, 0, 0, 0.1);
}

i.icon{
    display:                        inline-block;
    max-width:                      16px;
    height:                         auto;
    vertical-align:                 middle;
    margin:                         auto 7px auto 0;
}

i.icon.chat{
    content:                        url(../resources/img/icons/icon-chat.svg);   
}

i.icon.resize{
    content:                        url(../resources/img/icons/icon-resize.svg);   
}

i.icon.tag{
    content:                        url(../resources/img/icons/icon-tag.svg);   
}

i.icon.other{
    content:                        url(../resources/img/icons/icon-other.svg);   
}

i.icon.help{
    content:                        url(../resources/img/icons/icon-help.svg);   
}

i.icon.empty{
    content:                        url(../resources/img/icons/icon-empty.svg);   
}

i.icon.switch{
    content:                        url(../resources/img/icons/icon-switch.svg);   
}

i.icon.lock{
    content:                        url(../resources/img/icons/icon-lock.svg);   
}

i.icon.pj{
    content:                        url(../resources/img/icons/icon-pj.svg);   
}

i.icon.col_100{
    content:                        url(../resources/img/icons/icon-100.svg);   
}

i.icon.col_50_50{
    content:                        url(../resources/img/icons/icon-50-50.svg);   
}

i.icon.col_33_66{
    content:                        url(../resources/img/icons/icon-33-66.svg);   
}

i.icon.col_66_33{
    content:                        url(../resources/img/icons/icon-66-33.svg);   
}

i.icon.uninstall{
    content:                        url(../resources/img/icons/icon-uninstall.svg);   
}

i.icon.install{
    content:                        url(../resources/img/icons/icon-install.svg);   
}

i.icon.check-on{
    content:                        url(../resources/img/icons/check-on.svg);   
}

i.icon.historic{
    content:                        url(../resources/img/icons/icon-historical.svg);   
}

i.icon.check-off{
    content:                        url(../resources/img/icons/check-off.svg);   
}

i.icon.pin{
    content:                        url(../resources/img/icons/icon-pin.svg);   
}

i.icon.link{
    content:                        url(../resources/img/icons/icon-link.svg);   
}

i.icon.flag{
    content:                        url(../resources/img/icons/icon-flag.svg);   
}

i.icon.homepage{
    content:                        url(../resources/img/icons/icon-homepage.svg);   
}

i.icon.settings{
    content:                        url(../resources/img/icons/icon-settings.svg);   
}

i.icon.import{
    content:                        url(../resources/img/icons/icon-import.svg);   
}

i.icon.export{
    content:                        url(../resources/img/icons/icon-export.svg);   
}

i.icon.crop{
    content:                        url(../resources/img/icons/icon-crop.svg);   
}

i.icon.rotation{
    content:                        url(../resources/img/icons/icon-rotation.svg);   
}

i.icon.reward{
    content:                        url(../resources/img/icons/icon-reward.svg);   
}

i.icon.edit{
    content:                        url(../resources/img/icons/icon-edit.svg);   
}

i.icon.search{
    content:                        url(../resources/img/icons/icon-loupe.svg);   
}

i.icon.select {
    content:                        url(../resources/img/icons/icon-select.svg);
}

i.icon.remove{
    content:                        url(../resources/img/icons/icon-remove.svg);   
}

i.icon.menu{
    content:                        url(../resources/img/icons/icon-menu.svg);   
}

i.icon.convert{
    content:                        url(../resources/img/icons/icon-convert.svg);   
}

i.icon.upgrade{
    content:                        url(../resources/img/icons/icon-upgrade.svg);   
}

i.icon.list{
    content:                        url(../resources/img/icons/icon-list.svg);   
}

i.icon.new{
    content:                        url(../resources/img/icons/icon-new.svg);
}

i.icon.up{
    content:                        url(../resources/img/icons/icon-up.svg);   
}

i.icon.down{
    content:                        url(../resources/img/icons/icon-down.svg);
}

i.icon.code{
    content:                        url(../resources/img/icons/icon-code.svg);
}

i.icon.download{
    content:                        url(../resources/img/icons/icon-download.svg);
}

i.icon.close{
    content:                        url(../resources/img/icons/icon-close.svg); 
}

i.icon.back{
    content:                        url(../resources/img/icons/icon-back.svg); 
}

i.icon.quit{
    content:                        url(../resources/img/icons/icon-quit.svg); 
}

i.icon.plus{
    content:                        url(../resources/img/icons/icon-plus.svg); 
}

i.icon.minus{
    content:                        url(../resources/img/icons/icon-minus.svg); 
}

i.icon.copy{
    content:                        url(../resources/img/icons/icon-copy.svg); 
}

i.icon.view{
    content:                        url(../resources/img/icons/icon-view.svg);
}

i.icon.more{
    content:                        url(../resources/img/icons/icon-more.svg);
}

i.icon.custom{
    content:                        url(../resources/img/icons/icon-custom.svg);
}

i.icon.forward{
    content:                        url(../resources/img/icons/icon-forward.svg);
}

i.icon.backward{
    content:                        url(../resources/img/icons/icon-backward.svg);
}

i.icon.move-up{
    content:                        url(../resources/img/icons/icon-move-up.svg);
}

i.icon.move-down{
    content:                        url(../resources/img/icons/icon-move-down.svg);
}

i.icon.drag{
    content:                        url(../resources/img/icons/icon-drag.svg);
}

i.icon.info{
    content:                        url(../resources/img/icons/icon-info.svg);
}

i.icon.new-folder{
    content:                        url(../resources/img/icons/icon-new-folder.svg);
}

i.icon.new-file{
    content:                        url(../resources/img/icons/icon-new-file.svg);
}

i.icon.zoom{
    content:                        url(../resources/img/icons/icon-zoom.svg);
}

i.icon.right{
    content:                        url(../resources/img/icons/icon-right.svg);
}

i.icon.dezoom{
    content:                        url(../resources/img/icons/icon-dezoom.svg);
}

i.icon.notifications{
    content:                        url(../resources/img/icons/icon-notifications.svg);
}

/*  SOUS MENU DÉROULANT
----------------------------------------*/

.gs-menu-list{
    position:                   relative;
}

ul.gs-menu-list-container{
    display:                    none;
    width:                      auto;
    position:                   absolute;
    background:                 #fff;
    z-index:                    100;
	box-shadow: 				0 0 10px 0 rgba(0, 0, 0, 0.1);
	border-radius: 				7px;
	padding: 					10px 0;
    top:                        100%;
    transform:                  translateX(-50%) translateY(20px);
    left:                       50%;
	margin: 					auto;
}

ul.gs-menu-list-container:before{
    height:                     10px;
    width:                      10px;
    content:                    '';
    position:                   absolute;
    top:                        -5px;
    background:                 #fff;
    transform:                  rotate(45deg);
    box-shadow:                 -3px -3px 4px -2px rgba(0, 0, 0, 0.1);
    left:                       0;
    right:                      0;
    z-index:                    10;
    margin:                     auto;
}

ul.gs-menu-list-container:after{
	opacity: 					0;
	background: 				transparent;
	height: 					20px;
	position: 					absolute;
	top: 						-20px;
	left: 						0;
	width: 						100%;
	content: 					'';
}

ul.gs-menu-list-container li{
    display:                    block;
}

ul.gs-menu-list-container li a{
    padding:                    5px 10px;
    text-align:                 left;
    display:                    flex;
    text-decoration:            none;
    color:                      #272727;
    white-space:                nowrap;
}

ul.gs-menu-list-container li a:hover{
    color:                      #3187fd;
}

/* CHARGEMENT DE LA PAGE
----------------------------------------*/

#loader{
    position:                       fixed;
    top:                            0;
    left:                           0;
    width:                          100%;
    height:                         100%;
    z-index:                        100002;
    background:                     rgba(0, 0, 0, 0.8);
    display:                        flex;
    flex-direction:                 column;
    justify-content:                center;
}

#loader .loader-container{
    width:                          90px;
    height:                         90px;
    border-radius:                  100%;
    background:                     #fff;
    display:                        flex;
    flex-direction:                 column;
    justify-content:                center;
    position:                       relative;
    margin:                         auto;
    text-align:                     center;
    animation-name:                 rotating-logo;
    animation-duration:             1.2s;
    animation-iteration-count:      infinite;
    animation-direction:            alternate;
}

#loader .loader-container:before{
    position:                       absolute;
    z-index:                        1;
    top:                            0;
    right:                          0;
    width:                          50%;
    height:                         100%;
    border-radius:                  0 90px 90px 0;
    background:                     #e6e6e6;
    content:                        '';
    animation-name:                 rotating-logo-shadow;
    animation-duration:             1.2s;
    animation-iteration-count:      infinite;
    animation-direction:            alternate;
    opacity:                        0;
}

#loader .loader-container img{
    position:                       relative;
    z-index:                        2;
    margin:                         auto;
    width:                          90%;
}

/* TEMPLATE LOGIN
***********************************************/

.login-container{
    position:                           relative;
    width:                              auto;
    height:                             100vh;
}

.login-container .login-head{
	padding-top:                        15px;
    position:                           relative;
    z-index:                            2
}

.login-container .login-head .gs-button{
    float:                              right;
}

.login-ad{
    position:                           absolute;
    left:                               0;
    top:                                0;
    z-index:                            0;
    width:                              100%;
    height:                             100%;
    display:                            flex;
    flex-direction:                     column;
    justify-content:                    center;
    background-size:                    cover;
    background-position:                center;
    background-repeat:                  no-repeat;
}

.login-ad .accroche{
    margin:                             0 8vw 0 auto;
    text-align:                         right;
    font-size:                          4.16vw;
    line-height:                        4.36vw;
    color:                              #ffffff;
    text-transform:                     uppercase;
    text-shadow:                        3px 3px 5px rgba(0, 0, 0, 0.2);
    display:                            none;
}

.login-ad .accroche span{
    font-weight:                        500;
    color:                              transparent;
    display:                            inline-block;
    background:                         linear-gradient(to right, #1f5f96, #41b691);
    background-clip:                    text;
    -webkit-background-clip:            text;
    text-shadow:                        none;
}

/* TEMPLATE DEFAULT
***********************************************/

#main-container{
    display:                            flex;
    height:                             calc(100% - 60px);
    flex-direction:                     row;
}

#main-container .body-container{
    flex:                               1;
    height:                             100%;
    position:                           relative;
    flex-direction:                     column;
    display:                            flex;
    z-index:                            1;
}

#main-container .body-container ._dc1{
    overflow:                           auto;  
    position:                           absolute;
    left:                               0;
    top:                                0;
    bottom:                             0;
    right:                              0;
    padding:                            30px 0 0;
}

#main-container .body-container ._dc2{
    height:                             100%;
    overflow:                           auto;
    padding: 0 50px;
}

#main-container .body-container ._dc3{
    max-width:                          1280px;
    min-width:                          900px;
    margin:                             auto;
    position:                           relative;
	display: 							flex;
	flex-direction: 					column;
	min-height: 						100%;
}

.page-head{
    position:                           sticky;
    top:                                0;
    z-index:                            500;
    background:                         #f5f8fb;
    padding:                            0;
}

.page-head>.gs-container{
    background: #f5f8fb;
    padding-bottom: 10px;
}

.page-head .searchbox{
    padding-bottom: 0;
}

.page-head .legend{
    margin-top:                         10px;   
}

.page-body{
	flex: 								1;
	padding-bottom: 					50px;
}

.head-actions{
    text-align:                         right !important;
    padding-top:                        12px !important;
}

.head-actions a + a{
    margin-left:                        10px;   
}

.head-actions .gs-button{
    height:                             40px;
    line-height:                        40px;
    border-radius:                      17px;
    margin-bottom: 10px;
}

/* block contenu principal
----------------------------------------*/

.block-content{
    background:                         #fff;
    padding:                            25px;
    border-radius:                      10px;
    margin-bottom:                      40px;
}

/* MESSAGE HEADER
----------------------------------------*/

#system-messages{
    width:                          100%;
    height:                         auto;
    background:                     #fff;
    z-index:                        100001;
    padding:                        20px 25px;
    position:                       fixed;
    top:                            0;
    left:                           0;
}

#system-messages ul{
    width:                          block;
    height:                         auto;
}

#system-messages ul li{
    text-align:                     left;
}

#system-messages a{
    position:                       absolute;
    right:                          25px;
    top:                            15px;
}

/* MESSAGE POPIN
----------------------------------------*/

.window-popin{
    position:                       fixed;
    top:                            0;
    left:                           0;
    width:                          100%;
    height:                         100%;
    z-index:                        100000;
    background:                     rgba(0, 0, 0, 0.8);
    display:                        flex;
    flex-direction:                 column;
    justify-content:                center;
    opacity:                        0;
}

.window-popin .popin-container{
    position:                       relative;
    width:                          400px;
    text-align:                     center;
    background:                     #fff;
    height:                         auto;
    margin:                         auto;
    padding:                        25px;
    border-radius: 10px;
}

.window-popin.code-window .popin-container{
    width: 75%;
    height: 75%;
    display: flex;
    flex-direction: column;
    padding: 0;
}

.window-popin.code-window .popin-container .head{
    height: 40px;
    line-height: 40px;
    background: #f7f7f7;
    padding: 0 25px;
    width: auto;
    display: flex;
}

.window-popin.code-window .popin-container .head .title{
    width: 50%;   
    text-align: left;
}

.window-popin.code-window .popin-container .head .actions{
    width: 50%;   
    text-align: right;
}

.window-popin.code-window .popin-container .head .actions a{
    margin-top: 5px;   
}

.window-popin.code-window .popin-container .area{
    padding: 25px;
    flex: 1;
}

.window-popin.code-window .popin-container .area .gs-col{
    padding: 0 !important;   
    float: none !important;
}

.window-popin.code-window .popin-container .area .ql-editor.ql-blank::before{
    padding: 0 15px;
}

.window-popin.code-window .popin-container textarea{
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    padding: 0;
    margin: 0;
    background: none;
    width: 100%;
    height: 100%;
}

.window-popin .input-text-container{
	margin-bottom:                  20px;
    position:                       relative;
}

.window-popin p.message{
    width:                          auto;
    height:                         auto;
    text-align:                     left;
    margin-bottom:                  20px;
}

.window-popin.confirm-window p.message{
    text-align:                     center;
}

.window-popin .gs-button + .gs-button{
    margin-left:                    10px;
}

.window-popin  .input-container.button{
	text-align: 					center;
}

.window-popin.fullscreen .popin-container .bt-close{
    position:                       absolute;
    right:                          10px;
    top:                            10px;
    z-index:                        10;
}

.window-popin.fullscreen .popin-container{
    width:                          85%;
    height:                         85%;
    padding:                        20px 0 0;
    border-radius:                  5px;
}

#form-link-window .gs-input-title{
    text-align: center;
}

.form-link-window-title{
    margin-bottom: 20px;
    text-align: center;
}

.html-window .popin-container{
    width: 960px;
    height: auto;
    max-height: 80%;
}

.html-window .html-container{
    width: auto;
    overflow: auto;
    text-align: left;
    height: 100%;
}

.html-window .bt-close{
    position: absolute;
    right: 15px;
    top: 15px;
    z-index: 10;
}

.window-tips{
    display: none;
}

/* CREDITS
----------------------------------------*/

.ganesha-credits{
    padding: 0 20px;
}

.ganesha-credits-logo{
    text-align: center;
    margin-bottom: 5px;
}

.ganesha-credits-version{
    margin-bottom: 40px;
    text-align: center;
}

.ganesha-credits-title{
    margin-bottom: 25px;
    text-align: center;
}

.ganesha-credits-logo>img{
    width: 230px;
    height: auto;
}

.ganesha-credits-content{
    text-align: center;
}

.ganesha-credits-content>a{
    text-decoration: underline;
}

/* TIPS
----------------------------------------*/

#bt-gs-help{
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 100;
    cursor: pointer;
    transition: all 0.3s;
    width: 75px;
    height: 85px;
}

#bt-gs-help img{
    width: 100%;
    vertical-align: top;
}

#bt-gs-help:hover{
    transform: scale(1.1) rotate(5deg);
}

.gs-tips{
    width: 960px;
    padding: 20px 40px 40px;
    background: #fff;
    height: 590px;
    box-sizing: border-box;
    border-radius: 15px;
    overflow: hidden;
    margin: auto;
    position: relative;
}

.gs-tips .bt-close{
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 10;
}

.gs-tips-container{
    width: auto;
    height: 100%;
    position: relative;
    overflow: hidden;
    margin: auto -40px;
}

.gs-tips-item{
    width: 960px;
    height: 100%;;
    box-sizing: border-box;
    padding: 0 40px;
}

.gs-tips-item-title{
    text-align: left;
    height: auto;
}

.gs-tips-item-title span{
    margin-right: 10px;   
}

.gs-tips-item>img{
    width: 100%;
    vertical-align: top;
    height: auto;
    border-radius: 15px;
    margin-top: 20px;
    height: 330px;
}

.gs-tips-video{
    height: 330px;
    border-radius: 15px;
    margin-top: 20px;
    overflow: hidden;
    width: 100%;
}

.gs-tips-item video{
    width: 100%;
    height: 100%;
}

.gs-tips-item-info{
    height: auto;
    line-height: 23px;
    margin-top: 25px;
}

.gs-tips-item-info i{
    margin: 0;
    max-width: 12px;
}

.gs-tips-action{
    position: absolute;
    left: 20px;
    bottom: 15px;
    height: 15px;
    line-height: 15px;
    width: calc(100% - 40px);
}

.gs-tips-action .gs-custom-checkbox-label{
    font-size: 13px;
}

.gs-tips-action .gs-custom-checkbox a{
    height: 13px;
    width: 13px;
}

.gs-tips-menu{
    text-align: right;
}

.gs-tips-menu>a{
    vertical-align: top;   
    height: 20px;
    width: 20px;
    border-radius: 100%;
    display: inline-block;
    margin: -2px 0 auto 8px;
    box-sizing: border-box;
    text-align: center;
    line-height: 19px;
    background: rgba(49, 135, 253, 0.1);
    transition: all 0.3s;
    color: #272727 !important;
}

.gs-tips-menu-item{
    pointer-events: none;
    cursor: default;
}

.gs-tips-menu-item.clicking{
    cursor: pointer;
    pointer-events: all;
}

.gs-tips-menu>a.active,
.gs-tips-menu>a:nth-child(1){
    color: #fff !important;
    background: #3187fd;
}

.gs-tips-menu>a.bt-icon{
    line-height: normal;
    background: none;
}

.gs-tips-menu>a.bt-icon i{
    max-width: 12px;
}

.gs-tips-menu>a.bt-icon:hover{
    background: rgba(49, 135, 253, 0.1);
}

/* INFOBULLE
----------------------------------------*/

.gs-infobulle{
    position:                       absolute;
    max-width:                      250px;
    width:                          auto;
    min-width:                      170px;
    height:                         auto;
    text-align:                     center;
    box-shadow:                     0px 0px 8px 0 rgba(0, 0, 0, 0.1);
    opacity:                        0;
    transition:                     opacity 0.3s;
    z-index:                        900;
    padding:                        20px 25px;
    background:                     #fff;
    border-radius:                  15px;
    bottom:                         calc(100% + 5px);
    left:                           50%;
    transform:                      translateX(-50%);
    pointer-events: none;
    overflow-wrap: break-word;
    
}

.gs-infobulle.xs{
    padding:                        10px 15px;
    border-radius:                  5px;
}

.gs-infobulle.left{
    right:                          calc(100% + 5px);
    left:                           auto;
    bottom:                         auto;
    top:                            50%;
    transform:                      translateY(-50%);
}

.gs-infobulle.top_left{
	left: 							-25px;
	transform: 						none;
    right: auto;
}

.gs-infobulle.top_right{
	right: 							-25px;
	transform: 						none;
    left: auto;
}

.gs-infobulle.right{
    left:                           calc(100% + 5px);
    right:                          auto;
    bottom:                         auto;
    top:                            50%;
    transform:                      translateY(-50%);
}

.gs-infobulle.bottom{
    bottom:                         auto;
    top:                            calc(100% + 5px);
}

.gs-infobulle:after{
    height:                         10px;
    width:                          10px;
    content:                        '';
    position:                       absolute;
    background:                     #fff;
    transform:                      rotate(45deg);
    z-index:                        10;
    right:                          0;
    left:                           0;
    margin:                         auto;
    bottom:                         -5px;
    box-shadow:                     3px 3px 4px -2px rgba(0, 0, 0, 0.1);
}

.gs-infobulle.left:after{
    top:                            0;
    bottom:                         0;
    left:                           -5px;
    right:                          auto;
    box-shadow:                     3px 3px 4px -2px rgba(0, 0, 0, 0.1);
}

.gs-infobulle.right:after{
    top:                            0;
    bottom:                         0;
    right:                          -5px;
    left:                           auto; 
    box-shadow:                     3px 3px 4px -2px rgba(0, 0, 0, 0.1);
}

.gs-infobulle.bottom:after{
    top:                            -5px;
    bottom:                         auto;
    box-shadow:                     -3px -3px 4px -2px rgba(0, 0, 0, 0.1);
}

.gs-infobulle.top_left:after{
	left: 							25px;
	right:                          auto;
}

.gs-infobulle.top_right:after{
	right: 							25px;
	left:                          auto;
}

.gs-infobulle.active{
    opacity:                        1;   
}

/* LIVE DISPLAY
----------------------------------------*/

#live-display{
    position:                   fixed;
    top:                        90px;
    z-index:                    100001;
    right:                      20px;
    width:                      250px;
    height:                     0;
}

.live-notification{
    opacity:                    0;
    width:                      250px;
    height:                     auto;
    background:                 #fff;
    border-radius:              10px;
    transform:                  translateX(300px);
    display:                    flex;
}

.live-notification.success{
    height:                     auto;
    background:                 rgba(84, 189, 156, 0.95);
}

.live-notification.error{
    height:                     auto;
    background:                 rgba(237, 64, 64, 0.95);
}

.live-notification + .live-notification{
    margin-top:                 10px;   
}

.live-notification-button{
    display:                    flex;
    flex-direction:             column;
    justify-content:            center;
    width:                      60px;
    text-align:                 center;
    border-right:               1px solid #dbdbdb;
    float:                      left;
    font-weight:                600;
}

.live-notification-text{
    width:                      190px;
    display:                    block;
    border-left:                1px solid #fff;
    float:                      right;
    text-align:                 left;
    padding:                    10px;
}

.live-notification-system-text{
    height:                     auto;
    width:                      auto;
    padding:                    15px;
    text-align:                 left;
    display:                    block;
    cursor:                     pointer;
}

/* SEARCH BAR
----------------------------------------*/

#searchbox{
    position:                   sticky;
    z-index:                    100;
    background:                 #f5f8fb;
    top:                        0;
}

#searchbox .input-container>span.placeholder{
    left: 40px;
}

.searchbox-display{
    float:                      right;
    background:                 #fff;
    border-radius:              5px;
    border:                     1px solid #e6e6e6;
}

.searchbox-display:after{
    display:                    block;
    clear:                      both;
    content:                    '';    
}

.searchbox-display a{
    float:                      right;
}

/* LISTING
----------------------------------------*/

.data-container{
    margin-top:                 20px;
}

.data-container-total{
    text-align: left;
}

.listing-item-block{
    height:                     300px;
    background:                 #fff;
    border-radius:              5px;
    transition:                 all 0.3s;
    position:                   relative;
    z-index:                    1;
}

.listing-item-block.selected{
    background: #0c062e;   
}

.block-page-rank{
    position: relative;
    width: 30px;
    height: 30px;
    z-index: 10;
    cursor: pointer;
}

.listing-item-block .block-page-rank{
    left: 15px;
    top: 15px; 
    position: absolute;
}

.block-page-rank:hover .gs-infobulle{
    opacity: 1;   
}

.block-page-rank .item-rank{
    width: 30px;
    height: 30px;
    position: relative;
    margin: auto;
}

.block-page-rank .block-page-rank-infobulle{
    display: flex;
}

.block-page-rank .block-page-rank-infobulle .diagram{
    margin: 0;
    text-align: center;
}

.block-page-rank .block-page-rank-infobulle .diagram>p{
    margin-bottom: 5px;   
    font-weight: 500;
}

.block-page-rank .block-page-rank-infobulle .diagram:first-child{
    margin-left: auto;   
}

.block-page-rank .block-page-rank-infobulle .diagram:last-child{
    margin-right: auto;   
}

.block-page-rank .block-page-rank-infobulle .diagram + .diagram{
    margin-left: 10px;
}

.listing-item-block-title{
    height: 25px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.listing-item-block-title>span{
    line-height: normal !important;
}

.listing-item-block:hover{
    transform:                  translateY(-10px);
    z-index:                    2;
}

.listing-item-block-photo{
    height:                     220px;
    display:                    flex;
    flex-direction:             column;
    justify-content:            center;
}

.listing-item-block.selected .listing-item-block-photo{
    background-color: #fff;
}

.listing-item-block-photo>a,
.listing-item-block-photo>div,
.listing-item-block-photo>span{
    margin: auto;
}

.listing-item-block-photo img{
    max-width:                  100%;
    max-height:                 100%;
    margin:                     auto;
}

.listing-item-block-miniature{
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.listing-item-block-actions{
    position:                   absolute;
    left:                       0;
    top:                        0;
    width:                      100%;
    height:                     220px;
    display:                    flex;
    flex-direction:             column;
    justify-content:            center;
    opacity:                    0;
    transition:                 all 0.3s;
    background:                 rgba(77, 73, 101, 0.8);
    border-radius:              5px 5px 0 0;
    z-index: 1;
}

.listing-item-block:hover .listing-item-block-actions{
    opacity:                    1;   
}

.listing-item-block-content{
    padding:                    10px 25px;
}

.listing-item-block.selected .listing-item-block-content p{
    color: #fff !important;
}

.listing-item-block-description{
    margin-top:                 3px;
}

.listing-item-block-actions .gs-menu-list{
    position:                   absolute;
    right:                      15px;
    top:                        15px;
}

.listing-item-block-actions .gs-menu-list-container{
    right:                      0;
    left:                       auto;
    transform:                  translateX(calc(50% - 3px)) translateY(20px);;
}

.listing-item-list-title{
    font-weight:                500;
}

.listing-item-list-title i.icon{
    margin-top: -1px;
    margin-left: 5px;
}

.listing-item-list-description{
    margin-top:                 5px;
}

/* TABLEAU
----------------------------------------*/

.gs-table{
    margin:                     auto auto 40px;
    background:                 #fff;
    border-radius:              25px 25px 0 0;
}

.data-container .gs-table{
    margin:                     auto 25px;
    min-height:                 400px;
}

.gs-table-row{
    display:                    flex;   
    border-bottom:               1px solid #e6e6e6;
    position: relative;
    z-index: 1;
}

.gs-table-row>.gs-col>img{
    max-width: 100%;   
}

.gs-table-row:hover{
    background:                 rgba(49, 135, 253, 0.05);
    z-index: 10;
}

.gs-table-row.head{
    border-bottom:              1px solid rgba(49, 135, 253, 0.2);
    border-radius:              25px 25px 0 0;
}

.no-actions .gs-table-row.head{
    border-radius: 25px 25px 0 0 !important;
}

.data-container .gs-table-row.head{
    border-radius:              0;
}

.gs-table-row:after{
    display:                    block;
    content:                    '';
    clear:                      both;
}

.gs-table-row .gs-col{
    padding:                    15px !important; 
    margin:                     auto;
}

.gs-table-row .bt-icon.view{
    opacity:                    0;
}

.gs-table-row:hover .bt-icon.view{
    opacity:                    1;
}

.gs-table-row .gs-menu-list{
    display:                    inline-block;
    margin-left:                5px;
}

.gs-table-row.head{
    background:                 rgba(49, 135, 253, 0.1) !important;
    font-weight:                500;
    min-height:                 60px;
}

.gs-table-row.head .gs-col{
    margin:                     auto;
    display:                    flex;
}

.gs-table-row .gs-col.right{
    text-align:                 right;
}

.gs-table-row .gs-col.actions{
    display:                    flex;
    justify-content:            flex-end;
}

.gs-table-row .selection{
    display:                    flex;
}

.gs-table-row .selection .input-container{
    margin: auto auto auto 0;   
}

.gs-table-col-sortable{
    cursor:                     pointer;
}

.gs-table-col-sortable i{
    width:                      16px;
    height:                     16px;
    margin-left:                7px;
    margin-top: auto;
    margin-bottom: auto;
}

.gs-table-col-sortable.asc i{
    content:                    url(../resources/img/order-desc.svg);
}

.gs-table-col-sortable.desc i{
    content:                    url(../resources/img/order-asc.svg);
}

.gs-table-options{
    padding:                    0 15px;
    height:                     60px;
}

.gs-table-options-buttons{
    display:                    none;
    justify-content:            flex-end;
}

.gs-table-options-buttons a{
    margin-right:               0;
    margin-left:                10px;
}

.gs-table-options-buttons.visible{
    display:                    flex;   
    width:                      100%;
}

.gs-table-options input{
    margin:                     auto 10px auto 0;
}

.gs-table-options label{
    margin:                     auto 0;
}

.gs-table-options .gs-col{
    height:                     100%;
    padding-bottom:             0 !important;
    display:                    flex;
} 

.gs-table-options .input-container{
    margin:                     auto 0;
}

.total-list-selection{
    display:                    none;
}

.gs-table-item-statement{
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 100%;
    margin-right: 5px;
}

.gs-table-item-statement.active{
    background: #41b691;
}

.gs-table-item-statement.inactive{
    background: #ff0000;
}

.gs-table-item-status{
    display:inline-block;
}

.gs-table-item-status>i{
    max-width: 10px;
}

.gs-table-row .gs-col.col_align_center{
    text-align: center;
    justify-content: center;
}

/* GOOGLE FONTS
----------------------------------------*/

.fonts-container .variants .variant-item{
	width: 						20%;
	float: 						left;
}

.fonts-container .variants .gs-form-part-title{
    padding: 0 20px;
}

/* LOCALISATIONS
----------------------------------------*/

#gs-form-localisation .gs-col{
    padding-bottom: 0;
}

.localisation-value{
    display: flex !important;
}

.localisation-value .gs-div-editable{
    flex: 1;
    width: auto;
    margin: 0;
}

.localisation-value .gs-menu-list{
    width: 30px;
    margin: 0 0 auto 20px;
}

.localisation-tags-description{
    margin: 15px 0;
}

.localisation-data{
    margin-top: 20px;
}

.localisation-property-title{
    overflow: hidden;
    text-overflow: ellipsis;
}

#input-import{
    display: none;
}

/* COMPOSANT ACCORDEON
----------------------------------------*/

.gs-accordeon{
    margin-bottom: 25px;
    padding: 0 20px;
    background: #fff;
    border-radius: 10px 10px 0 0;
}

.gs-accordeon:hover{
    box-shadow: 0 0 2px 0 #3187fd;
}

.gs-accordeon .gs-table .gs-div-editable{
    border: 0;
    padding: 0;
}

.gs-accordeon .gs-table .gs-div-editable:hover{
    color: #3187fd;
}

.gs-accordeon .gs-table{
    margin-bottom: 0;
    min-height: 0;
}

.gs-accordeon .gs-table .gs-table-row:last-child{
    border-bottom: 0;
}

.gs-accordeon .gs-table-row.head{
    border-radius: 0;
}

.gs-accordeon .gs-table-row .gs-col{
    padding: 15px 20px !important;
    margin: 0 auto;
}

.gs-accordeon-top{
    margin: 0 -20px;
    padding: 0 20px;
    height: 60px;
    display: flex;
}

.gs-accordeon-content{
    margin: 0 -20px;
    height: 0;
    overflow: hidden;
    transition: height 0.3s;
}

.gs-accordeon.open .gs-accordeon-content{
    height: auto;
    overflow: visible;
}   

.gs-accordeon-top>a{
    margin: auto 0 auto 20px;
}

.gs-accordeon-top>.title{
    flex: 1;
    width: auto;
    margin: auto;
}

.gs-accordeon-top>.title{
    font-weight: 500;
}

.gs-accordeon-top>.title>.total-items{
    margin-left: 10px;
    font-size: 12px;
    font-weight: 400;
    font-style: italic;
}

.gs-accordeon.open .gs-accordeon-top .bt-open>i{
    content: url(../resources/img/icons/icon-minus.svg) !important;
}

.gs-accordeon-actions{
    padding: 10px 20px;
    text-align: right;
    position: sticky;
    z-index: 100;
}

.gs-accordeon-actions .gs-button + .gs-button{
    margin-left: 10px;
}

/* PICTURE EDITOR
*******************************************/

#picture_editor{
    width:                      100%;
    height:                     100%;
    position:                   relative;
    background:                 #f5f8fb;
    display:                    flex;
    flex-direction:             column; 
    box-sizing:                 border-box;
    animation-name:             pictureeditor-display;
    animation-duration:         0.3s;
    animation-iteration-count:  1;
    z-index:                    100000;
    top:                        0;
    left:                       0;
    position:                   fixed;
    opacity:                    1;
}

.pe_head{
    padding-top: 15px;
    background: #fff;
    position: relative;
    z-index: 10;
}

.pe-actions{
    text-align: right !important;
}

.pe-actions .gs-button + .gs-button{
    margin-left: 10px;
}

.pe_head .gs-col{
    padding-bottom: 15px !important;
}

.pe_head_quit{
    line-height: 30px;
    float: left;
    width: 135px;
}

.pe_head_quit span{
    margin-left: 10px;
    font-weight: 600;
    font-size: 16px;
    display: inline-block;
}

.pe_head h2{
    float: left;
    height: 30px;
    line-height: 30px;
    text-transform: uppercase;
    margin-bottom: 0;
}

.pe_body{
    height:                     auto;
    overflow:                   hidden;
    position:                   relative;
    flex: 1;
}

.pe_workspace{
    position:                   absolute;
    width: 100%;
    top: 0;
    left: 0;
    box-sizing:                 border-box;
    height:                     100%;
    padding:                    25px 375px 25px 25px;

}

.pe-menu-item.main .pe-menu-item-title{
    line-height: 25px;
    margin-top: 3px;
}

.pe_workspace .picture_container{
    width:                      100%;
    height:                     100%;
    position:                   relative;
    display:                    flex;
    text-align:                 center;
}

.pe_workspace .picture_container .pe_picture{
    width:                      auto;
    height:                     auto;
    margin:                     auto;
    max-width:                  100%;
    max-height:                 100%;
    position:                   relative;
    overflow:                   hidden;
}

.pe_workspace .picture_container .pe_picture .konvajs-content{
    height:                     100%;
    width:                      100%;
    position:                   absolute;
    top:                        0;
    left:                       0;
    z-index:                    1;
}

.pe_workspace .picture_container .pe_picture .pe_picture_border{
    width:                      100%;
    height:                     100%;
    top:                        0;
    left:                       0;
    z-index:                    90;
    display:                    none;
    position:                   absolute;
    box-sizing:                 border-box;
    border:                     1px solid #ababab;
}

.pe_workspace .picture_container .pe_picture.active .pe_picture_border{
    display:                    block;
}

.pe_workspace .ui-resizable-se{
    width:                      20px;
    height:                     20px;
    position:                   absolute;
    bottom:                     0;
    right:                      0;
    z-index:                    100;
    background:                 url(../resources/img/icons/expand.svg) no-repeat center center #ababab;
    background-size:            12px;
    cursor:                     nwse-resize;
}

.pe_workspace .ui-resizable-se:hover{
    background-color:           #3187fd;            
}

.pe_picture_mask{
    width:                      100%;
    height:                     100%;
    top:                        0;
    left:                       0;
    position:                   absolute;
    z-index:                    10;
    background:                 rgba(0, 0, 0, 0.6);
    cursor:                     crosshair;
}

.pe_cropper_mask{
    background:                 rgba(0, 0, 0, 0.6);
    position:                   absolute;
    z-index:                    10;
}

.pe_cropper_mask.mask_top{
    left:                       0;
    top:                        0;
    width:                      100%;
}

.pe_cropper_mask.mask_right{
    right:                      0;
    top:                        0;
    width:                      auto;
}

.pe_cropper_mask.mask_bottom{
    left:                       0;
    bottom:                     0;
    width:                      100%;
}

.pe_cropper_mask.mask_left{
    left:                       0;
    top:                        0;
    width:                      auto;
}

.pe_picture_selection_cropper{
    position:                   absolute;
    z-index:                    11;
    background-repeat:          no-repeat;
    overflow:                   hidden;
}

.pe_picture_cropper_border{
    border:                     1px solid #ababab;
    box-sizing:                 border-box;
    width:                      100%;
    height:                     100%;
    position:                   absolute;
    top:                        0;
    left:                       0;
    z-index:                    1;
}

.pe_crop_button{
    width:                      20px;
    height:                     20px;
    background-repeat:          no-repeat;
    background-position:        center center;
    background-color:           #ababab;
    background-size:            12px;
    z-index:                    2;
    position:                   absolute;
}

.pe_crop_button:hover{
    background-color:           #3187fd; 
}

.pe_resize_cursor{
    background-image:           url(../resources/img/icons/expand.svg);
    bottom:                     0;
    right:                      0;
    cursor:                     nwse-resize;
}

.pe_validate_crop{
    background-image:           url(../resources/img/icons/checked.svg);
    top:                        0;
    left:                       0;
    cursor:                     pointer;
}

.pe_cancel_crop{
    background-image:           url(../resources/img/icons/fullscreen.svg);
    top:                        0;
    left:                       20px;
    cursor:                     pointer;
}

.pe_crop_marker_horizontal{
    width:                      100%;
    left:                       0;
    border-top:                 1px dashed rgba(255, 255, 255, 0.6);
    top:                        33.3333%;
    position:                   absolute;
    z-index:                    1;
}

.pe_crop_marker_horizontal.second{
    top:                        66.6666%;
}

.pe_crop_marker_vertical{
    height:                     100%;
    top:                        0;
    border-left:                1px dashed rgba(255, 255, 255, 0.6);
    left:                       33.3333%;
    position:                   absolute;
    z-index:                    1;
}

.pe_crop_marker_vertical.second{
    left:                       66.6666%;
}

.pe_cropper_background{
    width:                      100%;
    height:                     100%;
    position:                   absolute;
    z-index:                    1;
    top:                        0;
    left:                       0;
    cursor:                     move;
}

#pe_picture_size .form-col + .form-col{
    margin-top:                 5px;
}

#pe_picture_size .editor-field-text{
    height:                     30px;
    background-size:            30px;
    padding-left:               46px;
    padding-right:              40px;
}

#pe_picture_size .input_field_locked{
    height:                     30px;
    width:                      30px;
    right:                      0;
    background-size:            12px;
}

#pe_picture_size .form-col .input_title{
    display:                    none;
}

.pe_menu{
    z-index: 2;
    float: right;
}

.pe_menu .ui-menu-vertical-item-body .bt-icon{
    background: #ababab;
}

.pe_menu .ui-menu-vertical-item-body .bt-icon i.icon{
    filter: brightness(0) invert(1)
}

.pe_menu .ui-menu-vertical-item-body .bt-icon:hover{
    background: #3187fd;
}

.pe_menu .ui-menu-vertical-item-body .bt-icon + .bt-icon{
    margin-left: 10px;
}

.pe-info-item p:first-child{
    text-transform: uppercase;
}

.pe-info-item + .pe-info-item{
    margin-top: 18px;
}

.pe_menu .ui-menu-vertical-item-body .gs-col{
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 18px;
}

.pe_menu .ui-menu-vertical-item-body .size-input{
    padding-left: 20px;
    padding-right: 20px;
    display: flex;
}

.pe_menu .ui-menu-vertical-item-body .size-input .gs-input-title{
    width: auto;
    margin: 0 5px 0 0;
    line-height: 40px;
}

.pe_menu .ui-menu-vertical-item-body .size-input .input-container{
    flex: 1;
}

#picture_infos p span{
    margin-right:               5px;
}

.pe_menu .ui-menu-vertical-item .form-col{
    padding:                    0;
    margin-bottom:              0;
}

.pe_menu .ui-menu-vertical-item .form-col + .form-col{
    margin-top:                 25px;   
}

.pe_menu .ui-menu-vertical-item .editor-field-text{
    background-color:           #fff;
}

.pe_menu .ui-menu-vertical-item  .editor-field-cursor{
    background:                 none;
}


/* FILESMANAGER
----------------------------------------*/

#filesManager{
	background: 				#fff;
	height: 					100%;
	display: 					flex;
	justify-content: 			flex-start;
	border-radius: 				10px 10px 0 0;
    position:                   relative;
    text-align: left;
}

#filesManager.mode-window{
    height:                     calc(100% - 50px);
}

#filesmanager-selector{
    display:                    none;
}

.fm-body{
	width: 						auto;
	flex: 						1;
	height: 					100%;
	padding: 					20px 40px;
	display: 					flex;
	flex-direction: 			column;
}

.fm-head{
	height: 					auto;
	padding-bottom: 			25px;
	margin-bottom: 				25px;
	border-bottom: 				1px solid #f4f4f4;
}

.fm-infos{
	width: 						250px;
	height: 					100%;
	padding: 					20px 20px;
	border-left: 				1px solid #f4f4f4;
	overflow: 					auto;
}

.fm-infos .preview{
	width: 						100%;
	height: 					220px;
	display: 					flex;
	justify-content: 			center;
	margin-bottom: 				15px;
	border-radius: 				5px;
	overflow: 					hidden;
}

.fm-infos .preview img{
	margin: 					auto;
	max-width: 					100%;
	max-height: 				100%;
}

.fm-infos .fileName{
	padding-bottom: 			15px;
	border-bottom: 				1px solid #f4f4f4;
	margin-bottom: 				15px;
    word-break: break-all;
}

.fm-infos .menu-title{
	font-weight: 				500;
	margin-bottom: 				15px;
}

.fm-infos .menu-actions{
	padding-bottom: 			15px;
	border-bottom: 				1px solid #f4f4f4;
	margin-bottom: 				15px;
}

.fm-infos .menu-actions-items{
    display:                    flex;
    flex-direction:             column;
}

.fm-infos .menu-actions a{
	color: 						#3187fd;
	margin-left: 				-15px !important;
}

.fm-infos .informations-table-row{
    display:                    flex;
    margin-bottom:              5px;
}

.fm-infos .informations-table-row p{
    width:                      50%;   
}

.fm-infos .informations-table-row p.title{
    font-weight:                600;   
}

.fm-head #searchbox{
	background: 				none;
}

.fm-content{
	flex: 						1;
	overflow: 					auto;
    position:                   relative;
    margin:                     0 -40px;
    padding:                    0 40px;
}

.fm-content .block-no-file{
    padding: 25px;
    background: #f5f8fb;
    border-radius: 3px;
}

.fm-dropzone{
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 101;
    background: rgba(49, 135, 253, 0.8);
    width: 100%;
    display: none;
}

.fm-dropzone:after{
    position: absolute;
    width: calc(100% - 40px);
    height: calc(100% - 40px);
    top: 20px;
    left: 20px;
    pointer-events: none;
    border: 1px dashed #fff;
    content: '';
}

.fm-dropzone-container{
    display: flex;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.fm-dropzone-container p{
    margin: auto;   
    font-weight: 500;
}

.fm-content-bg{
    position:                   absolute;
    width:                      100%;
    height:                     100%;
    top:                        0;
    left:                       0;
}

.fm-item{
    width:                      130px;
    float:                      left;
    height:                     160px;
    margin:                     5px;
    transition:                 all 0.3s;
    position:                   relative;
}

.fm-item-container{
    position:                   relative;
    width:                      100%;
    height:                     100%;
    padding:                    40px 10px 0;
    box-sizing:                 border-box;
}

.fm-item:hover,
.fm-item.active,
.fm-item.selected{
    background:                 rgba(49, 135, 253, 0.1);
}

.fm-item-container:after{
    border:                     2px solid transparent;
    height:                     100%;
    width:                      100%;
    position:                   absolute;
    left:                       -2px;
    top:                        -2px;
    content:                    '';
    pointer-events:             none;
    transition:                 all 0.3s;
}

.fm-item.active .fm-item-container:after{
    border:                     2px solid #3187fd;
}

.fm-item-content{
    position:                   relative;
}

.fm-item-content p{
	text-align: 				center;
}

.fm-content .listing-item-block-title{
	white-space: 				nowrap;
	overflow: 					hidden;
	font-size: 					14px;
}

.fm-content .fm-item-content .gs-infobulle{
    display:                    none;
    opacity:                    1;
    padding:                    5px;
    background:                 rgba(12, 6, 46, 0.9);
    color:                      #fff;
    border-radius:              5px;
    font-size:                  13px;
    font-weight:                500;
    pointer-events:             none;
}

.fm-content .fm-item-content .gs-infobulle:after{
    background:                 rgba(12, 6, 46, 0.9);
}

.fm-content .fm-item-content:hover .gs-infobulle{
    display:                    block;
}

.fm-item.dragenter{
	background: 				rgba(49, 135, 253, 0.1);
	border: 					1px solid rgba(49, 135, 253, 0.5);
	border-radius: 				3px;
}

.fm-item-icon{
	height: 					60px;
	display: 					flex;
	flex-direction: 			column;
	justify-content: 			center;
	margin-bottom: 				15px;
    position: relative;
}

.fm-item.folder .fm-item-icon:after{
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    display: none;
    content: '';
    width: 12px;
    height: 12px;
    background: url(../resources/img/icons/icon-lock.svg);
    background-size: 12px auto;
    opacity: 0.4;
    transform: translateY(5px);
}

.fm-item.folder.private .fm-item-icon:after{
    display: block;
}

.fm-item-icon img{
	margin: 					auto;
	max-width: 					100%;
	max-height: 				100%;
	pointer-events: 			none;
}

.fm-item.progress .fm-item-actions{
    display:                    none !important;
}

.fm-item-actions{
	position:                   absolute;
    right:                      5px;
    top:                        5px;
    display:                    none;
}

.fm-item-actions .bt-icon:hover{
    background:                 #fff;
}

.fm-item:hover .fm-item-actions,
.fm-item.active .fm-item-actions{
    display:                    block;
}

.fm-head-actions{
	margin-top: 				15px;
	text-align: 				right;
}

.fm-head-actions a + a{
	margin-left: 				10px;
}

.fm-breadcrumb{
	margin-top: 				15px;
}

.fm-breadcrumb-item{
	display: 					inline-block;
	vertical-align: 			top;
}

.fm-breadcrumb-item + .fm-breadcrumb-item:before{
	content: 					'>';
	margin: 					0 5px;
	display: 					inline-block;
	color: 						#272727;
	font-size: 					13px;
}

.fm-breadcrumb-item a{
	text-transform: 			lowercase;
	color: 						#3187fd;
	font-size: 					13px;
	height: 					20px;
	line-height: 				20px;
	border-radius: 				5px;
	padding: 					0 5px;
	display: 					inline-block;
}

.fm-breadcrumb-item.open a,
.fm-breadcrumb-item a:hover{
	background: 				rgba(49, 135, 253, 0.1);
}

.fm-item-progressbar{
    width:                      100%;
    height:                     10px;
    position:                   absolute;
    left:                       0;
    top:                        0;
    z-index:                    10;
}

.fm-item-progressbar span{
    width:                      0;
    height:                     100%;
    display:                    block;
    background:                 #2c74d7;
    transition:                 background 0.3s;
}

.fm-item-progressbar.complete span{
    background:                 #41b691;
}

.fm-item-mask{
    position:                   absolute;
    top:                        0;
    left:                       0;
    width:                      100%;
    height:                     100%;
    background:                 rgba(0, 0, 0, 0.65);
    display:                    flex;
    flex-direction:             column;
    justify-content:            center;
}

.fm-item-mask a{
    margin:                     0 auto;
}

.fm-item-mask a i.icon{
    filter:                     brightness(1) invert(1);
}

.fm-item-mask a + a{
    margin-top:                 5px;   
}

.fm-footer{
    position:                   absolute;
    width:                      100%;
    bottom:                     -50px;
    left:                       0;
    height:                     50px;
    background:                 #fff;
    padding:                    0 20px;
    box-sizing:                 border-box;
    border-top:                 1px solid #f4f4f4;
}

.fm-infos .fm-footer .count,
.fileName .count{
    color:                          #41b691;
    font-size:                      18px;
    font-weight:                    600;
}

.fm-selection{
    float:                      left;
    width:                      50%;
    text-align:                 left;
    display:                    flex;
    justify-content:            flex-start;
}

.fm-selection-actions{
    float:                      right;
    width:                      50%;
    text-align:                 right;
    display:                    flex;
    justify-content:            flex-end;
}

.fm-footer #groupActions{
    width:                      210px;
    margin:                     9px 0 0 0;
    background-color:           transparent;
    display:                    none;
}

.fm-selection-active{
    line-height:                50px;
}

.fm-selection-active span{
    font-weight:                600;   
}

.fm-selection .gs-col{
    padding:                    16px 0 0 !important;   
}

.fm-item-select{
    position:                   absolute;
    top:                        10px;
    left:                       10px;
    z-index:                    50;
    display:                    none;
}

.fm-item:hover .fm-item-select,
.fm-item.active .fm-item-select,
.fm-item.selected .fm-item-select{
    display:                    block;
}

.fm-item-select .gs-col{
    padding:                    0 !important;
}

/* ZOOM
----------------------------------------*/

.gs-zoom{
    position:                   fixed;
    z-index:                    100000;
    top:                        0;
    left:                       0;
    width:                      100%;
    height:                     100%;
    opacity:                    0;
    display:                    flex;
    background:                 rgba(0, 0, 0, 0.8);
}

.gs-zoom-content{
    width:                      100%;
    height:                     100%;
    margin:                     auto;
    background:                 #fff;
    padding:                    20px 20px 0;
    box-sizing:                 border-box;
    display:                    flex;
    flex-direction:             column;
}

.gs-zoom-body{
    display:                    flex;
    width:                      100%;
    justify-content:            center;
    flex-direction:             column;
    height:                     calc(100% - 50px);
}

.gs-zoom-body audio{
    margin: auto;
    width: 300px;
    height: 100px;
}

.gs-zoom-body img{
    margin:                     auto;
    max-width:                  100%;
    max-height:                 100%;
} 

.gs-zoom-body video{
    width: 100%;
    height: 100%;
} 

.gs-zoom-footer{
    flex:                       1;  
}

.gs-zoom-title{
    float:                      left;
    width:                      70%;
    display:                    flex;
    flex-direction:             column;
    justify-content:            center;
    padding-right:              20px;
    height:                     100%;
    box-sizing:                 border-box;
}

.gs-zoom-title p{
    margin:                     auto;  
    text-align:                 left;
    width:                      100%;
}

.gs-zoom-menu{
    float:                      right;
    width:                      30%;
    box-sizing:                 border-box;
    text-align:                 right;
    padding-top:                10px; 
}

.gs-zoom-menu a + a{
    margin-left:                10px;   
}

/* INFORMATION BOX
----------------------------------------*/

.gs-container-box{
	display: flex;
}

.gs-container-box .gs-col{
	margin: 0;
}

.gs-information-box{
    background: #fff;
    border-radius: 5px;
    transition: all 0.3s;
    position: relative;
    z-index: 1;
    height: 100%;
}

.gs-information-box:hover{
    transform: translateY(-10px);
}

.gs-information-box-title{
    padding: 25px 25px 5px;
    height: 125px;
}

.gs-information-box-title.icon{
    height: 150px;
}

.gs-information-box-title.icon:before{
    display: block;
    margin: 0 0 25px;
    text-align: left;
    height: 32px;
    width: 32px;
    content: '';
    background-size: 100%;
    background-repeat: no-repeat;
}

.gs-information-box-body{
    padding: 0 25px 25px;
}

/* INFORMATION MENU
----------------------------------------*/

#informations-menu .gs-information-box-body{
    text-align: center;
}

#informations-menu .gs-container{
    display: flex;
}

#informations-menu .gs-information-box-body p{
    text-align: left;
    display: flex;
}

#informations-menu .gs-information-box-body p span.info-value{
    font-weight: 500;
    margin-left: 3px;
    flex: 1;
}

#informations-menu .bt-hebergement-link{
    margin-top: 25px;
}

#informations-menu .info-element p{
    text-align: left;
}

#informations-menu .info-element img{
    max-width: 75%;
    margin-top: 10px;
}

#informations-menu .gs-information-box-title.logo:before{
    background-image: url(../resources/img/icons/icon-logotype.svg);
}

#informations-menu .gs-information-box-title.settings:before{
    background-image: url(../resources/img/icons/icon-settings-ganesha.svg);
}

#informations-menu .gs-information-box-title.web:before{
    background-image: url(../resources/img/icons/icon-web.svg);
}

#informations-menu .gs-information-box-title.admin:before{
    background-image: url(../resources/img/icons/icon-contact-admin.svg);
}

#informations-menu .gs-information-box-title.img:before{
    background-image: url(../resources/img/icons/icon-image-settings.svg);
}

#informations-menu .gs-information-box-title.blog:before{
    background-image: url(../resources/img/icons/icon-blog.svg);
}

/* MENU VERTICAL
----------------------------------------*/

.ui-menu-vertical{
    width: 350px;
    height: 100%;
    background: #fff;
    position: relative;
    padding: 25px 0 0;
}

.ui-menu-vertical>form{
    height: 100%;
}

.ui-menu-vertical-item{
    padding: 0 25px;
    height: 100%;
    overflow: auto;
}

.ui-menu-vertical-item.main .ui-menu-vertical-item-body>a{
    display: block;
    padding-bottom: 8px;
    color: #272727;
    font-weight: 500;
    text-transform: uppercase;
    border-bottom: 1px solid #e6e6e6;
    background: url(../resources/img/icons/icon-right.svg) no-repeat right top 5px;
}

.ui-menu-vertical-item.sub{
    display: none;
}

.ui-menu-vertical-item.main .ui-menu-vertical-item-body>a+a{
    margin-top: 18px;
}

.ui-menu-vertical-item-head{
    padding: 0 0 35px;
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 2;
}

.ui-menu-vertical-item-head .bt-back{
    margin-left: -6px;
}

.ui-menu-vertical-item-title{
    margin-top: 3px;
    list-style: 25px;
}

.ui-menu-vertical .gs-form-part-title{
    margin-bottom: 20px;
}

/* BOUTON EDITOR
----------------------------------------*/

#button-editor-stage{
    width: 100%;
    height: 100%;
    display: flex;
    position: relative;
}

#button-editor-demo{
    display:inline-flex;
    vertical-align:top;
    text-decoration:none;
    cursor:pointer;
    margin:auto;
    width:auto;
    height:auto;
    position: relative;
    margin: auto;
    z-index: 2;
}

#button-editor-demo>i{
    display: inline-block;
    vertical-align: middle;
    margin: auto 5px auto 0;
}

.button-editor-horizontal-border{
    width: auto;
    height: 100%;
    border-left: 1px dotted #ddd;
    border-right: 1px dotted #ddd;
    z-index: 1;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 0;
    top: 0;
}

.button-editor-horizontal-border>p{
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    pointer-events: none;
    top: 20px;
}

.button-editor-vertical-border>p{
    position: absolute;
    right: 20px;
    margin: auto;
    text-align: center;
    pointer-events: none;
    top: -100px;
    bottom: -100px;
    writing-mode: vertical-rl;
}

.button-editor-vertical-border{
    width: 100%;
    height: auto;
    border-top: 1px dotted #ddd;
    border-bottom: 1px dotted #ddd;
    z-index: 1;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 0;
    top: 0;
}

/* CREATION DE MENUS
----------------------------------------*/

.gs-menueditor-form-add{
    margin-bottom:              5px;
    height:                     40px;
}

.gs-menueditor-form-add .form-col{
    margin-bottom:              0;
}

.gs-menueditor{
    display: block;
    padding-bottom: 25px;
}

.gs-menueditor-item{
    height:                     auto;
    display:                    block;
    clear:                      both;
    position:                   relative;
    padding:                    15px 25px 0;
    background:                 #fff;
    border-radius: 10px;
}

.gs-menueditor-item.level-0:hover{
    box-shadow: 0 0 2px 0 #3187fd;
}

.gs-menueditor-item.level-0 + .level-0{
    margin-top: 10px;
}

.gs-menueditor-item-head{
    display:                    flex;
    width:                      auto;
    position:                   relative;
}

.gs-menueditor-item-head .title{
    padding: 0;
    margin: auto 0;
    flex: 1;
    box-sizing: border-box;
}

.gs-menueditor-item-actions{
    width:                      auto;
    margin: auto 0;
    box-sizing: border-box;
}

.gs-menueditor-item-actions a + a{
    margin-left: 5px;
}


.gs-menueditor-item-submenu{
    width:                      auto;
    padding:                    0;
    clear:                      both;
    padding-top: 15px;
}

.gs-menueditor-item-submenu .gs-menueditor-item{
    background:                 url(../resources/img/submenu.svg) no-repeat left 5px top 15px transparent;
    background-size:            20px 20px;
    padding: 15px 0 0 40px;
}


.gs-menueditor-item-submenu .gs-menueditor-item:hover{
    background-color: rgba(49, 135, 253, 0.05);
}

.gs-menueditor-item-submenu.active{
    display:                    block;   
}

.gs-menueditor-item-form{
    width:                      auto;
    display:                    none;
    padding-top: 15px;
}

.gs-menueditor-item-form .gs-col{
    padding-bottom: 0;
}

.gs-menueditor-item-form.visible{
    display:                    block;   
}

.ui-state-highlight {
    height:                     45px;
    list-style:                 none;
    width:                      auto;
    background:                 #3187fd;
    opacity:                    0.5;
    margin-bottom:              5px;
}

.form-mail-response{
    padding: 25px;
    border-radius: 5px;
    background: #eee !important;
}

.form-mail-response-title{
    margin-bottom: 20px;
}

.form-mail-response .user-content-item>span{
    font-weight: 600;
    margin-bottom: 5px;
}

.form-mail-response .user-content-item + .user-content-item{
    margin-top: 10px;
}

.form-mail-pj{
    margin-top: 20px;
}

.form-mail-pj>ul{
    padding-left: 10px;   
}

.form-mail-pj>ul>li{
    display: block;
    margin-top: 5px;
}

/* GESTION DES MODULES
----------------------------------------*/

#module-selector{
    display: none;
}

/* GESTION DES THEMES
----------------------------------------*/

#theme-selector{
    display: none;
}

.theme-installer-actions{
    text-align: center;
    margin-top: 50px;
}

.theme-installer-actions a + a{
    margin-left: 10px;   
}

.theme-installer-part{
    display: none;
}

.theme-installer-part[data-id="1"]{
    display: block;
}

.theme-installer-infos{
    margin-bottom: 25px;
    display: flex;
}

.theme-installer-infos .theme-version{
    display: flex;
    flex: 1;
    margin: 0 0 auto;
}

.theme-installer-infos .theme-miniature{
    text-align: right;
    flex: 1;
    padding-left: 25px;
}

.theme-installer-infos .theme-miniature>img{
    max-width: 400px;   
}

.theme-installer-infos .theme-version div{
    margin: auto 0;
}

.theme-installer-infos .theme-version div + div{
    padding-left: 56px;
    position: relative;
}

.theme-installer-infos .theme-version div + div:before{
    margin: 0 20px;
    background: url(../resources/img/icons/icon-right.svg) no-repeat center;
    background-size: 100% auto;
    height: 100%;
    width: 16px;
    content: '';
    position: absolute;
    left: 0;
    top: 0;
}

.theme-installer-infos .theme-modules{
    margin-top: 25px;
}

.theme-modules-list-title{
    margin-bottom: 15px;
    font-weight: 600;
}

.theme-modules-list p{
    float: left;
    width: 50%;
    padding-right: 25px;
    box-sizing: border-box;
    margin-bottom: 10px;
    display: list-item;
    list-style: inside;
}

.theme-modules-list p:even{
    clear: both;   
}

.theme-installer-modules-list + theme-installer-modules-list{
    margin-top: 25px;
}

.theme-installer-modules-list>.gs-container{
    margin-top: 25px;
}

.theme-options-container{
    margin-top: 25px;
}

.theme-installer-error{
    padding: 25px;
    background: rgba(237, 64, 64, 0.1);
    border-radius: 25px;
    margin-top: 25px;
}

.theme-installer-error.success{
    background: rgba(84, 189, 156, 0.1);
}

/* CONTEXT MENU
----------------------------------------*/

.context-menu{
    position: fixed;
    width: 130px;
    z-index: 200;
    height: auto;
    background: #fff;
    border-radius: 3px;
    padding: 5px 10px 3px;
}

.context-menu li{
    display: block;
    text-align: left;
    padding: 4px 0 6px;
}

.context-menu li i{
    display: inline-block;
    margin-right: 8px;
    max-width: 12px;
}

.context-menu li a.disabled{
    color: #e6e6e6 !important; 
    pointer-events: none;
}

.context-menu li a.disabled i{
    opacity: 0.2;   
}

.context-menu li.separator{
    border-top: 1px solid #e6e6e6;   
}

/* TABLEAU DE BORD
----------------------------------------*/

#board{
    position: relative;
}
    
#board:after{
    clear: both;
    display: block;
    content: '';
}

#board .ui-icon{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 20px;
    height: 20px;
}

#board .ui-icon:after{
    width: 10px;
    height: 10px;
    position: absolute;
    border: 2px solid #ddd;
    border-top: 0;
    border-left: 0;
    content: '';
    bottom: 4px;
    right: 4px;
}

.ui-resizable-helper
{
    border: 1px dotted #e6e6e6;
    pointer-events: none;
}

#board .widget{
    position: absolute;
    height: 400px;
    display: flex;
    flex-direction: column;
    border: 1px solid #e6e6e6;
    box-sizing: border-box;
    border-radius: 3px;
    background: #fff;
    z-index: 2;
    opacity: 0;
    left: 0;
    top: 0;
}

#board .widget:hover{
    z-index: 99;   
}

#board .widget .block-content{
    margin: 0;
    padding: 0;
}

#board .widget.resizable{
    transition-property: left, top, width;
    transition-duration: 0.2s, 0.2s, 0.2s;
    transition-delay: 0s, 0s, 0.2s;
}

#board .widget.resizable.contract{
    transition-delay: 0s, 0s, 0s;
}

#board .dropzone{
    position: absolute;
    height: 400px;
    border: 1px solid #e6e6e6;
    z-index: 100;
    opacity: 0;
    border-radius: 3px;
}

#board .zone-overview{
    border: 1px solid #e6e6e6;
    border-radius: 3px;
    box-sizing: border-box;
    height: 400px;
    position: absolute;
    z-index: 1;
}

#board .widget-head{
    height: 50px;
    border-bottom: 1px solid #e6e6e6;
    padding: 0 20px;
    display: flex;
    cursor: move;
}

#board .widget-head textarea{
    display: none;   
}

#board .widget-title{
    width: auto;
    margin: auto auto auto 0;
}

#board .widget-head .gs-menu-list{
    width: 30px;
    margin: auto 0 auto auto;
}

#board .widget-body{
    height: auto;
    flex: 1;
    padding: 20px;
    max-height: calc(100% - 50px);
}

.window-form-settings{
    width: 100vw;
    height: 100%;
    position: fixed;
    z-index: 1001;
    top: -100%;
    left: 0;
    background: #fff;
    padding: 60px 25px;
    box-sizing: border-box;
    display: flex;
}

.window-form-settings .bt-close{
    position: absolute;
    z-index: 10;
    left: 25px;
    top: 15px;
}

.window-form-container{
    width: 960px;
    margin: auto;
    height: auto;
    max-height: 100%;
}

.window-form-container h2{
    margin-bottom: 45px;
}

.window-form-container .form-widget-title{
    margin-bottom: 15px;
}

.window-form-container .block-content{
    padding: 0;
    border-radius: 0;
    margin-bottom: 0;
}

.window-form-settings #bt-save-widget-settings{
    position: absolute;
    top: 15px;
    right: 25px;
    z-index: 10;
}

.new-widgets-list-container>div{
    margin: 0 0 50px;
    padding: 25px 0;
    border: 1px solid #E6E6E6;
    border-radius: 12px;
}

.new-widgets-list-container>div:after{
    display: block;
    content: '';
    clear: both;
}

.new-widget{
    width: 20%;
    height: auto;
    float: left;
    padding: 0 25px;
    cursor: pointer;
    box-sizing: border-box;
    position: relative;
}

.new-widget:hover .gs-infobulle{
    opacity: 1;
}

.new-widget-miniature{
    width: 100%;
    border-radius: 12px;
    height: 0;
    padding-top: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: all 0.3s;
    box-shadow: 0 0 20px 0 rgb(0, 0, 0, 0.1);
}

.new-widget-title{
    height: 50px;
    display: flex;
    box-sizing: border-box;
}

.new-widget-title p>span{
    display: block;   
}

.widgets-enabled{
    margin-bottom: 0 !important;
}

.new-widget-title p{
    margin: auto;
    text-align: center;
    font-weight: 500;
}

.new-widget-description{
    margin-bottom: 15px;
    margin-top: -10px;
}

.new-widgets-list-container>div .no-widget{
    width: 100%;
    height: 50px;
    text-align: center;
    display: flex;
}

.new-widgets-list-container>div .no-widget p{
    margin: auto;
}

.widget-mod-shortcut{
    height: 100%;
    width: 100%;
    display: block;
    text-decoration: none;
    padding-bottom: 50px;
    box-sizing: border-box;
    position: relative;
    transition: all 0.3s;
}

.widget-mod-shortcut:hover{
    transform: scale(1.05);
}

.widget-mod-shortcut-img{
    height: 100%;
    width: 100%;
    text-align: center;
    display: flex;
}

.widget-mod-shortcut-img img{
    margin: auto;
    max-width: 100%;
    max-height: 100%;
}

.widget-mod-shortcut p{
    height: 50px;
    display: flex;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    text-align: center;
}

.widget-mod-shortcut p span{
    margin: auto;
}

/* STATISTIQUES
----------------------------------------*/

.gs-stats{
    padding-bottom: 25px;
}

.gs-stats-pages-visited .data-container-total{
    display: none;
}

.gs-stats-pages-visited-description{
    margin-bottom: 25px;
}

.gs-stats-pages-visited .block-content p{
    display: none;
}

.gs-stats-pages-visited .block-content h2{
    margin-bottom: 0;   
    font-size: 15px;
    color: #272727;
    font-weight: 400;
}

.gs-stats-pages-visited .gs-table{
    min-height: 0;
}

.gs-stats-data-keys,
.gs-stats-evolution{
    margin-bottom: 45px;
}

.gs-stats-session-type{
    margin-bottom: 25px;   
}

.gs-stats-data-keys .gs-container{
    margin: 0 -10px;
}

.gs-stats-data-keys .gs-col{
    padding: 0 10px 20px;
}

.gs-stats-data-keys .gs-col:nth-child(n+5){
    padding-bottom: 0;
}

.stats-data-key{
    height: 150px;
    border-radius: 12px;
    padding: 15px 20px;
    box-sizing: border-box;
    background: #fff;
}

.stats-data-title{
    height: 22px;
}

.stats-data-value{
    margin-bottom: 5px;
    height: 50px;
    line-height: 50px;
}

.stats-data-legend{
    display: flex;
    height: 43px;
}

.stats-data-legend span{
    display: block;
    width: 100%;
    margin: auto;
}

.page-stats-percent-complement{
    font-weight: 500;
}

.session-type-container{
    margin: 0 -20px;
}

.session-type-container>.block-content{
    margin: 0 20px;
}

.session-type-container:after{
    clear: both;
    display: block;
    content: '';
}

.session-type-item{
    float: left;
    padding: 0 20px;
    width: 25%;
    box-sizing: border-box;
    margin-bottom: 20px;
    position: relative;
}

.session-type-item:nth-child(4n+1):before,
.session-type-item:nth-child(4n+1):after{
    display: none;
}

.session-type-item:before{
    height: 1px;
    width: 30px;
    left: -15px;
    background: #272727;
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
}

.session-type-item:after{
    content: '';
    width: 15px;
    height: 15px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 4px;
    background: url(../resources/img/right.svg);
    background-size: 100%;
    margin: auto;
}

.session-type-item-container{
    background: #fff;
    border-radius: 12px;
    padding: 10px 15px;
    display: flex;
    height: 75px;
    box-sizing: border-box;
}

.session-type-item-container>p{
    margin: auto 15px auto 0;   
}

.session-type-item-content{
    width: auto;
    flex: 1;
    margin: auto 0;
}

.session-type-item-content p:first-child{
    max-height: 36px;
    line-height: 18px;
    margin-bottom: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.session-type-item-content p:nth-child(2){
    height: 15px;
    line-height: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ANALYTICS
----------------------------------------*/

.gs-analytics-menu-type{
    float: left;
    width: 50%;
}

.gs-analytics-graph-menu #view_type{
    max-width: 230px;
}

.gs-analytics-menu-periods{
    float: right;
    width: 50%;
    padding: 0 20px;
    box-sizing: border-box;
}

.gs-analytics-menu-periods .menu-unity{
    text-align: right;
}

.gs-analytics-graph a.bt-tool{
    height: 40px;
    line-height: 38px;
    border: 1px solid #e6e6e6;
    width: auto;
    padding: 0 10px;
    vertical-align: top;
}

.gs-analytics-graph a.bt-tool:hover{
    border-color: #3187fd;   
}

.gs-analytics-menu-periods .menu-unity a + a{
    margin-left: 5px;   
}

.gs-analytics-graph .gs-menu-list{
    float: right;
    width: auto;
    margin-top: -5px;
}

.gs-analytics-graph .gs-menu-list .gs-col{
    padding-bottom: 10px;
    padding-top: 10px;
}

.gs-analytics-menu-periods:after{
    clear: both;
    display: block;
    content: '';
}

.gs-analytics-graph h2{
    float: left;
    width: 50%;
    margin-bottom: 25px;
}

.gs-analytics-graph-container{
    clear: both;
}

.gs-stats .gs-analytics-graph h2{
    margin-bottom: 15px;
}
    
.gs-stats .gs-analytics-graph{
    padding-top: 10px;
}

.gs-stats  .gs-analytics-graph-container{
    padding: 20px;
    border-radius: 25px;
    background: #fff;
}

/* GRAPH
----------------------------------------*/

.gs-graph{
    position: relative;
    margin-bottom: 30px;
    height: 150px;
}

.gs-graph:after{
    position: absolute;
    height: 1px;
    background: #272727;
    width: 100%;
    bottom: 0;
    left: 0;
    z-index: 1;
    content: '';
}

.gs-graph-markers{
    height: 100%;
    position: absolute;
    z-index: 1;
    width: 100%;
    top: 0;
    left: 0;
}

.gs-graph-marker{
    width: 100%;
    left: 0;
    height: 0;
    border-bottom: 1px dotted #ddd;
    position: absolute;
    z-index: 1;
}

.gs-graph-marker p{
    pointer-events: none;
    margin-top: 3px;
}

.gs-graph-marker-medium{
    top: 50%;
}

.gs-graph-marker-max{
    top: 3px;
}

.gs-graph-points{
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
}

.gs-graph-point{
    top: 0;
    height: 100%;
    position: absolute;
    z-index: 2;
    cursor: pointer;
}

.graph-point-date{
    position: absolute;
    width: 100%;
    left: 0;
    top: 160px;
    text-align: center;
}

.gs-graph-point.hidden .graph-point-date{
    display: none;   
}

.gs-graph-point .marker{
    position: absolute;
    border-radius: 100%;
    width: 8px;
    height: 8px;
    left: -4px;
    right: -4px;
    margin: auto;
    transform: translate3d(0, 4px, 0);
    z-index: 2;
    background: #ddd;
}

.gs-graph-point.hidden .marker{
    background: transparent;
}

.gs-graph-point:hover{
    z-index: 10;
}

.gs-graph-point:hover .marker{
    background: #3187fd;
}

.gs-graph-point .gs-infobulle{
    padding: 5px;
    bottom: calc(100% + 10px);
}

.gs-graph-point:hover .gs-infobulle{
    opacity: 1;   
}

.gs-graph-background{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
}

.gs-graph-axe-x{
    position: absolute;
    left: 0;
    width: 100%;
    top: 100%;
    z-index: 3;
}

.gs-graph-axe-x p{
    position: absolute;
    top: 0;
    line-height: 30px;
    height: 30px;
    text-align: left;
    z-index: 2;
}  


/* DIAGRAM
----------------------------------------*/

.gs-diagram{
    border-radius: 100%;
    background: #e6e6e6;
    position: relative;
    overflow: hidden;
}

.gs-diagram.valid{
    background: #41b691;
}

.gs-diagram-segment{
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.gs-diagram-segment.mask{
    z-index: 2;
    background: #e6e6e6;
}

.gs-diagram .rank{
    width: 77%;
    height: 77%;
    border-radius: 100%;
    background: #fff;
    left: 0;
    right: 0;
    margin: auto;
    top: 0;
    bottom: 0;
    text-align: center;
    display: flex;
    position: absolute;
    z-index: 10;
}

.gs-diagram .rank p{
    margin: auto;   
}

/* UPDATE SYSTEM
----------------------------------------*/

.ganesha-update-part{
    display: none;
}

.ganesha-update-part[data-id="1"]{
    display: block;
}   

.ganesha-update-actions{
    text-align: center;
    margin-top: 50px;
}

.ganesha-update-actions a + a{
    margin-left: 10px;   
}

.ganesha-update-error{
    padding: 25px;
    background: rgba(237, 64, 64, 0.1);
    border-radius: 25px;
    margin-top: 25px;
}

.ganesha-update-error.success{
    background: rgba(84, 189, 156, 0.1);
}

.ganesha-update-version-update{
    display: flex;
    margin-top: 40px;
    justify-content: center;
}

.ganesha-update-version-update>p{
    width: auto;
    margin: 0;
    display: flex;
}

.ganesha-update-version-update>p span{
    margin: auto;   
}

.ganesha-update-version-update>p + p:before{
    margin: 5px 10px auto;
    background: url(../resources/img/icons/icon-right.svg) no-repeat center;
    background-size: 100% auto;
    height: 16px;
    width: 16px;
    content: '';
}

.ganesha-update-step{
    margin-top: 30px;
    position: relative;
    height: 100px;
}

.ganesha-update-step .progressbar{
    margin: auto;
    display: flex;
    justify-content: center;
}

.ganesha-update-step .progressbar>.step{
    width: auto;
    margin: 0;
    position: relative;
    display: flex;
}

.ganesha-update-step .progressbar>.step .statut{
    display: none;
    width: auto;
    right: -150px;
    top: -5px;
    text-align: right;
    transform: translateX(50%);
    position: absolute;
    font-size: 12px;
}

.ganesha-update-step .progressbar>.step.active .statut{
    display: block;
}

.ganesha-update-step .progressbar>.step + .step:before{
    width: 300px;
    height: 2px;
    background: #ababab;
    content: '';
    margin: auto 0;
}

.ganesha-update-step .progressbar>.step + .step:after{
    width: 0;
    height: 2px;
    background: #3187fd;
    content: '';
    margin: auto 0;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: 1;
    transition: all 0.3s;
}

.ganesha-update-step .progressbar>.step + .step.active:after{
    width: 100%;   
}

.ganesha-update-step .progressbar>.step>div{
    position: relative;
}

.ganesha-update-step .progressbar>.step .step-id{
    width: 25px;  
    height: 25px;
    border-radius: 100%;
    background: #ababab;
    font-weight: 500;
    line-height: 25px;
    text-align: center;
    display: block;
    transition: all 0.3s;
    position: relative;
    z-index: 2;
}

.ganesha-update-step .progressbar>.step.active .step-id{
    background: #3187fd;
    transform: scale(1.25);
}

.ganesha-update-step .progressbar>.step.active.success .step-id{
    background: #41b691;   
    transform: scale(1.5);
}

.ganesha-update-step .progressbar>.step.active.error .step-id{
    background: #f44336;   
}


.ganesha-update-step .progressbar>.step.active.success .step-id:before{
    width: 8px;
    height: 8px;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../resources/img/icons/check-on.svg);
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: -13px;
}

.ganesha-update-step .progressbar>.step.active.error .step-id:before{
    width: 8px;
    height: 8px;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../resources/img/icons/check-off.svg);
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: -13px;
}

.ganesha-update-step .progressbar>.step .step-name{
    width: 120px;
    position: absolute;
    top: 35px;
    margin: auto;
    right: 0;
    transform: translateX(calc(50% - 12.5px));
    text-align: center;
}

.ganesha-update-step .progressbar>.step.active .step-name{
    font-weight: 600;
}

.ganesha-update-step .progressbar>.step.active.error .step-name,
.ganesha-update-step .progressbar>.step.active.success .step-name{
    font-weight: 400;
}

.ganesha-install-feedback{
    text-align: center;
}

.ganesha-install-feedback>div{
    text-align: left;
}

.ganesha-install-feedback>div + div{
    margin-top: 25px;
}

.ganesha-update-part a.bt-update-action{
    margin-top: 25px;
}

/* TROPHIES
----------------------------------------*/

.gs-trophies-list .gs-col{
    width: 20%;
    float: left;
    margin-bottom: 50px;
}

.gs-trophies-list .gs-col:nth-child(5n+1){
    clear: both;   
}

@media screen AND (max-width: 1440px){
    .gs-trophies-list .gs-col{
        width: 25%;   
    }
    
    .gs-trophies-list .gs-col:nth-child(5n+1){
        clear: none;   
    }
    
    .gs-trophies-list .gs-col:nth-child(4n+1){
        clear: both;   
    }
}

.gs-trophy .icon{
    height: 120px;
    display: flex;
    margin-bottom: 15px;
}

.gs-trophy .icon img{
    max-width: 100%;
    max-height: 100%;
    margin: auto;
} 

.gs-trophy.not-complete .icon img{
    filter: grayscale(100);
}

.gs-trophy .title{
    font-weight: 600;
    text-align: center;
}

.gs-trophy .description{
    margin-top: 10px;   
    text-align: center;
    height: 40px;
}

.gs-trophy .progress{
    height: 10px;
    background: #fff;
    border-radius: 5px;
    position: relative;
    margin: 15px auto 0;
    width: 60%;
}

.gs-trophy.not-complete .progress{
    margin-top: 12px;   
}

.gs-trophy.completed .progress:before{
    position: absolute;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    background: url(../resources/img/trophies/trophy-completed.svg) no-repeat center;
    background-size: 100% auto;
    z-index: 2;
    top: -5px;
    right: -5px;
    content: '';
}

.gs-trophy .progress .bar{
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 100%;
    border-radius: 5px;
    background: linear-gradient(to right, #2c74d7, #41b691);
}

.gs-trophy .user{
    margin-top: 10px;
    text-align: center;
}

.gs-trophy .user .content-data{
    font-weight: 600; 
    color: #272727;
    cursor: default;
}

.gs-trophies-levels{
    margin: 0 auto 45px;
    display: flex;
    justify-content: center;
}

.gs-trophies-levels-container{
    width: auto;
    height: 45px;
    border-radius: 18px;
    background: #fff;
    padding: 0 20px;
    box-sizing: border-box;
    display: flex;
}

.gs-trophies-levels .level{
    width: auto;
    margin: auto 0;
    display: flex;
}

.gs-trophies-levels .level .value{
    margin: auto 5px;
    position: relative;
}

.gs-trophies-levels .level.current .value{
    margin: auto 16px;
}

.gs-trophies-levels .level.current .value:before{
    content: '';
    position: absolute;
    margin: auto;
    left: -20px;
    top: -20px;
    bottom: -20px;
    z-index: 1;
    right: -20px;
    width: 65px;
    height: 80px;
    background: url(../resources/img/trophies/star.svg) no-repeat center top;
    background-size: 100% auto;
}

.gs-trophies-levels .level.completed .value:before{
    content: '';
    position: absolute;
    margin: auto;
    left: 0;
    top: -14px;
    z-index: 1;
    right: 0;
    width: 24px;
    height: 18px;
    background: url(../resources/img/trophies/crown.svg) no-repeat center top;
    background-size: 100% auto;
}

.gs-trophies-levels .level[data-id="0"].completed .value:before{
    display: none;
}

.gs-trophies-levels .level .value p{
    font-weight: 700;  
    position: relative;
    z-index: 2;
    width: 30px;
    height: 30px;
    border-radius: 100%;
    background: #3187fd;
    text-align: center;
    line-height: 28px;
    border: 1px solid #fff;
}

.gs-trophies-levels .level.current .value p{
    border: 0;
    background: linear-gradient(90deg, #FBC12A 41650%, #F29C14 43850%);
    margin-top: -10px;
}

.gs-trophies-levels .level .progress{
    width: 200px;
    height: 16px;
    background: #e6e6e6;
    border-radius: 8px;
    position: relative;
    margin: auto 0;
}

.gs-trophies-levels .level.completed .progress{
    background: #3187fd;
}

.gs-trophies-levels .level .progress .bar{
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 0;
    border-radius: 8px;
    content: '';
    background: linear-gradient(to right, #2c74d7, #41b691);
}

/* REPORT
----------------------------------------*/

.report-status,
.report-priority{
    padding: 4px 5px 5px;
    display: inline-block;
    vertical-align: top;
    border-radius: 3px;
    font-size: 13px;
    line-height: 13px;
    color: #fff;
}

.report-status{
    vertical-align: middle;
    margin-left: 10px;
}

.report-status.new{
    background: #2c74d7;
}

.report-status.inprocess{
    background: #fba52a;
}

.report-status.closed{
    background: #41b691;
}

.report-priority.low{
    background: #fba52a;
}

.report-priority.normal{
    background: #41b691;
}

.report-priority.urgent{
    background: #ed3636;
}

#gs-form-report .gs-col.sub-categories,
#gs-form-report .gs-col.list-pages,
#gs-form-report .gs-col.list-modules,
#gs-form-report .gs-col.list-forms{
    display: none;
}

/* CHAT
----------------------------------------*/

.gs-chat{
    position: relative;
}

.gs-chat-container{
    position: relative;
}

.gs-chat-container:before{
    height: auto;
    left: 50%;
    top: 0;
    bottom: 0;
    border: 1px dashed #eaeaea;
    content: '';
    position: absolute;
}

.gs-chat-container:after{
    clear: both;
    display: block;
    content: '';
}

.gs-chat-response{
    float: right;
    clear: both;
    width: auto;
    max-width: 40%;
    position: relative;
    margin-left: 40px;
}

.gs-chat-response.you{
    margin-left: 0;
    margin-right: 40px;
}

.gs-chat-response>p.contact{
    margin-bottom: 5px; 
    margin-left: 10px;
    font-weight: 500;
}

.gs-chat-response p.time{
    position: absolute;
    width: 40px;
    text-align: center;
    left: -40px;
    top: 0;
    height: 15px;
    line-height: 15px;
    bottom: 0;
    margin: auto;
}

.gs-chat-response.you p.time{
    right: -40px;
    left: auto;
}

.gs-chat-response .message{
    padding: 10px 12px 12px;
    border-radius: 15px;
    background: #3187fd;
    color: #fff;
    width: auto;
    display: inline-block;
    vertical-align: top;
    position: relative;
}

.gs-chat-response.contact{
    float: left;
}

.gs-chat-response.contact .message{
    background: #41b691;
}

.gs-chat-response.contact + .gs-chat-response.contact,
.gs-chat-response.you + .gs-chat-response.you{
    margin-top: 5px;
}

.gs-chat-response + .gs-chat-response{
    margin-top: 15px;
}

.gs-chat-date{
    display: flex;
    justify-content: center;
    padding: 10px 0 20px;
    background: #f5f8fb;
    text-align: center;
    clear: both;
    margin: 10px 40px;
    position: relative;
    z-index: 10;
    font-weight: 500;
}

.gs-chat-date:after{
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background: #ddd;
    content: '';
    bottom: 10px;
}

.gs-chatbox{
    width: 100%;
    height: auto;
}

.gs-chatbox{
    margin: 70px 0 25px;
    padding: 0 40px;
}

.gs-chatbox form{
    position: relative;
}

.gs-chatbox div{
    width: auto;
    border: 1px solid #eaeaea;
    border-radius: 10px;
    padding: 8px 48px 10px 12px;
    box-sizing: border-box;
}

.gs-chatbox button{
    appearance: none;
    -webkit-appearance: none;
    background: #ddd;
    position: absolute;
    top: 7px;
    right: 12px;
    border: 0;
    width: 24px;
    height: 24px;
}

.gs-chatbox button i{
    max-width: 12px;   
}

.gs-chatbox button:hover{
    background: #3187fd;   
}

.gs-chatbox button:hover i{
    filter: brightness(0) invert(1);
}

.gs-chatbox-title{
    margin-bottom: 10px;
    font-weight: 500;
}

.gs-chat-pj{
    clear: both;
    margin-top: 10px;
    margin-bottom: 10px;
    float: left;
    text-align: left;
    margin-left: 40px;
}

.gs-chat-pj i{
    max-width: 14px;
    margin-right: 5px;
}

.gs-chat-pj.you{
    text-align: right;
    float: right;
    margin-right: 40px;
    margin-left: auto;
}

/* WIDGET
***********************************/

.backup_header_body{
    padding: 0 20px;
}
.backup_header_body .block-content{
    background: #f5f8fb;
}
.backup_header_body .data-container-total{
    display: none;
}
.backup_header_body .data-container .gs-table{
    border: 1px solid #eaeaea;
}