/*label.error {*/
    /*background: #ff4444;*/
    /*color: white;*/
    /*border-radius: 5px;*/
    /*padding: 5px 11px 5px 31px;*/
    /*display: inline-block;*/
    /*/!*position: relative;*!/*/
/*}*/
label.error:before {
    content: "\f071";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    margin-right: 5px;
    /*position: absolute;*/
    /*top: 4px;*/
    /*left: 7px;*/
}
.hidden {
    display: none;
}
#wut_booking_form .wut_form_title {
    margin: 20px 0 40px 0;
    color: #1a4f81;
    font-weight: 300;
}
#wut_booking_form .wut_form_title span {
    margin: 20px 0 40px 0;
    color: #1a4f81;
    font-weight: 400;
}
#wut_booking_form {
    position: relative;
    margin: 0 auto;
    /*min-height: 450px;*/
    margin-bottom: 40px;
    max-width: 720px;
    font-size: 11px;
    border: 1px solid #000;
    padding: 40px;
}
#wut_booking_form .wut_preloader {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 100;
    background: url('img/725.GIF');
    background-position: center;
    background-repeat: no-repeat;
    background-color: white;
}
#wut_booking_form h3 {
    color: #fb5022;
    font-size: 14px;
    clear: both;
}
#wut_booking_form label {
    color: #646464;
}
#wut_booking_form input[type="text"],#wut_booking_form input[type="tel"] {
    border: 1px solid #646464;
    padding: 3px;
    color: #646464;
    width: 30%;
}
#wut_booking_form h3 i {
    padding-left: 20px;
    font-size: 18px;
    cursor: pointer;
}
#wut_booking_form .help_wrapper {
    position: relative;
    display: inline-block;
    z-index: 10;
}
#wut_booking_form .wut_help {
    display: none;
    position: absolute;
    top: 0;
    left: 40px;
    width: 210px;
    height: auto;
    font-size: 11px;
    color: #646464;
    background: white;
    border: 1px solid #fb5022;
    border-radius: 5px;
    padding: 10px;
    line-height: 16px;
}
#wut_booking_form .removePerson {
    font-size: 24px;
    cursor: pointer;
    color: #fa501f;
    /*line-height: 60px;*/
    float: left;
}
#wut_booking_form .remove_person_text {
    font-size: 13px;
    color: black;
    font-weight: 300;
    padding: 10px;
    position: relative;
    top: -2px;
}
#wut_booking_form > div {
    width: 100%;
}
#wut_booking_form .wut_label {
    /*width: 39%;*/
    /*float: left;*/
    text-align: right;
    padding-right: 1%;
    /*margin-bottom: 10px;*/
    height: 30px;
}
.wut_field > label:first-of-type {
    width: 38%;
    float: left;
    padding-left: 1%;
    padding-right: 10px;
    text-align: right;
    margin-right: 5px;
    /*margin-bottom: 10px;*/
}
/*.wut_field input {*/
    /*width: 40%;*/
    /*float: left;*/
    /*padding-left: 10px;*/
/*}*/
#wut_booking_form .wut_field {
    position: relative;
    width: 100%;
    float: left;
    padding-left: 1%;
    /*margin-bottom: 10px;*/
    min-height: 30px;
}

.cl {
float: left;
    line-height: normal;
    text-align: center;
    margin-left: 5px;
    width:25%;
}

.cl b {
    font-size: 16px;
    text-decoration: none !important;
    font-weight: bold;
    color: #E84D15;
}

.check_data {
    font-size: 15px !important;
    border-top: 1px;
    border-bottom: 1px;
    border-style: solid;
    border-color:#909090;
    padding: 7px 0;
    margin-bottom: 7px;
}

#wut_confirm_data_section .wut_no_label_field {
    padding-left: 10px !important;
}

#wut_confirm_data_section .wut_no_label_field h3 {
    font-size: 16px;
}

#wut_confirm_data_section .discount {
    display: none;
}

#wut_booking_form .wut_field input,#wut_booking_form .wut_field select {
    font-size: 11px;
}

#wut_booking_form .wut_no_label_field {
    position: relative;
    width: 100%;
    padding-left: 41%;
    clear: both;
   /* margin-bottom: 10px;*/
    height: 30px;
}
#wut_booking_form .wut_field_left {
    position: relative;
    width: 100%;
    /*margin-bottom: 20px;*/
    height: 30px;
    clear: both;
}
#wut_booking_form button {
    background-color: #e54100;
    padding: 0 14px;
    border: none;
    font-weight: 500;
    color: white;
    font-size: 12px;
    line-height: 34px;
    text-transform: uppercase;
    cursor: pointer;
}
#wut_booking_form button .fa-angle-right {
    padding-left: 50px;
    font-size: 16px;
}
#wut_booking_form button .fa-angle-left {
    padding-right: 50px;
    font-size: 16px;
}

#wut_navigation_buttons {
    clear: both;
    height: 34px;
}
#wut_booking_form #wut_add_person_button, #wut_booking_form #wut_add_child_button {
    background-color: transparent;
    /*line-height: 20px !important;*/
    float: left;
}

#wut_add_person_button i, #wut_add_child_button i {
    font-size: 25px;
    color: #0cd227;
    cursor: pointer;
}
#wut_add_child_section, #wut_add_person_section {
    clear: both;
    /*line-height: 57px;*/
    min-height: 30px;
}
#wut_next_button {
    float: right;
    margin-right: 2.5%;
}
#wut_next_button:hover,#wut_prev_button:hover{
    background-color: #f84100 !important;
}
#wut_booking_form #wut_prev_button {
    float: left;
    margin-left: 2.5%;
    border: 2px solid #b0b0b0;
    color: #b0b0b0;
    background-color: white;
    line-height: 30px;
}
#wut_booking_form #wut_prev_button i {
    color: #b0b0b0;
}
#wut_booking_form .wut_textarea, #wut_booking_form .wut_textarea textarea{
    /*height: 150px;*/
}
#wut_booking_form .wut_added_person {
    clear: both;
}
#wut_booking_form #wut_submit_button {
    position: absolute;
    bottom: 40px;
    right: 40px;
}
#wut_booking_form .wut_select select {
    background: transparent;
    width: 100%;
    padding: 1px 3px 3px 3px;
    font-size: 11px;
    line-height: 1;
    border: 0;
    border-radius: 0;
    height: 25px;
    -webkit-appearance: none;
}
#wut_booking_form .wut_select {
    width: 31%;
    height: 21px;
    overflow: hidden;
    background: url(img/arrowdown.png) no-repeat 98% #fff;
    border: 1px solid #949494;
    float: left;
}

span[id$="level_check"] {
    padding-left: 5px;
}
/* error messages */

.wut_no_label_field label.error,.wut_field_left label.error,.wut_select label.error,.lesson_type .error {
    padding-left: 1% !important;
}

.wut_select label.error {
    position: absolute !important;
    top: 24px !important;
}

#wut_booking_form label.error {
    display: block;
    width: 100%;
    float: left;
    /*height: 30px;*/
    background: none;
    color: #e80000;
    padding-top: 0px;
    text-align: left;
    padding-left: 41%;
    /*position: absolute;*/
    /*top: 24px;*/
}
#wut_booking_form .wut_select label.error {
    top: 32px;
}
#wut_booking_form .error:before {
    content: "\f0aa";
    /*top: 0px;*/
}
#wut_booking_form .error {
    border-color: #e80000!important;
}
/* force datepicker on top */
.ui-datepicker {
    z-index: 1000!important;
}
/* bubble nav */
#wut_bubble_nav {
    width: 90%;
    margin: auto;
}
#wut_bubble_nav .bubble, #wut_bubble_nav .line_between_bubbles, #wut_bubble_nav .under_bubble_text {
    /*float: left;*/
}
#wut_bubble_nav .bubble_container {
    width: 100%;
    text-align: center;
}
#wut_bubble_nav .bubble {
    display: inline-block;
    width: 4%;
    height: 4%;
    border-radius: 100px;
    border: 3px solid #b7b7b7;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    line-height: 45px;
    color: #b7b7b7;
}
#wut_bubble_nav .bubble.full {
    border: 3px solid #e54100;
    background-color: #e54100;
    color: white;
    cursor: pointer;
}
#wut_bubble_nav .line_between_bubbles {
    position: relative;
    top: -2px;
    display: inline-block;
    height: 7px;
    width: 19%;
    border-radius: 3px;
    background-color: #b7b7b7;
    margin-left: 0.5%;
    margin-right: 0.5%;
}
#wut_bubble_nav .line_between_bubbles.full {
    background-color: #e54100;
}
#wut_bubble_nav .under_bubbles {
    text-align: center;
}
#wut_bubble_nav .under_bubbles .under_bubbles_text {
    text-align: center;
    color: #707070;
    display: inline-block;
    width: 17%;
    margin: 10px 4%;
}
.section_title {
    background: url(img/2015/09/line-bg1.png);
    background-size: 4.5px;
    padding: 7px 15px;
    margin: 10px 0 10px 0;
}
.section_title_right {
    background: url(img/2015/09/line-bg1.png);
    background-size: 4.5px;
}
.section_title_no_padding {
    background: url(img/2015/09/line-bg1.png);
    background-size: 4.5px;
    margin: 10px 0;
    /*height: 60px!important;*/
    float: left;
    padding: 7px 15px;
    width: 100%;
}
.section_title_no_padding h3 {
    /*line-height: 60px;*/
    width: 39%;
    text-align: left;
    float: left;
    /*padding-left: 30px;*/
}
/* popup styling. Also privacy policy popup */
#wut_booking_form .wut_popup {
    display: none;
    position: fixed;
    top: 7%;
    left: 7%;
    margin: auto;
    width: 80%;
    min-height: 200px;
    max-height: 360px;
    /*overflow-y: auto;*/
    padding: 0 0 40px;
    background: white;
    border: 1px solid #e54100;
    z-index: 2000;;
}

.wut_popup p {
    font-size: 11px;
}

.wut_popup ol {
    padding-left:15px;
}

.wut_popup div:first-of-type {
    padding: 10px;
    overflow-y: auto;
    max-height: 280px;
}

#wut_level_checking {
    /*width: 620px !important;*/
    max-height: 500px !important;
    /*left: auto !important;*/
}

#wut_booking_form .wut_popup h3.wut_title {
    display: block;
    text-align: center;
    background-color: #e54100;
    color: white;
    padding: 10px;
    font-size: 16px;
}

#wut_booking_form .wut_confirm_popup {
    padding: 10px 20px;
    font-size: 16px;
    background-color: white;
    color: #e54100;
    border: 2px solid #e54100;
    margin: 5px 6% 0px 80%;
    cursor: pointer;
}
#wut_booking_form .wut_confirm_popup:hover {
    padding: 10px 20px;
    background-color: #e54100;
    color: white;
    border: 2px solid #e54100;
}
#wut_booking_form .wut_clickable {
    cursor: pointer;
    text-decoration: underline;
}
/* phone inputs */
#wut_booking_form #wut_phone_area_code {
    width: 3%;
}
#wut_booking_form #wut_phone {
    width: 26%;
}
.error_on_top {
    z-index: 2!important;
    background-color: white!important;
    padding-bottom: 0!important;
    top: 27px!important;
    line-height: 22px!important;
}
/* calendar icon on date inputs */
.ui-datepicker-trigger {
   vertical-align: middle;
    padding-bottom: 2px;
    margin-left: 5px;
}
/* hidden fields by default */
.wut_hidden {
    display: none;
}

.wut_packages {
    display: block;
    float: left;
    text-align: center;
    border-spacing: 2px;
    border-collapse: separate;
    font-size: 11px;
    font-family: 'Lato',sans-serif;
    color: #fff;
}

.wut_packages td,.wut_packages th {
    height: 15px;
    padding: 0px 2px 0px 2px;
}
.wut_packages tr th {
    min-width: 30px;
    background-color: #757b85;
}
.wut_packages .notselectable {
    background-color: #fff !important;
}
.wut_packages td:first-of-type,.wut_packages tr:nth-child(even) th:not(:first-of-type) {
    background-color: #535762 !important;
}
.wut_packages tr:first-of-type th:nth-child(3),.wut_packages tr:nth-child(odd) td:nth-last-child(-n+3) {
    background-color: #55a838;
}
.wut_packages tr:nth-child(even) td:nth-last-child(-n+4)/*,.wut_packages tr:nth-child(even) th:nth-last-child(-n+3)*/ {
    background-color: #95cc56;
}
.wut_packages tr:first-of-type th:nth-child(2),.wut_packages tr:nth-child(odd) td:nth-child(-n+4) {
    background-color: #44a2d4;
}
.wut_packages tr:nth-child(even) td:nth-child(-n+4) {
    background-color: #64c2dd;
}
.wut_packages .selectable:hover,.wut_packages .selected {
    cursor: pointer;
    cursor: hand;
    background-color: #F3D229 !important;
    color: #000 !important;
}
.smalldp {
     width: 60px !important;
 }

.scheduler i.fa-plus-circle:before,.lesson_type i.fa-plus-circle:before,.care_scheduler i.fa-plus-circle:before {
    font-size: 11px;
    color: #0cd227;
}

.scheduler i.fa-times-circle:before,.lesson_type i.fa-times-circle:before,.care_scheduler i.fa-times-circle:before {
    font-size: 11px;
    color: #fa501f;
    cursor: pointer;
    cursor: hand;
}

.scheduler button,.lesson_type button,.care_scheduler div button {
    background-color: transparent !important;
    color: #909090 !important;
    text-transform: none !important;
    font-size: 11px !important;
}
.scheduler,.lesson_type {
    width: 290px;
    float: left;
}

.helpbox {
    width: 120px;
    border: 1px solid #fb5022;
    line-height: normal;
    padding: 3px;
    float: right;
    border-radius: 5px;
    text-align: center;
}
.tooltip{
    display: inline;
    position: relative;
    text-align: left;
}

.tooltip:hover:after{
    bottom: 26px;
    content: attr(data-tooltip);
    left: -150px;
    position: absolute;
    z-index: 98;
    width: 200px;
    font-size: 12px;
    color: #646464;
    background: white;
    border: 1px solid #fb5022;
    border-radius: 5px;
    padding: 10px;
    line-height: 16px;
    font-family: 'Lato',sans-serif !important;
}

#wut_finishing_buttons_section {
    text-align: center;
}

#wut_shop_redirection {
    margin-left: 30px
}
/* ---------------------------------------------------------------------------
   Additions for the rewritten form. Everything above is the stylesheet the
   WordPress plugin shipped, kept so the form looks the way clients know it.
   Below: the classes this version introduces, plus the narrow-screen rules the
   original never had (it was drawn for a 670px iframe).
   --------------------------------------------------------------------------- */

.hidden { display: none !important; }

body {
    margin: 0;
    padding: 16px;
    background: #fff;
    font-family: Verdana, Geneva, sans-serif;
}

#wut_booking_form { margin: 0 auto; }

/* The help icon, in place of the Font Awesome glyph the plugin loaded. */
.help_wrapper { position: relative; display: inline-block; margin-left: 6px; }
.help_icon {
    display: inline-block; width: 16px; height: 16px; line-height: 16px;
    border-radius: 50%; background: #0a6ebd; color: #fff;
    font-size: 11px; text-align: center; cursor: help; font-weight: bold;
}
.help_wrapper .wut_help {
    display: none; position: absolute; z-index: 30; left: 22px; top: -4px;
    width: 260px; padding: 10px; background: #fff; color: #333;
    border: 1px solid #ccc; box-shadow: 0 2px 8px rgba(0,0,0,.15);
    font-size: 12px; font-weight: normal; line-height: 1.4;
}
.help_wrapper:hover .wut_help, .help_wrapper:focus-within .wut_help { display: block; }

.error_on_top {
    margin: 12px 0; padding: 10px 12px;
    background: #fdecea; border: 1px solid #f5c6cb; color: #8a1f1f;
    font-size: 13px;
}

.wut_participant { padding-bottom: 8px; border-bottom: 1px solid #eee; margin-bottom: 16px; }
.wut_participant:last-child { border-bottom: none; }
.removePerson {
    float: right; border: none; background: none; cursor: pointer;
    font-size: 20px; line-height: 1; color: #b00; padding: 0 4px;
}
.remove_person_text { float: right; cursor: pointer; font-size: 11px; color: #b00; padding-top: 5px; }

.dob_sep { padding: 0 4px; }
.smalldp { width: 42px !important; text-align: center; }
.smalldp.year { width: 62px !important; }

#wut_add_person_button {
    width: 32px; height: 32px; border-radius: 50%; border: none;
    background: #0a6ebd; color: #fff; font-size: 20px; line-height: 1; cursor: pointer;
}
#wut_add_person_label { display: inline-block; margin-left: 10px; vertical-align: super; }

/* Package grid: the price table the client picks a cell from. */
.package_grid { overflow-x: auto; }
table.wut_packages { border-collapse: collapse; width: 100%; }
table.wut_packages th, table.wut_packages td {
    border: 1px solid #ddd; padding: 8px 6px; text-align: center; font-size: 13px;
}
table.wut_packages td.selectable { cursor: pointer; }
table.wut_packages td.selectable:hover { background: #eaf4fc; }
table.wut_packages td.selectable.green { background: #e8f6e8; }
table.wut_packages td.selectable.chosen { background: #0a6ebd; color: #fff; font-weight: bold; }

.scheduler { margin: 12px 0; }
.session_row { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; flex-wrap: wrap; }
.session_row input[type="date"], .session_row select { padding: 6px; }
.remove_session, .add_session { border: 1px solid #ccc; background: #f7f7f7; cursor: pointer; padding: 6px 10px; }

.check_data div { padding: 3px 0; font-size: 13px; }
.check_data div span { display: inline-block; min-width: 150px; font-weight: bold; }

.wut_popup {
    position: fixed; z-index: 50; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: min(720px, 92vw); max-height: 86vh; overflow: auto;
    background: #fff; border: 1px solid #ccc; box-shadow: 0 4px 24px rgba(0,0,0,.25); padding: 18px;
}
.wut_popup .popup_body iframe { width: 100%; height: 60vh; border: none; }
.wut_popup .wut_confirm_popup {
    position: absolute; top: 8px; right: 12px; cursor: pointer;
    font-weight: bold; color: #666; padding: 4px 8px;
}
.popup_backdrop { position: fixed; z-index: 40; inset: 0; background: rgba(0,0,0,.45); }
.levels { line-height: 1.8; font-size: 13px; }

#wut_navigation_buttons button { cursor: pointer; }
#wut_submit_button {
    background: #0a6ebd; color: #fff; border: none; padding: 10px 22px; font-size: 15px; cursor: pointer;
}
#wut_submit_button[disabled] { opacity: .6; cursor: progress; }

#wut_finishing_buttons_section { text-align: center; padding: 40px 16px; }

/* Phone and small tablet: the plugin assumed a fixed-width iframe and broke below it. */
@media (max-width: 640px) {
    body { padding: 10px; }
    #wut_booking_form label { display: block; width: auto; text-align: left; margin-bottom: 4px; }
    #wut_booking_form input[type="text"], #wut_booking_form input[type="tel"],
    #wut_booking_form input[type="email"], #wut_booking_form textarea { width: 100%; box-sizing: border-box; }
    .wut_select select { width: 100%; box-sizing: border-box; }
    .wut_field.phone #wut_phone_area_code { width: 60px; }
    .wut_field.phone #wut_phone { width: calc(100% - 70px); }
    .smalldp { width: 52px !important; }
    .help_wrapper .wut_help { left: auto; right: 0; width: min(260px, 70vw); }
    .under_bubbles_text { font-size: 9px; }
    .check_data div span { display: block; min-width: 0; }
}
