/***********************************
############## PANEL ###############
***********************************/

/*PANEL HEADER*/
.panel_header{
    padding: 15px;
    background: #FFF;
    padding-bottom: 8px;
    border-bottom: 1px solid #CCC;
}

.panel_header h1, .panel_header h2, .panel_header h3, .panel_header h4, .panel_header h5, .panel_header h6, .panel_header p{color: #555;}
.panel_header h4, .panel_header h5, .panel_header h6{margin: 8px 0;}

.panel_header > h2 {
    font-size: 1.8em;
    font-weight: normal;
}

.panel_header > p{
    font-size: 0.875em;
    color: #000;
    font-weight: 300;
    margin: 6px 0;
}

.panel_header mark{
    padding: 2px 6px;
}

.panel_header > p.subtitle{
    margin-left: 40px;
}

.panel_header > ul{
    list-style: initial;
    margin: 30px;
    font-size: 0.875em;
    color: #555;
}

.panel_header > ol{
    margin: 30px;
    font-size: 0.875em;
    color: #555;
}

.panel_header > span{
    float: right;
    margin-top: 4px;
}

/* PANEL HEADER DEFAULT WHITE */
.panel_header.default{background: #FFF !important; border-top: 5px solid #EBEBEB !important; border-bottom: 1px solid #EEE !important; color: #555;}
.panel_header.default > h2{font-size: 0.875em; font-weight: 600; color: #333; padding-bottom: 5px;}
.panel_header.default > span{position: relative; right: 0; top: -10px;}

/* PANEL HEADER SUCCESS GREEN */
.panel_header.success{background: linear-gradient(45deg, rgba(0,180,148,1) 0%, rgba(0,128,104,1) 100%) !important; color: #FFF;}
.panel_header.success > h2{font-size: 0.875em; font-weight: 600; color: #FFF; padding-bottom: 5px;}
.panel_header.success > span{position: relative; right: 0; top: -10px;}

/* PANEL HEADER ALERT YELLOW */
.panel_header.alert{background: linear-gradient(45deg, rgba(250,187,61,1) 0%, rgba(238,163,6,1) 100%) !important; color: #FFF;}
.panel_header.alert > h2{font-size: 0.875em; font-weight: 600; color: #FFF; padding-bottom: 5px;}
.panel_header.alert > span{position: relative; right: 0; top: -10px;}

/* PANEL HEADER INFO BLUE */
.panel_header.info{background: linear-gradient(45deg, rgba(14,150,229,1) 0%, rgba(9,99,151,1) 100%) !important; color: #FFF;}
.panel_header.info > h2{font-size: 0.875em; font-weight: 600; color: #FFF; padding-bottom: 5px;}
.panel_header.info > span{position: relative; right: 0; top: -10px;}

/* PANEL HEADER WARNING RED */
.panel_header.warning{background: linear-gradient(45deg, rgba(255,82,79,1) 0%, rgba(198,61,58,1) 100%) !important; color: #FFF;}
.panel_header.warning > h2{font-size: 0.875em; font-weight: 600; color: #FFF; padding-bottom: 5px;}
.panel_header.warning > span{position: relative; right: 0; top: -10px;}

/*PANEL*/
.panel{
    padding: 15px;
    font-weight: 300;
    background: #fff;
    font-size: 0.875em;
}

.panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6, .panel p{color: #555;}
.panel h4, .panel h5, .panel h6{margin: 8px 0;}

.panel h2{
    font-size: 1.8em;
    font-weight: normal;
}

.panel > p{
    font-size: 1em;
    color: #000;
    font-weight: 300;
    margin: 10px 0;
}

.panel mark{
    padding: 2px 6px;
}

.panel > ul{
    list-style: initial;
    margin: 30px;
    font-size: 1em;
    color: #555;
}

.panel > ol{
    margin: 30px;
    font-size: 1em;
    color: #555;
}

.panel > span{
    float: right;
    position: relative;
    right: 0;
    top: -3px;
}

/*PANEL FOOTER*/
.panel_footer{
    padding: 15px;
    border-top: 1px solid #CCC;
    color: #555;
    font-size: 0.75em;
    text-align: right;
    font-weight: 300;
    background: #FFF;
}

.panel_footer_external{
    padding: 15px 0;
    border-top: 1px solid #CCC;
    color: #555;
    font-size: 0.75em;
    text-align: right;
    font-weight: 300;
}

.panel_footer > span, .panel_footer_external > span {
    float: right;
    position: relative;
    top: -3px;
    right: 0;
    padding-left: 10px;
}