/*
@description Covers styling of the WordPress metaboxes that typically appear on page/post edit screens.
@author Dan Suleski
@link http://suleski.name
@version: 1.0.0
*/

/*

SECTION: From WP

*/

#ski_metabox_sample > h3 {
    background-color: firebrick !important;
    color: #eeeeee !important;
}

/*

CLASS: metabox

*/

.mbc {
    margin: 10px 0px;
}

.mb-left {
    display: inline-block;
    vertical-align: top;
    width: 15%;
}

.mb-right {
    display: inline-block;
    width: 85%;
}

.mbc.side .mb-left,
.mbc.side .mb-right {
    display: block;
    margin-bottom: 5px;
    margin-top: 5px;
    width: 100%;
}

/*

CLASS: mb_ctl

*/

.mb-label {
    font-weight: bold;
    margin-bottom: 10px;
    margin-top: 20px;
}

.mb-desc {
    font-style: italic;
}

/*

CLASS: mb_divider_ctl

*/

.mb_divider_ctl {
    border-top: 1px solid silver;
    line-height: 0px;
    margin: 25px 0px;
}

/*

CLASS: mb_media_library_control
@link http://css-tricks.com/text-blocks-over-image/
@link http://www.w3schools.com/css/css_image_transparency.asp

*/

.mbmlc-preview {
    float: left;
    margin-top: 0px;
}

.image-container {
    display: inline-block;
    height: 100px;
    margin: 0px 10px 5px 0px;
    position: relative;
}

.image-container > img {
    max-height: 100%;
}

.image-container > .mbmlc-remove {
    color: firebrick;
    filter: alpha(opacity=50);      /* For IE8 and earlier */
    font-size: 2rem;
    font-weight: bold;
    margin-right: 5px;
    margin-top: 5px;
    opacity: 0.5;
    position: absolute;
    right: 0px;
    top: 0px;
}

.image-container > .mbmlc-remove:hover {
    cursor: pointer;
    opacity: 1.0;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}

.mbmlc-select {
    display: inline-block;
    font-weight: bold;
    height: 100px !important;
    margin: 0px 10px 5px 0px;
    position: relative;
}

/*

CLASS: mb_number_bar_ctl

*/

.mbnbc-slider-container {
    display: inline-block;
    vertical-align: middle;
    width: 60%;
}

.mbnbc-display-min {
    margin-right: 15px;
    text-align: left;
    width: 20%;
}

.mbnbc-display-max {
    margin-left: 15px;
    text-align: right;
    width: 20%;
}

/*

CLASS: mb_radio_text_ctl

*/

.mbrtc-label {
    margin-right: 20px;
}

/*

CLASS: mb_radio_image_ctl

*/

.mbric-label {
    margin-right: 4px;
}

.mbric-value + img {
    border:     5px solid transparent;
    max-height: 50px;
    max-width:  100%;
}

.mbric-value + img:hover {
	-moz-box-shadow: 0px 0px 15px #777;
	-webkit-box-shadow: 0px 0px 15px #777;
	box-shadow: 0px 0px 15px #777;	
}

.mbric-value:checked + img {    
	-moz-box-shadow: 0px 0px 5px #000;
	-webkit-box-shadow: 0px 0px 5px #000;
	box-shadow: 0px 0px 5px #000;
}

.mbric-value {
    display: none !important;
}

/*

CLASS: mb_text_area_ctl

*/

.mbtac-value {
    width: 90%;
}

/*

CLASS: mb_text_notice_ctl

*/

.mb-notice.info {
    padding: 5px 10px;
    border-left: 5px solid #7AD03A;
}

.mb-notice.caution {
    padding: 5px 10px;
    border-left: 5px solid #FFBA00;
}

.mb-notice.fail {
    padding: 5px 10px;
    border-left: 5px solid firebrick;   /* WP red = #DD3D36 */
}

/*

CLASS: mb_textbox_ctl

*/

.mbtc-value {
    width: 90%;
}