/**
 * CSS for Social Locker Statistics
 * 
 * @author Paul Kashtanoff <paul@byonepress.com>
 * @copyright (c) 2013, OnePress Ltd
 * 
 * @package sociallocker 
 * @since 1.0.0
 */

/** 
* Chart Area
*/ 

#onp-sl-chart-area {
    background-color: #fff;
    padding: 0 20px;
    border-top: 1px solid #e5e5e5;
    border-bottom: 2px solid #e5e5e5;
    margin-top: 10px;
}
.factory-volumetric #onp-sl-chart-area {
    border-bottom: 1px solid #e5e5e5;
    padding: 0;
}
#onp-sl-settings-bar {
    height: 55px;
    padding-top: 10px;
    margin-top: 10px;
    -webkit-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#onp-sl-settings-bar  .btn {
    padding: 3px 10px 4px 10px;
}
.factory-volumetric #onp-sl-settings-bar  .btn {
    padding: 3px 8px;
}

/* Type Select */

#onp-sl-type-select {
    float: left;
    white-space: nowrap;
    border: 0px;
    position: relative;
    top: -6px;
}
#onp-sl-type-select .fa {
    font-size: 14px;
    margin-right: 3px;
}
#onp-sl-type-select > * {
    display: inline-block;
}

/* Date Select */

#onp-sl-date-select {
    float: right;
}
#onp-sl-date-select > * {
    display: inline-block; 
    vertical-align: top;
}
.onp-sl-range-label {
    position: relative;
    margin-right: 8px;
    top: 4px;
}
.factory-volumetric .onp-sl-range-label {
    top: 7px;
}
#onp-sl-date-start, #onp-sl-date-end {
    width: 120px;
    height: 28px;
}
#onp-sl-apply-dates {
    margin-left: 5px;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 13px;
}
#onp-sl-apply-dates .fa {
    margin-right: 3px;
    position: relative;
    top: 1px;
}
.chart-wrap {
    margin-bottom: 20px;
    margin-top: 20px;
}

/**
* Charts selector
*/

#onp-sl-chart-selector {
    padding-top: 15px;
    padding-bottom: 15px;
}
#onp-sl-chart-selector .onp-sl-chart-item {
    display: inline-block;
    clear: both;
    cursor: pointer;
    padding: 7px;
    border-radius: 3px;
    color: #d0d0d0;
}
#onp-sl-chart-selector .onp-sl-chart-item.active {
    color: #111;
}
#onp-sl-chart-selector .onp-sl-chart-item:hover
{ 
    background-color: #f9f9f9;
}
#onp-sl-chart-selector .onp-sl-chart-item + .onp-sl-chart-item {
    margin-left: 15px;
}
#onp-sl-chart-selector .chart-color {
    width: 15px;
    height: 15px;
    float: left;
    background-color: #e5e5e5;
    margin-right: 5px;
    top: 2px;
    position: relative;
}
#onp-sl-chart-selector .active.facebook-like .chart-color {
    background-color: #7089be;
}
#onp-sl-chart-selector .active.facebook-share .chart-color {
    background-color: #566a93;
}
#onp-sl-chart-selector .active.twitter-tweet .chart-color {
    background-color: #3ab9e9;
}
#onp-sl-chart-selector .active.twitter-follow .chart-color {
    background-color: #1c95c3;
}
#onp-sl-chart-selector .active.google-plus .chart-color {
    background-color: #e26f61;
}
#onp-sl-chart-selector .active.google-share .chart-color {
    background-color: #ba5145;
}
#onp-sl-chart-selector .active.linkedin-share .chart-color {
    background-color: #006080;
}
#onp-sl-chart-selector .active.vk-like .chart-color {
    background-color: #517296;
}
#onp-sl-chart-selector .active.vk-subscribe .chart-color {
    background-color: #517296;
}
#onp-sl-chart-selector .active.ok-klass .chart-color {
    background-color: #f3800d;
}

/**
* Posts
*/

#onp-sl-posts-wrap {
    background: #f6f6f6;
}
#onp-sl-pagination-wrap {
    text-align: right;
}
#onp-sl-posts-wrap .pagination {
    margin-bottom: 0px;
    text-align: right;
}
#onp-sl-posts {
    background-color: #fff;
    width: 100%;
    padding: 0px;
    border-collapse: collapse;
    border-top: 1px solid #e5e5e5;
    border-bottom: 2px solid #e5e5e5;
}
.factory-volumetric #onp-sl-posts {
    border-bottom: 1px solid #e5e5e5;
}
#onp-sl-posts th {
    text-align: left;
    padding: 8px 10px 8px 6px;
    font-family: Arial, Helvetica, Geneva, sans-serif;
    font-size: 11px;
    font-weight: bold;
    text-align: right;
}
#onp-sl-posts td {
    text-align: right;
    font-family: Arial, Helvetica, Geneva, sans-serif;
    font-size: 13px;
}
#onp-sl-posts td,
#onp-sl-posts th {
    padding: 9px 20px;
}
#onp-sl-posts tbody tr {

    border-bottom: 1px solid #eee;
    border-top: 1px solid #eee;
}
#onp-sl-posts tbody tr:nth-child(odd) {
    background-color: #f9f9f9;
}
#onp-sl-posts .col-index {
    width: 1%;
}
#onp-sl-posts .col-number {
    width: 100px;
}
#onp-sl-posts .col-title {
    text-align: left;
}
#onp-sl-posts .col-title a {
    text-decoration: none;
}
#onp-sl-posts .col-title a:hover {
    text-decoration: underline;
}

#onp-sl-posts th.col-total,
#onp-sl-posts td.col-total {
    background-color: #f9f9f9;
    font-weight: bold;  
}
#onp-sl-posts tr:nth-child(odd) td.col-total {
    background-color: #f5f5f5;
}

