:root .grid-stack-item > .ui-resizable-handle {
    filter: none;
}

.grid-stack {
    position: relative;
}

.grid-stack .grid-stack-placeholder > .placeholder-content {
    border: 1px dashed lightgray;
    margin: 0;
    position: absolute;
    top: 0;
    left: 10px;
    right: 10px;
    bottom: 0;
    width: auto;
    z-index: 0 !important;
    text-align: center;
}

.grid-stack > .grid-stack-item {
    min-width: 8.3333333333%;
    position: absolute;
    padding: 0;
}

.grid-stack > .grid-stack-item > .grid-stack-item-content {
    margin: 0;
    position: absolute;
    top: 0;
    left: 10px;
    right: 10px;
    bottom: 0;
    width: auto;
    z-index: 0 !important;
    overflow-x: hidden;
    overflow-y: auto;
}

.grid-stack > .grid-stack-item > .ui-resizable-handle {
    position: absolute;
    font-size: 0.1px;
    display: block;
    -ms-touch-action: none;
    touch-action: none;
}

.grid-stack > .grid-stack-item.ui-resizable-disabled > .ui-resizable-handle,
.grid-stack > .grid-stack-item.ui-resizable-autohide > .ui-resizable-handle {
    display: none;
}

.grid-stack > .grid-stack-item.ui-draggable-dragging, .grid-stack > .grid-stack-item.ui-resizable-resizing {
    z-index: 100;
}

.grid-stack > .grid-stack-item.ui-draggable-dragging > .grid-stack-item-content,
.grid-stack > .grid-stack-item.ui-draggable-dragging > .grid-stack-item-content, .grid-stack > .grid-stack-item.ui-resizable-resizing > .grid-stack-item-content,
.grid-stack > .grid-stack-item.ui-resizable-resizing > .grid-stack-item-content {
    box-shadow: 1px 4px 6px rgba(0, 0, 0, 0.2);
    opacity: 0.8;
}

.grid-stack > .grid-stack-item > .ui-resizable-se,
.grid-stack > .grid-stack-item > .ui-resizable-sw {
    text-align: right;
    color: gray;
    padding: 2px 3px 0 0;
    margin: 0;
    font: normal normal normal 10px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.grid-stack > .grid-stack-item > .ui-resizable-se::before,
.grid-stack > .grid-stack-item > .ui-resizable-sw::before {
    content: "\f065";
}

.grid-stack > .grid-stack-item > .ui-resizable-se {
    display: inline-block;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}

.grid-stack > .grid-stack-item > .ui-resizable-nw {
    cursor: nw-resize;
    width: 20px;
    height: 20px;
    left: 10px;
    top: 0;
}

.grid-stack > .grid-stack-item > .ui-resizable-n {
    cursor: n-resize;
    height: 10px;
    top: 0;
    left: 25px;
    right: 25px;
}

.grid-stack > .grid-stack-item > .ui-resizable-ne {
    cursor: ne-resize;
    width: 20px;
    height: 20px;
    right: 10px;
    top: 0;
}

.grid-stack > .grid-stack-item > .ui-resizable-e {
    cursor: e-resize;
    width: 10px;
    right: 10px;
    top: 15px;
    bottom: 15px;
}

.grid-stack > .grid-stack-item > .ui-resizable-se {
    cursor: se-resize;
    width: 20px;
    height: 20px;
    right: 10px;
    bottom: 0;
}

.grid-stack > .grid-stack-item > .ui-resizable-s {
    cursor: s-resize;
    height: 10px;
    left: 25px;
    bottom: 0;
    right: 25px;
}

.grid-stack > .grid-stack-item > .ui-resizable-sw {
    cursor: sw-resize;
    width: 20px;
    height: 20px;
    left: 10px;
    bottom: 0;
}

.grid-stack > .grid-stack-item > .ui-resizable-w {
    cursor: w-resize;
    width: 10px;
    left: 10px;
    top: 15px;
    bottom: 15px;
}

.grid-stack > .grid-stack-item[data-gs-width='1'] {
    width: 10%;
}

.grid-stack > .grid-stack-item[data-gs-x='1'] {
    left: 10%;
}

.grid-stack > .grid-stack-item[data-gs-min-width='1'] {
    min-width: 10%;
}

.grid-stack > .grid-stack-item[data-gs-max-width='1'] {
    max-width: 10%;
}

.grid-stack > .grid-stack-item[data-gs-width='2'] {
    width: 20%;
}

.grid-stack > .grid-stack-item[data-gs-x='2'] {
    left: 20%;
}

.grid-stack > .grid-stack-item[data-gs-min-width='2'] {
    min-width: 20%;
}

.grid-stack > .grid-stack-item[data-gs-max-width='2'] {
    max-width: 20%;
}

.grid-stack > .grid-stack-item[data-gs-width='3'] {
    width: 30%;
}

.grid-stack > .grid-stack-item[data-gs-x='3'] {
    left: 30%;
}

.grid-stack > .grid-stack-item[data-gs-min-width='3'] {
    min-width: 30%;
}

.grid-stack > .grid-stack-item[data-gs-max-width='3'] {
    max-width: 30%;
}

.grid-stack > .grid-stack-item[data-gs-width='4'] {
    width: 40%;
}

.grid-stack > .grid-stack-item[data-gs-x='4'] {
    left: 40%;
}

.grid-stack > .grid-stack-item[data-gs-min-width='4'] {
    min-width: 40%;
}

.grid-stack > .grid-stack-item[data-gs-max-width='4'] {
    max-width: 40%;
}

.grid-stack > .grid-stack-item[data-gs-width='5'] {
    width: 50%;
}

.grid-stack > .grid-stack-item[data-gs-x='5'] {
    left: 50%;
}

.grid-stack > .grid-stack-item[data-gs-min-width='5'] {
    min-width: 50%;
}

.grid-stack > .grid-stack-item[data-gs-max-width='5'] {
    max-width: 50%;
}

.grid-stack > .grid-stack-item[data-gs-width='6'] {
    width: 60%;
}

.grid-stack > .grid-stack-item[data-gs-x='6'] {
    left: 60%;
}

.grid-stack > .grid-stack-item[data-gs-min-width='6'] {
    min-width: 60%;
}

.grid-stack > .grid-stack-item[data-gs-max-width='6'] {
    max-width: 60%;
}

.grid-stack > .grid-stack-item[data-gs-width='7'] {
    width: 70%;
}

.grid-stack > .grid-stack-item[data-gs-x='7'] {
    left: 70%;
}

.grid-stack > .grid-stack-item[data-gs-min-width='7'] {
    min-width: 70%;
}

.grid-stack > .grid-stack-item[data-gs-max-width='7'] {
    max-width: 70%;
}

.grid-stack > .grid-stack-item[data-gs-width='8'] {
    width: 80%;
}

.grid-stack > .grid-stack-item[data-gs-x='8'] {
    left: 80%;
}

.grid-stack > .grid-stack-item[data-gs-min-width='8'] {
    min-width: 80%;
}

.grid-stack > .grid-stack-item[data-gs-max-width='8'] {
    max-width: 80%;
}

.grid-stack > .grid-stack-item[data-gs-width='9'] {
    width: 90%;
}

.grid-stack > .grid-stack-item[data-gs-x='9'] {
    left: 90%;
}

.grid-stack > .grid-stack-item[data-gs-min-width='9'] {
    min-width: 90%;
}

.grid-stack > .grid-stack-item[data-gs-max-width='9'] {
    max-width: 90%;
}

.grid-stack > .grid-stack-item[data-gs-width='10'] {
    width: 100%;
}

.grid-stack > .grid-stack-item[data-gs-x='10'] {
    left: 100%;
}

.grid-stack > .grid-stack-item[data-gs-min-width='10'] {
    min-width: 100%;
}

.grid-stack > .grid-stack-item[data-gs-max-width='10'] {
    max-width: 100%;
}

.grid-stack > .grid-stack-item[data-gs-width='11'] {
    width: 91.6666666667%;
}

.grid-stack > .grid-stack-item[data-gs-x='11'] {
    left: 91.6666666667%;
}

.grid-stack > .grid-stack-item[data-gs-min-width='11'] {
    min-width: 91.6666666667%;
}

.grid-stack > .grid-stack-item[data-gs-max-width='11'] {
    max-width: 91.6666666667%;
}

.grid-stack > .grid-stack-item[data-gs-width='12'] {
    width: 100%;
}

.grid-stack > .grid-stack-item[data-gs-x='12'] {
    left: 100%;
}

.grid-stack > .grid-stack-item[data-gs-min-width='12'] {
    min-width: 100%;
}

.grid-stack > .grid-stack-item[data-gs-max-width='12'] {
    max-width: 100%;
}

.grid-stack.grid-stack-animate,
.grid-stack.grid-stack-animate .grid-stack-item {
    -webkit-transition: left 0.3s, top 0.3s, height 0.3s, width 0.3s;
    -moz-transition: left 0.3s, top 0.3s, height 0.3s, width 0.3s;
    -ms-transition: left 0.3s, top 0.3s, height 0.3s, width 0.3s;
    -o-transition: left 0.3s, top 0.3s, height 0.3s, width 0.3s;
    transition: left 0.3s, top 0.3s, height 0.3s, width 0.3s;
}

.grid-stack.grid-stack-animate .grid-stack-item.ui-draggable-dragging,
.grid-stack.grid-stack-animate .grid-stack-item.ui-resizable-resizing,
.grid-stack.grid-stack-animate .grid-stack-item.grid-stack-placeholder {
    -webkit-transition: left 0s, top 0s, height 0s, width 0s;
    -moz-transition: left 0s, top 0s, height 0s, width 0s;
    -ms-transition: left 0s, top 0s, height 0s, width 0s;
    -o-transition: left 0s, top 0s, height 0s, width 0s;
    transition: left 0s, top 0s, height 0s, width 0s;
}

/** Uncomment this to show bottom-left resize handle **/
/*
.grid-stack > .grid-stack-item > .ui-resizable-sw {
    display: inline-block;
    @include vendor(transform, rotate(180deg));
}
*/
@media (max-width: 768px) {
    .grid-stack-item {
        position: relative !important;
        width: auto !important;
        left: 0 !important;
        top: auto !important;
        margin-bottom: 20px;
    }
    .grid-stack-item .ui-resizable-handle {
        display: none;
    }
    .grid-stack {
        height: auto !important;
    }
}

.trash {
    height: 150px;
    border-radius: 5px;
    margin-bottom: 20px;
    background: rgba(255, 0, 70, 0.1) center center url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjY0cHgiIGhlaWdodD0iNjRweCIgdmlld0JveD0iMCAwIDQzOC41MjkgNDM4LjUyOSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDM4LjUyOSA0MzguNTI5OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnPgoJPGc+CgkJPHBhdGggZD0iTTQxNy42ODksNzUuNjU0Yy0xLjcxMS0xLjcwOS0zLjkwMS0yLjU2OC02LjU2My0yLjU2OGgtODguMjI0TDMwMi45MTcsMjUuNDFjLTIuODU0LTcuMDQ0LTcuOTk0LTEzLjA0LTE1LjQxMy0xNy45ODkgICAgQzI4MC4wNzgsMi40NzMsMjcyLjU1NiwwLDI2NC45NDUsMGgtOTEuMzYzYy03LjYxMSwwLTE1LjEzMSwyLjQ3My0yMi41NTQsNy40MjFjLTcuNDI0LDQuOTQ5LTEyLjU2MywxMC45NDQtMTUuNDE5LDE3Ljk4OSAgICBsLTE5Ljk4NSw0Ny42NzZoLTg4LjIyYy0yLjY2NywwLTQuODUzLDAuODU5LTYuNTY3LDIuNTY4Yy0xLjcwOSwxLjcxMy0yLjU2OCwzLjkwMy0yLjU2OCw2LjU2N3YxOC4yNzQgICAgYzAsMi42NjQsMC44NTUsNC44NTQsMi41NjgsNi41NjRjMS43MTQsMS43MTIsMy45MDQsMi41NjgsNi41NjcsMi41NjhoMjcuNDA2djI3MS44YzAsMTUuODAzLDQuNDczLDI5LjI2NiwxMy40MTgsNDAuMzk4ICAgIGM4Ljk0NywxMS4xMzksMTkuNzAxLDE2LjcwMywzMi4yNjQsMTYuNzAzaDIzNy41NDJjMTIuNTY2LDAsMjMuMzE5LTUuNzU2LDMyLjI2NS0xNy4yNjhjOC45NDUtMTEuNTIsMTMuNDE1LTI1LjE3NCwxMy40MTUtNDAuOTcxICAgIFYxMDkuNjI3aDI3LjQxMWMyLjY2MiwwLDQuODUzLTAuODU2LDYuNTYzLTIuNTY4YzEuNzA4LTEuNzA5LDIuNTctMy45LDIuNTctNi41NjRWODIuMjIxICAgIEM0MjAuMjYsNzkuNTU3LDQxOS4zOTcsNzcuMzY3LDQxNy42ODksNzUuNjU0eiBNMTY5LjMwMSwzOS42NzhjMS4zMzEtMS43MTIsMi45NS0yLjc2Miw0Ljg1My0zLjE0aDkwLjUwNCAgICBjMS45MDMsMC4zODEsMy41MjUsMS40Myw0Ljg1NCwzLjE0bDEzLjcwOSwzMy40MDRIMTU1LjMxMUwxNjkuMzAxLDM5LjY3OHogTTM0Ny4xNzMsMzgwLjI5MWMwLDQuMTg2LTAuNjY0LDguMDQyLTEuOTk5LDExLjU2MSAgICBjLTEuMzM0LDMuNTE4LTIuNzE3LDYuMDg4LTQuMTQxLDcuNzA2Yy0xLjQzMSwxLjYyMi0yLjQyMywyLjQyNy0yLjk5OCwyLjQyN0gxMDAuNDkzYy0wLjU3MSwwLTEuNTY1LTAuODA1LTIuOTk2LTIuNDI3ICAgIGMtMS40MjktMS42MTgtMi44MS00LjE4OC00LjE0My03LjcwNmMtMS4zMzEtMy41MTktMS45OTctNy4zNzktMS45OTctMTEuNTYxVjEwOS42MjdoMjU1LjgxNVYzODAuMjkxeiIgZmlsbD0iI2ZmOWNhZSIvPgoJCTxwYXRoIGQ9Ik0xMzcuMDQsMzQ3LjE3MmgxOC4yNzFjMi42NjcsMCw0Ljg1OC0wLjg1NSw2LjU2Ny0yLjU2N2MxLjcwOS0xLjcxOCwyLjU2OC0zLjkwMSwyLjU2OC02LjU3VjE3My41ODEgICAgYzAtMi42NjMtMC44NTktNC44NTMtMi41NjgtNi41NjdjLTEuNzE0LTEuNzA5LTMuODk5LTIuNTY1LTYuNTY3LTIuNTY1SDEzNy4wNGMtMi42NjcsMC00Ljg1NCwwLjg1NS02LjU2NywyLjU2NSAgICBjLTEuNzExLDEuNzE0LTIuNTY4LDMuOTA0LTIuNTY4LDYuNTY3djE2NC40NTRjMCwyLjY2OSwwLjg1NCw0Ljg1MywyLjU2OCw2LjU3QzEzMi4xODYsMzQ2LjMxNiwxMzQuMzczLDM0Ny4xNzIsMTM3LjA0LDM0Ny4xNzJ6IiBmaWxsPSIjZmY5Y2FlIi8+CgkJPHBhdGggZD0iTTIxMC4xMjksMzQ3LjE3MmgxOC4yNzFjMi42NjYsMCw0Ljg1Ni0wLjg1NSw2LjU2NC0yLjU2N2MxLjcxOC0xLjcxOCwyLjU2OS0zLjkwMSwyLjU2OS02LjU3VjE3My41ODEgICAgYzAtMi42NjMtMC44NTItNC44NTMtMi41NjktNi41NjdjLTEuNzA4LTEuNzA5LTMuODk4LTIuNTY1LTYuNTY0LTIuNTY1aC0xOC4yNzFjLTIuNjY0LDAtNC44NTQsMC44NTUtNi41NjcsMi41NjUgICAgYy0xLjcxNCwxLjcxNC0yLjU2OCwzLjkwNC0yLjU2OCw2LjU2N3YxNjQuNDU0YzAsMi42NjksMC44NTQsNC44NTMsMi41NjgsNi41N0MyMDUuMjc0LDM0Ni4zMTYsMjA3LjQ2NSwzNDcuMTcyLDIxMC4xMjksMzQ3LjE3MnogICAgIiBmaWxsPSIjZmY5Y2FlIi8+CgkJPHBhdGggZD0iTTI4My4yMiwzNDcuMTcyaDE4LjI2OGMyLjY2OSwwLDQuODU5LTAuODU1LDYuNTctMi41NjdjMS43MTEtMS43MTgsMi41NjItMy45MDEsMi41NjItNi41N1YxNzMuNTgxICAgIGMwLTIuNjYzLTAuODUyLTQuODUzLTIuNTYyLTYuNTY3Yy0xLjcxMS0xLjcwOS0zLjkwMS0yLjU2NS02LjU3LTIuNTY1SDI4My4yMmMtMi42NywwLTQuODUzLDAuODU1LTYuNTcxLDIuNTY1ICAgIGMtMS43MTEsMS43MTQtMi41NjYsMy45MDQtMi41NjYsNi41Njd2MTY0LjQ1NGMwLDIuNjY5LDAuODU1LDQuODUzLDIuNTY2LDYuNTdDMjc4LjM2NywzNDYuMzE2LDI4MC41NSwzNDcuMTcyLDI4My4yMiwzNDcuMTcyeiIgZmlsbD0iI2ZmOWNhZSIvPgoJPC9nPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=) no-repeat;
}

.x-panel-body {
    height: 100% !important;
    width: 100% !important;
}

.x-panel {
    height: 100% !important;
}

.pimcore_editable {
    height: 100% !important;
}

.gs-1, .gs-2, .gs-3, .gs-4, .gs-5, .gs-6, .gs-7, .gs-8, .gs-9, .gs-10, .gs-11 {
    float: left;
}

.gs-12 {
    width: 100%;
}

.gs-11 {
    width: 91.66666667%;
}

.gs-10 {
    width: 83.33333333%;
}

.gs-9 {
    width: 75%;
}

.gs-8 {
    width: 66.66666667%;
}

.gs-7 {
    width: 58.33333333%;
}

.gs-6 {
    width: 50%;
}

.gs-5 {
    width: 41.66666667%;
}

.gs-4 {
    width: 33.33333333%;
}

.gs-3 {
    width: 25%;
}

.gs-2 {
    width: 16.66666667%;
}

.gs-1 {
    width: 8.33333333%;
}