/* --------- COMMON STYLES --------- */

html{
    width:99.6%;
    height:100%;
}

body{
    width:100%;
    height:100%;
}

body{
    color: #333;
}

#content{
    width:100%;
    height:100%;
}

.hcal{
    font-size:20px;
    font-family:"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica,  arial, sans-serif;
    background:#fff;
    position:relative;
    margin-top: 10px;
}

.hcal, .hcal > .hcal-header, .hcal > .hcal-body, .hcal > .hcal-body > .hcal-body-row{
    width:100%;
}

/* --------- HEADER RELATED --------- */

.hcal .hcal-header{
    background-color: #F8F8F8;
    height:auto;
    padding-top:15px;
    border-bottom:1px solid #ddd;
    text-align:center;
    margin: 5px 0;
}

.hcal .hcal-header-days{
    font-size:12px;
    height: 24px;
}

.hcal .hcal-header-days, .hcal .hcal-header-dates{
    display:-webkit-flex;
    display:flex;
    border-bottom: 1px solid #d3d3d3;
}

.hcal-header-dates:nth-last-child(1) {
    border-bottom: none;
}

.hcal .hcal-header-dates{
    margin-top:3px;
    height: 38px;
    padding-bottom: 3px;
}

.hcal .hcal-header-date{
    color: #333;
}

.hcal .hcal-header-day, .hcal .hcal-header-date{
    width:15%;
    text-align:center;
}

.hcal .hcal-header-date-inner{
    display:inline-block;
    border-radius:200px;
    background: transparent;
    width:36px;
    height:36px;
    text-align:center;
    padding-top:7px;
}

.hcal .hcal-header-date-inner.hcal-has-clients {
    background: orange;
}

.hcal .hcal-header-date-inner.active{
    background: #337ab7;
    color:#fff;
}

.hcal .hcal-header-date-inner.hcal-has-sessions {
    border-color: green;
    border-width: 1px;
    border-style: solid;
    box-sizing: border-box;
    padding-top: 6px;
}

.hcal .hcal-header-date-inner.hcal-has-bookings:after {
    display: block;
    content: '\25CF';
    font-size: 12px;
    position: relative;
    top: -9px;
}

.hcal.hcal-client .hcal-header-date-inner.hcal-has-bookings:after {
    display: none;
}

.hcal .hcal-header-today{
    margin-top:10px;
    font-size:15px;
}

/* --------- MAIN PART --------- */

.hcal-body .hcal-body-row{
    height: 50px;
}

.hcal-body .hcal-body-row-time{
    margin-top:5px;
    margin-left:30px;
    font-size:12px;
}

.hcal-body .hcal-body-row-hr{
    margin-top:-8px;
    margin-left:70px;
    border:0;
    border-bottom:1px solid #ddd;
}

.hcal .hcal-body-row-item{
    overflow:hidden;
    text-overflow: ellipsis;
    position: relative;
    border-bottom: 1px solid #d3d3d3;
    padding: 2px 5px;
    height:auto;
    cursor: pointer;
}

.hcal .hcal-body-row-item .hcal-item-time {
    font-size: 12px;
    width: 70px;
    height: 100%;
    vertical-align: middle;
    padding-right: 10px;
    border-right: 5px solid;
    float: left;
    position: relative;
    margin-right: 10px;
}

.hcal .hcal-body-row-item .hcal-item-time-orange {
    border-color: orange;
}

.hcal .hcal-body-row-item .hcal-item-time-darkgreen {
    border-color: darkgreen;
}

.hcal .hcal-body-row-item .hcal-item-time-lightgreen {
    border-color: lightgreen;
}

.hcal .hcal-body-row-item .hcal-item-time-gray {
    border-color: gray;
}


.hcal .hcal-body-row-item .hcal-item-time .start, .hcal .hcal-body-row-item .hcal-item-time .end {
    display: block;
    text-align: right;
}

.hcal .hcal-body-row-item .hcal-item-time .start {
    font-weight: bold;
}

.hcal .hcal-body-row-item .hcal-item-time .end {
    opacity: 0.8;
}

.hcal .hcal-body-row-item .hcal-item-text {
    float: none;
    display: inline;
    padding: 3px 0;
    font-size: 14px;
    position: relative;
    color: #000;
}

.hcal-current-day {
    text-align: center;
}

.hcal .hcal-btn-info {
    margin-left: 10px;
}