The Foxes Den - Booking Calendar CSS

/*******************************************************************************/

/*  The Foxes Den   -   C O L O R    S K I N          ****************************/

/*******************************************************************************/

/* For better compatibility, please change here only folowing properties:      */

/*

*        background , background-color, background-repeat, background-image,  background-repeat, background-position

*        border

*        box-shadow, -moz-box-shadow, -webkit-box-shadow

*        border-radius, -moz-border-radius, -webkit-border-radius

*        color

*        font-weight

*        text-shadow

*        text-transform

*

*/

/* Full Calendar Frame */

.datepick-inline {

}

/* Background of one calendar month */

.datepick-inline .datepick{

  background:  transparent;

}

/* Previous & Next links  and TITLE BACKGROUND */

.datepick-inline .calendar-links {

  background-color: #2d1616;

}

/* Prev - Next Text */

.datepick-inline .calendar-links .datepick-prev a,

.datepick-inline .calendar-links .datepick-next a,

.datepick-inline .calendar-links .datepick-prev a:hover,

.datepick-inline .calendar-links .datepick-next a:hover{

    color: #e0cd81;

    font-weight: bold;

}

/* Month Titles */

.datepick-inline .datepick-header {

	font-size: 21px;

  color: #e0cd81;

  font-weight: bold;

}

/* Week Titles */

div.datepick-inline .datepick-title-row th{

	font-size: 18px;

    color: #2d1616;

    font-weight: bold;

    text-transform: uppercase;

}

/* Cell border*/

.block_hints .block_free, .block_hints .block_time, .block_hints .block_booked, .block_hints .block_pending, .block_hints .block_check_in_out,

.datepick-inline .datepick-days-cell{

	font-size: 18px;

	font-weight: bold;

    color:#a9964c;

}

/*  Dates Cells       **********************************************************/

/*******************************************************************************/

/* A V A I L A B L E - BACKGROUND */

.block_hints .block_free,

.block_hints .block_time,

.block_hints .block_check_in_out div.check-in-div,                             /* Item  for the LEGEND */

.block_hints .block_check_in_out div.check-out-div,                             /* Item  for the LEGEND */

.datepick-inline .date_available,

.datepick-inline .timespartly.check_in_time div.check-in-div,                   /* Define the COLOR fot the check  in / out times the same as available*/

.datepick-inline .timespartly.check_out_time div.check-out-div {

  background: none repeat scroll 0 0 #e3d288;

}

/* A V A I L A B L E  and UNSELECTABLE - Text */

.block_hints .block_free,

.datepick-inline .date_available,

.datepick-inline .date_available.datepick-unselectable{

  color: #CCCCCC;                                                               /* This style for the uvailbale date, when we are select the dates */

}

/* A V A I L A B L E  - Text A */

.block_hints .block_free a,

.block_hints .block_time,

.datepick-inline .date_available a{

    color:#2d1616;

    font-weight: bold;

	font-size: 18px;

}

/*******************************************************************************/

/* T I M E   S L O T S */

.block_hints .block_time,

.datepick-inline .timespartly{

  background-image: url("../../img/clock_fill.png");

  background-repeat: no-repeat;

  background-position:100% 100%;

}

/*******************************************************************************/

/* A P P R O V E D  - BACKGROUND */

.block_hints .date_approved.block_check_in_out,

.block_hints .block_booked,

.datepick-inline .date_approved  {

    background-color: #e3d288;

}

/* A P P R O V E D  -  T E X T /including partially booked - timeslots/ */

.block_hints .date_approved.block_check_in_out,

.block_hints .block_booked,

.datepick-inline .date_approved,

.block_hints .block_booked a,

.datepick-inline .date_approved a{

    color: #e3d288;

    font-weight: bold;

}

/* CHECK IN and CHECK OUT  Borders for the approved cells - the COLOR have to be the SAME as BACKGROUND of this cell*/

.block_hints .date_approved.block_check_in_out div.check-in-div,                /* Item  for the LEGEND */

.datepick-inline .date_approved.timespartly.check_in_time div.check-in-div{

}

.block_hints .date_approved.block_check_in_out div.check-out-div,               /* Item  for the LEGEND */

.datepick-inline .date_approved.timespartly.check_out_time div.check-out-div{

}

/*******************************************************************************/

/* P E N D I N G  - BACKGROUND */

.block_hints .date2approve.block_check_in_out,

.block_hints .block_pending,

.datepick-inline .date2approve  {

  background-color: #77AAFF;

}

/* P E N D I N G  -  T E X T /including partially booked - timeslots/ */

.block_hints .date2approve.block_check_in_out,

.block_hints .block_pending,

.datepick-inline .date2approve,

.block_hints .block_pending a,

.datepick-inline .date2approve a {

    color: #e3d288;

    font-weight: bold;

    text-shadow: 0 -1px 0 #55e;

}

/* CHECK IN and CHECK OUT  Borders for the approved cells - the COLOR have to be the SAME as BACKGROUND of this cell*/

.block_hints .date2approve.block_check_in_out div.check-in-div,                 /* Item  for the LEGEND */

.datepick-inline .date2approve.timespartly.check_in_time div.check-in-div{

}

.block_hints .date2approve.block_check_in_out div.check-out-div,                /* Item  for the LEGEND */

.datepick-inline .date2approve.timespartly.check_out_time div.check-out-div{

}

/*******************************************************************************/

/* S E L E C T E D   Dates - Background */

.datepick-inline .datepick-one-month .datepick .datepick-current-day {

  background-color: #555;

}

/* S E L E C T E D   Dates - Text color */

.datepick-inline .datepick-one-month .datepick .datepick-current-day a{

    color: #EEEEEE;

    text-shadow: 0 -1px 0 #000000;

}

/*******************************************************************************/

/* C e l l   O V E R   Dates - Background */

.datepick-inline .datepick .datepick-days-cell-over{

    background:#a9964c;

}

/* C e l l   O V E R   Dates - Text color */

.datepick-inline .datepick .datepick-days-cell-over a:hover,

.datepick-inline .datepick .datepick-days-cell-over a{

    color: #eee;

    text-shadow: 0 -1px 0 #888;

}

/*******************************************************************************/