div.ccm-dialog-icon-item-grid { margin: -24px -26px; .clear_float(); position: relative; min-height: 100%; div.ccm-dialog-icon-item-grid-sets { width: 195px; float: left; ul { list-style-type: none; margin-left: 20px; li { padding: 0px 0px 15px 0px; a { display: block; color: #999; } a.active, a:hover { text-decoration: none; color: #333; } } } } div.ccm-dialog-icon-item-grid-list-wrapper { float: left; width: 460px; margin-left: 40px; height: 430px; padding-top: 30px; overflow: scroll; } .ccm-icon-item-grid-search { background-color: #fff; padding: 0px; height: 47px; width: 195px; white-space: nowrap; color: #c8c8c8; position: relative; border-bottom: 1px solid #dadada; margin-bottom: 15px; input { margin: 0px 0px 0px 45px; height: 33px; padding: 10px 0px 0px 0px; width: 160px; border: 0px; .border-radius(0px); .box-shadow(none); outline: 0px !important; } input:focus { -webkit-appearance: none !important; outline: 0px !important; .box-shadow(none); } i.icon-search { position: absolute; top: 20px; left: 20px; } } } .ui-dialog-content-icon-item-grid { background: transparent url(../images/bg_icon_item_grid_overlay.png) repeat-y !important; } ul.ccm-overlay-icon-item-grid-list a, a.ccm-overlay-draggable-block-type { display: block; height: 100px; width: 100px; line-height: 100px; padding: 2px; box-sizing: padding-box; text-align: center; background-color: @wellBackground; border: 1px solid darken(@wellBackground, 7%); .border-radius(@baseBorderRadius); .box-shadow(inset 0 1px 1px rgba(0,0,0,.05)); span { position: absolute; left: 0px; bottom: 15px; width: 100%; text-align: center; display: block; color: @gray; font-size: @fontSizeMini; line-height: @fontSizeSmall; font-weight: lighter; } img { margin-top: -10px; height: 24px; width: auto; } } ul.ccm-overlay-icon-item-grid-list a:hover { cursor: pointer; border-color: #00cc66; background-color: #e0ffe0 !important; } ul.ccm-overlay-icon-item-grid-list a:hover, a.ccm-overlay-draggable-block-type:hover { text-decoration: none; } ul.ccm-overlay-icon-item-grid-list { margin: 0px !important; li { list-style-type: none; float: left; margin: 0px 35px 35px 0px; position: relative; display: none; } .ccm-icon-item-grid-available { display: block; } } /** * Drag and drop into an area with blocks in it */ div.ccm-block-type-drop-zone { height: 2px; border: 2px solid rgba(0,0,0,0.05); .border-radius(2px); margin-bottom: 2px; } div.ccm-block-type-drop-zone.ccm-area-drag-block-type-over { border-color: #0c6; }