@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
body{
    margin:0;
    font-family: "Montserrat", sans-serif;
    color:#333;
    overflow-x:hidden;
}
a {text-decoration:none;color:inherit;}
h1, h2, h3 {
    margin: 0;
    padding: 0;
    font-size: inherit;
    font-weight: inherit;
}
.section-holder {
    padding:50px 15px;
    display:flex;
    flex-direction:column;
    align-items:center;
}
.logo-holder img{max-height:45px;}
.header-holder {padding:15px 0;display:flex;justify-content:center;background:#ffffff;position:sticky;top:0;box-shadow:0 0 12px #00000012;z-index:2;}
.header-holder .menu {display:flex;flex-wrap:wrap;justify-content:center;gap:20px;}
.header-holder .menu .menu-item {font-size:16px;line-height:24px;font-weight:700;text-transform:capitalize}
@media screen and (min-width:768px){
#hero.section-holder {
    padding-top:100px;
    padding-bottom:100px;
}
}
#hero.section-holder .section-title, #hero.section-holder .section-subtitle{
    max-width:550px;
}
.section-holder .container, .header-holder .container {
    width:100%;
    max-width:1300px;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-items:center;
    gap:30px;
    margin:0 15px;
}
.section-holder .container .text, .section-holder .container .image {
    flex:1;
    display:flex;
    flex-direction:column;
    gap:30px;
}
.section-holder .container .text .buttons {
    display:flex;
    gap:10px;
}

.section-holder .container .text .section-label{
    font-size:16px;
    line-height:24px;
    font-weight:700;
}

.section-holder .container .text .section-title{
    font-size:56px;
    line-height:62px;
    font-weight:700;
}

.section-holder .container .text .section-subtitle{
    font-size:20px;
    line-height:30px;
    font-weight:400;
}

.section-holder .container .text .title-holder {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.section-holder .container .image img {border-radius:35px;}

img.responsive{max-width:100%;width:auto;height:auto}

.btn {
    text-decoration:none;
    border-radius:5px;
    padding:15px 40px;
    font-size:14px;
    line-height:22px;
    font-weight:700;
    transition:all 0.5s;
}
.btn.appointment {border:none;}
.btn:hover{
    padding:15px 45px;
}

.categories-holder {
    display:flex;
    flex-wrap:wrap;
    gap:30px;
}
.categories-holder .category-box {
    flex:1;
    min-width:min(635px, 100%);
    display:flex;
    flex-direction:column;
    border-radius:10px;
    background:#fff;
    box-shadow:0 5px 20px 0 #00000010;
}
.categories-holder .category-box img {
    border-radius:10px;
    width:auto;
    max-height:350px;
    object-fit:cover;
}

.category-box-text {
    padding:20px;
    display:flex;
    flex-direction:column;
    gap:2px;
}
.category-box-title {
    font-size:16px;
    line-height:24px;
    font-weight:700;
    color:#252B42;
}
.category-box-description {
    font-size:14px;
    line-height:20px;
    font-weight:400;
    color:#737373;
    margin-top:5px;
}

.category-box-product {
    display: flex;
    gap: 10px;
    justify-content: space-between;
    align-items:center;
    border-bottom: solid 1px #170F49;
    padding-bottom: 3px;
    margin-bottom: 6px;
    font-size: 18px;
    line-height: 30px;
    color: #6F6C90;
}

.users-holder {
    display:flex;
    flex-wrap:wrap;
    gap:20px;
}
.users-holder .user-box {
    background:#fff;
    display:flex;
    flex-direction:column;
    gap:20px;
    padding:20px;
    border-radius:10px;
    box-shadow:0 5px 20px 0 #00000010;
}
.users-holder .user-box img, .user-box.doctor img, .user-box.location img {
    width:270px;
    height:350px;
    object-fit:cover;
    border-radius:10px;
}
.users-holder .user-box .user-box-text {
    display:flex;
    flex-direction:column;
    gap:20px;
    max-width:270px;
}
.users-holder .user-box .user-box-title {
    font-size:16px;
    line-height:24px;
    font-weight:700;
    color:#252B42;
}
.users-holder .user-box .user-box-separator{
    display:block;
    width:50px;
    height:2px;
    background:#E74040;
}
.users-holder .user-box .user-box-description {
    font-size:14px;
    line-height:20px;
    font-weight:400;
    color:#737373;
}
.users-holder .user-box.location img {
    width: 100%;
    height: auto;

}
.users-holder .user-box.location {
    flex: 1;
    min-width: 250px;

}


/* Media q */
@media screen and (max-width:1090px){
    .section-holder .container {
        flex-direction:column;
    }
}


.step-container {
    display: none;
}
.step-container.active {
    display: block;
}
.service button,.service button:hover {
    padding: 5px 10px;
    font-size: 14px;
}
#calendar {
    width:100%;
    max-width: 800px;
}
#available-hours select {
    padding: 10px;
    font-size: 16px;
    margin-top: 10px;
}
#hours {
    width: 200px;
    border: solid 2px #f1f1f1;
    display: flex;
    flex-direction: column;
    padding: 10px;
    max-height: 631px;
    overflow-x: auto;
}
#hours .hour{
    display: flex;
    gap:2px;
    flex-direction: column;
}
.calendar-box {
    width:100%;
    display: flex;
    gap: 20px;
    justify-content: center;
}
@media screen and (max-width:500px){
    .calendar-box {flex-direction:column;}
}
.inactive-event {opacity:1!important;border:none!important;}
.inactive-event .fc-event-title {color:#333!important}
.fc-day-today {background: #62c05026 !important;border: none !important;} 

.footer-box {
    display:flex;
    flex-direction:column;
    gap:20px;
}
.footer-box-title{
    font-size:16px;
    line-height:24px;
    font-weight:700;
    color: #252B42;
}
.footer-box-menu, .footer-box.social .anpc-icons {
    display:flex;
    flex-direction:column;
    gap:10px;
}
.footer-menu-item {
    font-size:14px;
    line-height:24px;
    font-weight:700;
    color:#737373;
    text-transform:capitalize;
}

#footer.section-holder {
    box-shadow: 0 0 12px #00000012;
}


#footer.section-holder .container {
    align-items: stretch;
}

.logo-holder.footer-box {
    justify-content: center;
}
.footer-box.social .footer-box-menu {
    flex-direction:row;
}
.footer-box.social .footer-box-menu i {font-size:24px}


@media screen and (max-width:768px){
    .section-holder {padding:30px 15px;}
    .section-holder .container .text, .section-holder .container .image {gap:20px;}
    .section-holder .container .text .section-label {font-size:15px;line-height:24px;}
    .section-holder .container .text .section-title {font-size:40px;line-height:42px;}
    .section-holder .container .text .section-subtitle {font-size:17px;line-height:26px;}
    .btn, .btn:hover {padding:10px 20px;}
    .category-box-product {font-size:16px;}
    .users-holder .user-box {width:100%;}
    .users-holder .user-box img {width:100%;height:auto;}
    .footer-box {align-items: center;text-align: center;}
    #contact.section-holder .text {text-align:center;}
    #contact.section-holder .text .buttons {justify-content:center;}
    .categories-holder, .users-holder {gap:15px;}
}

/* MENU */
.no-scroll {overflow:hidden;}
@media screen and (min-width:768px){
    .mobile-menu-trigger {display:none;}
    .mobile-menu {display:none;}
}
@media screen and (max-width:768px){
    .menu-holder, #header .container > .btn.appointment {display:none;}
    .mobile-menu {
        justify-content:space-between;
        gap:30px;
        display:flex;
        flex-direction:column;
        position:fixed;
        background:#fff;
        top:0;right:0;left:0;bottom:0;
        height:100vh;
        padding:15px;
        box-sizing:border-box;
        transform:translateX(100%);
        transition:all 0.5s;
    }
    .mobile-menu.open{
        transform:none;
    }
    .mobile-menu .menu {
        display:flex;flex-direction:column;
        text-align:center;gap:30px
    }
    .mobile-menu .menu .menu-item {font-size:22px;}
    .mobile-menu .btn {text-align:center;}
    .mobile-menu-trigger {font-size:28px;}
    .mobile-menu .close-menu {font-size:28px;text-align:right;}
    .mobile-menu .close-menu i {width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center}
}

.mobile-menu-trigger {
    font-size: 28px;
}

/* CALENDAR */
.fc .fc-col-header-cell-cushion {
    font-size:15px;
    font-weight:500;
}

.fc .fc-col-header-cell {
    background:var(--light);
    padding:12px;
}

.fc .fc-daygrid-day.fc-day-today, .fc .fc-timegrid-col.fc-day-today {
    background:var(--light);;
}

.fc-daygrid-event-dot {display:none;}
.fc-event {
    background:var(--blue);
    border:none;
    border-radius:8px;
    padding:8px;
    color:var(--black);
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    align-items:flex-start;
    gap:5px;
    cursor:pointer;
    margin:4px;
}
.fc-event:hover{background:var(--blue);color:var(--black)}
.fc-event > div, .fc-v-event .fc-event-main {
    white-space:initial;
    height:auto;
}

.fc-event-time {display:flex;gap:5px;}
.fc-event .editurl {display:none;}
.fc .fc-button-primary {
    background:var(--light)!important;
    color:var(--black)!important;
    font-size:14px!important;
    line-height:14px;
    outline:none!important;
    border-color: var(--black)!important;
}
.fc-timegrid-event, .fc-event-main-frame, .fc-event-main-frame {
    display: flex;
    flex-direction: row!important;
    align-items: center;
    gap: 15px;
    color: var(--black);
    padding: 2px;
}
.fc-event-main-frame, .fc-event-main-frame  {padding:0!important;}