@font-face {
  font-family: 'star';
  src: url('../font/star.eot?28761837');
  src: url('../font/star.eot?28761837#iefix') format('embedded-opentype'),
       url('../font/star.woff?28761837') format('woff'),
       url('../font/star.ttf?28761837') format('truetype'),
       url('../font/star.svg?28761837#star') format('svg');
  font-weight: normal;
  font-style: normal;
}

#full-screen-composer {
    background-color: white;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}

#full-screen-composer svg,
#full-screen-composer path{
    pointer-events: none;
}

#full-screen-composer input,
#full-screen-composer textarea,
#full-screen-composer select {
    outline: none;
}

#full-screen-composer .screenHeader {
    line-height: 33px;
    overflow: hidden;
    background-color: #ffffff;
    /*border: 1px solid #bbb;*/
    height: 65px;
    display: grid;
    /*grid-template-columns: 1.5fr 3fr 4fr 3fr 0.5fr;*/
    grid-template-columns: 1.5fr 10fr 0.5fr;
    align-items: center;
    border-bottom: 5px solid #666666;
}

#full-screen-composer #pathList .header {
    line-height: 33px;
    overflow: hidden;
}

#full-screen-composer .header .headerH2 {
    font-weight: bold;
    text-transform: uppercase;
    padding: 0 20px;
}

#full-screen-composer .right-content-wrapper .right-content {
    position: relative;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
            flex-grow: 1;
    background-color: #D5D5D5;
    border-right: 5px solid #666666;
    border-left: 5px solid #666666;
}


#full-screen-composer .select-wrap,
#full-screen-composer .select-wrap > select{
    width: 100%;
}

#full-screen-composer .full-pannels-holder #OKButtonAdvancedComposer,
#full-screen-composer .full-pannels-holder .reCompose,
#full-screen-composer .full-pannels-holder .btn-color {
    padding: 5px 15px;
    display: block;
    margin: 0 auto 15px;
    text-transform: uppercase;
    border-radius: 5px;
    width: 90%;
    box-shadow: 0 2px #e4e4e4;
}

#full-screen-composer #OKButtonAdvancedComposer:active,
#full-screen-composer .reCompose:active,
#full-screen-composer .btn-color:active {
    box-shadow: 0 0 #e4e4e4;
    transform: translateY(2px);
}

#full-screen-composer #CancelButtonAdvancedComposer,
#full-screen-composer .cancelBtn {
    display: block;
    margin: 10px auto;
    border: none;
    background: none;
    text-transform: uppercase;
    box-shadow: 0 2px #e4e4e4;
}


#full-screen-composer #CancelButtonAdvancedComposer:active,
#full-screen-composer .cancelBtn:active {
    box-shadow: 0 0 #e4e4e4;
    transform: translateY(2px);
}

#editDiv1.disabled #full-contours,
#full-screen-composer button:disabled {
    opacity: 0.5;
}

#full-screen-composer select:disabled {
    background-color: #eee;
}

.linked-input-container-holder input[type=text],
#full-screen-composer input[type=number],
#full-screen-composer input[type=text],
#full-screen-composer input[type=url] {
    width: 100%;
    height: 26px;
    padding: 0 5px;
    border: 1px solid #666666;
    border-radius: 3px;
    line-height: 1.2;
}


#full-screen-composer #full-composer-pannel-object input[type=text],
#full-screen-composer #full-composer-pannel-object input[type=url] {
    padding: 0 5px ;
}

#full-screen-composer input[type=number] {
    padding: 0 0 0 10px;
}
#full-screen-composer select {
    height: 26px;
    margin: 0 0 10px 0;
}

#full-screen-composer .custom-checkbox-holder label {
    font-weight: normal;
    line-height: 21px;
}
#full-screen-composer #editDiv1 {
    border-top: none;
    /*width: calc(100% - 3px);*/
    display: grid;
    /*grid-template-rows: 10fr 2fr;*/
    grid-template-rows: repeat( auto-fit, minmax(36px, 12fr) );
}

#full-screen-composer #editDiv1 .body {
    height: calc(100vh - 101px);
}
#full-screen-composer .full-pannels-holder .bottom-fixed {
    position: fixed;
    z-index: 2;
    bottom: 1px;
    width: 318px;
    margin: 0;
    padding-top: 15px;
    background-color: white;
    border-top: 1px dashed #b6b6b6;
    left: 44px;
}

#full-screen-composer .right-content-wrapper {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    height: calc(100vh - 65px);
}

#full-screen-composer .wrapper-block,
#visualComposerPresetsPopup .wrapper-block{
    padding: 0 15px;
    margin: 0 0 10px 0;
}

#full-screen-composer .wrapper-block.dashed,
#visualComposerPresetsPopup .wrapper-block.dashed{
    padding-bottom: 10px;
    border-bottom: 1px dashed #b6b6b6;
}

#full-screen-composer .wrapper-block h3,
#visualComposerPresetsPopup .wrapper-block h3{
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
}

#visualComposerPresetsPopup .wrapper-block h3{
    margin-top: 5px;
    margin-bottom: 2px;
}

#visualComposerPresetsPopup .wrapper-block {
    margin: 0 0 5px 0;
}

#full-screen-composer #editDiv1 .logo{
    display: block;
    margin: 0 auto;
}

/*#full-screen-composer .GroupImage {*/
/*    position: absolute;*/
/*    top: calc(7% + 50px);*/
/*    !*top: 60px;*!*/
/*    left: 50%;*/
/*    !*padding: 5px;*!*/
/*    -webkit-transform: translateX(-50%);*/
/*        -ms-transform: translateX(-50%);*/
/*         -o-transform: translateX(-50%);*/
/*            transform: translateX(-50%);*/
/*    !*border: 1px solid silver;*!*/
/*    !*border-radius: 5px;*!*/
/*    background-color: #fff;*/
/*}*/
#full-screen-composer .GroupImage {
    display: flex;
    justify-content: center;
    /*height: calc(100% - 50px);*/
    width: 100%;
    align-items: center;
    flex: auto;
}

#full-screen-composer .composer-image-frame {
    width: fit-content;
    height: fit-content;
    background-color: #FFFFFF;
}

#full-screen-composer #headingContainer{
    margin-left: -16px;
    width: 272px;
    height: 55px;
    padding-top:20px;
}

#full-screen-composer #headingContainer p{
    /*font: normal bold 14px Arial,Helvetica,Arial,sans-serif;*/
    text-transform: uppercase;
    margin: 0 auto;
    width: 161px;
}

#full-screen-composer #advancedDiv {
    z-index: 1;
    top: 15px;
    left: 15px;
    float: left;
    width: 300px;
    border: 1px solid silver;
    background-color: #fff;
    position: absolute;
}

#full-screen-composer #edit-composition-settings {
    /*width: calc(100% - 3px);*/
    /*border: 1px solid silver;*/
    background-color: #fff;
    /*height: 100%;*/
}
#full-screen-composer #edit-composition-settings .body-wrapper {
    height: calc(100% - 34px);
    overflow: hidden;
}

#full-screen-composer #edit-composition-settings .body {
    height: calc(100vh - 35px - 180px);
}

#full-screen-composer .dimmed {
    opacity: 0.3;
}
/* ASSETS DIV */
#full-screen-composer #assetsDiv,
#full-screen-composer #collagesDiv {
    width: 200px;
    /*height: 100%;*/
    /*border: 1px solid silver;*/
    /*padding: 0 15px;*/
    background: #d5d5d5;
}

#full-screen-composer .input-images-collages-header-wrapper {
    text-align: center;
    padding: 10px;
    margin: 0;
    background-color: #ffffff;
    font-size: 12px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

#full-screen-composer .input-images-collages-header-wrapper span {
    line-height: 1;
}

#full-screen-composer .closeCollageMenuBtnWrapper {
    display: flex;
    padding: 5px;
    position: absolute;
    top: 10px;
    right: 5px;
}

#full-screen-composer .closeCollageMenuBtnWrapper a {
    display: flex;
}

#full-screen-composer img {
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}

#full-screen-composer #assetsDiv .boxscroll,
#full-screen-composer #collagesDiv .boxscroll {
    height: calc(100% - 50px);
    /*padding: 7px 0 0 0;*/
    background-color: #d5d5d5;
    width: 100%;
    margin-top: 10px;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages {
    list-style: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0 15px;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages li {
    font-size: 12px;
    font-weight: bold;
    overflow: hidden;
    width: 150px;
    height: 150px;
    /* margin: 0 auto 20px; */
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    text-transform: uppercase;
    justify-content: space-between;
    /* box-shadow: 0 0 3px rgb(0 0 0 / 20%); */
    border-radius: 4px;
    outline: 1px solid #666666;
    margin-bottom: 10px;
    background-color: #ffffff;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages li:last-child{
    margin-bottom: 10px;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages li:first-child{
    margin-top: 10px;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages li > label {
    width: 120px;
    max-height: 134px;
    padding: 8px 2px;
    position: relative;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages li .labelWrap {
    max-width: 100%;
    width: 100%;
    max-height: 129px;
    min-height: 129px;
    /* height: 80%; */
    /* width: 80%; */
    padding: 4px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages input[type="checkbox"] + .custom-checkbox{
    /*visibility: hidden;*/
    top: 4px;
    left: 4px;
    margin: 0;
    padding: 0;
    box-shadow: none;
    /*z-index: 9999;*/
}

/* COLLAGES LIST */
#full-screen-composer #collagesDiv {
    width: 205px;
    display: none;
    /*height: 100%;*/
    /*border: 1px solid silver;*/
    /*padding: 0 15px;*/
    background: #d5d5d5;
    border-right: 5px solid #666666;
}


#full-screen-composer #full-openModalSaveAsPreset,
#full-screen-composer #full-openModalUpdatePreset,
#full-screen-composer #full-openModalDeletePreset,
#full-screen-composer #composerSaveComposition,
#full-screen-composer #pathListSaveChanges,
#full-screen-composer #pathList {
    z-index: 3;
    top: 100px;
    left: calc(50% - (950px + 500px)/2);
    width: 950px;
    border: 1px solid silver;
    background-color: #fff;
    position: absolute;
    overflow: hidden;
}
#full-screen-composer #full-openModalSaveAsPreset,
#full-screen-composer #full-openModalUpdatePreset,
#full-screen-composer #full-openModalDeletePreset {
    width: 260px;
    left: calc(50% - (260px + 500px)/2);
}

#full-screen-composer #full-openModalUpdatePreset,
#full-screen-composer #pathList,
#full-screen-composer #full-openModalSaveAsPreset,
#full-screen-composer #composerSaveComposition{
    width: 100vw;
    top: 0;
    left: 0;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 10;
}

#full-screen-composer .fullPopupWrapper {
    width: 397px;
    background: #ffffff;
    opacity: 1;
    margin: 14% auto 0;
}

#full-screen-composer .fullPopupWrapper input {
    text-align: initial;
    padding-left: 5px!important;
}

#full-screen-composer .fullPopupWrapper .headerH2{
    text-transform: capitalize;
    font-weight: 700;
}

#full-screen-composer #composerSaveComposition .fullPopupWrapper{
    width: 530px;
}

#full-screen-composer #composerSaveComposition .fullPopupWrapper .productCollageSection {
    display: flex;
    align-items: center;
    padding: 0 20px;
}

#full-screen-composer #composerSaveComposition .fullPopupWrapper .productCollageSection:last-child{
    margin-top: 20px;
}

#full-screen-composer #composerSaveComposition .fullPopupWrapper .productCollageSection label {
    width: 36%;
    text-align: end;
    margin-right: 15px;
    line-height: 1.4;
    font-weight: 700;
}

#full-screen-composer #composerSaveComposition .fullPopupWrapper .productCollageSection .input-group {
    margin: 0;
}

#full-screen-composer #composerSaveComposition .fullPopupWrapper .productCollageSection .input-group input {
    border-right: none;
    outline: none;
    padding: 0 0 0 5px;
}

#full-screen-composer #composerSaveComposition .fullPopupWrapper .productCollageSection .input-group.disabledFileName input,
#full-screen-composer #composerSaveComposition .fullPopupWrapper .productCollageSection .input-group.disabledFileName span {
    background-color: #D4D4D4;
}

#full-screen-composer #composerSaveComposition .fullPopupWrapper .productCollageSection .input-group.disabledFileName span{
    /*border: none;*/
}

#full-screen-composer #composerSaveComposition .fullPopupWrapper .productCollageSection textarea {
    resize: none;
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #d7d7d7;
    border-radius: 3px;
    padding: 5px;
    outline: none;
    line-height: 1.4;
}

#full-screen-composer .fullPresetUpdateModalPopup,
#full-screen-composer .pathListModalPopup{
    display: flex;
    justify-content: space-between;
    height: 30px;
    align-items: center;
    padding: 0 10px;
}

#full-screen-composer .buttonForPresetWrapper {
    display: flex;
    justify-content: space-around;
    padding-bottom: 20px;
}

#full-screen-composer .descriptionPresetPopup {
    background: #ffffff;
    /* margin: 68px; */
    padding: 20px 10px;
}

#full-screen-composer #pathListSaveChanges {
    top: 50vh;
    width: 260px;
    left: calc(50% - (260px + 500px)/2);
}

/*#full-screen-composer #composerSaveComposition {*/
/*    top: 5vh;*/
/*    width: 360px;*/
/*    left: calc(50% - (360px + 500px)/2);*/
/*    z-index: 100;*/
/*}*/

#full-screen-composer #composerSaveComposition label {
    /*width: 100%;*/
    margin: 0;
}

#full-screen-composer #composerSaveComposition label input {
    font-weight: normal;
}
#full-screen-composer #full-openModalSaveAsPreset .body,
#full-screen-composer #full-openModalUpdatePreset .body,
#full-screen-composer #full-openModalDeletePreset .body,
#full-screen-composer #composerSaveComposition .body,
#full-screen-composer #pathList .body {
    padding: 15px 0 0 0;
}
#full-screen-composer #full-openModalSaveAsPreset label,
#full-screen-composer #full-openModalUpdatePreset label,
#full-screen-composer #full-openModalDeletePreset label {
    cursor: pointer;
    width: 100%;
}

#full-screen-composer #pathList .pathListTable-wrapper .colFour {
    width:125px;
}
#full-screen-composer #pathList .pathListTable-wrapper .colOne,
#full-screen-composer #pathList .pathListTable-wrapper .colFive {
    width:200px;
}
#full-screen-composer #pathList .pathListTable-wrapper .colThree {
    width: 124px;
}

#full-screen-composer #pathList .pathListTable-wrapper .boxscroll {
    max-height: 592px;
}

#full-screen-composer #pathList .pathListTable-wrapper table {
    table-layout: fixed;
}
#full-screen-composer #pathList .pathListTable-wrapper table th,
#full-screen-composer #pathList .pathListTable-wrapper table td {
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 2px 10px;
}

#full-screen-composer .table-wrapper .pathListTable tbody>tr>td {
    font-size: 1rem;
}

#full-screen-composer #pathList .pathListTable {
    width: 100%;
    border: 1px solid #E2E2E2;
}
#full-screen-composer #pathList label.error {
    display: block;
    line-height: 1;
    margin-top: 5px;
    font-size: 10px;
}

#full-screen-composer .table-wrapper thead>tr {
    line-height: 1.5em;
    height: 60px;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages li.background-image {
    position: relative;
}
#full-screen-composer .listOfContentForCollagesAssetsAndCollages li.background-image:before {
    font-family: "FontAwesome";
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 20px;
    position: absolute;
    z-index: 1;
    top: 4px;
    right: 4px;
    padding: 2px;
    content: "\f005";
    word-spacing: normal;
    border-radius: 4px;
    background-color: #fff;
    box-shadow: 0 0 4px #999;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages li label input[type=checkbox] {
    display: none;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages li .labelWrap input[type=checkbox] {
    display: none;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages.selMode li label span {
    display: block;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages.selMode li .labelWrap span {
    display: block;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages .add-more,
#full-screen-composer .listOfContentForCollagesAssetsAndCollages img {
    max-width: 100%;
    max-height: 100%;
}

#visualComposerPresetsPopup .contour{
    height: 35px;
    padding: 1px 5px;
}
#full-screen-composer .data_frames {
    text-align: center;
}


.add-more .plus + span {
    display: block;
    text-transform: uppercase;
}
.add-more .plus {
    position: relative;
    display: inline-block;
    width: 21px;
    height: 21px;
}
.add-more .plus:before,
.add-more .plus:after {
    position: absolute;
    content: "";
    background-color: red;
}
.add-more .plus:before {
    top: 50%;
    left: 0;
    width: 21px;
    height: 3px;
    margin: -2px 0 0 0;
}
.add-more .plus:after {
    top: 0;
    left: 50%;
    width: 3px;
    height: 21px;
    margin: 0 0 0 -1px;
}


#full-screen-composer .composition-element:hover{
    box-shadow: 0 0 3px rgba(255,0,0,.4);
}

#full-screen-composer .composer-image-frame canvas{
    width: 100%;
    height: 100%;
}

#full-screen-composer .spinner {
    margin-top: 0;
    height: 100%;
    text-align: justify;
    position: relative;
    -moz-box-sizing: border-box;
    background: url(../img/ajax-loader.gif) no-repeat center;
    z-index: 10;
}


#edit-composition-settings .arrange button {
    margin: 0 0 8px 0;
    border: none;
    background: none;
}
#edit-composition-settings .arrange button:hover {
    font-weight: bold;
}

#edit-composition-settings .text-controls .composer-style-btn-wrapper {
    display: inline-block;
}

/*#pathList .header > .path-list-save,*/
/*#full-screen-composer .header > .composer-save,*/
/*#full-screen-composer .header > .composer-download,*/
/*#full-screen-composer .header > .composer-email {*/
/*    width: 27px;*/
/*    height: 27px;*/
/*    margin: -4px 5px 0 0;*/
/*    vertical-align: middle;*/
/*    border: none;*/
/*}*/
#pathList .header > .path-list-save {
    width: 27px;
    height: 27px;
    margin: -4px 5px 0 0;
    vertical-align: middle;
    border: none;
}

#pathList .header > .path-list-save,
#full-screen-composer .header > .composer-save {
    height: 23px;
    background: url(../img/panel_sprites.png) no-repeat -105px -8px;
}
#pathList .header > .path-list-save:hover,
#full-screen-composer .header > .composer-save:hover {
    background: url(../img/panel_sprites.png) no-repeat -105px -53px;
}
#pathList .header > .path-list-save:active,
#full-screen-composer .header > .composer-save:active {
    background: url(../img/panel_sprites.png) no-repeat -105px -28px;
}

#full-screen-composer .header > .composer-download {
    background: url(../img/panel_sprites.png) no-repeat -242px 1px;
}
#full-screen-composer .header > .composer-download:hover {
    background: url(../img/panel_sprites.png) no-repeat -242px -51px
}
#full-screen-composer .header > .composer-download:active {
    background: url(../img/panel_sprites.png) no-repeat -242px -21px
}

#full-screen-composer .header > .composer-email {
    background: url(../img/panel_sprites.png) no-repeat -284px 1px;
}
#full-screen-composer .header > .composer-email:hover {
    background: url(../img/panel_sprites.png) no-repeat -284px -51px
}
#full-screen-composer .header > .composer-email:active {
    background: url(../img/panel_sprites.png) no-repeat -284px -21px
}
#full-HorizontalAlignment {
    display: table;
    margin: 0 auto;
}

#full-screen-composer .alignBtn {
    margin: 0 10px 0 0;
}

#full-screen-composer .input-group,
#visualComposerPresetsPopup .input-group{
    width: 100%;
    margin: 0 0 10px 0;
}

#full-screen-composer .input-group label.error,
#visualComposerPresetsPopup .input-group label.error {
    position: absolute;
    left: 0;
    bottom: -24px;
}

#full-screen-composer .productCollageSection .input-group label.error {
    position: absolute;
    left: 0;
    bottom: -18px;
    width: 100%!important;
    font-size: 12px;
}

#full-screen-composer .input-group input[type=number],
#full-screen-composer .input-group input[type=text],
#visualComposerPresetsPopup .input-group input[type=number],
#visualComposerPresetsPopup .input-group input[type=text]{
    border-radius: 2px 0 0 2px;
}

#full-screen-composer .input-group input[type=number],
#full-screen-composer .input-group input[type=text] {
    text-align: center;
    padding: 0!important;
}

#full-screen-composer #composerSaveComposition .input-group input[type=text] {
    text-align: inherit;
    padding: 0 5px!important;
}

#full-screen-composer .controls-media-wrapper .input-group input[type=number],
#full-screen-composer .controls-media-wrapper .input-group input[type=text] {
    text-align: left;
    padding: 0!important;
}


.linked-input-container-holder .input-group .input-group-addon,
#full-screen-composer .input-group .input-group-addon,
#visualComposerPresetsPopup .input-group .input-group-addon{
    padding: 0 3px;
    text-transform: uppercase;
    border-radius: 0 2px 2px 0;
}
#composerSaveComposition .input-group {
    margin-bottom: 14px;
}
#full-screen-composer #composerSaveComposition .input-group .input-group-addon {
    text-transform: lowercase;
    background-color: #ffffff;
    padding: 5px;
}
#composerSaveComposition .input-group input {
    margin: 0;
}

#full-screen-composer .select-picture-block button {
    float: left;
    width: 32%!important;
    margin: 0 0 0 2%;
}
#full-screen-composer .select-picture-block button:first-child {
    margin: 0;
}

#full-screen-composer .in-crop-mode button {
    width: 46%;
}
.full-color-picker-btn {
    display: inline-block;
    float: left;
}

#full-screen-composer .canvas-zoom,
#full-screen-composer .canvas-zoom h3,
#full-screen-composer .canvas-zoom .js-linked-input-container {
    display: inline-block;
}
#full-screen-composer .canvas-zoom {
    /*position: absolute;*/
    /*top: 4px;*/
    /*left: 50%;*/
    /*transform: translateX(-50%);*/
}

#full-screen-composer .canvas-zoom h3 {
    text-transform: uppercase;
    margin: 0px 15px 4px 0;
    vertical-align: middle;
}
#full-screen-composer .canvas-zoom .js-linked-input-container .input-group {
    float: left;
    width: 60px;
    margin: 0 15px 0 0;
}
#full-screen-composer .canvas-zoom .js-linked-input-container #composer-zoom {
    width: 100px;
    display: inline-block;
    vertical-align: middle;
    background-color: transparent;
}

#full-screen-composer .table-wrapper .pathListTable tbody>tr>td {
    text-align: left;
    white-space: nowrap;
}

#full-create-text-asset-btn {
    width: 100%;
    padding: 7px 12px;
    border: none;
    border-radius: 3px;
    background-color: white;
    /*-webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.21);*/
            /*box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.21);*/
    box-shadow: 0 2px #e4e4e4
}

#full-create-text-asset-btn:active{
    box-shadow: 0 0 #e4e4e4;
    transform: translateY(2px);
}

#full-create-text-asset-btn .T-letter {
    width: 12px;
    height: 12px;
}
#full-create-text-asset-btn .T-letter,
#full-create-text-asset-btn span {
    vertical-align: middle;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages .text-asset {
    width: 48px;
    height: 48px;
    margin: 34px;
    margin-top: calc(50% - 28px);
    padding: 12px;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages .text {
    font-size: 12px;
    line-height: 1;
    position: absolute;
    bottom: 0;
    overflow: hidden;
    width: 100%;
    max-height: 37px;
    padding: 0 3px;
    text-align: left;
    text-transform: none;
    word-wrap: break-word;
}

#full-screen-composer .composer-style-btn-wrapper .composer-style-btn {
    position: relative;
    width: 27px;
    height: 27px;
    border: none;
    background: none;
}

#full-screen-composer .composer-style-btn-wrapper .composer-style-btn.active {
    border: 1px solid #d7d7d7;
    border-radius: 3px;
}
#full-screen-composer .composer-style-btn-wrapper .composer-style-btn:after {
    position: absolute;
    top: calc(50% - 18px / 2);
    left: calc(50% - 13px / 2);
    width: 13px;
    height: 18px;
    content: "";
}

#full-screen-composer .composer-style-btn-wrapper .composer-style-btn-bold:after {
    background: url(../img/composer-text-editor.png) no-repeat 0 0;
}

#full-screen-composer .composer-style-btn-wrapper .composer-style-btn-underline:after {
    background: url(../img/composer-text-editor.png) no-repeat -13px 0;
}

#full-screen-composer .composer-style-btn-wrapper .composer-style-btn-italic:after {
    left: calc(50% - 12px / 2);
    width: 12px;
    background: url(../img/composer-text-editor.png) no-repeat -26px 0;
}

#full-screen-composer .composer-style-btn-wrapper .composer-style-btn-superscript:after {
    left: calc(50% - 17px / 2);
    width: 17px;
    background: url(../img/composer-text-editor.png) no-repeat -38px 0;
}

#full-screen-composer .composer-style-btn-wrapper .composer-style-btn-subscript:after {
    left: calc(50% - 15px / 2);
    width: 15px;
    background: url(../img/composer-text-editor.png) no-repeat -55px 0;
}

#full-screen-composer .composer-style-btn-wrapper .composer-style-btn-strikethrough:after {
    left: calc(50% - 14px / 2);
    width: 14px;
    background: url(../img/composer-text-editor.png) no-repeat -70px 0;
}

#full-screen-composer .composer-line-spacing-wrapper label {
    font-weight: normal;
    display: inline-block;
    margin-top: 10px;
}

#full-screen-composer .btn-group .btn:focus {
    outline: none;
}

#full-screen-composer .text-align-wrapper .btn,
#full-screen-composer .text-direction-wrapper .btn {
    position: relative;
    width: 36px;
    height: 30px;
}


#full-screen-composer .text-align-wrapper .btn:after,
#full-screen-composer .text-direction-wrapper .btn:after {
    position: absolute;
    top: calc(50% - 14px / 2);
    left: calc(50% - 14px / 2);
    width: 14px;
    height: 14px;
    content: "";
}
#full-screen-composer .text-align-wrapper .btn:after {
    top: calc(50% - 13px / 2);
    height: 13px;
}
#full-screen-composer .text-align-right:after {
    background: url(../img/composer-text-editor.png) no-repeat 0 -18px;
    left: calc(50% - 13px / 2);
    width: 13px;
}
#full-screen-composer .text-align-center:after {
    background: url(../img/composer-text-editor.png) no-repeat -13px -18px;
    left: calc(50% - 15px / 2);
    width: 15px;
}
#full-screen-composer .text-align-left:after {
    background: url(../img/composer-text-editor.png) no-repeat -28px -18px;
}
#full-screen-composer .text-align-justify:after {
    background: url(../img/composer-text-editor.png) no-repeat -43px -18px;
    left: calc(50% - 15px / 2);
    width: 15px;
}
#full-screen-composer .text-direction-left:after {
    background: url(../img/composer-text-editor.png) no-repeat -56px -18px;
}
#full-screen-composer .text-direction-right:after {
    background: url(../img/composer-text-editor.png) no-repeat -70px -18px;
}

#full-screen-composer .asset-qty {
    height: 100%;
    border-top: 1px solid #666666;
    /*height: 21px;*/
    border-top: 1px solid #666666;
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
}

#full-screen-composer .asset-qty input[type=number].numberOfAssets {
    width: 22px;
    height: 16px;
    margin-right: 3px;
    outline: none;
    border: 1px solid #666666;
    padding: 0;
    text-align: center;}

#full-screen-composer .asset-qty .itemCodeInAsset {
    margin-left: 10px;
    padding: 0;
    border: none;
    max-width: 70%;
    outline: none;
    height: 100%;
}

#full-screen-composer .notIncludeInCanvasIcon {
    display:  none;
    position: absolute;
    top: 4px;
    right: 4px;
}

#full-screen-composer .notIncludeInCanvasIcon.active {
    display: flex;
    cursor: pointer;
}

#full-screen-composer #collagesDiv .asset-qty .itemCodeInAsset{
    max-width: 100%;
    margin: 0 10px;
    text-align: center;
}

#full-screen-composer input[type=number]::-webkit-inner-spin-button,
#full-screen-composer input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: textfield;
}

#full-screen-composer .asset-qty table td:first-child {
    padding-right: 7px;
}
#full-screen-composer .asset-qty input,
#full-screen-composer .asset-qty label {
    margin: 0;
}

#full-screen-composer .listOfContentForCollagesAssetsAndCollages input[type="checkbox"] + .custom-checkbox:before {
    right: -7px;
	position: initial;
    border: 1px solid #666666;
}

/*.full-pannels-holder {*/
/*    width: 320px;*/
/*    margin-left: 43px;*/
/*    position: relative;*/
/*    border: 1px solid silver;*/
/*}*/

.full-pannels-holder {
    width: 382px;
    /* margin-left: 43px; */
    /* position: relative; */
    /*border: 1px solid silver;*/
    display: grid;
    grid-template-columns: 1fr 11fr;
    overflow: hidden;
}

.full-pannels-holder .nav-tabs-custom {
    /*position: absolute;*/
    /*top: -1px;*/
    /*left: -45px;*/
    /*z-index: 10;*/
    /*border: 1px solid silver;*/
    background-color: #616161;
    margin: 0;
    /*box-shadow: 1px 1px 5px rgba(0, 0, 0, .2);*/
}
.full-pannels-holder .nav-tabs-custom > li {
    position: relative;
    display: block;
}
.full-pannels-holder .nav-tabs-custom > li > a {
    position: relative;
    display: block;
    padding: 10px 15px;
}

.full-pannels-holder .nav-tabs-custom > li {
    /*border-top: 1px solid silver;*/
    /*padding-left: 3px;*/
    /*background-color: #fff;*/
    width: 50px;
    height: 50px;
}
.full-pannels-holder .nav-tabs-custom > li.active {
    background-color: #ffffff;
    padding-left: 0;
    /*border-left: 3px solid #eee;*/
}
.full-pannels-holder .nav-tabs-custom > li:first-child {
    border-top: 0;
}
.full-pannels-holder .nav-tabs-custom > li > button {
    border: none;
    background-color: transparent;
    height: 100%;
    width: 100%;
    /*text-indent: -9999px;*/
    position: relative;
    background-size: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.full-pannels-holder .nav-tabs-custom > li.active > button svg path {
    fill: #000000;
    /*stroke: #000000;*/
}

.full-pannels-holder .nav-tabs-custom > li > button svg path {
    fill: #ffffff;
    /*stroke: #ffffff;*/
}
/*.full-pannels-holder .nav-tabs-custom > li > button:after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    background-size: contain;
}*/

.full-pannels-holder .nav-tabs-custom > li > .full-composer-tab-text {
    /*background: url(../img/composer-pannel-tab--text-2x.png) no-repeat 11px center;*/
    /*background-size: 14px 15px;*/
}
.full-pannels-holder .nav-tabs-custom > li.active > .full-composer-tab-text {
    /*background: url(../img/composer-pannel-tab--text-active-2x.png) no-repeat 11px center;*/
    /*background-size: 14px 15px;*/
}
.full-pannels-holder .nav-tabs-custom > li > .full-composer-tab-object {
    /*background: url(../img/composer-pannel-tab--object-2x.png) no-repeat 8px center;*/
    /*background-size: 21px 18px;*/
}
.full-pannels-holder .nav-tabs-custom > li.active > .full-composer-tab-object {
    /*background: url(../img/composer-pannel-tab--object-active-2x.png) no-repeat 8px center;*/
    /*background-size: 21px 18px;*/
}
.full-pannels-holder .nav-tabs-custom > li > .full-composer-tab-layout {
    /*background: url(../img/composer-pannel-tab--layout-2x.png) no-repeat 9px center;*/
    /*background-size: 20px 20px;*/
}
.full-pannels-holder .nav-tabs-custom > li.active > .full-composer-tab-layout {
    /*background: url(../img/composer-pannel-tab--layout-active-2x.png) no-repeat 9px center;*/
    /*background-size: 20px 20px;*/
}

.full-pannels-holder .nav-tabs-custom > li > button:disabled {
    opacity: 0.5;
}
#full-screen-composer .composer-style-background-color-wrapper .icon,
#full-screen-composer .composer-style-fill-wrapper .icon {
    background: url(../img/composer-fill-color-2x.png) no-repeat center;
    background-size: 15px 14px;
    width: 15px;
    height: 18px;  /* Y+4 */ /* background-size: Xpx Ypx*/
    border-bottom: 2px solid red;
    top: 4px; /* (26 - height) / 2 */

}
#full-screen-composer .composer-style-background-color-wrapper select,
#full-screen-composer .composer-style-fill-wrapper select {
    text-indent: 31px; /* .icon width + 16 */
}

#full-screen-composer .composer-text-stroke-color-wrapper .icon {
    background: url(../img/composer-stroke-color-2x.png) no-repeat center;
    background-size: 14px 14px;
    width: 14px;
    height: 18px;  /* Y+4 */ /* background-size: Xpx Ypx*/
    border-bottom: 2px solid red;
    top: 4px; /* (26 - height) / 2 */

}
#full-screen-composer .composer-text-stroke-color-wrapper select {
    text-indent: 30px; /* .icon width + 16 */
}

#full-screen-composer .composer-line-spacing-wrapper .icon {
    background: url(../img/composer-line-spacing-2x.png) no-repeat center;
    background-size: contain;
    width: 23px;
    height: 12px;
    top: 7px; /* (26 - height) / 2 */
    left: 6px;
}
#full-screen-composer .composer-line-spacing-wrapper select {
    text-indent: 32px;
}

#full-screen-composer .arrange .icon-list {
    cursor: pointer;
}
#full-screen-composer .arrange .icon-list .icon {
    width: 28px;
    height: 28px;
    display: inline-block;
    vertical-align: middle;
}
#full-screen-composer .arrange .icon-list .icon svg {
    width: 100%;
    height: auto;
}
/*#full-screen-composer .activeContour,*/
#visualComposerPresetsPopup .activeContour{
    background-color: silver;
}

/*newProductCollageStyles start*/

#full-screen-composer .productCollageMainControls .composeBtn {
    height: 26px;
    padding: 0 20px;
    text-align: center;
    display: flex;
    align-items: center;
}

#full-screen-composer .productCollageMainControls .composer-open-input-collages{
    /*height: auto;*/
    /*padding: 20px;*/
}

#full-screen-composer .productCollageMainControls button:not(.composeBtn) {
    border: none;
    background: none;
    height: 25px;
}

#full-screen-composer .productCollageLogoWrapper {
    max-height: 60px;
    display: flex;
    justify-content: center;
}

#full-screen-composer .productCollageLogoWrapper .productCollageLogo{
    max-width: inherit;
    max-height: inherit;
    /* display: flex; */
    padding: 10px 0;
}

#full-screen-composer .productCollageMainControls {
    display: flex;
    /*justify-content: center;*/
    flex-direction: row;
    flex: 1 1 auto;
    padding: 0 170px 0 50px;
    justify-content: space-between;
    align-items: center;
}

#full-screen-composer .productCollageMainControls-group {
    display: flex;
}

#full-screen-composer .productCollageMainControls button {
    margin-left: 15px;
}

#full-screen-composer .productCollageMainControls button:first-child {
    margin: 0;
}

#full-screen-composer .productCollageSizeControls {
    display: flex;
    justify-content: center;
    width: 2%;
}

#full-screen-composer .productCollageSizeControlsWrapper {
    display: flex;
    height: 30px;
    /*width: 120px;*/
    /*background-color: rgba(212, 212, 212, 1);*/
    border-radius: 13px;
}

#full-screen-composer .productCollageSizeControlsWrapper .defaultCanvasZoom {
    background: url("../img/FullScreenIcon.png") no-repeat 4px 4px;;
}

#full-screen-composer .productCollageSizeControlsWrapper .defaultCanvasZoom.activeMaxZoomForCanvas {
    background: url("../img/DefaultScreenIcon.png") no-repeat 4px 4px;;
}

#full-screen-composer .productCollageSizeControls button {
    width: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    border: none;
    /*background-color: rgba(212, 212, 212, 1);*/
}

#full-screen-composer .productCollageCloseWrapper {
    display: flex;
    justify-content: center;
}

#full-screen-composer .productCollageCloseWrapper a {
    line-height: 1;
    height: 15px;
    width: 15px;
}

#full-screen-composer .productCollageItemsControls {
    display: flex;
    align-items: center;
    /*justify-content: center;*/
    width: 60%;
}

#full-screen-composer .productCollageItemsControls button {
    background: none;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
}

#full-screen-composer .productCollageItemsControls button:last-child {
    margin: 0;
}


#full-screen-composer .productCollageItemsControls button:not(.removeFromCollage){
    height: 26px;
    width: 29px;
}

#full-screen-composer .productCollageItemsControls .selectAllImagesOnCollageWrapper {
    display: flex;
    width: auto;
    align-items: center;
    margin-right: 20px;
}

#full-screen-composer .productCollageItemsControls .selectAllImagesOnCollageWrapper .labelSelectAllImagesOnCollage {
    margin-left: 10px;
}

#full-screen-composer .productCollageItemsControls .selectAllImagesOnCollageWrapper input,
#full-screen-composer .productCollageItemsControls .selectAllImagesOnCollageWrapper label {
    margin: 0;
}

#full-screen-composer .productCollageItemsControls .arrange-backwards{
    align-items: baseline;
}

#full-screen-composer .productCollageItemsControls .arrange-forwards{
    align-items: flex-end;
}

#full-screen-composer .spinner .canvas-container{
    opacity: 0;
}

/*#full-screen-composer .canvas-container {*/
/*    background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, #D5D5D5), color-stop(.25, transparent)), -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #D5D5D5), color-stop(.25, transparent)), -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.75, transparent), color-stop(.75, #D5D5D5)), -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.75, transparent), color-stop(.75, #D5D5D5));*/
/*    background-size: 20px 20px;*/
/*    -webkit-background-size: 20px 20px;*/
/*    !* override value for shitty webkit *!*/
/*    background-position: 0 0, 50px 0, 50px -50px, 0px 50px;*/
/*}*/
#full-screen-composer .canvas-container {
    background-image: url("../img/squares2.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/*@-moz-document url-prefix() {*/

/*    #full-screen-composer .canvas-container {*/
/*        background-image: -moz-linear-gradient(45deg, #D5D5D5 25%, transparent 25%), -moz-linear-gradient(-45deg, #D5D5D5 25%, transparent 25%), -moz-linear-gradient(45deg, transparent 75%, #D5D5D5 75%), -moz-linear-gradient(-45deg, transparent 75%, #D5D5D5 75%);*/
/*        background-size: 20px 20px;*/
/*    }*/
/*}*/


#full-screen-composer .wrapper-for-block {
    display: flex;
    align-items: center;
    margin-top: 20px;
    padding: 0 10px;
    /*height: 30px;*/
}

#full-screen-composer .wrapper-for-block .preset-controls-wrapper{
    display: flex;
    align-items: center;
    height: 100%;
}

#full-screen-composer .wrapper-for-block .preset-controls {
    border: 0;
    background: white;
    height: 15px;
    width: 15px;
    margin-left: 10px;
}

#full-screen-composer .wrapper-for-block .select-preset-wrapper {
    width: 48%;
}

#full-screen-composer .wrapper-for-block select {
    margin: 0;
    width: 100%;
    background: #FFFFFF;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.5);
    /*border: 1px solid rgba(0, 0, 0, 0.5);*/
    border: none;
    border-radius: 3px;
    height: 30px;
    outline: none;
}

.width-35per {
    width: 35%;
}

#full-screen-composer .controls-media-wrapper {
    width: 65%;
    display: flex!important;
    justify-content: space-between;
}

#full-screen-composer .controls-media-wrapper.target-size .js-linked-input-container {
    width: 45%;
}

#full-screen-composer .controls-media-wrapper.target-size input {
    border: none;
    box-shadow: none;
    height: 30px;
    padding: 0;
    border-radius: 0 3px 3px 0;
    outline: none;
}

#full-screen-composer .controls-media-wrapper.target-size input:disabled,
#full-screen-composer .controls-media-wrapper.target-size .charOfSize.disabledChar{
    background-color: #D5D5D5;
}

#full-screen-composer .select-wrapper-media {
    width: 45%;
}


#full-screen-composer .controls-media-wrapper .input-group {
    margin: 0;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
    border-radius: 3px;
}

#full-screen-composer .input-group .charOfSize {
    border-radius: 3px 0 0 3px;
    background: white;
    /* border-right: none; */
    border: none;
    padding: 3px!important;
}

#full-screen-composer .same-controls-wrapper {
    width: 58%;
    justify-content: space-around;
    display: flex;
}
#full-screen-composer .same-control-wrapper {
    display: flex;
    align-items: center;
}

#full-screen-composer input[type='checkbox'] {
    margin: 0;
    height: 14px;
    width: 14px;
}

#full-screen-composer label {
    margin: 0 0 0 10px;
    line-height: 1;
    font-weight: normal;
}

#full-screen-composer .label-caption-name {
    font-weight: 700;
    /*text-transform: capitalize;*/
}

#full-screen-composer .crop-controls-wrapper {
    display: flex;
    align-items: center;
}

#full-screen-composer .crop-controls-wrapper label {
    margin-left: 5px;
    font-weight: 700;
}

#full-screen-composer .crop-size-wrapper {
    display: none;
    width: 65%;
}

#full-screen-composer .crop-size-wrapper .controls-media-wrapper{
    width: 100%;
}

#full-screen-composer .shapes-wrapper {
    flex-direction: column;
    align-items: baseline;
    height: auto;
}

#full-screen-composer .shapes-wrapper #full-contours,
#full-screen-composer .background-color-wrapper,
#full-screen-composer .stroke-color-wrapper{
    width: 100%;
    display: flex;
    flex-direction: column;
    height: auto;
}

#full-screen-composer .shapes-wrapper #full-contours .contours-row {
    display: flex;
    width: 100%;
    height: 64px;
    margin-top: 15px;
}


#full-screen-composer .shapes-wrapper #full-contours .contours-row .shape-element {
    border: none;
    height: 100%;
    width: 64px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #FFFFFF;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
    border-radius: 3px;
    margin-right: 19px;
    cursor: pointer;
}

#full-screen-composer .shapes-wrapper #full-contours .contours-row .shape-element.last-in-row {
    margin: 0;
}

#full-screen-composer .background-color-wrapper,
#full-screen-composer .stroke-color-wrapper {
    align-items: baseline;
}

#full-screen-composer #full-composition-background-color-holder {
    width: 100%;
}

#full-screen-composer .color-picker .color-square.color-square-transparent {
    /*background-image: -moz-linear-gradient(45deg, #D3D3D3 25%, transparent 25%), -moz-linear-gradient(-45deg, #D3D3D3 25%, transparent 25%), -moz-linear-gradient(45deg, transparent 75%, #D3D3D3 75%), -moz-linear-gradient(-45deg, transparent 75%, #D3D3D3 75%);*/
    /*background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, #D3D3D3), color-stop(.25, transparent)), -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #D3D3D3), color-stop(.25, transparent)), -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.75, transparent), color-stop(.75, #D3D3D3)), -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.75, transparent), color-stop(.75, #D3D3D3));*/
    /*-moz-background-size: 20px 20px;*/
    /*background-size: 20px 20px;*/
    /*-webkit-background-size: 20px 20px;*/
    /*!* override value for shitty webkit *!*/
    /*background-position: 0 0, 50px 0, 50px -50px, 0px 50px;*/
    background: url("../img/кубики.png") no-repeat -4px -4px;

}

#full-screen-composer .active-background-color,
#full-screen-composer .active-stroke-color{
    display: flex;
    align-items: center;
    margin-right: 15px;
    width: 34px;
}

#full-screen-composer .active-background-color .color-square.color-square-transparent,
#full-screen-composer .active-stroke-color .color-square.color-square-transparent{
    background: url("../img/кубики.png") no-repeat -4px -4px;
}





.color-picker .color-square:before {
    border-radius: 0;
}

.background-colors-selector-wrapper,
.stroke-colors-selector-wrapper {
    width: 100%;
    display: flex;
    height: 40px;
    margin-top: 10px;
}

.background-colors-selector-wrapper .full-color-picker-btn {

}

#full-composition-background-color-holder-full-screen,
#full-composition-stroke-color-holder-full-screen {
    height: 100%;
    display: flex;
    align-items: center;
}

.background-colors-selector-wrapper .color-square,
.stroke-colors-selector-wrapper .color-square {
    margin-right: 5px;
    /*box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);*/
    min-width: 32px;
    max-width: 32px;
    height: 32px;
    cursor: pointer;
    border-radius: 0;
    border: 1px solid #D4D4D4;
}

.background-colors-selector-wrapper .color-square.disabledColorPicker {
    opacity: 0.2;
}

#full-screen-composer .captionPresetConfig {
    width: 40%;
}

#full-screen-composer .valueForConfigWrapper {
    width: 60%;
}

#full-screen-composer .valueForConfigWrapper input,
#full-screen-composer .valueForConfigWrapper select {
    width: 100%;
    outline: none;
    border: none;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
}

#full-screen-composer .advanceButtonWrapper {
    justify-content: center;
    margin-bottom: 20px;
    margin-top: 30px;
}

#full-screen-composer .advanceButtonWrapper button {
    border-radius: 3px;
    width: 108px;
    border: none;
    height: 30px;
}

#full-screen-composer .not-full-row {
    justify-content: space-between;
}

#full-screen-composer .last-row-shapes {
    display: flex;
}

#full-screen-composer .without-margin {
    margin: 0;
    height: 24px;
    justify-content: space-between;
}

#full-screen-composer .close-advance-setting-collage {
    background: transparent;
    border: none;
    /* height: 24px; */
    display: flex;
    align-items: center;
}

#full-screen-composer .radioBtnsGroupForGap {
    display: flex;
    height: 20px;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

#full-screen-composer .radioBtnsGroupForGap .radioControlWrapper {
    display: flex;
    align-items: center;
}

#full-screen-composer .radioBtnsGroupForGap input[type="radio"]{
    margin: 0!important;
    outline: none;
}

#full-screen-composer .radioBtnsGroupForGap label {
    margin-left: 5px;
}

#full-screen-composer .horizontal-gap-setting,
#full-screen-composer .vertical-gap-setting {
    height: auto;
    align-items: flex-start;
}

#full-screen-composer .controlsForGapWrapper{
    width: 65%;
    height: 70px;
}

#full-screen-composer .controlsForFileSetting {
    height: auto;
}

#full-screen-composer .controlsForFileSetting .radioBtnsGroupForGap {
    width: 80%;
}

#full-screen-composer .controlsForFileSetting .radioBtnsGroupForGap .radioControlWrapper {
    width: 50%;
}

#full-screen-composer .caption-advance-collage-setting,
#full-screen-composer .captionImageConfig{
    width: 35%;
}

#full-screen-composer .custom-gap {
    display: flex;
    /*justify-content: center;*/
    align-items: baseline;
    margin-top: 12px;
}

#full-screen-composer .custom-gap .input-group {
    width: 25%;
    margin: 0 10px 0 0;
}

#full-screen-composer .custom-gap input[type="range"] {
    margin: 0;
    height: 26px;
}

#full-screen-composer input[type=range] {
    -webkit-appearance: none; /* Hides the slider so that custom slider can be made */
    width: 100%; /* Specific width is required for Firefox. */
    background: transparent; /* Otherwise white in Chrome */
    margin: 10px 0;
}

#full-screen-composer input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
}

#full-screen-composer input[type=range]:focus {
    outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
}

#full-screen-composer input[type=range]::-ms-track {
    width: 100%;
    cursor: pointer;

    /* Hides the slider so custom styles can be added */
    background: transparent;
    border-color: transparent;
    color: transparent;
}

/* Special styling for WebKit/Blink */

#full-screen-composer input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: 2px solid;
    height: 14px;
    width: 14px;
    border-radius: 50%;
    background: #ffffff;
    cursor: pointer;
    margin-top: -8px; /* You need to specify a margin in Chrome, but in Firefox and IE it is automatic */
    box-shadow: none; /* Add cool effects to your sliders! */
}

/* All the same stuff for Firefox */
#full-screen-composer input[type=range]::-moz-range-thumb {
    box-shadow: none;
    border: 2px solid;
    height: 14px;
    width: 14px;
    border-radius: 50%;
    background: #ffffff;
    cursor: pointer;
    padding: 0;
}

/* All the same stuff for IE */
#full-screen-composer input[type=range]::-ms-thumb {
    box-shadow: none;
    border: 2px solid;
    height: 14px;
    width: 14px;
    border-radius: 50%;
    background: #ffffff;
    cursor: pointer;
}

input[type=range]::-webkit-slider-runnable-track {
    box-sizing: border-box;
    width: 100%;
    height: 2px;
    max-height: 2px;
    cursor: pointer;
    box-shadow: none;
    background: #616161;
    border: none;
}

input[type=range]:focus::-webkit-slider-runnable-track {
    background: #616161;
}

input[type=range]::-moz-range-track {
    box-sizing: border-box;
    width: 100%;
    height: 2px;
    max-height: 2px;
    cursor: pointer;
    box-shadow: none;
    background: #616161;
    /*border-radius: 1.3px;*/
    border: none;
}

input[type=range]::-ms-track {
    box-sizing: border-box;
    width: 100%;
    height: 2px;
    max-height: 2px;
    cursor: pointer;
    background: transparent;
    border-color: transparent;
    border-width: 16px 0;
    color: transparent;
}
input[type=range]::-ms-fill-lower {
    background: #616161;
    border: none;
    /*border-radius: 2.6px;*/
    box-shadow: none;
}
input[type=range]:focus::-ms-fill-lower {
    background: #616161;
}
input[type=range]::-ms-fill-upper {
    background: #616161;
    border: none;
    /*border-radius: 2.6px;*/
    box-shadow: none;
}
input[type=range]:focus::-ms-fill-upper {
    background: #616161;
}

#full-screen-composer .input-group .input-group-addon {
    padding: 0;
    border-color: #666666;
}

#full-screen-composer .maxMinValueForRangeWrapper {
    display: flex;
    justify-content: space-between;
    font-size: 10px
}

#full-screen-composer .advanceSettingCollageSetting,
#full-screen-composer .valueForImageWrapper{
    width: 65%;
}

#full-screen-composer .valueForImageWrapper {
    display: flex;
    justify-content: space-between;
}

#full-screen-composer .switch-image-in-canvas-btn {
    width: 20px;
    background-color: transparent;
    border: none;
}

#full-screen-composer .switch-image-in-canvas-btn.select-prev {
    margin-left: 10px;
}

#full-screen-composer .advanceSettingCollageSetting .custom-gap,
#full-screen-composer .input-controls-for-image-setting-wrapper .custom-gap {
    margin: 0;
    align-items: center;
}

#full-screen-composer .advanceSettingCollageSetting .custom-gap input[type="range"] ,
#full-screen-composer .input-controls-for-image-setting-wrapper .custom-gap input[type="range"] {
    height: 14px;
}

#full-screen-composer .custom-gap .range-group {
    width: 75%;
}

#full-screen-composer .controlsForImageSettingImageInLine .input-group,
#full-screen-composer .controlsForImageSettingResolution .input-group {
    width: 17%;
}

#full-screen-composer .controlsForImageSettingImageInLine .range-group,
#full-screen-composer .controlsForImageSettingResolution .range-group {
    width: 83%;
}


#full-screen-composer  .wrapper-for-block.lastInSection {
    padding-bottom: 20px;
    border-bottom: 1px solid #666666;
}

#full-screen-composer  .wrapper-for-block.firstInSection {
    margin-top: 30px;
}

#full-screen-composer  .wrapper-for-block.lastInSectionWithOutLine {
    padding-bottom: 20px;
}

/*#full-screen-composer .controlsForImageSettingResolution .input-group {*/
/*    width: 35%;*/
/*}*/

#full-screen-composer .closePresetPopup {
    background: none;
    border: none;
    width: 14px;
    height: 14px;
    display: flex;
}

#full-screen-composer .caption-image-setting {
    width: 20%;
}

#full-screen-composer .input-controls-for-image-setting-wrapper {
    width: 80%;
}

#full-screen-composer .input-controls-for-image-setting-wrapper .input-group {
    width: 15%;
    margin: 0;
}

#full-screen-composer .input-controls-for-image-setting-wrapper .range-group {
    width: 85%;
    margin-left: 17px;
}

#full-screen-composer .input-controls-for-image-setting-wrapper .input-group input {
    border-radius: 3px;
    /*padding-left: 1px!important;*/
}

#full-screen-composer .horizontalVerticalWrapper .label-caption-name{
    /*width: 50%;*/
}

#full-screen-composer .horizontalVerticalWrapper .controlsForGapWrapper{
    width: 50%;
}

#full-screen-composer .horizontalVerticalWrapper .radioBtnsGroupForGap{
    width: 100%;
}

#full-screen-composer .withOutAddon {
    border-radius: 2px!important;
}

#full-screen-composer .strokeSettingWrapper {
    display: flex;
}

#full-screen-composer .strokeSettingEffectWrapper {
    align-items: center;
    display: flex;
    margin-right: 10px;
    /*width: 30%;*/
}

#full-screen-composer .strokeSettingWeightWrapper {
    display: flex;
    align-items: center;
    /*width: 70%;*/
    flex: 1;
    justify-content: flex-end;
}

#full-screen-composer .strokeSettingWeightCaption {
    /*width: 80%;*/
}

#full-screen-composer .strokeSettingWeightInput {
    width: 20%;
    margin-left: 10px;
}

#full-screen-composer .strokeSettingWeightInput input {
    padding: 0 5px;
    text-align: center;
}

#full-screen-composer .collageSettingWrapper {
    display: flex;
    height: 44px;
}

#full-screen-composer .collageBtnControl {
    height: 100%;
    width: 50%;
    border: none;
    background: #D5D5D5;
    font-weight: bold;
    text-transform: uppercase;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

#full-screen-composer .collageBtnControl.active {
    background-color: #ffffff;
}

#full-screen-composer .controlsForCanvasImages{
    display: flex;
    height: 44px;
    background-color: #ffffff;
    align-items: center;
    justify-content: space-between;
    padding: 0 30px;
}

#full-screen-composer .controlsForCanvasImages .collageFileNameInCanvasArea {
    font-weight: bold;
    max-width: 38%;
    width: 38%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#full-screen-composer .wrapperForLoader{
    height: 100%;
    display: flex;
    flex-direction: column;
}

#full-screen-composer #pathList .fullPopupWrapper {
    width: 900px;
}

#full-screen-composer #pathList .pathListTableWrapper{
    margin: 20px 10px;
    max-height: 300px;
    overflow: auto;
    background: white;
}

#full-screen-composer #pathList .pathListTableWrapper .selectClippingPathTarget {
    width: 100%;
}

#full-screen-composer #pathList .pathListTableWrapper .AssetClippingPathTarget {
    margin: 0;
    width: 100%;
    height: 26px;
    border-radius: 3px;
}

#full-screen-composer #pathList .saveBtnPathListWrapper {
    display: flex;
    justify-content: center;
    padding-bottom: 20px;
}

#full-screen-composer #pathList .saveBtnPathListWrapper button {
    width: 108px;
    height: 30px;
}

#full-screen-composer #pathList .pathListTable thead tr {
    height: 40px;
    background-color: #c4c4c4;
}

#full-screen-composer #pathList .pathListTable {

}

#full-screen-composer #pathList .pathListTable th,
#full-screen-composer #pathList .pathListTable td {
    padding: 5px 10px;
}

#full-screen-composer #pathList .pathListTable td {
    line-height: 1;
}

#full-screen-composer #pathList .pathListTable th{
    position: sticky;
    top: 0;
    text-align: center;
    line-height: 1;
}

#full-screen-composer #pathList .pathListTable input {
    float: none;
}

#full-screen-composer #pathList .pathListTable tbody tr {
    border-bottom: 1px solid #E2E2E2;
    height: 40px;
}

#full-screen-composer #pathList .pathListTable tbody tr:last-child {
    border: none;
}

#full-screen-composer .contour.inactiveContour svg path {
    opacity: 0.3;
}

#full-screen-composer #full-openModalSaveAsPreset .fullPopupWrapper{
    width: 70%;
}
#full-screen-composer #full-openModalSaveAsPreset .contentTablePresetWrap {
    padding: 15px 10px;
}

#full-screen-composer #full-openModalSaveAsPreset .addNewPresetBtn {
    width: auto;
    padding: 0 10px;
    height: 30px;
}

#full-screen-composer #full-openModalSaveAsPreset .fullPopupWrapper option:disabled {
    background-color: #d4d4d4;
}

#full-openModalSaveAsPreset .nicescroll-rails-vr .nicescroll-cursors {
    right: -7px;
    width: 8px!important;
}

#full-openModalSaveAsPreset button:disabled svg path {
    fill: #c4c4c4!important;
}

#full-screen-composer .image-asset-caption,
#full-screen-composer .collageFileNameInCanvasArea{
    border: none!important;
    padding: 0!important;
}

#full-screen-composer .image-asset-caption:disabled,
#full-screen-composer .collageFileNameInCanvasArea:read-only {
    background-color: inherit;
}