/**
 * Created by PhpStorm.
 * User: Michael
 * Date: 2/06/2015
 * Time: 13:17
 */

/**visibility: hidden;**/
.my_plugin_hidden {
    display: none !important;
}

/**close me for small 'x' buttons **/
.my_plugin_close_me{
    float: right !important;
    color: #999999 !important;
    padding: 5px !important;
    width: 30px !important;
    height: 30px !important;
}

.my_plugin_logo img {
    padding: 5px;
    float: left;
    max-width: 50px;
    max-height: 50px;
}

.my_plugin_image-select_preview {
    resize: both;
    overflow: auto;
    border: 1px solid #cccccc;
    padding: 20px;
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    background-size: cover;
    box-shadow: 5px 5px 5px #888888;
}
.my_plugin_about-page {
    border: 1px solid #cccccc;
    padding: 20px;
    box-shadow: 5px 5px 5px #888888;
}
.my_plugin_clear_button {
    padding: 5px;
}
.my_plugin_input_form{
    display: inline!important;
}
.my_plugin_input_form_button{
    padding: 5px;
}
.my_plugin_label{
    display: inline;
    vertical-align: middle;
}

.my_plugin_public-admin-notice {
    float: right;
    border: 5px solid red;
}
/* Overlay for the select list - grey over background */
#my_plugin_dashicon-select_overlay,
#my_plugin_glyphicon-select_overlay{
    visibility: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
    width:100%;
    height:100%;
    text-align:center;
    z-index: 1000;
    background-color: rgba(224, 224, 224, 0.5);
}

/* Select list within the overlay */
#my_plugin_dashicon-select_overlay #my_plugin_dashicon-select_list,
#my_plugin_glyphicon-select_overlay #my_plugin_glyphicon-select_list{
    width:80%;
    margin: 100px auto;
    background-color: #fff;
    border:1px solid #000;
    padding:15px;
    text-align:center;
    opacity: 1;
}
/* Format for each dashicon */
#my_plugin_dashicon-select_list .dashicons,
#my_plugin_glyphicon-select_list .glyphicon{
    position: relative;
    box-sizing: content-box;
    padding: 0px 0px 10px;
    width: 40px;
    height: 40px;
    overflow: hidden;
    white-space: nowrap;
    font-size: 40px;
    line-height: 1;
    margin-right: 40px;
    content: '';
}
/* Dashicon preview */
.my_plugin_dashicon-select_preview,
.my_plugin_glyphicon-select_preview {

    border: 1px solid #cccccc;
    padding: 5px;
    width: 40px;
    height: 40px;
    box-shadow: 5px 5px 5px #888888;
    display: block;
    font-size: 40px;
    horiz-align: center;
}
/* Shows the alt text code for each dashicon - e.g. f333 */
#my_plugin_dashicon-select_list .dashicons::after,
#my_plugin_glyphicon-select_list .glyphicon::after {
    content: attr(alt);
    display: block;
    font-size: 9px;
    color: #999;
    text-align: center;
}