/* Espilon Layout Control */ .epsilon-layouts-container { a { outline: none; text-decoration: none; &:hover, &:focus { text-decoration: none; color: #79b5d1; } } .epsilon-control-group { a { line-height: 41px; } } .epsilon-layouts-container-advanced { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-border-top-right-radius: 0px; -moz-border-top-right-radius: 0px; border-top-right-radius: 0px; background-color: #f4f4f4; -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, .05); -moz-box-shadow: 0 4px 5px rgba(0, 0, 0, .05); box-shadow: 0 4px 5px rgba(0, 0, 0, .05); position: relative; padding: 20px; box-sizing: border-box; display: none; .epsilon-layouts-container-label { margin-bottom: 20px; display: inline-block; } .epsilon-layouts-setup { display: inline-block; width: 100%; } .epsilon-column { border-right: 4px solid #f4f4f4; float: left; position: relative; box-sizing: border-box; height: 40px; background-color: #cacaca; -webkit-box-shadow: inset 0 2px 1px rgba(0, 0, 0, .15); -moz-box-shadow: inset 0 2px 1px rgba(0, 0, 0, .15); box-shadow: inset 0 2px 1px rgba(0, 0, 0, .15); text-align: center; &:first-of-type { a { &:first-of-type { display: none; } } } &:last-of-type { border-right: none; a { &:last-of-type { display: none; } } } &:first-of-type { &:last-of-type { .dependency-visible { display: block; } } } &.col12 { width: 100% } &.col11 { width: 91.66666667% } &.col10 { width: 83.33333333% } &.col9 { width: 75% } &.col8 { width: 66.66666667% } &.col7 { width: 58.33333333% } &.col6 { width: 50% } &.col5 { width: 41.66666667% } &.col4 { width: 33.33333333% } &.col3 { width: 25% } &.col2 { width: 16.66666667% } &.col1 { width: 8.33333333% } a { opacity: .2; width: 17px; height: 17px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #e14d43; color: #fff; position: absolute; top: 50%; left: 2%; -webkit-transform: translate(0%, -50%); -ms-transform: translate(0%, -50%); -o-transform: translate(0%, -50%); transform: translate(0%, -50%); -webkit-transition: opacity .2s; transition: opacity .2s; .dashicons { font-size: 12px; line-height: 17px; width: initial; height: initial; } &:last-of-type { right: 0; left: initial; } &.dependency-visible { display: none; left: 50%; right: initial; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } } &:hover, &:focus { > a { opacity: 1; -webkit-transition: opacity .2s; transition: opacity .2s; } } } } }