/* ==========================================
   HARBOUR ROAD PICKLEBALL BOOKING
   ========================================== */

/* Fonts */
#fbuilder,
#fbuilder *{
    font-family: "Montserrat", Arial, sans-serif;
}

/* Labels */
#fbuilder label,
#fbuilder span.uh,
#fbuilder .fields label{
    color:#28256A !important;
    font-weight:600;
}

/* General text */
#fbuilder,
#fbuilder p,
#fbuilder div,
#fbuilder span{
    color:#28256A;
}

/* Headings */
#fbuilder h1,
#fbuilder h2,
#fbuilder h3{
    color:#28256A;
    font-weight:700;
}

/* Calendar Month */
#fbuilder .ui-datepicker-title{
    color:#28256A !important;
    font-weight:700;
}

/* Weekday names */
#fbuilder .ui-datepicker th{
    color:#28256A !important;
}

/* Calendar numbers */
#fbuilder .ui-datepicker td a{
    color:#28256A !important;
}

/* Selected day */
#fbuilder .ui-datepicker-current-day a{
    background:#28256A !important;
    color:#ffffff !important;
}

/* Available time buttons */
#fbuilder .slots a{
    border:2px solid #28256A;
    color:#28256A !important;
    background:#ffffff;
    border-radius:30px;
    transition:.3s;
}

/* Hover */
#fbuilder .slots a:hover{
    background:#28256A !important;
    color:#ffffff !important;
}

/* Selected time */
#fbuilder .slots .currentSelection a{
    background:#28256A !important;
    color:#ffffff !important;
}

/* Inputs */
#fbuilder input,
#fbuilder textarea,
#fbuilder select{
    border:1px solid #d8d8d8;
    border-radius:6px;
    padding:12px;
    color:#28256A;
}

/* Placeholder */
#fbuilder input::placeholder,
#fbuilder textarea::placeholder{
    color:#888;
}

/* Submit button */
#fbuilder input[type=submit]{
    background:#28256A !important;
    color:#fff !important;
    border:none;
    border-radius:30px;
    padding:14px 40px;
    font-weight:700;
    letter-spacing:1px;
    text-transform:uppercase;
}

#fbuilder input[type=submit]:hover{
    background:#861B3E !important;
}

/* Captcha */
.captcha{
    color:#28256A !important;
}

/* Existing slot spacing */
#fbuilder .slots{
    text-align:center;
    padding:10px 10px 50px;
}

/* Responsive */
@media(max-width:700px){

    #fbuilder .ui-datepicker{
        margin:10px;
        padding:10px;
    }

}

@media(min-width:701px) and (max-width:950px){

    #fbuilder .ui-datepicker{
        margin:20px;
        padding:20px;
    }

}

@media(min-width:951px){

    #fbuilder .ui-datepicker{
        padding:20px;
        margin:60px auto;
        max-width:850px;
    }

}