/*
Scheme: Planyo Default
Description: Desktop Calendar Stylesheet
*/


/*
CSS STRUCTURE:

1. GENERAL 
        - Google font import & General Style

2. GENERAL CALENDAR STYLES  
        - General
        - Previous/Next icon + text
        - Calendar info legend
        - Seasons

3. DROP-DOWN CALENDAR
4. BIG CALENDAR    
5. UPCOMING CALENDAR
*/

/*==============================================*/
/* 1. GENERAL */
/*==============================================*/

/*------------------------------------*/
/* Google font import & General Style */
/*------------------------------------*/ 
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700);
.planyo {
    -webkit-font-smoothing: antialiased;
}
.planyo, body{
    margin:0px;
    padding:0px;
}
/* Links 
===================================*/
#calendar_nav a,#horizontal_calendar a,#calendarbig a{
    text-decoration: none;
    color:#303030;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
}
/* Typography
===================================*/


/* Logo
===================================*/

/*===============================================*/
/* 2. GENERAL CALENDAR STYLES                    */
/*===============================================*/
#horizontal_calendar .available {
    background: #f9f9f9;
}
#horizontal_calendar .unavailable {
    background: #f56c4e;
}
#horizontal_calendar .reserved {
    background: #f56c4e;
}
#cal{
    font-family: 'Open Sans', sans-serif;
    clear: both;
    border-collapse: collapse;	
    width: 100%;
    border: 1px solid #EAEAEA;
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2) inset, 0px 0px rgba(0, 0, 0, 0.1) inset, 0px 2px rgba(0, 0,0, 0) inset, 0px 0px 1px rgba(0, 0, 0, 0.1);
}
#cal caption{
    padding-bottom: 8px;
    overflow:hidden;
}

#cal caption .earlier{
    float: left;
}

#cal caption .later, #cal caption .nav_today, #cal caption .switch_mode{
    float: left;
    margin-left:10px;
}

#cal tr.days th{
    font:14px/20px 'Open Sans', sans-serif;
    background: #444444;
    padding: 8px 2px;
    color:white;
    text-align: left;
    border: 1px solid #444444;
}

#cal tr.hours.hours1 th {
    font-size: medium; 
    font-weight: 100; 
    padding: 1pt; 
    background: #444444;
    color:white;
}


#cal tr.hours th{
    border-bottom: 1px solid #EAEAEA;

}

#cal tr.hours2 {}

#cal tr.hours th,#cal tr.hours2 th{
    min-width: 16px;
    padding: 2px 0;
    background: #f6f6f6;
    font-size: 11px;
    text-align: center;
    font-weight: 100;
}

#cal td{
    border: 1px solid #F8F8F8;
    font-size: 10px;
    text-align: center;
    background:white;
}

#cal td.with_pad {
    padding:3px;
}

#cal td:hover{
    background: #303030;
    color: white;
    cursor: pointer;
}

#cal .resource{
    width: 16em;
    padding: 0px 4px;
    font-size: 12px;
    text-align: left;
}

#cal .day {
    padding: .2em;
    font-size: 14px;
    text-align: left;
    white-space:nowrap;
}

#cal .day:hover, #cal td.nohover:hover {
    color: black;
    background: none;
    cursor: auto;
}

#cal .resource:hover {
    background: transparent;
}

#cal td.reserved{
    background: #f56c4e;
    font: bold 14px Tahoma, Verdana, Arial, sans-serif;
    cursor: auto;
    color:#444444;
}

#cal td.no_start:hover{
    background: transparent;
    cursor:default;
    color:black;
}

#cal td.arrival_day, .cal_legend_arrival2{
    background:#f9f9f9;
}

#cal td.morning_av{
    background-image: url(https://www.planyo.com/images/diagonal4.png);
    background-repeat: no-repeat;
}

#cal td.first_day {
    border-left:2px solid red;
}

#cal td.morning_occ{
    background-image: url(https://www.planyo.com/images/diagonal3.png);
    background-repeat: no-repeat;
}

#cal td.partial,
#cal td.partial2{color: #444444;font: normal 14px Tahoma, Verdana, Arial, sans-serif;background: #f9f9f9;}

#cal td.partial:hover,
#cal td.partial2:hover{
    color: white;
}
#cal_legend_info{
    font-family: 'Open Sans', sans-serif;
    clear: both;
    float: left;
    margin-top: 15px;
    overflow:hidden;
}
/*------------------------------------*/
/* Previous/Next icon + text          */
/*------------------------------------*/ 
#calendar_nav{display:inline-block;}
.upcoming a.earlier,#calendar_nav a.earlier{
    float:left;
    background: transparent url("http://www.letolab.nl/letolab/wp-content/uploads/2016/03/left-arr.png") no-repeat center left;

    padding-left: 20px;
    text-transform: uppercase;
}
.upcoming a.later,#calendar_nav a.later {
    float:right;
    background: transparent url("http://www.letolab.nl/letolab/wp-content/uploads/2016/03/right-arr.png") no-repeat center right;

    padding-right: 25px;
    text-transform: uppercase;
}
#calendar_nav a.later{
      margin-right: 15px;
}
.upcoming .av_nav {
    margin: 15px 0px;
    text-align:center;
    text-align: -webkit-center;
    width: 100%;
}
/*------------------------------------*/
/* Calendar info legend */
/*------------------------------------*/ 

.cal_legend {
    display:none;border: 1px solid #F8F8F8;width:14px;text-align: center;padding:1px;font-size:10px;background-color:white;float:left;overflow:hidden;
}
.legend_and_icon{
    float:left;
}
.cal_legend_av{
    background: #f9f9f9;
}

.cal_legend_pages {
    text-align:right;font-size:10px;padding:6px;
}

.cal_legend_text {font-size:12px;float:left;padding:3px 5px 1px 5px;margin-right: 5px;height:18px;}

#legend_av_txt,#cal_legend_partav_2,#legend_avqty_txt{background: #f9f9f9;}
#legend_unav_txt,#legend_res_txt{background: #f56c4e; color: #e2e2e2;}
#legend_stdate_txt{background:#f9f9f9;}
#legend_mornav_txt{  background: url(https://www.planyo.com/images/diagonal2nox.png);
  background-repeat: no-repeat;
  background-color: #f56c4e;}
#legend_mornocc_txt  {background: url(https://www.planyo.com/images/diagonal1nox.png);
  background-repeat: no-repeat;
  background-color: #f9f9f9;  }
.cal_legend_arrival, .cal_legend_arrival_nox {
    font-weight:bold;
}

.cal_legend_partav {
    color:black;
    font-weight:normal;
    background: #f9f9f9;
}

.cal_legend_morning_av{
    background: url(https://www.planyo.com/images/diagonal2.png);
    background-repeat: no-repeat;
    font-size:10px;
    color:red;
    font-weight:bold;
}

.cal_legend_morning_av_nox{
    background: url(https://www.planyo.com/images/diagonal2nox.png);
    background-repeat: no-repeat;
    background-color: #f56c4e;
    color:#e2e2e2;
}

.cal_legend_morning_occ_nox{
    background: url(https://www.planyo.com/images/diagonal1nox.png);
    background-repeat: no-repeat;
    background-color: #f9f9f9 ;
}

.cal_legend_av_nox, .cal_legend_arrival_nox {
    background:#f9f9f9 ;color:black;}

.cal_legend_unav_nox {
    background:#e8e8e8;color:black;}

.cal_legend_res_nox {
    background:#f56c4e;color:#e2e2e2;}

#legend_res.cal_legend_res{display:inline-block;
                           background:#f56c4e;font: bold 12px Tahoma, Verdana, Arial, sans-serif;padding: 3px 0px 1px 5px;border:none;height:18px;}

#legend_partres.cal_legend_partav{display:inline-block;
                                  font: normal 14px Tahoma, Verdana, Arial, sans-serif;padding: 1px 0px 3px 5px;border:none;height:18px;}
.cal_legend_morning_occ{
    background: url(https://www.planyo.com/images/diagonal1.png);
    background-repeat: no-repeat;}

.cal_legend_morning_av2
{
    background: url(https://www.planyo.com/images/diagonal4.png);
    background-repeat: no-repeat;
    background-color: #e8e8e8;
    color:red;
    font-weight:bold;
}

.cal_legend_morning_occ2
{
    background: url(https://www.planyo.com/images/diagonal3.png);
    background-repeat: no-repeat;
}

.cal_legend_unav {
    background:white;color:red;font-weight:bold;font-size:10px;
}

.cal_legend_res {
    background: #f56c4e;font-weight:bold;font-size:12px;
}
/*------------------------------------*/
/* Seasons                            */
/*------------------------------------*/ 

#cal td.cuscol_33FF33, #calendar_nav td.cuscol_33FF33 {
    border-bottom:3px solid #33FF33;
}

#cal td.cuscol_A8314F, #calendar_nav td.cuscol_A8314F {
    border-bottom:3px solid #A8314F;
}

#cal td.cuscol_yellow, #calendar_nav td.cuscol_yellow {
    border-bottom:3px solid yellow;
}

#cal td.cuscol_81FCF6, #calendar_nav td.cuscol_81FCF6 {
    border-bottom:3px solid #81FCF6;
}

#cal td.cuscol_FFBAF1, #calendar_nav td.cuscol_FFBAF1 {
    border-bottom:3px solid #FFBAF1;
}

#cal td.cuscol_999999, #calendar_nav td.cuscol_999999 {
    border-bottom:3px solid #999999;
}

#cal td.cuscol_B84DFF, #calendar_nav td.cuscol_B84DFF {
    border-bottom:3px solid #B84DFF;
}

#cal td.cuscol_4D4DFF, #calendar_nav td.cuscol_4D4DFF {
    border-bottom:3px solid #4D4DFF;
}

#cal td.cuscol_DADAD2, #calendar_nav td.cuscol_DADAD2 {
    border-bottom:3px solid #DADAD2;
}
#cal td.cuscol_ECDC81, #calendar_nav td.cuscol_ECDC81 {
    border-bottom:3px solid #ECDC81;
}
#cal td.cuscol_CEF0FF, #calendar_nav td.cuscol_CEF0FF {
    border-bottom:3px solid #CEF0FF;
}
#cal td.cuscol_D1FFB3, #calendar_nav td.cuscol_D1FFB3 {
    border-bottom:3px solid #D1FFB3;
}
#cal td.cuscol_FFA4A4, #calendar_nav td.cuscol_FFA4A4 {
    border-bottom:3px solid #FFA4A4;
}
#cal td.resclickable {cursor:pointer}
/*------------------------------------*/
/*Messages,Error,Help                 */
/*------------------------------------*/ 
.warning {
    color: orange;
}
/*===============================================*/
/* 3. DROP-DOWN CALENDAR                             */
/*===============================================*/
.calpicker {
    font: normal 13px/20px 'Raleway',Tahoma, Verdana, Arial, sans-serif;
    margin: 0;
    line-height:100%;
    clear:both;
    border: 1px solid #444444;
    border-collapse: collapse;
    background-color:white;
    width: 140px;
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2) inset, 0px 0px rgba(0, 0, 0, 0.1) inset, 0px 2px rgba(0, 0,0, 0) inset, 0px 0px 1px rgba(0, 0, 0, 0.1);
}

.calpicker th {
    font: normal 14px/20px Tahoma, Verdana, Arial, sans-serif;
    color: white;   
    padding: 2px;
    border-bottom: 1px;
    text-shadow: 0px -1px rgba(0, 0, 0, 0.3);
    background: #444444;	
}

.calpicker .nocuscol{
    padding:5px;
}
.calpicker .active_day {
    background: #bbbbbb;
    color:white;
}

.calpicker .reserved {
    color: red;
    font-weight: bold;
}
.picker_unav_h {
    background-color:#f56c4e;
}
.calpicker .reserved:hover {
    cursor:auto;
    background:white;
    color:red;
}

.calpicker .cur_month_day {
    background: white;
    color:#555;
}

.calpicker .ext_month_day {
    background: #ffffff;
    color: #c5c5c5;
}

.calpicker .reserved_nox_u
{
    background:#e8e8e8;
}

.calpicker .reserved_nox
{
    background:#f56c4e;
    color: #e2e2e2;;
}

.calpicker .reserved_nox:hover
{
    cursor:auto;
    background:#f56c4e;
    color: #e2e2e2;
}

.calpicker .reserved_nox_u:hover
{
    cursor:auto;
    background:#e8e8e8;
}

.calpicker .cur_month_day_nox
{
    background: #f9f9f9;
}

.calpicker .active_day_nox
{
    background: #cfdfd0;
    color: white;
    background: #303030;
}

.calpicker .ext_month_day_nox
{
    background: #f9f9f9;
    color:#e2e2e2;
}

.calpicker .ext_month_day_nox_u
{
    background:#e8e8e8;
    color:#a0a0a0;
}

.calpicker .ext_month_day_nox_r
{
    background:#f56c4e;
    color:#e2e2e2;
}

.calpicker .ext_month_day_nox_r:hover
{
    cursor:auto;
    background:#f56c4e;
    color: #e2e2e2; 
}

.calpicker .ext_month_day_nox_u:hover
{
    cursor:auto;
    background:#e8e8e8;
}

.calpicker .ext_month_day_nox:hover
{
    cursor:auto;
    background:#f9f9f9;
}

.calpicker td.morning_av_nox,.calpicker td.morning_av_nox:hover
{
    background: url(https://www.planyo.com/images/diagonal2nox.png);
    background-repeat: no-repeat;
    background-color: #f56c4e;
}
.calpicker .ext_month_day:hover{
    background-color: #303030;
    color: #c5c5c5;
}

.calpicker td.morning_occ_nox
{
    background: url(https://www.planyo.com/images/diagonal1nox.png);
    background-repeat: no-repeat;
    background-color: #f9f9f9;
}

.calpicker td:hover {
    background:#303030;
    color: white;
    cursor: pointer;
}

.calpicker td {
    border: 1px solid #EAEAEA;
    vertical-align: top;
    text-align: center;
    padding: 4px 5px;
}

.calpicker caption {
    padding:4px 2px;
    background-color:white;
    border-top:1px solid #EAEAEA;
    overflow:hidden;
    font: normal 13px 'Open Sans', sans-serif;
    color:black;
}

.calpicker caption .nav {
    float:left;
    padding-right:3px;
    color: #303030;
    text-decoration: none;
    margin-bottom:0px;
}
/*============================================*/
/* 4. BIG CALENDAR                            */
/*============================================*/
#calendarbig{
    font: 14px/20px 'Open Sans', sans-serif;
    clear:both;
    border: 1px solid #EAEAEA;
    border-collapse: collapse;
}

#calendarbig th{
    font-weight: normal;
    background: #444444;
    padding: 8px 2px;
    color: white;
    border: 1px solid #444444;
}

#calendarbig .mv_head_active_day{
    background: #bbbbbb;
    font-weight:bold;
}

#calendarbig .mv_head_cur_month_day{}

#calendarbig .mv_head_ext_month_day{}

#calendarbig .mv_head_cur_month_day,#calendarbig .mv_head_active_day,#calendarbig .mv_head_ext_month_day
{
    padding: 2px 2px;
    text-align: right;
}

#calendarbig td
{
    border: 1px solid #F8F8F8;
    vertical-align: top;
    text-align: center;
    height: 63px;
    width: 133px;
}

#day_contents td {min-width:50px;}
#week_contents #calendarbig th{
    min-width: 90px;}
#weeks_contents #calendarbig td,#weeks_contents div.item_code {width:40px;}
#weeks_contents #calendarbig td.resource {width:96px;}
#week_legend {margin-top:20px;}

#calendarbig .week_td, #calendarbig .day_td
{
    height:36px;
    vertical-align:middle;
}

#calendarbig caption
{
    padding: 8px 0 8px 0;
    overflow: hidden;
    white-space: nowrap; 
}

#calendarbig caption .nav
{
    float:left;
    padding-right:1em;
}

#calendarbig caption .mid
{
    margin:0 auto;
    font-weight:bold;
    text-transform: uppercase;
    font-size: medium;
    color: #444;
}

#calendarbig caption .scope
{
    float: right;
    padding-left:1em;
}

#calendarbig .mv_cnt
{
}

#calendarbig .item_code
{
    padding:2px;
}
#calendarbig .invisible{
    display:none;
}
#calendarbig .vacation, #week_legend .vac_class
{
    background-color:#ffd699;
    width:100%;
}
#calendarbig .unav_box {background-color:#f56c4e;}
#calendarbig .av_box {background-color:#f9f9f9;}

/*===============================================*/
/* 5. UPCOMING CALENDAR                             */
/*===============================================*/
.upcoming {
    font: 14px/20px 'Open Sans', sans-serif;
    display:inline-block;
    width:100%;
}

.upcoming .av_day_group {clear:both;}

.upcoming .av_month {
    font-weight:bold;
    text-transform: uppercase;
    font-size: medium;
    color: #444;
}

.upcoming .av_day_group .av_date {
    padding: 6pt 0pt;
    font-size: medium;
    float:left;
}

.upcoming .av_day_group .av_res {
    float:left;
    clear:left;
    color: grey;
    padding: 4px 0px 2px 0px;
    font-size: medium;
    margin: 4pt 4pt 2pt 0pt;
}

.upcoming .av_day_group .av_time.av_time_day, .result_range {
    font-size: medium;
    min-width: 71pt;
    color: #333;
    padding: 3pt 5pt;
    margin: 4pt 0pt 2pt 0pt;
    text-align: center;
    background-color: #f9f9f9;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}
.upcoming .av_day_group .av_time.av_time_h,.upcoming .unav_txt.unav_txt_h{
    float: right;
    clear:right;
    font-size: medium;
    min-width: 90pt;
    color: #333;
    padding: 3pt 5pt;
    margin: 4pt 0pt 2pt 0pt;
    text-align: center;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}
.upcoming .av_day_group .av_time.av_time_h{
    background-color: #f9f9f9;
}
.upcoming .unav_txt.unav_txt_d,.upcoming .unav_txt.unav_txt_h{
    background-color: #f56c4e;
}
.upcoming .av_day_group .unav_txt.unav_txt_d{
    min-width:100%;
    padding: 3pt 0pt;
}
.result_ranges {
    clear:both;
    display:block;
    margin-left:-3px;
}

.upcoming .av_day_group .av_time:hover {
    text-decoration: none;
    color: #303030;
    cursor: pointer;
}

#demo_info
{
    margin-top:2px;
    padding:2px;
    font-size: 11px;
    font-style: italic;
    color:#444444;
}

.stdtable
{
    clear:both;
    border-collapse:collapse;
    border: 1px solid #c0c0c0;
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2) inset, 0px 0px rgba(0, 0, 0, 0.1) inset, 0px 2px rgba(0, 0,0, 0) inset, 0px 0px 1px rgba(0, 0, 0, 0.1);
}

.stdtable td
{
    border: 1px solid #c0c0c0;
    font-size: 12px;
    text-align: left;
    padding:2px 5px 2px 5px;
}

.stdtable th
{
    background: #f0f0f0;
    padding: 2px 5px 2px 5px;
    font-size: 12px;
    text-align: left;
}

#bg_hider .buttons
{
    padding: 8px;
}

/* START FLEXIBLE MULTI-VIEW CALENDAR */
.cp_calendar .vacation {background-color:#707070;border-color:#707070;}
.page.pg_schedule_php .page_contents {width:98%;}
.fc-cust3Week-view .fc-sat,.fc-cust3Week-view .fc-sun {background-color:#fcf8e3;}
.cp_calendar .fc-today {background:rgba(255, 255, 204, 0.46);}
.fc-center h2 {
    color: #777;
    font-weight: 400;
    line-height: 1.471;
    font-size: 20px;
}
th.fc-widget-header {
    line-height: 1.47em;
    color: #777;
	font-weight:500;
}
.cp_calendar.fc button {
    padding: 6px 12px;
    border-color: #357ebd;
    font-weight: normal;
    color: #fff;
    background-color: #428bca;
    font-size: 13px;
    background-image: none;
    height: initial;
    text-shadow: none;
    box-shadow: none;
    background-repeat: no-repeat;
}
.cp_calendar.fc button.fc-state-hover {
    background-color: #253340;
    color: #FFF;
}
.cp_calendar.fc button.fc-state-active {
    background-color: #253340;
    color: #FFF;
}
.fc-rows td.fc-widget-content>div,.fc-resource-area tbody tr td.fc-widget-content>div{min-height:30px!important;height:auto!important;}
.fc-body .fc-resource-area .fc-cell-content { padding-top: 2px!important;}
.fc-bgevent.oc_all{background-color: #d9534f!important;
    opacity: 0.75!important;}
.fc-bgevent.oc_all:hover{cursor:initial;}
.fc-bgevent,.fc-highlight{opacity:.6!important;}
.fc-highlight{background:#428bca!important;}
a.fc-day-grid-event.ev_av:hover,.fc-list-item.ev_av:hover{cursor:pointer;}
.fc-cust3Day-view colgroup col{width:30px!important;}
.fc-cust3Day-view th.fc-widget-header{font-size:10px;}
.cp_units_60 .fc-custDay-view th.fc-widget-header{font-size:10px;}
td.fc-resource-area.fc-widget-header th.fc-widget-header{font-size:15px;}
.oc_part{background-color: transparent!important;    text-align: center;color: black;padding-top: 3px;}
    
.oc_part.oc_10{ background-color: #f9f0f0!important;background: linear-gradient(0deg, #f0c2c2 10%, transparent 15%);}
.oc_part.oc_20{ background-color: #f9f0f0!important;background: linear-gradient(0deg, #f0c2c2 20%, transparent 25%);}
.oc_part.oc_30{background-color: #f9f0f0!important; background: linear-gradient(0deg, #f0c2c2 30%, transparent 35%);}
.oc_part.oc_40{ background-color: #f9f0f0!important;background: linear-gradient(0deg, #f0c2c2 40%, transparent 45%);}
.oc_part.oc_50{background-color: #f9f0f0!important; background: linear-gradient(0deg, #f0c2c2 50%, transparent 55%);}
.oc_part.oc_60{background-color: #f9f0f0!important; background: linear-gradient(0deg, #f0c2c2 60%, transparent 65%);}
.oc_part.oc_70{background-color: #f9f0f0!important; background: linear-gradient(0deg, #f0c2c2 70%, transparent 75%);}
.oc_part.oc_80{ background-color: #f9f0f0!important;background: linear-gradient(0deg, #f0c2c2 80%, transparent 85%);}
.oc_part.oc_90{ background-color: #f9f0f0!important;background: linear-gradient(0deg, #f0c2c2 90%, transparent 95%);}
.fc-day-grid-event .fc-content{white-space:normal!important;}
.ev_all .fc-event-dot{background-color:#f0c2c2!important;}
.ev_all{color:#bbb;}
a.fc-day-grid-event.ev_all{    background-color: #bbb!important;border: 1px solid #bbb;}

/* END FLEXIBLE MULTI-VIEW CALENDAR  */