/************************************************ * the handles to where you can drag the blocks * ************************************************/ .block-target { padding: 2px; background: #81FF9B; margin-bottom: 5px; opacity: 0.8; visibility: hidden; height: 0; font-size: 20px; font-weight: bold; color: white; text-align: center; } .block-target-hover { border: 1px solid #000; box-shadow: 0 0 15px #888 inset; opacity: 1; } .shadow .block-target-hover, .shadow .block-target-active { visibility: visible; height: 30px; } /************************************************ * block store styles ************************************************/ #block-store #block-store-filter { float: right; margin-bottom: 8px; } #block-store #block-types { clear: both; } #block-store { display: none; } #content #block-store .block-type { position: relative; border: 0px solid #AAA; margin: 4px 0; padding: 0; text-align: center; height: auto; float: none; display: inline-block; overflow: hidden; width: 112px; cursor: move; vertical-align: top; } #block-store .block-type:hover { box-shadow: 0px 0px 0px 2px #FFF, 0px 0px 0px 2px #FFF, 0px 0px 10px rgba(0,0,0,0.6); outline: none; } #block-store .block-type:hover .button-bar { display: inline; } #block-store .button-bar { margin: 0; display: none; position: absolute; right: 0%; border: 0px solid #AAA; margin: 0px; padding: 0px; } #block-store .button-bar .icon-help { font-size: 0; width: 0; } #block-store .block-type .block-type-icon { margin-right: auto; margin-left: auto; } #block-store-draggables .block-type, #block-store-draggables .block, #block-store-draggables .block-type-icon, #block-store-draggables .ui-draggable-dragging { display: inline-block; height: auto; z-index: 100; } #block-store-draggables .block-type .button-bar { visibility: hidden; } #box-organizer.shadow .block { opacity: 0.2; } #box-organizer.shadow .ui-draggable-dragging { opacity: 1; border: 5px solid red; box-shadow: 0px 0px 10px 2px red, inset 0px 0px 10px 2px red; } #box-organizer .block { transition: opacity 0.3s ease-in-out; } /************************************************ * block info styles ************************************************/ #block-info-container { width: 770px; padding: 15px; color: #444; } #block-info-container #block-info-icon { float: left; padding-right: 10px; } #block-info-container #block-info-header { float: left; } #block-info-container #block-info-header .block-type-icon{ float: left; } #block-info-container #block-info-header h1 { margin: 0; font-weight: normal; font-family: "Arial Black", Liberation Sans, Arial, sans-serif; margin-left: 5px; white-space: nowrap; } #block-info-container #block-info-header p{ margin-left: 55px; } #block-info-container h2 { margin: 0; margin-top: 10px; font-weight: normal; font-family: "Arial Black", Liberation Sans, Arial, sans-serif; } #block-info-container p { margin: 0; } #block-info-images { clear: both; overflow-x: auto; padding-top: 15px; } #block-info-images ul{ margin: 0px; padding: 0px; } #block-info-images li{ list-style: none; display: inline; } #block-info-description { margin-top: 20px; }