@charset "UTF-8";


input[text],
input[password],
textarea,
select{
    appearance:                     none;
    -webkit-appearance:             none;
    -moz-appearance:                none;
}

input:-webkit-autofill,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:focus {
    -webkit-box-shadow:             0 0 0px 1000px #fff inset;
    box-shadow:             0 0 0px 1000px #fff inset;
}

textarea:-webkit-autofill:hover,
input:-webkit-autofill:hover, 
select:-webkit-autofill:hover{    box-shadow:             none;
}

/* FORMULAIRE
----------------------------------------*/

.input-container{
    position:                       relative;
}

.input-container.multiselect{
    z-index: 2;
}

.input-container.radio,
.input-container.switch{
    height: 40px;
    display: flex;
}

.input-container>span.placeholder{
    position:                       absolute;
    left:                           21px;
    top:                            5px;;
    text-align:                     left;
    font-size:                      10px;
    line-height:                    10px;
    opacity:                        0;
    color:                          #1f5f96;
    pointer-events: none;
}

.input-container.placeholder-on.not-empy .placeholder{
    opacity:                        1;   
}

.input-container.placeholder-on.not-empy .gs-field-text{
    padding-top:                    10px;
}

.input-legend{
    margin-top:                     5px;
    clear: both;
}

.gs-input-title{
    margin-bottom:                  8px;
    text-transform:                 uppercase;
    font-weight:                    500;
}

.gs-form-part-title{
    margin-bottom:                  30px;
}

.gs-form-part-description{
    margin-bottom:                  30px;
}

/* FORM MENU
----------------------------------------*/

.gs-form-part-menu{
    width:                          250px;
    background:                     #fff;
    height:                         100%;
    position:                       relative;
    z-index:                        200px;
    padding:                        30px 25px;
}

.gs-form-part-menu .gs-form-part-menu-title{
    margin-bottom:                  30px; 
    font-weight:                    700;
    text-transform:                 uppercase;
}

.gs-form-part-menu a{
    display:                        block;
    padding-bottom:                 6px;
	padding-top: 					5px;
    border-bottom:                  1px solid #e6e6e6;
    position:                       relative;
    font-weight:                    500;
    text-transform:                 uppercase;
    text-align:                     left;
    color:                          #272727;
}

.gs-form-part-menu a.invalid{
    background:                  	rgba(237, 64, 64, 0.1);
}

.gs-form-part-menu a.valid{
    background:                 	rgba(84, 189, 156, 0.1);
}

.gs-form-part-menu a + a{
    margin-top:                     15px;
}

.gs-form-part-menu a:after{
    position:                       absolute;
    left:                           0;
    bottom:                         -1px;
    width:                          0;
    height:                         1px;
    background:                     #3187fd;
    content:                        '';
    transition:                     all 0.3s;
}

.gs-form-part-menu a:hover:after{
    width:                          100%;   
}

.gs-form-part-menu a.active{
    color:                          #3187fd;
}

/* BUTTON
----------------------------------------*/

.input-container.button .gs-button{
    height:                         40px;
    line-height:                    40px;
    border-radius:                  17px;
}

.input-container.button .gs-button.min{
    height: 30px;
    line-height: 30px;
    border-radius: 12px;
}

/* RADIO
----------------------------------------*/

.gs-custom-radiobutton{
    margin:                         auto 0;
    display:                        inline-flex;
    flex-direction:                 row;
    justify-content:                flex-start;
    vertical-align:                 top;
}

.gs-custom-radiobutton-label{
    margin:                         auto 0;
    line-height:                    15px;
    vertical-align:                 top;
    display:                        inline-block;
    vertical-align:                 middle;
}

.gs-custom-radiobutton input{
    display:                        none;   
}

.gs-custom-radiobutton-container{
    position:                       relative;
    width:                          44px;
    height:                         24px;
    border-radius:                  12px;
    background:                     #e6e6e6;
    margin:                         auto 10px auto 0;
    transition:                     all 0.3s;
}

.gs-custom-radiobutton.checked .gs-custom-radiobutton-container{
    background:                     #54bd9c;
}

.gs-custom-radiobutton a{
    height:                         20px;
    width:                          20px;
    display:                        block;
    margin:                         auto;
    position:                       absolute;
    border-radius:                  100%;
    background:                     #fff;
    top:                            2px;
    left:                           2px;
    transition:                     all 0.3s;
    cursor:                         pointer;
}

.gs-custom-radiobutton.checked a{
    left:                           calc(100% - 22px);
}

.gs-custom-radiobutton.invalid .gs-custom-radiobutton-container{
    background-color:               rgba(237, 64, 64, 0.2);
}

.gs-custom-radiobutton-container:hover{
    background:                     rgba(49, 135, 253, 0.1);
}

.gs-custom-radiobutton.readonly .gs-custom-radiobutton-container{
    background:                     #e6e6e6 !important;
}

.gs-custom-radiobutton.readonly a{
    cursor:                         default;
}

/* CHECKBOX
----------------------------------------*/

.gs-custom-checkbox{
    margin:                         auto;
    display:                        inline-flex;
    flex-direction:                 row;
    justify-content:                flex-start;
    vertical-align:                 top;
}

.gs-custom-checkbox input{
    display:                        none;   
}

.gs-custom-checkbox-label{
    margin:                         auto 0;
    line-height:                    15px;
    vertical-align:                 top;
    display:                        inline-block;
}

.gs-custom-checkbox a{
    height:                         15px;
    width:                          15px;
    display:                        inline-block;
    margin:                         auto 10px auto 0;
    border-radius:                  3px;
    border:                         1px solid #d2d2d2;
    background:                     #fff;
    position:                       relative;
    cursor:                         pointer;
}

.gs-custom-checkbox.readonly a{
    cursor:                         default;
    border:                         1px solid #d2d2d2 !important;
    background:                     #e6e6e6 !important;
}

.gs-custom-checkbox a:hover{
    background:                     rgba(49, 135, 253, 0.1);
    border:                         1px solid #3187fd;
}

.gs-custom-checkbox.valid a{
    background-color:               rgba(84, 189, 156, 0.1);
}

.gs-custom-checkbox.invalid a{
    background-color:               rgba(237, 64, 64, 0.2);
}

.gs-custom-checkbox a i{
    background-repeat:              no-repeat;
    background-position:            center;
    background-size:                100% auto;
    display:                        block;
    position:                       absolute;
    left:                           0px;
    top:                            0px;
    right:                          0px;
    bottom:                         0px;
    margin:                         auto;
}

.gs-custom-checkbox.checked a i{
    background-image:               url(../resources/img/forms/check.svg);   
}

/* LISTE
----------------------------------------*/

.gs-select{
    border:                         1px solid #e6e6e6;
    height:                         40px;
    padding:                        0 35px 0 20px;
    width:                          100%;
    display:                        block;
    border-radius:                  0;
    margin:                         0;
    text-align:                     left;
    border-radius:                  5px;
    background:                     url(../resources/img/forms/input-select-button.svg) no-repeat right 10px center #fff;
    background-size:                14px auto;
}

.gs-select:hover{
    background-image:               url(../resources/img/forms/input-select-button-up.svg);
    background-color:               rgba(49, 135, 253, 0.1);
    border-color:                   #3187fd;
}

.page-builder-properties-menu-body select.gs-select,
select.gs-property-select{
    height:                         30px;
    padding:                        0 0 10px;
    border:                         0;
    border-radius:                  0;
    border-bottom:                  1px solid #e6e6e6;
    background-color:               none;
    background-position:            right center;
    background-size:                10px auto;
    background-repeat:              no-repeat;
}

.page-builder-properties-menu-body select.gs-select:hover,
select.gs-property-select:hover{
    background-color:               transparent;
    background-image:               url(../resources/img/forms/input-select-button.svg);
}

.gs-select.valid{
    background-color:               rgba(84, 189, 156, 0.1);
}

.gs-select.invalid{
    background-color:               rgba(237, 64, 64, 0.1);
}

/* CHAMPS DE TEXTE / AREA
----------------------------------------*/

.gs-field-text,
.gs-div-editable.gs-field-div-text{
    border:                         1px solid #e6e6e6;
    height:                         40px;
    padding:                        0 20px;
    width:                          100%;
    display:                        block;
    border-radius:                  0;
    margin:                         0;
    text-align:                     left;
    border-radius:                  5px;
    background:                     #fff;
}

.gs-div-editable.gs-field-div-text{
    line-height: 40px;
}

.gs-field-text.gs-field-text-mini{
    height: 30px;
    padding: 0 15px;
    border-radius: 10px;
}

.gs-field-text.locked{
    background-color: #eee;
    background-image: url(../resources/img/icons/icon-lock.svg);
    background-size: 16px auto;
    background-repeat: no-repeat;
    background-position: right 5px center;
}

.gs-field-text.readonly{
    border:                         1px solid #e6e6e6 !important;
    background:                     #eee !important;
}

.page-builder-properties-menu-body .gs-div-editable,
input.gs-property-field,
.gs-property-field.gs-div-editable{
    height:                         30px;
    line-height: normal;
    padding:                        0 0 14px;
    border:                         0;
    border-radius:                  0;
    border-bottom:                  1px solid #e6e6e6;
    width:                          100%;
    margin:                         auto;
    display:                        block;
    background:                     none;
    text-overflow: ellipsis;
}

.page-builder-properties-menu-body .gs-div-editable,
.gs-property-field.gs-div-editable{
    height:                         auto;
    min-height:                     30px;
}

.gs-div-editable:after{
    content: attr(data-after-content);
    margin-left: 5px;
    color: #e6e6e6;
}

[contentEditable=true]:empty:not(:focus):before{
    content: attr(data-placeholder);
    font-style: italic;
    color: #a8a8a8;
}

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

.gs-field-text:hover,
.gs-div-editable.gs-field-div-text:hover{
    background-color:               rgba(49, 135, 253, 0.1);
    border-color:                   #3187fd;
}

.page-builder-properties-menu-body .gs-div-editable:hover,
.gs-property-field:hover{
    border-bottom-color:            #3187fd;
    background:                     none;
}

.gs-textarea{
    border:                         1px solid #e6e6e6;
    height:                         160px;
    padding:                        10px 20px;
    width:                          100%;
    display:                        block;
    border-radius:                  0;
    margin:                         0;
    text-align:                     left;
    border-radius:                  5px;
    background:                     #fff;
}

.gs-textarea.readonly{
    border:                         1px solid #e6e6e6 !important;
    background:                     #fff !important;
}

.gs-textarea:hover{
    background-color:               rgba(49, 135, 253, 0.1);
    border:                         1px solid #3187fd;
}

input.valid,
textarea.valid{
    background:                     rgba(84, 189, 156, 0.1);
}

input.invalid,
textarea.invalid{
    background:                     rgba(237, 64, 64, 0.1);
}

.gs-textarea-counter{
    margin-top: 3px;
    text-align: right;
}

.gs-textarea-counter.validate{
    color: #41b691;
}

/* TAGS
----------------------------------------*/

.input-container.searchbox.gs-field-tags{
    max-width: none;
}

.gs-field-text.searchbox.gs-field-tags{
    background: #fff !important;
    padding: 0 20px;
    border-radius: 5px;
}

.tag-suggestions{
    position: absolute;
    max-width: 250px;
    width: auto;
    box-sizing: border-box;
    padding: 15px;
    background: #fff;
    z-index: 100;
    border-radius: 5px;
}

.tag-suggestions>a + a{  
    margin-top: 7px;
    display: flex;
    padding-top: 5px;
    border-top: 1px solid #e6e6e6;
}

.tag-suggestions>a.active{
    color: #3187fd;
}

.tag-suggestions>a>i{
    max-width: 10px;
}

/* CHAMP PASSWORD
----------------------------------------*/

.gs-field-text.password{
    padding-right:                  40px;
}

.bt-view-chars{
    position:                       absolute;
    height:                         40px;
    width:                          40px;
    right:                          0;
    top:                            0;
    z-index:                        1;
    display:                        flex;
    flex-direction:                 column;
    justify-content:                center;
    cursor:                         pointer;
}

.bt-view-chars i{
    width:                          20px;
    height:                         20px;
    margin:                         auto;
    background:                     url(../resources/img/forms/view-password.svg) no-repeat left top;
    background-size:                100% auto;
}

.bt-view-chars.active i{
    background-position:            left top -20px;   
}

/* CHAMP RECHERCHE
----------------------------------------*/

.gs-field-text.searchbox{
    border-radius:                  18px;
    padding-left:                   40px;
    padding-right:                  40px;
    height:                         36px;
    background-image:               url(../resources/img/forms/searchbox.svg);
    background-size: 16px auto;
    background-repeat:              no-repeat;
    background-position:            left 10px center;
}

.gs-field-text.searchbox:hover{
    background-image:               url(../resources/img/forms/searchbox-up.svg);
}

.input-container.searchbox{
    max-width:                      300px;
}

.input-container.searchbox label{
    left:                           41px;
}

.bt-clear-search{
    position:                       absolute;
    right:                          0;
    top:                            0;
    width:                          40px;
    height:                         36px;
    display:                        flex;
    flex-direction:                 column;
    justify-content:                center;
    z-index:                        1;
    display:                        none;
}

.input-container.searchbox.active .bt-clear-search{
    display:                        flex;
}

.bt-clear-search i{
    background:                     url(../resources/img/forms/clear.svg) no-repeat center;
    background-size:                12px auto;
    margin:                         auto;
    width:                          100%;
    height:                         100%;
}

.bt-clear-search:hover i{
    background-image:               url(../resources/img/forms/clear-up.svg);
}

.searchbox-tags{
    margin:                         auto -5px;
}

.searchbox-tag{
    display:                        inline-flex;
    height:                         25px;
    line-height:                    25px;
    background:                     #3187fd;
    color:                          #fff;
    text-transform:                 lowercase;
    font-size:                      13px;
    padding:                        0 10px;
    margin:                         10px 5px 0;
    border-radius:                  7px;
}

.searchbox-tag a{
    margin:                         auto 0 auto 7px;
    width:                          8px;
    max-width: 16px;
    filter: brightness(0) invert(1);
    content:                        url(../resources/img/forms/clear.svg);
    opacity:                        0.5;
    transition:                     all 0.3s;
}

.searchbox-tag a:hover{
    opacity:                        1;   
}

/* DATE
----------------------------------------*/

.gs_input_date{
    position:                       relative;
    width:                          auto;
}

.editor-field-date-default{
    background:                     none;
    color:                          #e0e0e0;
}

.editor-field-date{
    background-image:               url(../resources/img/forms/icon-calendar.jpg);
}

.gs_calendar_picker{
    display:                        none;
    width:                          211px;
    position:                       absolute;
    z-index:                        200;
    opacity:                        0;
    top:                            40px;
    left:                           40px;
    background:                     #f7f5f6;
}

.gs_calendar_picker_head{
    height:                         40px;
    display:                        block;
    position:                       relative;
    background:                     #47b592;
}

.gs_calendar_picker_month_active{
    line-height:                    50px;
    text-align:                     center;
    text-transform:                 uppercase;
    font-size:                      12px;
    color:                          #fff;
    height:                         20px;
    line-height:                    20px;
    bottom:                         5px;
    left:                           0;
    right:                          0;
    margin:                         auto;
    position:                       absolute;
}

.gs_calendar_picker_year_active{
    text-align:                     center;
    position:                       absolute;
    height:                         20px;
    line-height:                    20px;
    font-size:                      10px;
    color:                          #f7f5f6;
    top:                            0;
    left:                           0;
    right:                          0;
    margin:                         auto;
    font-weight:                    700;
}

.gs_calendar_picker.display{
    display:                        block;   
}

.gs_calendar_picker_main{
    height:                         auto;
    border-left:                    1px solid #e7e7e7;
}

.gs_calendar_picker_head .next,
.gs_calendar_picker_head .prev{
    width:                          25px;
    height:                         100%;
    position:                       absolute;
    top:                            0;
    background:                     url(../resources/img/buttons/next-w.png) no-repeat center center #2b8469;
    background-size:                10px auto;
    right:                          0;
    z-index:                        1;
    opacity:                        0.6;
    transition:                     opacity 0.3s;
    -o-transition:                  opacity 0.3s;
    -ms-transition:                 opacity 0.3s;
    -moz-transition:                opacity 0.3s;
    -webkit-transition:             opacity 0.3s;
    cursor:                         pointer;
}

.gs_calendar_picker_head .prev{
    background:                     url(../resources/img/buttons/prev-w.png) no-repeat center center #2b8469;
    background-size:                10px auto;
    right:                          auto;
    left:                           0;
}

.gs_calendar_picker_head .next:hover,
.gs_calendar_picker_head .prev:hover{
    opacity:                        1;
}

.gs_calendar_picker_day_title{
    width:                          30px;
    height:                         30px;
    line-height:                    29px;
    float:                          left;
    box-sizing:                     border-box;
    -o-box-sizing:                  border-box;
    -ms-box-sizing:                 border-box;
    -moz-box-sizing:                border-box;
    -webkit-box-sizing:             border-box;
    border-right:                   1px solid #e7e7e7;
    border-bottom:                  1px solid #e7e7e7;
    display:                        block;
    text-align:                     center;
    font-size:                      11px;
}

.gs_calendar_picker_day_title:first-letter{
    text-transform:                 uppercase;   
}

.gs_calendar_picker_day{
    width:                          30px;
    height:                         30px;
    line-height:                    29px;
    float:                          left;
    box-sizing:                     border-box;
    -o-box-sizing:                  border-box;
    -ms-box-sizing:                 border-box;
    -moz-box-sizing:                border-box;
    -webkit-box-sizing:             border-box;
    border-right:                   1px solid #e7e7e7;
    border-bottom:                  1px solid #e7e7e7;
    display:                        block;
    text-align:                     center;
    font-size:                      11px;
    cursor:                         pointer;
}

.gs_calendar_picker_day:hover,
.gs_calendar_picker_day.active{
    background:                     #e7e7e7;
}

.gs_calendar_picker_day.empty{
    background:                     none !important;
    cursor:                         default;
}

.gs_calendar_picker_foot{
    height:                         27px;
    line-height:                    27px;
    width:                          auto;
    background:                     #47b592;
}

.input_default_value{
    position:                       absolute;
    left:                           81px;
    top:                            23px;
    text-align:                     left;
    font-size:                      9px;
    color:                          #47b592;
    opacity:                        0;
}

/* MENU DYNAMIQUE
----------------------------------------*/

.gs-dynamic-menu-item{
    width:                          100px;
    height:                         100px;
    background:                     #f7f5f6;
    margin:                         0 5px 10px;
    display:                        block;
    list-style:                     none;
    float:                          left;
    cursor:                         pointer;
    position:                       relative;
}

.gs-dynamic-menu-item:hover{
    background:                     #29313c;   
}

.gs-dynamic-menu-item-icon{
    position:                       absolute;
    margin:                         auto;
    width:                          50px;
    height:                         50px;
    overflow:                       hidden;
    top:                            0;
    right:                          0;
    bottom:                         0;
    left:                           0;
}

.gs-dynamic-menu-item-icon img{
    height:                         100px;
    width:                          50px;
    vertical-align:                 top;
}

.gs-dynamic-menu-item:hover img{
    margin-top:                     -50px;
}

.gs-dynamic-menu-bar{
    position:                       fixed;
    right:                          0;
    top:                            0;
    width:                          50px;
    height:                         100%;
    z-index:                        40;
    padding-top:                    50px;
    background:                     #f7f5f6;
}

.gs-dynamic-menu-bar-item{
    margin:                         0;
    width:                          50px;
    height:                         50px;
    border-bottom:                  1px solid #dbdbdb;
    border-top:                     1px solid #ffffff;
}

.gs-dynamic-menu-bar-item:hover{
    border-bottom:                  1px solid #29313c;
    border-top:                     1px solid #29313c;
}

.gs-dynamic-menu-bar-menu{
    height:                         100%;
}

.gs-dynamic-menu-bar-item .gs-dynamic-menu-item-icon{
    height:                         20px;
    width:                          20px;
    margin:                         15px;
}

.gs-dynamic-menu-bar-item .gs-dynamic-menu-item-icon img{
    width:                          20px;
    height:                         40px;
}

.gs-dynamic-menu-bar-item:hover .gs-dynamic-menu-item-icon img{
    margin-top:                     -20px;
}

.gs-dynamic-menu-bar-title{
    display:                    none;
    position:                   absolute;
    right:                      49px;
    top:                        -1px;
    width:                      auto;
    line-height:                50px;
    background:                 #29313c;
    color:                      #fff;
    text-transform:             none;
    padding:                    0 0 0 15px;
    z-index:                    999;
    height:                     50px;
    font-size:                  12px;
    white-space:                nowrap;
    text-align:                 right;
}

.gs-dynamic-menu-bar-item:hover .gs-dynamic-menu-bar-title{
    display:                    block;
}

/* CHAMPS FILE
----------------------------------------*/

.gs_input_file{
    position:                       relative;
    height:                         40px;
    display: flex;
}

.gs_input_file .bt-remove{
    display: none;
    position: absolute;
    top: 5px;
    right: 5px;
}

.gs-file-input-data.active .bt-remove{
    display: flex;
}

.gs-file-input-data .gs-field-file{
    padding-right: 45px;
}

.gs_input_file_browse_input{
    display:                        none;
}

.gs-file-input-data{
    flex: 1;
    position: relative;
}

.gs_input_file .bt-browse{
    width: auto;
    margin: auto 0 auto 10px;
    height: 40px;
    line-height: 40px;
    border-radius: 16px;
}

.gs_input_file.readonly .bt-browse{
    background: #ababab !important;
}

.gs_input_file.valid input[type=text]{
    background:                     rgba(84, 189, 156, 0.1);
}

.gs_input_file.invalid input[type=text]{
    background:                     rgba(237, 64, 64, 0.1);
}

/* CHAMPS IMAGE
----------------------------------------*/

.gs-input-img{
    background:                     #fff;
}

.gs-input-img .form.invalid{
    border-left:                    5px solid #FF0000;
}

.gs-input-img .form p{
    margin:                         11px 0 0 10px; 
    display:                        inline-block;
    vertical-align:                 top;
    font-size:                      13px;
}

.gs-input-img.gs-input-img-mini .form p{
    margin-top: 6px;
}

.gs-input-img.invalid .form p{
    color: #FF0000;
}

.gs-input-img .gs-infobulle{
    left: 50px !important;
    transform: translate(0) !important;
}

.gs-input-img .form p span.current{
    font-weight:                    bold;
}

.gs-field-img{
    display:                        none;
}

.gs-input-img .browse-button{
    height: 40px;
    line-height: 40px;
    border-radius: 16px;
}

.gs-input-img.gs-input-img-mini .browse-button{
    height: 30px;
    line-height: 30px;
    border-radius: 12px;
}

.gs-input-img.readonly .browse-button{
    background: #e6e6e6 !important;
}

.gs-input-img-item{
    width:                          130px;
    height:                         130px;
    float:                          left;
    margin-right:                   10px;
    display:                        flex;
    flex-direction:                 column;
    justify-content:                center;
    align-items:                    center;
    list-style:                     none;
    position:                       relative;
    box-sizing:                     border-box;
    background:                     #f5f8fb;
    margin-top:                     20px;
    padding:                        30px 10px 10px;
}

.gs-input-img-mini .gs-input-img-items{
    padding-top: 10px;
}

.gs-input-img-mini .gs-input-img-item{
    height: 95px;
    width: 95px;
    margin-right: 5px;
    margin-top: 5px;
}

.gs-input-img-item:hover{
    background:                     rgba(49, 135, 253, 0.1);
}

.gs-input-img.readonly .gs-input-img-item:hover{
    background:                     #f5f8fb;
}

.gs-input-img-item img{
    width:                          auto;
    max-width:                      100%;
    height:                         auto;
    max-height:                     100%;
}

.gs-input-img-item .gm-input-img-menu{
    position:                       absolute;
    top:                            5px;
    right:                          5px;
    opacity:                        0;
    transition:                     all 0.3s;
}

.gs-input-img-item .gm-input-img-menu .bt-icon:hover{
    background:                     #fff;
}

.gs-input-img-item:hover .gm-input-img-menu{
    opacity:                        1;
}

.gs-input-img-items{
    display:                    block;
    margin:                     0;
}

/* CHAMPS CURSOR
----------------------------------------*/

.gs-input-cursor{
    width:                      auto;
    height:                     auto;
}

.gs-input-cursor-body{
    display: flex;
    height: 40px;
    border: 1px solid #e6e6e6;
    border-radius: 20px;
}

.gs-input-cursor-bar{
    width:                      auto;
    height:                     100%;
    overflow:                   hidden;
    background:                 #f5f8fb;;
    position:                   relative;
    border-radius:              20px;
    flex: 1;
}

.gs-input-cursor-button{
    width:                      40px;
    position:                   absolute;
    top:                        0;
    left:                       0;
    height:                     100%;
    background:               #ababab;
    display: flex;
    cursor:                     pointer;
    border-radius:              100%;
}

.gs-input-cursor.readonly .gs-input-cursor-button{
    background-color:           #ababab !important;
}

.gs-input-cursor-value{
    margin: auto;
    padding: 3px;
    text-align: center;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    line-height: 12px;
}

.gs-input-cursor-value span{
    display: block;
    font-size: 9px;
}

.gs-input-cursor-button:hover{
    background-color:           #3187fd;
}

.gs-input-cursor-min,
.gs-input-cursor-max{
    width:                      40px;
    text-align:                 center;
    height:                     100%;
    line-height:                40px;
    padding: 0 5px;
    box-sizing: border-box;
}

.gs-field-cursor{
    text-align:                 center;
    padding:                    0;
    background:                 none !important;
    width: 100%;
    height: 20px;
    border: 0 !important;
    font-size: 14px;
    font-weight: 600;
}

.gs-cursor-mini .gs-input-cursor-body{
    height: 30px;
    border: 0;
}

.gs-cursor-mini .gs-input-cursor-min,
.gs-cursor-mini .gs-input-cursor-max{
    line-height: 30px;
    width: 30px;
    border-radius: 100%;
    background: rgba(39, 39, 39, 0.7);
    color: #fff;
}

.gs-cursor-mini .gs-input-cursor-bar{
    margin: 0 5px;
}

.gs-cursor-mini .gs-input-cursor-button{
    width: 30px;
}

/* CHAMPS COLOR
----------------------------------------*/

.gs-field-color-container{
    position: relative;
    width: 100%;
}

.input-container.color input[type=text]{
    padding-right: 40px;
}

.input-container.color input[type=text]::placeholder{
    color: #E6E6E6;   
}

.input-container.color .color-selector-menu{
    position: absolute;
    z-index: 200;
    width: auto;
    max-width: 100%;
    background: #fff;
    height: auto;
    padding: 10px;
    box-sizing: border-box;
    top: 39px;
    max-height: 149px;
    overflow: auto;
    border-radius: 3px;
}

.input-container.color .color-selector-menu>a{
    display: flex;
}

.input-container.color .color-selector-menu>a.picker:hover{
    text-decoration: underline;
}

.input-container.color .color-selector-menu>a>i{
    height: 10px;
    width: 10px;
    margin: auto 5px auto 0;
    border: 1px solid #e6e6e6;
    box-sizing: border-box;
}

.input-container.color .color-selector-menu>a.picker{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: pre;
    display: block;
}

.input-container.color .color-selector-menu>a + a{
    margin-top: 6px;
    padding-top: 4px;
    border-top: 1px solid #E6e6e6;
}

.gs-field-color{
    width: 1px;
    border: 0;
    padding: 0;
    height: 1px;
    background: none;
    opacity: 0;
}

.page-builder-properties-menu-body .gs-field-color-container input[type=text],
.gs-field-color-mini input[type=text]{
    height: auto;
    min-height: 30px;
    line-height: normal;
    padding: 0 30px 14px 0;
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid #e6e6e6;
    width: 100%;
    margin: auto;
    background: none;
    text-overflow: ellipsis;
}

.page-builder-properties-menu-body .gs-field-color-container input[type=text]:hover,
.gs-field-color-mini input[type=text]:hover{
    border-bottom-color: #3187fd;
}

.page-builder-properties-menu-body .color-selector-menu,
.gs-field-color-mini .color-selector-menu{
    top: 29px !important;   
}

.input-container.color a.bt-reset{
    margin: auto 0 auto 10px;
    display: none;
    background: rgba(49, 135, 253, 0.1);
    position: absolute;
    right: 5px;
    top: 10px;
    width: 20px;
    height: 20px;
}

.input-container.color a.bt-reset i{
    max-width: 10px;   
}

.page-builder-properties-menu-body .input-container.color a.bt-reset,
.input-container.color.gs-field-color-mini a.bt-reset{
    width: 20px;
    height: 20px;
    top: 0;
}

.page-builder-properties-menu-body .input-container.color a.bt-reset i,
.input-container.color.gs-field-color-mini a.bt-reset i{
    max-width: 10px;   
}

.gs-field-color-container.selected a.bt-reset{
    display: flex;
}

.input-container.color a.bt-reset:hover i{
    filter: brightness(0) invert(1);
}

.input-container.color a.bt-reset:hover{
    background: #3187fd;   
}

/* RICHTEXT
----------------------------------------*/

.gs-richtext-input{
    background: #fff;
    display: flex;
    flex-direction: column;
}

.gs-richtext-input.invalid .ql-container.ql-snow{
    background: rgba(237, 64, 64, 0.1);
}

.gs-richtext-input.valid .ql-container.ql-snow{
    background: rgba(84, 189, 156, 0.1);
}

.gs-richtext-input-data{
    display: none;
}

.input-container.richtext.readonly .gs-richtext-toolbar{
    display: none;
}

.gs-richtext-input:hover .ql-container.ql-snow{
    border-color:#3187fd;
}

.gs-richtext-input .ql-editor a{
    display: inline-block;
    vertical-align: top;
}

/* INPUT LINK
----------------------------------------*/

.gs-field-link{
    padding-right: 50px !important;
}

.bt-open-window-link{
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    right: 10px;
}

.gs-property-field .bt-open-window-link{
    top: -10px;
    right: 0;
}

.gs-property-select .bt-open-window-link{
    right: 0;
    top: -5px;
    bottom: auto;
}

/* INPUT MULTISELECT
----------------------------------------*/

.gs-custom-multiselect{
    position: relative;
}

.gs-custom-multiselect.gs-property-select .gs-custom-multiselect-selection{
    height:                         30px;
    padding:                        0 0 10px;
    border:                         0;
    border-radius:                  0;
    border-bottom:                  1px solid #e6e6e6;
    background-color:               #fff;
    background-position:            right center;
    background-size:                10px auto;
    background-repeat:              no-repeat;
}

.gs-custom-multiselect.gs-property-select .gs-custom-multiselect-selection:hover{
    background-color:               transparent;
    background-image:               url(../resources/img/forms/input-select-button.svg);
    border-bottom:                  1px solid #3187fd;
}

.gs-custom-multiselect-selection{
    line-height: 38px;
    text-overflow: ellipsis;
    overflow: hidden;
    cursor: pointer;
}

.gs-custom-multiselect.gs-property-select .gs-custom-multiselect-selection{
    line-height: 30px;
}

.gs-custom-multiselect-selection[data-readonly=true]{
    border: 1px solid #e6e6e6 !important;
    background-color: #eee !important;
}

.gs-custom-multiselect.open .gs-custom-multiselect-selection{
    background-image: url(../resources/img/forms/input-select-button-up.svg);
    background-color: rgba(49, 135, 253, 0.1);
    border-color: #3187fd;
    z-index: 10;
}

.gs-custom-multiselect-current-selection{
    display: none;
}

.gs-custom-multiselect-current-selection span{
    font-weight: 500;   
}

.gs-custom-multiselect-selection.selection .gs-custom-multiselect-current-selection{
    display: block;
}

.gs-custom-multiselect-list{
    position: absolute;
    display: none;
    top: 39px;
    left: 0;
    background: #fff;
    border-radius: 3px;
    width: auto;
    box-sizing: border-box;
    padding: 0;
    min-width: 150px;
    overflow: auto;
    max-height: 210px;
    max-width: 100%;
}

.gs-custom-multiselect-list i.icon{
    vertical-align: bottom;
}

.gs-custom-multiselect.gs-property-select .gs-custom-multiselect-list{
    top: 29px;   
}

.gs-custom-multiselect-list>span{
    display: block;
    padding: 10px 20px;
}

.gs-custom-multiselect-list .gs-custom-checkbox{
    width: 100%;
}

.gs-custom-multiselect-list .gs-custom-checkbox label{
    flex: 1;   
}

.gs-custom-multiselect-list>span:hover,
.gs-custom-multiselect-list>span.selected{
    background: rgba(49, 135, 253, 0.1);   
}

.gs-custom-multiselect-list>span .gs-col{
    padding: 0 !important;
}

.gs-custom-multiselect-selection.selection .gs-custom-multiselect-no-selection{
    display: none;
}

.gs-multiselect-option{
    cursor: pointer;
}