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

		Simplybook additional styles
		Rainbow theme base styles

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

.ui-widget * {
    /*font-family: 'Coda', cursive;*/
}
.logo-container .company-logo-container img,
.logo-container .company-logo-container .company-name {
    display: inline-block;
    vertical-align: bottom;
}
.logo-container {
    box-sizing: border-box;
    width: 100%;
    padding: 0;
    margin: 0;
    margin-top: 10px;
}
.logo-container .logo {
    box-sizing: border-box;
    width: 100%;
    margin: 0;
}
.logo-container .company-logo-container img {
    border: 1px solid #cccccc;
    box-shadow: 0px 5px 15px #e0e0e0;
    box-sizing: border-box;
    margin-bottom: 12px;
    margin-right: 10px;

    max-height: 120px;
    max-width: 100%;
}
.logo .company-time {
    background: #ffffff;
    margin-top: -10px;
}
.logo.logo-only .company-time {
    margin-top: -60px;
    padding: 10px;
}
.logo-container .company-logo-container .company-name {
    font-size: 40px;
    text-transform: capitalize;
}
@media (max-width: 480px){
    .logo-container .company-logo-container img,
    .logo-container .company-logo-container .company-name  {
        display: block;
    }
    .logo-container .company-logo-container img {
        margin: 0 !important;
    }
}


.logo .company-time {
    margin: 0 20px 0;
    font-size: 18px;
}
.logo .company-time .time-title {
    margin-right: 12px;
}
.logo .company-time a {
    font-size: 14px;
    margin-top: -4px;
}
#content-container {
    margin-bottom: 10px;
}
.top-goo * {
    font-size: 20px;
}
.page-container {
    padding: 10px;
    min-height: 100px;
}


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

		About page

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

.about-page .with_padding {
    margin-top: 50px;
}
.about-page .company-address-container {
    margin-top: 30px;
}
.about-page .company-address-container h3 {
    font-size: 19px;
}
.about-page .company-intro {
    font-size: 16px;
    line-height: 1.6em;
}
.about-page #work_hours {
    margin: 20px 0;
}
.about-page #work_hours table {
    margin: 10px 0 15px 0;
}
.about-page #work_hours .day-name-data,
.about-page #work_hours .time-data {
    padding: 1px 5px;
    font-size: 14px;
}
.about-page #work_hours table .day-name-data {
    padding-right: 12px;
    font-size: 1.05em;
    line-height: 1.5em;
}
.about-page .button-container {
    margin: 25px 0;
}
.about-page .button-container #save_button.btn.btn-success,
.feedback_add .btn-success,
.feedback-form #Submit {
    color: #ffffff;
    padding: 10px 26px;
    font-size: 23px;
    font-weight: normal;
    border: 1px solid #444444;
    text-shadow:0px 0px 1px #000;
}
.about-page #map_container {
    margin: 20px 0;
}



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

		Services gallery page

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

#events {}
#events .event {
    margin: 5px;
    padding: 7px;
    border-radius: 3px;
}
#events .event .picture {
    width: 180px;
    height: 90px;
    padding: 5px;
    text-align: center;
}
#events .event .picture img {
    max-width: 100%;
    max-height: 100%;
    vertical-align: center;
}
#events .event .info {
    width: 180px;
    padding: 7px 4px 4px 4px;
    text-align: center;
}
#events .event .name {
    font-size: 1.1em;
    width: 180px;
    height: 1.5em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#events .event .description {
    opacity: 0.7;
    font-size: 0.8em;
}
#events .event .duration {
    font-size: 1em;
}


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

		Feedbacks page

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

#pageNotifications.ui-state-highlight.ui-corner-all {
    background: #cc2200;
    border: none;
    color: #ffffff;
    padding: 20px;
    margin: 20px 0;
    font-size: 1.1em;
    border-radius: 0px;
}
#pageNotifications .ui-icon {
    display: none;
}

.feedback_list {
    margin: 20px;
}
.feedback_list .feedback {
    width: 350px;
    margin: 0 25px 25px 0;
    vertical-align: top;
}
.feedback_list .feedback .top-part {
    border-bottom: 1px solid #eeeeee;
    margin-bottom: 5px;
    padding-bottom: 3px;
}
.feedback_list .feedback .top-part .image {
    display: inline-block;
    margin: 0 10px 10px 0;
    width: 80px;
    height: 80px;
    padding: 7px;
    background: #f0f0f0;
    text-align: center;
}
.feedback_list .feedback .top-part .image img {
    max-width: 100%;
    max-height: 100%;
    vertical-align: center;
}
.feedback_list .feedback .top-part .info {
    display: inline-block;
}
.feedback_list .feedback .top-part .info .user-name {}
.feedback_list .feedback .top-part .info .date-time {}
.feedback_list .feedback .top-part .info .feedback-link {}
.feedback_list .feedback .bottom-part {}
.feedback_list .feedback .bottom-part .description {
    font-size: 0.9em;
    opacity: 0.9;
}

.feedback-form {
    margin: 30px 0px;
}
.feedback-form .form-elements {

}
.feedback-form .user-data {
    vertical-align: center;
}
.feedback-form .user-data img {
    margin: 5px;
}
.feedback-form .user-data .user-name {}
.feedback-form dt label {
    margin-top: 10px;
}
.feedback-form dd input[type='text'],
.feedback-form dd textarea {
    width: 100%;
}
.feedback-form dd textarea {
    height: 100px;
}
.feedback-form #add_comment {
    opacity: 0.7;
    font-size: 0.9em;
    padding: 0 10px;
}
.feedback-form #Submit-element {
    margin-top: -20px;
}
.feedback_add {
    text-align: right;
}



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

		Timeline

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

#timeline.bootstrap {
    margin: 0;
    width: 100%;
}
#timeline.bootstrap #step_title {
    display: none;
}
#timeline.bootstrap #step_info_container {
    background: none;
    border: none;
    padding: 0px;
    margin: 0px;
    border-radius: 0px;
    height: auto;
}
#timeline.bootstrap #step_info_container .step-header {
    margin: 5px;
    height: 75px;
    background: none;
    box-shadow: 0 0 1px #000000 inset;
}
#timeline.bootstrap #step_info_container  .step-header * {}
#timeline.bootstrap #step_info_container .step-header .step-title {
    padding: 0 10px;
}
#timeline.bootstrap #step_info_container .step-header .step-title .step-number-container,
#timeline.bootstrap #step_info_container .step-header .step-title .step-number {
    display: none;
}
#timeline.bootstrap .step-header .step-title .step-name {
    margin-bottom: 3px;
    width: 100%;
    font-size: 23px;
    text-align: center;
}
/*#timeline.bootstrap #step_info_container .step-header .step-title .step-info {*/
    /*text-align: center;*/
    /*width: 100%;*/
    /*font-size: 15px;*/
    /*font-weight: normal;*/
/*}*/
#timeline.bootstrap .step-content {
    /*margin-left: 5px;
    margin-right: 5px;	*/
}
#timeline.bootstrap .step-header .step-name,
#timeline.bootstrap .step-header .step-info,
#timeline.bootstrap .step-header .step-number {
    float: left;
}
#timeline.bootstrap #step_info_container .step-header .step-info {
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    line-height: 14px;
}

#timeline.bootstrap #navigation {
    margin: 10px 0;
    min-height: 45px;
}
#timeline.bootstrap .back-button {
    margin: 0;
    font-size: 18px;
    padding-left: 25px;
}
#timeline .back-button:hover {}


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

	Timeline: Locations, Categories,
			  Services, Performers

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

#timeline.bootstrap .step-content {
    padding: 10px 20px;
}
#timeline.bootstrap .step-content ul {
    text-align: center;
}
#timeline.bootstrap .step-content li {
    text-align: left;
}
#timeline.bootstrap .step-content .list-inline {
    vertical-align: top;
}
#timeline.bootstrap .item {
    margin: 0 15px 15px 0;
    font-size: 13px;
    border: none;
    vertical-align: top;
}
#timeline.bootstrap .item .left-block {
    display: inline-block;
    margin: 0 7px 7px 0;
}
#timeline.bootstrap .item .location-image,
#timeline.bootstrap .item .category-image,
#timeline.bootstrap .item .event-image,
#timeline.bootstrap .item .unit-image {
    float: none;
    padding: 7px;
    width: 120px;
    text-align: center;
}
#timeline.bootstrap .item .location-image img,
#timeline.bootstrap .item .category-image img,
#timeline.bootstrap .item .event-image img,
#timeline.bootstrap .item .unit-image img {
    max-width: 100%;
    max-height: 100%;
    vertical-align: center;
}
#timeline.bootstrap .item .location-image.empty-bg,
#timeline.bootstrap .item .category-image.empty-bg,
#timeline.bootstrap .item .event-image.empty-bg,
#timeline.bootstrap .item .unit-image.empty-bg {
    background: #f0f0f0;
}
#timeline.bootstrap .item .location-info,
#timeline.bootstrap .item .category-info,
#timeline.bootstrap .item .event-info,
#timeline.bootstrap .item .unit-info {
    display: inline-block;
    vertical-align: top;
    width: 250px;
}
#timeline.bootstrap .item .location-info .location-title,
#timeline.bootstrap .item .category-info .category-title,
#timeline.bootstrap .item .event-info .event-title,
#timeline.bootstrap .item .unit-info .unit-title {
    font-size: 1.4em;
    font-weight: normal;
}
#timeline.bootstrap .item .location-info .location-address,
#timeline.bootstrap .item .event-info .event-duration,
#timeline.bootstrap .item .unit-info .unit-duration {
    font-size: 13px;
    font-weight: normal;
}
#timeline.bootstrap .button,
.reserve_time_btn,
#pay_btn,
.iphone-favorites-button a {
    margin-top: 10px;
    min-width: 120px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border: 1px solid transparent;
    border-radius: 3px;
    font-size: 1.1em;
    cursor: pointer;
}
.iphone-favorites-button {
    margin: 15px 0;
}
.iphone-favorites-button a {
    padding: 5px 10px;
}

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

	Timeline: Timeline step

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


@media (min-width: 768px) {
    div#timeline.bootstrap.daily.long-timeframe #date_start {
        width: 37%;
        margin-right: 1%;
    }
    div#timeline.bootstrap.daily.long-timeframe #time_select {
        width: 61%;
    }
}

@media (min-width: 1000px) and (max-width: 1330px) {

    div#timeline.bootstrap.daily.long-timeframe #date_start, div#timeline.bootstrap.daily.flexible #date_start {
        width: 39%;
        margin-right: 1%;
    }

    div#timeline.bootstrap.daily.long-timeframe #time_select, div#timeline.bootstrap.daily.flexible  #time_select {
        width: 60%;
    }
}


#timeline.bootstrap #date_start,
#timeline.bootstrap #time_select {
    text-shadow: none;
}
#timeline.bootstrap #date_start .ui-datepicker {
    /*border-radius: 0;*/
    /*border: none;*/
    /*background: none;*/
    font-size: 20px;
}
#timeline.bootstrap #date_start .ui-datepicker .ui-datepicker-header {
    /*border-radius: 0;*/
    /*border: none;*/
    /*background: none;*/
}
#timeline.bootstrap #date_start .ui-datepicker .ui-widget-header .ui-datepicker-prev,
#timeline.bootstrap #date_start .ui-datepicker .ui-widget-header .ui-datepicker-next {
    /*background: none;*/
    /*width: 0;*/
    /*height: 0;*/
    /*border-top: 18px solid transparent;*/
    /*border-bottom: 18px solid transparent;*/

}
#timeline.bootstrap #date_start .ui-datepicker .ui-widget-header .ui-datepicker-prev {
    /*border-left: none;*/
}
#timeline.bootstrap #date_start .ui-datepicker .ui-widget-header .ui-datepicker-next {
    /*border-right: none;*/
}
#timeline.bootstrap #date_start .ui-datepicker .ui-widget-header .ui-datepicker-prev .ui-icon,
#timeline.bootstrap #date_start .ui-datepicker .ui-widget-header .ui-datepicker-next .ui-icon {
    /*background: none;*/
}
#timeline.bootstrap #date_start .ui-datepicker .ui-widget-header .ui-datepicker-prev-hover,
#timeline.bootstrap #date_start .ui-datepicker .ui-widget-header .ui-datepicker-next-hover {
    /*top: 2px;*/
}
#timeline.bootstrap #date_start .ui-datepicker td span,
#timeline.bootstrap #date_start .ui-datepicker td a {
    /*width: 2.6em;*/
    /*text-align: center;*/
}

/*------ Time select -------*/

#timeline.bootstrap #time_select {
    font-size: 14px;
    line-height: 1em;
    padding: 0 0 0 20px;
}
#timeline.bootstrap #time_select .timeline-grid .time-item {
    border: 2px solid transparent;
}
#timeline.bootstrap #time_select .timeline-grid .time-item .time-select-div {
    height: 35px;
    padding: 7px 6px 0 10px;
    font-weight: normal;
    color: #2b2b2b;
}
#timeline.bootstrap #time_select .timeline-grid .time-item .time-select-div:hover {
    font-weight: normal;
    color: #212121;
}
#timeline.bootstrap #time_select .timeline-grid .time-select-div span {
    margin-top: 10px;
}

/*-- Slots timeline ---*/

#timeline.bootstrap #time_select .time-select-item,
#timeline.bootstrap #time_select .time-select-div {
    color: #2b2b2b;
    border-radius: 2px;
    padding: 0px 10px 0 10px;
    height: 40px;
}
#timeline.bootstrap #time_select .time-select-item {
    min-width: 64px;
}
#timeline.bootstrap #time_select .time-select-item.am-pm {
    min-width: 80px;
}
#timeline.bootstrap #time_select .hour-title {
    min-width: 75px;
    text-align: right;
}

#timeline.bootstrap #time_select  .time-select-item:hover,
#timeline.bootstrap #submit_button:hover  {
    border: 1px solid #999999;
    background: #dadada url(../../images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x;
    font-weight: normal;
    color: #212121;
}

/* Extra small devices Phones (<768px) */
@media (max-width: 768px) {
    #timeline.bootstrap #time_select {
        overflow: visible; /* timeline becomes wide and jump under calendar, otherwise visible only part of timeline */
    }
    #timeline.bootstrap #time_select .timeline-grid-wrapper {
        margin-left: 0; /* timeline not on the left, but under calendar now */
        margin-top: 30px;
    }
    #timeline.bootstrap #time_select {
        padding-left: 0;
    }
}


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

		Week timeline
	(for rainbow bootstrap theme)

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




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

		Booking info
 (time, client info, after-booking steps)

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

.client-info-step-form-container {
    /*width: 340px;*/
    margin: auto;
}
#timeline.bootstrap .bottom-info,
.client-info-step-form-container {
    display: inline-block;
    vertical-align: top;
    position: relative;
    top: 0px;
}
#timeline.bootstrap .bottom-info {

}
#timeline.bootstrap #date_time_step .bottom-info {
    margin-top: 25px;
    width: 100%;
    padding: 0px;
}
/*#timeline.bootstrap #date_time_step .left-side .bottom-info {*/
    /*width: 100%;*/
/*}*/
#timeline.bootstrap #client_info_step .bottom-info {
    /*margin-top: 25px;*/
    /*margin-right: 25px;*/
    /*padding: 15px;*/
    /*width: 29%;*/
    /*border: 1px solid #cccccc;*/
    /*border-radius: 2px;*/
}
#timeline.bootstrap #client_info_step .bottom-info .service-info-block .service-info,
#timeline.bootstrap #client_info_step .bottom-info .data  {
    /*width: 150px;*/
    display: block;
    width: 100%;
    text-align:center;
}
#timeline.bootstrap #client_info_step .bottom-info .service-info-block .service-info{
    width:100%;
}
#timeline.bootstrap #client_info_step .bottom-info .service-info-block {

}

#timeline.bootstrap .ui-datepicker {
    width: 17.5em;
}

#timeline.bootstrap .bottom-info div {
    font-size: 15px;
    line-height: 1.4em;
}
#timeline.bootstrap .bottom-info .service-name {
    /*font-size: 20px;*/
    /*padding: 20px 0 10px 0;*/
    /*font-weight: bold;*/
}
#timeline.bootstrap .bottom-info .service-info-block {
    /*margin-bottom: 10px;*/
    /*padding-bottom: 10px;*/
    /*border-bottom: 1px solid #cccccc;*/
}
#timeline.bootstrap .bottom-info .service-info-block .image,
#timeline.bootstrap .bottom-info .title,
#timeline.bootstrap .info-block .datetime .image {
    display: inline-block;
    margin-right: 20px;
    padding: 3px 7px;
    width: 120px;
}
#timeline.bootstrap .bottom-info .service-info-block .image {
    float: none;
    padding: 7px;
    height: 90px;
    text-align: center;
}
#timeline.bootstrap .bottom-info .service-info-block .image img {
    max-width: 100%;
    max-height: 100%;
    vertical-align: center;
}
#timeline.bootstrap .bottom-info .service-info-block .image.empty-bg {
    background: #f0f0f0;
}
#timeline.bootstrap .bottom-info .service-info-block .service-info,
#timeline.bootstrap .bottom-info .data  {
    display: inline-block;
    vertical-align: top;
    width: 100%;
}
#timeline.bootstrap .left-side .bottom-info .service-info-block .service-info,
#timeline.bootstrap .left-side .bottom-info .data {
    width: 100%;
    word-wrap: break-word;
}
#timeline.bootstrap .left-side .bottom-info .service-info-block .service-info{
    width: 100%;
}
#timeline.bootstrap .bottom-info .service-info-block .service-info .service-name,
#timeline.bootstrap .info-block .datetime .data {
    font-size: 1.17em;
    line-height: 1.3em;
    margin: 5px 0;
}
#timeline.bootstrap .bottom-info .service-info-block .service-info .service-name {
    word-wrap: break-word;
}
#timeline.bootstrap .bottom-info .service-info-block .service-info .info span {
    display: block;
    margin-bottom: 2px;
}
#timeline.bootstrap .info-block .datetime {
    margin: 10px 0;
    vertical-align: bottom;
}
#timeline.bootstrap .info-block .datetime .image {
    height: 54px;
    position: relative;
    vertical-align: bottom;
}
#timeline.bootstrap .info-block .datetime .data {
    vertical-align: bottom;
}
#timeline.bootstrap .info-block .datetime .data span {
    margin-right: 10px;
    color: #777777;
}
#timeline.bootstrap .info-block .glyphicon {
    margin-right: 10px;
    font-size: 1.2em;
    opacity: 0.8;
}


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

	Timeline: Client form step

*************************************/
#timeline.bootstrap #client_form {
    display: inline-block;
    width: 100%;
}
#timeline.bootstrap #client_form .client_form_wrapper .zend_form dd input,
#timeline.bootstrap #client_form #additional_fields .zend_form dd input {
    height: auto;
    margin-right: 24px;
}
#timeline #client_form dt,
#timeline #client_form dt * {
    font-size: 20px;
    margin-top: 6px;
}
#timeline.bootstrap #client_form input[type=text],
#timeline.bootstrap #client_form select,
#timeline.bootstrap #client_form textarea,
#timeline.bootstrap #additional_fields input[type=text],
#timeline.bootstrap #additional_fields select,
#timeline.bootstrap #additional_fields textarea {
    border-radius: 2px;
    border: 1px solid #cccccc;
}
#timeline.bootstrap #client_form select,
#timeline.bootstrap #additional_fields select {
    width: 100% !important;
    background: #fff;
}
#timeline.bootstrap #client_form #client_phone_number {
    width: 81% !important;
}

#timeline.bootstrap #client_form .client_form_wrapper .zend_form dd input[name='client_phone_area_code']{
    width:14% !important;
}
/*
#timeline #client_form .fixed_prefix {
	width: 80px !important;
	margin: 0;
	padding: 3px 0;
	font-size: 1.3em;
	font-weight: normal;
	text-align: center;
}
#timeline #client_form #client_phone_area_code {
	width: 80px !important;
}
#timeline #client_form #client_phone_number {
	width: 220px !important;
}
#timeline #client_form input[type=text],
#timeline #client_form select {
	padding: 7px 10px;
}
*/
/*--- multiple booking plugin */
/* #timeline.bootstrap #client_info_step .bottom-info  analog for multiple booking case */
#timeline.bootstrap #client_info_step #booked_list {
    margin: 25px 40px 0 0;
    width: 100%;
}
#timeline.bootstrap #client_info_step #booked_list .book-item,
#timeline.bootstrap #client_info_step #booked_list .book-item.current-booking {
    display: inline-block;
    float: none;
    box-sizing: border-box;
    width: 48%;
    margin: 0 10px 10px 0;
    padding: 10px 25px;
    background: #f9f9f9;
    color: #444444;
    border: 1px solid #eeeeee;
    border-radius: 3px;
}
#timeline.bootstrap #client_info_step #booked_list .book-item.current-booking {
    background-color: #fcf8e3;
    border-color: #faebcc;
    color: #8a6d3b;
}
#timeline.bootstrap #client_info_step #booked_list .book-item .delete-button.glyphicon {
    font-size: 18px;
    color: #999999;
    background: none;
    top: 0;
    cursor: pointer;
}
#timeline.bootstrap #client_info_step #booked_list .book-item .delete-button.glyphicon:hover {
    color: #ff0000;
}


#timeline.bootstrap #errors {
    margin: 13px 0px 0px 0px;
    width: 97%;
}

#timeline.bootstrap #errors ul li {
    padding: 5px 0;
    font-size: 1.2em;
}
#timeline.bootstrap #submit_button {
    color: #ffffff;
    font-weight: normal;
}
#timeline.bootstrap #submit_button:hover {
    color: #ffffff;
}
#timeline.bootstrap .book-item,
#timeline.bootstrap .book-item.current-booking {
    margin: 5px;
    padding: 10px 25px;
    border-radius: 0px;
}
#timeline.bootstrap .book-item:hover .delete-button:hover {
    top: 4px;
}
#timeline.bootstrap .ui-datepicker th {
    padding: 0.7em 0.2em;
}
#timeline.bootstrap .book-another-button .icon {
    background: none;
}

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

		Other pages Rainbow default

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

.video-conversation-page {
    padding-bottom: 100px;
}
.video-conversation-page #code {
    margin-left: 10px;
}
.video-conversation-page h2 {
    font-size: 20px;
}
.news-page {
    padding: 15px;
}
.news-page #news  .date,
.news-page #news .caption,
.news-details-page .caption {
    margin: 10px 0;
    font-size: 19px;
    border-bottom: none;
}
.news-page #news .row {
    border-bottom: none;
    margin-bottom: 15px;
}
.news-details-page .content {
    margin-top: 15px;
}



/*----- Payment plugin pages ---*/

#content-container  #booking-message-div,
#content-container #booking-result-div,
#success-button  {
    background: none;
    color: #cccccc;
    border: none;
}
#content-container  #booking-message-div.ui-state-error {
    border: 1px solid red;
    padding: 20px;
    border-radius: 0;
}
#content-container  #booking-message-div.ui-state-highlight {
    border: none;
}
.payment_redirect_message {
    margin: 20px 0;
    font-size: 17px;
}
.success-message img.image {
    display: none;
}
.success-message .glyphicon {
    display: inline-block;
    padding: 5px;
    font-size: 30px;
    color: #589c00;
    top: 7px;
}
.success-message .text {
    font-size: 1.3em;
    padding: 5px 0 7px 25px;
}


#timeline.bootstrap .item .location-image img,
#timeline.bootstrap .item .category-image img,
#timeline.bootstrap .item .event-image img,
#timeline.bootstrap .item .unit-image img {
    width: auto;
}

#timeline .ui-combobox-toggle {
    width: 5% !important;
    height: 39px !important;
    position: relative !important;
    top: -2px;
    border-radius: 0px;
    margin-right: -2px;
    margin-left: -1px;
}

#timeline.bootstrap #client_info_step .step-content {
    padding-left: 13%;
}


.ui-dialog .ui-dialog-buttonpane button {
    /* margin: .5em .4em .5em 0; */
    cursor: pointer;
    border: 0px;
    background: transparent;
    text-shadow: none;
    -webkit-border-radius: 19px;
    -moz-border-radius: 19px;
    -ms-border-radius: 19px;
    -o-border-radius: 19px;
    border-radius: 19px;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 0.6;
    /* padding: 10px 24px 10px 24px; */
    text-transform: uppercase;
    background-color: #5bc0de;
    border-color: #46b8da;
    text-decoration: none;
    display: inline-block;
    width: 187px;
    text-align: center;
    /* margin: 0px auto 40px auto; */
}


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

		Button widget styles

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

#widget_container{
    background: #fff;
}

#widget_content #timeline.bootstrap {
    padding: 0;
    margin-top: -20px;
}

#widget_content #timeline.bootstrap #client_info_step .step-content {
    padding-left: 0 !important;
}
#widget_content #timeline.bootstrap .bottom-info,
#widget_content .client-info-step-form-container {
    display: block;
    margin: auto;
    width: 100%;
    box-sizing: border-box;
}
#widget_content #timeline #client_form,
#widget_content #timeline #client_form .client_form_wrapper,
#widget_content #timeline #client_form #additional_fields,
#widget_content #timeline #client_form #redeem_code,
#widget_content #timeline .license,
#widget_content #timeline .buttons_container,
#widget_content #timeline .buttons_container #submit_button {
    width: 100%;
    box-sizing: border-box;
}

#widget_content #timeline #client_form .fixed_prefix,
#widget_content #timeline #client_form #client_phone_area_code {
    width: 20% !important;
}

/* bootstrap flexible timeline classes fix for this theme */
#timeline.bootstrap #time_select .timeline-grid .hour-row .time-items div.time-item {
    margin: 2px;
}
#timeline.bootstrap #time_select .timeline-grid .hour-row .time-items .time-item div.time-select-div {
    background: #e6e6e6;
    border: 1px solid #e6e6e6;
    border-radius: 0px;
}
/*#timeline.bootstrap .time-select-week-container {*/
    /*max-width: 665px;*/
/*}*/


@CHARSET "UTF-8";

.loader {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 32px;
    height: 32px;
    background: url(/common/images/catalogue/loading.gif) no-repeat top left transparent;
}

#timeline {
    margin: 20px;
    position: relative;
}

#timeline .step-title {
    font-size: 2.3em;
    font-weight: bold;
    margin: 25px 0 30px 10px;
}

#timeline #step_info_container {
    height: 52px;
    padding-bottom: 7px;
    padding-top: 10px;
    margin-bottom: 15px;
    margin-top: 5px;
    border: 1px solid #e5e5e5;
    border-radius: 3px;
    background: #f0f0f0;
    width: 100%;
    overflow: hidden;
}

#timeline #step_info_container .step-header {
    float: left;
    height: 52px;
    background: url('/common/images/catalogue/arrow.png') no-repeat top right;
}

#timeline #step_info_container .step-header .step-title {
    text-align: left;
    margin: 5px;
    margin-right: 15px;
    font-size: 1.4em;
    color: #999999;
    display: block;
    overflow: hidden;
    line-height: normal;
}
#timeline #step_info_container .step-header.checked .step-title {
    color: #777777;
}
#timeline #step_info_container .step-header.checked .step-title:hover {
    /*color: #f16c32; /* TEST */
}
#timeline #step_info_container .step-header .step-title .step-number {
    font-size: 1.9em;
    margin: 5px;
}
#timeline #step_info_container .step-header .step-title .step-name {
    vertical-align: top;
}

#timeline #step_info_container .step-header.active .step-title  {
    /* color: #f16c32; /* TEST */
}

#timeline #step_info_container .step-header .step-info {
    height: 30px;
    margin-top: -20px;
    margin-left: 3.5em;
    margin-right: 15px;
    overflow: hidden;
    line-height: normal;
}

#timeline .step {
    width: 100%;
    margin-right: 5px;
    overflow: hidden;
}

#timeline .step.hidden {
    display: none;
}

#timeline .item {
    padding-top: 15px;
    padding-bottom: 10px;
    border-bottom: 1px dashed #cccccc;
    overflow: hidden;
}
#timeline .item .location-image,
#timeline .item .category-image,
#timeline .item .event-image,
#timeline .item .unit-image {
    width: 80px;
    min-height: 80px;
    float: left;
    margin-right: 20px;
}
#timeline .item .location-image img,
#timeline .item .category-image img,
#timeline .item .event-image img,
#timeline .item .unit-image img {
    width: 80px;
}
#timeline .item .location-image.empty-bg,
#timeline .item .category-image.empty-bg,
#timeline .item .event-image.empty-bg,
#timeline .item .unit-image.empty-bg {
    background: url('/common/images/bodyBG.png');
}
#timeline .item .location-info,
#timeline .item .category-info,
#timeline .item .event-info,
#timeline .item .unit-info {
    overflow: hidden;
}
#timeline .item .location-info .location-title,
#timeline .item .category-info .category-title,
#timeline .item .event-info .event-title,
#timeline .item .unit-info .unit-title {
    font-size: 1.4em;
    color: #444444;
    font-weight: bold;
}
#timeline .item .location-info .location-address,
#timeline .item .event-info .event-duration,
#timeline .item .unit-info .unit-duration {
    font-size: 1em;
    font-weight: bold;
}
#timeline #date_start {
    float: left;
}
#timeline #time_select {
    overflow: hidden;
}
#timeline #time_select .time-select-item,
#timeline #time_select .time-select-div {
    float: left;
    width: auto;
    padding-left: 10px;
    padding-right: 10px;
    margin: 5px;
    line-height: 40px;
    height: 40px;
    border: 1px solid #cccccc;
    background: #efefef;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
    min-width: 32px;
}

#timeline #time_select .time-select-item.am-pm {
    min-width: 55px;
}

#timeline .bottom-info {
    margin-top: 10px
}
#timeline .bottom-info div {
    font-size: 1.2em;
    line-height: 1.3em;
}
#timeline .bottom-info .title {
    color: #777777;
    margin-right: 5px;
    display: inline-block;
    min-width: 5em;
}
#timeline .bottom-info .selected-event-container {}
#timeline .bottom-info .selected-event-container .name {
    font-size: 1.4em;
    line-height: 1.4em;
    padding-left: 0.3em;
}
#timeline .bottom-info .selected-event-container .description {
    font-size: 0.9em;
    color: #999999;
    display: inline-block;
    border-bottom: 1px solid #eeeeee;
    padding-bottom: 3px;
    margin-bottom: 7px;
}
#timeline .bottom-info .selected-event-duration-container {}
#timeline .bottom-info .selected-event-duration-container .time {
    display: inline-block;
    padding-left: 20px;
    background: url(/common/images/catalogue/clock_20_grey.png) no-repeat left top;
}
#timeline .bottom-info .selected-unit-container {}
#timeline .bottom-info .selected-unit-container .unit {}

#timeline .bottom-info .selected-unit-container .unit,
#timeline .bottom-info .selected-event-duration-container .time,
#timeline .bottom-info .selected-event-container .name {

}

#timeline .button {
    line-height: 30px;
    text-align: center;
    margin-top: 10px;
    border-radius: 5px;
    background: #efefef;
    cursor: pointer;
    border: 1px solid #e5e5e5;
}
#timeline .button {
    width: 100px;
    height: 30px;
}
#timeline .button:hover,
#timeline #time_select .time-select-item:hover,
#timeline #submit_button:hover  {
    /*color: #f16c32; /* TEST */
    border: 1px solid #cccccc;
    background: #f5f5f5;
}
#timeline .back-button {
    font-size: 1.4em;
    line-height: 1.5em;
    padding: 0.5em 0.7em;
    font-weight: bold;
    margin-top: 30px;
    text-decoration: underline;
    cursor: pointer;
}
#timeline .back-button:hover {}
#timeline .location-phone,
#timeline .event-price {
    font-weight: bold;
    font-size: 13px;
}
#timeline .event-price .sale-tax {
    opacity: 0.75;
}
#timeline #client_form .client_form_wrapper,
#timeline #client_form #additional_fields,
#timeline #client_form #redeem_code {
    margin: 0 auto;
    margin-top: 0px;
    margin-bottom: 30px;
    /*width: 340px;*/
    width: 100%;
}
#timeline #client_form dd {
    margin-left: 0px;
}
#timeline #client_form input[type=text],
#timeline #client_form textarea,
#timeline #client_form #phone_description {
    width: 100% !important;
}
#timeline #client_form select {
    width: 321px !important;
}
#timeline #client_form .fixed_prefix {
    width: 80px !important;
    margin: 0;
    padding: 3px 0;
    font-size: 1.3em;
    font-weight: normal;
    text-align: center;
}
#timeline #client_form #client_phone_area_code {
    width: 80px !important;
}
#timeline #client_form #client_phone_number {
    width: 218px !important;
}
#timeline #client_form input[type=text],
#timeline #client_form select {
    padding: 7px 10px;
}
#timeline .buttons_container {
    width: 340px;
    margin: 0 auto;
    margin-bottom: 20px;
}
#timeline #submit_button {
    font-size: 2em;
    line-height: 2.1em;
    text-align: center;
    padding: 6px 0;
    border-radius: 3px;
    width: 320px;
    cursor: pointer;
    background: #efefef;
    border: 1px solid #e5e5e5;
    /*color: #f16c32; /* TEST */
}
#timeline #errors li {
    color: #cd0a0a;
}
#timeline .step-header.checked .step-title {
    cursor: pointer;
}
#timeline .date_time_container {
    overflow: hidden;
}
/*
 Public-timeline Styles
 this is added to all ui-color theme files

#timeline .step-title,
#timeline #step_info_container .step-header.checked .step-title:hover,
#timeline #step_info_container .step-header.active .step-title,
#timeline .button:hover,
#timeline .back-button:hover,
#timeline #time_select .time-select-item:hover,
#timeline #submit_button,
#timeline #submit_button:hover  {
  color: #f16c32;
}
*/


/*----------------------------------

	SignIn Form styles

----------------------------------*/
#sign_form {}
#sign_form .sign_in, #sign_form .sign_up {
    float: left;
    width: 48%;
}
#sign_form .sign_up {
    padding-left: 3%;
    border-left: 1px solid #e5e5e5;
}
#sign_form h2 {
    color: #777777;
    font-size: 1.6em;
    margin: 0px;
}
#sign_form .zend_form dd {
    margin-left: 0px;
}
#sign_form .zend_form dt {
    margin-top: 5px;
}
#sign_form .zend_form dd input[type=text],
#sign_form .zend_form dd input[type=password],
#sign_form .zend_form dd select {
    padding: 4px;
    border-radius: 3px;
    border: 1px solid #cccccc;
    width: 90%;
}
#sign_form .zend_form dd select {
    padding: 3px;
    margin-right: 4px;
}
#sign_form .zend_form #short_session-element p.description {
    position: relative;
    top: -17px;
    left: 24px;
    clear: both;
}
#sign_form .zend_form #short_session {
    float: left;
}
#sign_form .zend_form .sign {
    padding: 7px;
}
#sign_form .zend_form label,
#sign_form .zend_form p.description,
#sign_form .zend_form .open_id_label,
#sign_form .zend_form .forgot_password {
    color: #777777;
    margin: 1px 0px;
    text-decoration: none;
}
#sign_form .zend_form #client__phone_area_code {
    width: 120px !important;
}
#sign_form .zend_form #client__phone_number {
    width: 180px !important;
}
#sign_form ul.errors {
    padding: 0px;
    margin: 0px;
    text-indent: 0px;
}
#sign_form ul.errors li {
    line-height: 1.2em;
    padding: 0.4em 0;
    color: #cd0a0a;
}
#sign_form .zend_form .forgot_password {
    float: right;
    margin: 10px 25px 0 0;
}
#sign_form .zend_form .forgot_password:hover {
    text-decoration: underline;
}
#sign_form .zend_form #signin-element {
    margin-top: 5px;
}
#sign_form .zend_form #signin-element #signin,
#sign_form .zend_form #register-element #register,
.wellcome_message a.sign_out_link {
    border-radius: 3px;
    margin: 0 auto;
    background: #efefef;
    border: 1px solid #cdcdcd;
    color: #555555;
    padding: 6px 12px;
    text-decoration: none;
}
#sign_form .zend_form #signin-element #signin:hover,
#sign_form .zend_form #register-element #register:hover,
.wellcome_message .sign_out_link:hover {
    background: #f0f0f0;
    border: 1px solid #aaaaaa;
}
#sign_form .open_id_label {
    margin: 0 0 5px 0;
    color: #777777;
}
#sign_form .zend_form #openid {
    float: left;
}

.wellcome_message h2 {
    color: #777777;
    font-size: 2em;
    margin: 10px 0px;
}
.wellcome_message .message {
    margin: 20px 0;
    font-size: 1.2em;
    color: #444444;
}

#sign_form .zend_form #signin-element #signin:hover,
#sign_form .zend_form #register-element #register:hover,
#sign_form .zend_form .forgot_password,
.wellcome_message .sign_out_link:hover {
    /* color: #3290f1; TEST */
}

/*----------------------------------

	Password recovery form

----------------------------------*/
.recovery_form_container #recovery_form {
    width: 300px;
    margin: auto;
}

.recovery_form_container h2 {
    color: #888888;
    font-size: 2em;
    text-shadow: 1px 1px #ffffff;

}

.recovery_form_container .sign_link a  {
    color: #666666;
    font-size: 1.2em;
}
.recovery_form_container .sign_link a:hover {
    color: #2b2b2b;
}
.recovery_form_container input[type=text] {
    padding: 6px;
    border-radius: 3px;
    border: 1px solid #cccccc;
    width: 285px;
}
.recovery_form_container .zend_form dd {
    margin: 5px 0px;
}
.recovery_form_container .zend_form label {
    color: #666666;
    text-shadow: 1px 1px #ffffff;
    margin: 1px 0px;
    text-decoration: none;
}
.recovery_form_container input[type=submit] {
    border-radius: 3px;
    margin: 0 auto;
    background: #efefef;
    border: 1px solid #cdcdcd;
    width: 100%;
    color: #555555;
    padding: 6px 12px;
    text-decoration: none;
}
.recovery_form_container input[type=submit]:hover {
    background: #f0f0f0;
    border: 1px solid #aaaaaa;
}

#timeline #step_info_container.numbers-only .step-name,
#timeline #step_info_container.numbers-only .step-info {
    display: none;
}

#timeline #step_info_container.numbers-only .active .step-name {
    display: inline;
}

#timeline #step_info_container.numbers-only .active .step-info {
    display: block;
}

/*-------------------------------------------------

	Multiple booking related elelents CSS

--------------------------------------------------*/
.book-another-button {
    /*width: 320px;*/
    /*margin: 5px 0 20px 0;*/
    /*padding: 7px 0;*/
    /*border: 1px solid #e5e5e5;*/
    /*border-radius: 4px;*/
    /*background: #efefef;*/
    /*text-align: center;*/
    /*cursor: pointer;*/
}
.book-another-button:hover  {
    /*border-color: #0581b5;*/
    /*-webkit-box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.15);*/
    /*-moz-box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.15);*/
    /*box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.15);*/
}
.book-another-button .icon {
    background: url(/common/images/gfx/addnew.png) no-repeat center;
    display: inline-block;
    height: 14px;
    width: 14px;
    margin: 0 10px -2px 0;
}
.book-another-button .link {
    font-size: 1.2em;
}
.book-another-button:hover .link {
    text-decoration: none;

}

#booked_list {

}
#booked_list .book-item {
    display: inline-block;
    position: relative;
    margin: 0 10px 10px 0;
    border: 1px solid #dddddd;
    border-radius: 4px;
    background: #fafafa;
    padding: 7px 21px 10px 10px;
}
#booked_list .book-item:hover {
    border-color: #cccccc;
    background: #ffffff;
}
#booked_list .book-item.current-booking {
    border: 1px solid #dddddd;
    background: #fafafa;
}
#booked_list .book-item.current-booking:hover {
}
#booked_list .book-item .event-title {
    font-size: 1.3em;
    color: #444444;
}
#booked_list .book-item .event-date-time {
    padding-left: 24px;
    background: url(/common/images/catalogue/clock_20_grey.png) no-repeat left top;
    margin: 4px 0 3px 0;
}
#booked_list .book-item .unit-title {
    padding-left: 21px;
    background: url(/common/images/gfx/admin_light.png) no-repeat left top;
}
#booked_list .book-item .delete-button {
    position: absolute;
    top: 3px;
    right: 2px;
    background: url(/common/images/gfx/cancel.png) no-repeat left top;
    width: 16px;
    height: 16px;
}
.clear {
    clear: both;
}

/*----------------------------------
	Timeline grid
----------------------------------*/

#timeline #time_select .timeline-grid .time-item .time-select-div {
    border: none;
    background: none;
    width: 100%;
    height: 25px;
    line-height: 25px;
    margin: 0px;
    padding: 0px;
    border-radius: 0px;
    -moz-border-radius: 0px;
    cursor: pointer;
}

/*--- !Important! On change styles for time slots remember about 2 modes: 1. Time titles above table; 2. Time titles inside slots. ---*/
#timeline #time_select .timeline-grid .time-item {
    border: 1px dotted #dddddd;
    min-width: 25px;
}
#timeline #time_select .timeline-grid-wrapper {
    margin-left: 30px;
    display: inline-block;
}
#timeline #time_select .timeline-grid {
    border-collapse: collapse;
    border-spacing: 0;
}

#timeline #time_select .timeline-grid.with-titles {
    width: 400px;
}

#timeline #time_select .timeline-grid .time-select-div span {
    margin: 5px;
}

#timeline #time_select .timeline-grid.with-titles .time-select-div span {
    margin: 0px;
}

#timeline #time_select .timeline-grid td {
    padding: 0px !important;
}

#timeline #time_select .timeline-grid .min-title {
    margin-left: -8px;
    font-size: 14px;
}

#timeline #time_select .timeline-grid .hour-title {
    font-size: 14px;
    padding-right: 5px;
}

#timeline #time_select .timeline-grid .time-select-div {
    background: #ffffff;
}

#timeline #time_select .timeline-grid .time-item .time-select-div.not_worked_time {
    background: #dddddd;
    cursor: default;
}

#timeline #time_select .timeline-grid .time-item .time-select-div.reserved_time,
#timeline #time_select .timeline-grid .time-item .time-select-div.reserved_time:hover {
    background-color: #ffbbaa;
    cursor: default;
}

#timeline #time_select .timeline-grid .time-select-div.selected {
    background-color: #a7e762;
    border-type: solid;
}
#timeline #time_select .timeline-grid .time-select-div:hover span {
    /* color: green; */ /*defined in each ui-color theme */
}
#timeline #time_select .timeline-grid .time-select-div.reserved_time:hover span,
#timeline #time_select .timeline-grid .time-select-div.not_worked_time:hover span {
    /* color: #666666; */ /* defined in theme css */
}

#timeline .license {
    width: 340px;
    margin: 0 auto;
}

#timeline .number-select-container {
    border: none;
    background: #f5f5f5;
    padding: 0px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    /*float: left;*/
    /*margin-top: 10px;*/
    /*margin-right: 6px;*/

    width: 100%;
    /*margin-left: 5%;*/

}
#timeline .number-select-container select {
    width: 45px;
    height: 20px;
    border: 1px solid #cccccc;
    float: right;
}

#timeline #client_form dt label.required {
    font-weight: bold;
}
#timeline #client_form dt label.optional {
    font-weight: normal;
}

/*---------    Facebook Login form  -----------*/

.facebook-form-wrapper {


}
.facebook-form-wrapper.logged {

}
.facebook-form-wrapper .facebook-image-wrapper {
    background: #eeeeee;
    border: 1px solid #dddddd;
    padding: 5px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}
.facebook-form-wrapper .wellcome-message {
    margin-left: 10px;
    font-size: 1.3em;
    position: relative;
    top: -20px;
}
.facebook-form-wrapper .facebook-image-wrapper,
.facebook-form-wrapper .wellcome-message,
.facebook-form-wrapper #facebook_login {
    display: inline-block;
}

#timeline .number-select-container > span {
    position: relative;
    top: -2px;
}

.number-select-none {
    /*display: block;*/
    /*padding: 5px 7px;*/
    /*margin-top: 10px;*/
    /*margin-right: 6px;*/
    /*min-height: 32px;*/
}

/*------ Dimka Calendar enhancements ----------*/

/*
#timeline.bootstrap #date_start .ui-datepicker {
	width: 22em;
}

#timeline.bootstrap #date_start .ui-datepicker td span,
#timeline #date_start .ui-datepicker td a {
	padding: 0.4em;
	text-align: center;
	border-radius: 4px;
}

#timeline.bootstrap #date_start .ui-datepicker table {
	font-size: 1.2em;
}

#timeline.bootstrap #date_start .ui-widget-content {
	border: none;
	background: #f5f5f5;
}

#timeline.bootstrap .ui-widget-header {
	border: none;
	background: none;
	color: #555555;
	font-size: 1.2em;
}

#timeline.bootstrap .ui-state-default {
	border: 1px solid #bbbbbb;
}

#timeline.bootstrap .ui-state-active {
	border-color: #357EBD;
	background: #428BCA;
	color: #ffffff;
}

#timeline.bootstrap .ui-icon-circle-triangle-w {
	background-position: -96px 0px;
}

#timeline.bootstrap .ui-icon-circle-triangle-e {
    background-position: -32px 0px;
}

#timeline.bootstrap .ui-widget-header .ui-icon {
	background-image: url("/common/css/ui-colors/gray_vcard_black/images/ui-icons_222222_256x240.png");
}
*/



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

		Weekly timeline
		(bootstrap-like styles)

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

.date_time_container.week.time-grid {}
.date_time_container.week.startmatirx {}

#date_time_step.prev-next-block-on-top .date_time_container.week .week_timeselect_top2 {
    width: 100%;
    margin-bottom: 15px;
    text-align: center;
}
#date_time_step.prev-next-block-on-top .date_time_container.week .week_timeselect_top2 .date-title-container {
    padding: 10px;
    margin: 5px;
}
.date_time_container.week .week_timeselect_top2,
.date_time_container.week .time-select-week-container {
    display: inline-block;
    vertical-align: top;
}
.date_time_container.week .week_timeselect_top2 {
    /*width: 250px;*/
    margin-right: 10px;
}
.date_time_container.week .week_timeselect_top2 .date_title,
.date_time_container.week .week_timeselect_top2 .calendar-button-container,
.date_time_container.week .week_timeselect_top2 .calendar-button-container .calendar_button {
    display: inline-block;
}
.date_time_container.week .week_timeselect_top2 .calendar-button-container .calendar_button {
    margin: -3px 0 -8px 15px;
    padding: 15px;
    background: url(/common/images/g_calendar_gray_30.png) no-repeat top left;
    cursor: pointer;
}
.date_time_container.week .week_timeselect_top2 .calendar-button-container .calendar_button:hover {
    opacity: 0.7;
}
.date_time_container.week .week_timeselect_top2 .prev-next-button-container {}
.date_time_container.week .week_timeselect_top2 .prev-next-button-container div {
    display: inline-block;
}
.date_time_container.week .week_timeselect_top2 .prev-next-button-container #calendar div {
    display: block;
}
.date_time_container.week .week_timeselect_top2 #calendar {
    position: absolute;
    z-index: 100;
    margin-top: 5px;
    margin-left: 15px;
}

.date_time_container.week .week_timeselect_top2 .prev-next-button-container .text-container {
    padding: 5px;
    text-align: center;
    width: 100px;
    font-size: 15px;
    border: 1px solid transparent;
    border-radius: 2px;
    background: #0581B5;
    color: #FFFFFF;
    font-weight: bold;
}
.date_time_container.week .week_timeselect_top2 .prev-next-button-container .left-side-arrow,
.date_time_container.week .week_timeselect_top2 .prev-next-button-container .right-side-arrow {
    position: relative;
    width: 0;
    height: 0;
    top: 11px;
    border-top: 16px solid transparent;
    border-bottom: 16px solid transparent;
}
.date_time_container.week .week_timeselect_top2 .prev-next-button-container .left-side-arrow {
    border-right: 16px solid  #0581B5;
    position: relative;
    top: 8px;
}
.date_time_container.week .week_timeselect_top2 .prev-next-button-container .right-side-arrow {
    border-left: 16px solid  #0581B5;
    position: relative;
    top: 8px;
}
.date_time_container.week .week_timeselect_top2 .prev-next-button-container .arrow-button {
    margin-left: 2px;
}
.date_time_container.week .week_timeselect_top2 .prev-next-button-container .arrow-button:hover {
    cursor: pointer;
    opacity: 0.7;
}
.date_time_container.week .week_timeselect_top2 .prev-next-button-container .arrow-button.disable,
.date_time_container.week .week_timeselect_top2 .prev-next-button-container .arrow-button.disable:hover {
    opacity: 0.5;
    cursor: default;
}
.date_time_container.week .week_timeselect_top2 .prev-next-button-container .arrow-button.disable:hover .text-container {
    /*color: #777777;*/
}
.date_time_container.week .week_timeselect_top2 .prev-next-button-container .left-inner-arrow {
    margin-right: 10px;
}



/*----- Grid head   -----*/

.date_time_container.week .time-select-week-container table th,
.date_time_container.week  .time-select-week-container table td {
    text-align: center;
}
.date_time_container.week .week_timeselect_top2 .date-title-container,
.date_time_container.week  .time-select-week-container table th .day-div {
    padding: 5px 2px;
    text-align: center;
}
.date_time_container.week  .time-select-week-container table th .day-div {
    border: 1px solid #cccccc;
    border-radius: 3px;
    background: #f0f0f0;
}
.date_time_container.week .week_timeselect_top2 .date-title-container .date_title,
.date_time_container.week .time-select-week-container table th .day-div {
    color: #777777;
    font-size: 12px; /* since we show date in format "20 Oct, Mon"  */
    font-weight: normal;
}
.date_time_container.week .time-select-week-container table th .day-div {
    width: 70px;
    margin: 0px 3px 5px 3px;
}
.date_time_container.week  .time-select-week-container table th .day-div.week-end {
    background: #f5f5f5;
}



/*----- Grid content. Common classes   -----*/
.date_time_container.week.time-grid .time-select-week-container table td .time-select-div {
    cursor: pointer;
}
.date_time_container.week.time-grid .time-select-week-container table td .time-select-div.not_worked_time,
.date_time_container.week.time-grid .time-select-week-container table td .time-select-div.busy {
    cursor: default;
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table td .time-select-div:hover,
.date_time_container.week.time-grid.slots-weekly-timeline .time-select-week-container table td .time-select-div:hover {
    background: #cdf39c;
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table td .time-select-div.selected,
.date_time_container.week.time-grid.slots-weekly-timeline .time-select-week-container table td .time-select-div.selected {
    background: #a7e762;
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table td .time-select-div.busy,
.date_time_container.week.time-grid.slots-weekly-timeline .time-select-week-container table td .time-select-div.busy:hover {
    background: #ee8877;
}



/*-------------- Grid timeline classes  -------------------*/


.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container {
    margin-left: 0px;
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table {
    border-bottom: 1px solid #cccccc;
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table .lefttime-select-div {
    width: 68px;
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table th .day-div {
    width: 74px; /* fix for 14 Oct, Tue. also look commit #21842 - fix for week-AM\PM-flexible */
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table .time-select-div span,
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table .lefttime-select-div span {
    display: none;
    position: relative;
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table .lefttime-select-div.hour-start-div span {
    display: block;
    text-align: right;
    padding: 2px 3px;
    color: #666666;
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table td .time-select-div,
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table td .lefttime-select-div {
    border-top: 1px dotted #cccccc;
    border-right: 1px solid #cccccc;
    height: 10px;
    background: #ffffff;
}
.date_time_container.week.time-grid.leftside-weekly-timeline.double-height-slots .time-select-week-container table td .time-select-div,
.date_time_container.week.time-grid.leftside-weekly-timeline.double-height-slots .time-select-week-container table td .lefttime-select-div {
    height: 22px;
}
.date_time_container.week.time-grid.leftside-weekly-timeline.quad-height-slots .time-select-week-container table td .time-select-div,
.date_time_container.week.time-grid.leftside-weekly-timeline.quad-height-slots .time-select-week-container table td .lefttime-select-div {
    height: 40px;
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table td .time-select-div.hour-start-div,
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table td .lefttime-select-div.hour-start-div {
    border-top: 1px solid #cccccc;
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table td .lefttime-select-div {
    border-top-color: transparent;
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table td .time-select-div:hover {
    border-top: 1px solid #cccccc;
}
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table td .time-select-div.not_worked_time,
.date_time_container.week.time-grid.leftside-weekly-timeline .time-select-week-container table td .time-select-div.not_worked_time.busy {
    background: #eeeeee;
}
#timeline .tooltip {
    position: absolute;
    opacity: 0.8;
    margin-left: 10px;

    padding: 6px 12px;

    color: #444444;
    font-size: 15px;
    background: none repeat scroll 0 0 #f0f0f0;
    border: 1px solid #CCCCCC;
    border-radius: 4px;
}
.tooltip .tooltip-arrow {
    position: absolute;
    width: 20px;
    height: 11px;
    bottom: -11px;
    left: 0px;
    margin-left: 5px;
    background-image: url('/common/images/corner.png');
}

#timeline .leftside-weekly-timeline .time-select-div > div.in {
    width: 100%;
    height: 100%;
}



/*-------------- Slots timeline classes  -------------------*/

.date_time_container.week.time-grid.slots-weekly-timeline .lefttime-div {
    display: none;
}
.date_time_container.week.time-grid.slots-weekly-timeline .time-select-week-container table th .day-div,
.date_time_container.week.startmatrix .time-select-week-container table th .day-div {
    width: 80px;
    margin: 0px 7px 5px 0;
}
.date_time_container.week.startmatrix .time-select-week-container table td .time-select-div {
    font-size: 14px;
    line-height: 20px;
}
.date_time_container.week.time-grid.slots-weekly-timeline .time-select-week-container table td .time-select-div,
.date_time_container.week.time-grid.slots-weekly-timeline .time-select-week-container table td .lefttime-select-div,
.date_time_container.week.startmatrix .time-select-week-container table td .time-select-div {
    margin:  3px 7px 0 2px;
    padding: 2px 5px;
    background: #e6e6e6;
    border: 1px solid transparent;
}
.date_time_container.week.time-grid.slots-weekly-timeline .time-select-week-container table td .time-select-div,
.date_time_container.week.time-grid.slots-weekly-timeline .time-select-week-container table td .lefttime-select-div,
.date_time_container.week.startmatrix .time-select-week-container table td .time-select-div {
    /* height: 26px; javascript sets element style height now */
}
.date_time_container.week.time-grid.slots-weekly-timeline .time-select-week-container table td .time-select-div.not_worked_time,
.date_time_container.week.time-grid.slots-weekly-timeline .time-select-week-container table td .time-select-div.not_worked_time.busy {
    background: #cccccc;
    color: #999999;
}
/**********************************************

		Startmatrix timeline styles

***********************************************/
.date_time_container.week.startmatrix .time-select-week-container table td {
    vertical-align: top;
}
.date_time_container.week.startmatrix .time-select-week-container table td .time-select-div,
.date_time_container.week.startmatrix .time-select-week-container table td .time-select-div.busy:hover {
    border: 1px solid #cccccc;
    background: #efefef;
    color: #2b2b2b;
    border-radius: 2px;
    cursor: pointer;
}
.date_time_container.week.startmatrix .time-select-week-container table td .time-select-div.busy,
.date_time_container.week.startmatrix .time-select-week-container table td .time-select-div.busy:hover {
    opacity: 0.2;
    cursor: default;
}
.date_time_container.week.startmatrix .time-select-week-container table td .time-select-div:hover,
.date_time_container.week.startmatrix .time-select-week-container table td .time-select-div.selected {
    background: #a7e762;
}

.startmatrix .time-select-week-row .time-select-div {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

#timeline .day-offset {
    color: #777777;
    font-size: 9px;
    margin-left: -22px !important;
    margin-top: 12px !important;
    position: absolute;
    white-space: nowrap;
}

.pricing-col h2 {
    font-size: 25px;
}

.pricing-col .price {
    font-size: 23px;
}
#pageNotifications{
    display: table;
}

.booking-result .result-message span {
    display: table-cell;
    width: 100%;
}

.booking-result .result-message span.glyphicon {
    margin-right: 15px;
    width: 15px;
    vertical-align: middle;
}

div#widget_content {
    height: 450px;
}

.user-events-page h3 {
    clear: both;
}

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

	Bootstrap flexible timeline

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

/* date-time step layout */
#timeline.bootstrap.daily.flexible #date_start,
#timeline.bootstrap.daily.flexible #time_select {
    float: none;
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box;
}
#timeline.bootstrap.daily.flexible #time_select .timeline-grid-wrapper {
    display: block; /* fix */
    margin: 0;
}

/*---- use col-xs sizes for .long-timeframe and col-sm sizes for .short-timeframe ---*/
@media (min-width: 768px) {
    /*#timeline.bootstrap.daily.long-timeframe #date_start {*/
        /*width: 45%;*/
        /*margin-right: 1%;*/
    /*}*/
    /*#timeline.bootstrap.daily.long-timeframe #time_select {*/
        /*width: 54%;*/
    /*}*/
}
/* Extra small devices Phones (<768px) */
@media (max-width: 767px) {
    /*#timeline.bootstrap.daily.long-timeframe #date_start {*/
        /*width: 100%;*/
        /*margin-bottom: 20px;*/
    /*}*/
    /*#timeline.bootstrap.daily.long-timeframe #time_select {*/
        /*width: 100%;*/
    /*}*/
    #timeline.bootstrap.daily.long-timeframe .date-start-title {
        display: block;
    }
    #timeline.bootstrap.daily.long-timeframe #date_start {
        display: none;
    }
    #timeline.bootstrap.daily.long-timeframe #date_start .ui-datepicker {
        width: 100%;
    }
}
@media (min-width: 992px) {
    /*#timeline.bootstrap.daily.short-timeframe #date_start {*/
        /*width: 45%;*/
        /*margin-right: 1%;*/
    /*}*/
    /*#timeline.bootstrap.daily.short-timeframe #time_select {*/
        /*width: 54%;*/
    /*}*/
}
/* Medium devices Desktops (≥992px) */
@media (max-width: 991px) {
    #timeline.bootstrap.daily.short-timeframe #date_start {
        width: 100%;
        margin-bottom: 20px;
    }
    #timeline.bootstrap.daily.short-timeframe #time_select {
        width: 100%;
    }
    #timeline.bootstrap.daily.short-timeframe .date-start-title {
        display: block;
    }
    #timeline.bootstrap.daily.short-timeframe #date_start .ui-datepicker {
        width: 100%;
    }
    #timeline.bootstrap.daily.short-timeframe #date_start {
        display: none;
    }
}
#timeline.bootstrap .date-start-title {
    margin-bottom: 15px;
}
/*  date start title (brief date selector) : for daily (modern and flexible) timelines */
#timeline.bootstrap.daily .date-start-title {
    margin-bottom: 25px;
    display: none;
}
#timeline.bootstrap.daily .date-start-title .prev-button,
#timeline.bootstrap.daily .date-start-title .current-date,
#timeline.bootstrap.daily .date-start-title .next-button {
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
}
#timeline.bootstrap.daily .date-start-title .prev-button.disabled,
#timeline.bootstrap.daily .date-start-title .next-button.disabled {
    cursor: default;
}
#timeline.bootstrap.daily .date-start-title .prev-button.disabled .glyphicon,
#timeline.bootstrap.daily .date-start-title .next-button.disabled .glyphicon,
#timeline.bootstrap.daily .date-start-title .prev-button.disabled:hover .glyphicon,
#timeline.bootstrap.daily .date-start-title .next-button.disabled:hover .glyphicon {
    color: #dddddd;
}
#timeline.bootstrap.daily .date-start-title .prev-button,
#timeline.bootstrap.daily .date-start-title .next-button {
    width: 10%;
}
#timeline.bootstrap.daily .date-start-title .next-button {
    text-align: right;
}
#timeline.bootstrap.daily .date-start-title .prev-button .glyphicon,
#timeline.bootstrap.daily .date-start-title .next-button .glyphicon,
#timeline.bootstrap.daily .date-start-title .current-date .glyphicon {
    font-size: 2em;
    color: #666666;
}
#timeline.bootstrap.daily .date-start-title .prev-button:hover .glyphicon,
#timeline.bootstrap.daily .date-start-title .next-button:hover .glyphicon,
#timeline.bootstrap.daily .date-start-title .current-date:hover .glyphicon,
#timeline.bootstrap.daily .date-start-title .current-date:hover .title {
    color: #999999;
}
#timeline.bootstrap.daily .date-start-title .current-date {
    width: 77%;
    text-align: center;
}
#timeline.bootstrap.daily .date-start-title .current-date .glyphicon {
    font-size: 1.5em;
    position: relative;
    top: 5px;
}
#timeline.bootstrap.daily .date-start-title .current-date .title {
    font-size: 1.23em;
    margin-right: 10px;
}

/*---- Hour and minutes titles  -----*/
#timeline.bootstrap.daily.flexible #time_select {
    background: none;
    border: none;
    padding: 0;
}
#timeline.bootstrap.daily.flexible #time_select #time_grid {
    padding: 0;
    text-align: center; /* to have grid in the center of container */
}
#timeline.bootstrap.daily.flexible #time_select #time_grid .timeline-grid-wrapper {
    text-align: left;
}
#timeline.bootstrap.daily.flexible #time_select .timeline-grid {
    display: block;
}
#timeline.bootstrap.daily.flexible #time_select .timeline-grid.with-titles {
    width: auto;
}
#timeline.bootstrap.daily.flexible .timeline-grid .min-title {
    display: none;
}
#timeline.bootstrap.daily.flexible .timeline-grid .hour-row .hour-title {
    position: relative;
    vertical-align: top;
    padding: 2px 5px 0 0;
    border-right: 1px dotted #888888;
    font-size: 1.1em;
}
#timeline.bootstrap.daily.flexible .timeline-grid  .hour-row .hour-title .dot {
    position: absolute;
    right: 0;
    top: 0;
    margin-right: -5px;
    width: 10px;
    height: 10px;
    background: #555555;
    border-radius: 10px;
    box-shadow: 1px 1px 1px #888888;
}
#timeline.bootstrap.daily.flexible .timeline-grid .hour-row .hour-title .dot span {
    width: 4px;
    height: 4px;
    margin: 1px 0 0 1px;
    border-radius: 5px;
    background: #f0f0f0;
    display: inline-block;
}
#timeline.bootstrap.daily.flexible .timeline-grid .hour-row .hour-title .info {}
#timeline.bootstrap.daily.flexible .timeline-grid .hour-row .hour-title .info .time,
#timeline.bootstrap.daily.flexible .timeline-grid .hour-row .time-items .time-item .time {}
#timeline.bootstrap.daily.flexible .timeline-grid .hour-row .hour-title .info .am-pm,
#timeline.bootstrap.daily.flexible .timeline-grid .hour-row .time-items .time-item .am-pm {
    font-size: 0.7em;
}
#timeline.bootstrap.daily.flexible .timeline-grid .hour-row .hour-title .info .day-offset {
    display: block;
    position: relative;
    margin: 0 !important;
    opacity: 0.7;
    font-size: 0.7em;
}
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .day-offset {
}
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items {
    padding: 5px 5px 5px 15px !important;
}

#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item {
    border: none;
    display: inline-block;
    margin: 1px;
}
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div {
    float: none;
    height: auto;
    line-height: 25px;
    box-sizing: border-box;

    padding: 3px 7px;
    background: #fafafa;
    border: 1px solid #eeeeee;
    border-radius: 3px;
    min-width: 5.5em;
    box-shadow: 1px 1px 1px #999999;
}
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div:hover,
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div.selected {
    background: none repeat scroll 0 0 #666666; /* #5caeff; colored */
    border: 1px solid #666666; /* #5caeff; colored  */
}
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div:hover span,
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div.selected span {
    color: #ffffff;
}
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div.reserved_time,
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div.reserved_time:hover {
    cursor: default;
    border: 1px solid #eeeeee;
    box-shadow: none;
    background: repeating-linear-gradient(
            45deg,
            #f0f0f0,
            #f0f0f0 10px,
            #dddddd 10px,
            #dddddd 20px
    );
}
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div.reserved_time span,
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div.reserved_time:hover span {
    color: #666666;
}
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div.not_worked_time,
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div.not_worked_time:hover {
    background: #f0f0f0;
    border: 1px solid #f0f0f0;
    opacity: 0.5;
    cursor: default;
    box-shadow: none;
}
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div.not_worked_time span,
#timeline.bootstrap.daily.flexible #time_select .timeline-grid .hour-row .time-items .time-item .time-select-div.not_worked_time:hover span {
    color: #666666;
}
#timeline.bootstrap .day-offset-warning {
    padding: 10px;
}

.date_time_container.week.startmatrix .time-select-week-container table td .time-select-div:hover, .date_time_container.week.startmatrix .time-select-week-container table td .time-select-div.selected {
    background: #A0D3FF !important;
}

.date_time_container.week.startmatrix .time-select-week-container table td .time-select-div:hover, .date_time_container.week.startmatrix .time-select-week-container table td .time-select-div.selected {
    background: #A0D3FF !important;
}

.date_time_container.week .week_timeselect_top2{
    margin-right:auto;
    margin-top: 6px;
}

#timeline #client_form .client_form_wrapper, #timeline #client_form #additional_fields, #timeline #client_form #redeem_code{
    width: 100% !important;
}

#timeline #client_form #redeem_code label{
    font-size: 20px;
    margin-top: 6px;
    /*font-weight: bold;*/
}


.date_time_container.week .time-select-week-container table{
    width: 100%;
}


.date_time_container.week .week_timeselect_top2 .prev-next-button-container { /* arrows */
    text-align: center;
}

#timeline.bootstrap #client_info_step .step-content{
    margin:0px;
}

div.booking-result{
    padding: 0px 0px 15px 0px;
}

.pricing-col ul li:nth-child(odd) {
    background-color: #D4D4D4;
}

.noweek_bottom_info{
    min-width: 350px;
    max-width: 350px;
    margin-left: 20px;
}

.step .noweek_bottom_info{
    min-width: inherit;
    max-width: none;
    margin-left: auto;
}

.ui-dialog.ui-widget {
    max-width: 100%;
}


/* mini arrow */
@media (min-width: 1000px) and (max-width: 1330px) {

    .date_time_container.week .week_timeselect_top2 .prev-next-button-container .arrow-button .text-container {
        display: none;
    }
}


/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 1000px) {

    div#timeline.bootstrap.daily.long-timeframe #date_start {
        width: 52%;
        margin-right: 1%;
    }

    div#timeline.bootstrap.daily.long-timeframe #time_select {
        width: 47%;
    }

    .noweek_bottom_info{
        min-width: inherit;
        max-width: none;
        margin-left: auto;
    }

    .date_time_container.week .week_timeselect_top2 .prev-next-button-container {
        margin-bottom: 20px;
    }

    .week_timeselect_bottom{
        border:1px solid rgba(0, 0, 0, 0.1);
        padding: 10px;
    }

    #timeline.bootstrap .bottom-info.week_timeselect_bottom .service-name {
        padding: 0px;
    }

    #step_info_container .step-header{
        /*width:100% !important;*/
    }

}



@media (max-width: 768px) {

    .noweek_bottom_info{
        width: auto;
        margin-left: auto;
    }

    .date_time_container.week .week_timeselect_top2 .prev-next-button-container {
        text-align: center;
        margin-bottom: 20px;
    }

    .week_timeselect_bottom{
        border:1px solid rgba(0, 0, 0, 0.1);
        padding: 10px;
    }

    #timeline.bootstrap .bottom-info.week_timeselect_bottom .service-name {
        padding: 0px;
    }

    #step_info_container .step-header{
        width:100% !important;
    }

    #timeline.bootstrap #client_form .client_form_wrapper .zend_form dd input[name='client_phone_area_code'] {
        width: 17% !important;
    }

    #timeline .ui-combobox-toggle {
        width: 10% !important;
    }

    #timeline.bootstrap #client_form #client_phone_number {
        width: 73% !important;
    }

    #timeline.bootstrap #client_info_step #booked_list .book-item,
    #timeline.bootstrap #client_info_step #booked_list .book-item.current-booking {
        width: 100%;
    }
}