/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/
 #events h3   {
	/* add your css rule here */
}


 #events p.duration, #events div.duration   {
	/* add your css rule here */
}


 #events p.description, #events div.description   {
	/* add your css rule here */
}


 #events .selectedEvent   {
	/* add your css rule here */
}


 #events input.reserve_time_btn   {
	/* add your css rule here */
}


 #events input.select_another_btn   {
	/* add your css rule here */
}


 #eventForm #start_date-block-container h3, #eventForm #timeline-container h3   {
	/* add your css rule here */
}


 #eventForm #save_button   {
	/* add your css rule here */
}


 div.ui-widget-content   {
	/* add your css rule here */
}


 div.ui-widget-header   {
	/* add your css rule here */
}


 #timeline-container table.timeline   {
	/* add your css rule here */
}


 .timeline td.not_worked_time   {
	/* add your css rule here */
}


 .timeline td.free_time   {
	/* add your css rule here */
}


 .timeline td.selected_time   {
	/* add your css rule here */
}


 .timeline td.reserved_time   {
	/* add your css rule here */
}


 div#loading   {
	/* add your css rule here */
}


#start_date-block-container .zend_form dt, 
#start_date-block-container .zend_form dt b, 
#start_date-block-container .zend_form dd label   {
	/* add your css rule here */
}



/* ==========================================
   JESS LIS. LEE - CLEAN CUSTOM STYLING
   ========================================== */


/* ==========================================
   1. GLOBAL TYPOGRAPHY
   ========================================== */

body,
button,
input,
textarea,
select,
h1,
h2,
h3,
h4,
h5,
h6,
.title,
.title a,
.title-main,
.company-name,
.company-name a,
.contact-title,
.widget-title,
#main-buttons .btn a,
#news-index .news-list .article .cap,
#news-index .news-list .article .cap a {
    font-family: "Avenir Next", Avenir, "Segoe UI", Arial, sans-serif !important;
    font-style: normal !important;
}


/* ==========================================
   2. HEADING STYLING
   ========================================== */

h1,
h2,
h3,
.title-main,
.company-name {
    font-weight: 600 !important;
    letter-spacing: -0.2px !important;
}


/* ==========================================
   3. MAIN HOME PAGE BUTTONS
   ========================================== */

#main-buttons .btn a {
    font-family: "Avenir Next", Avenir, "Segoe UI", Arial, sans-serif !important;
    font-style: normal !important;
    font-weight: 600 !important;
    letter-spacing: 0.2px !important;
    text-transform: none !important;
}


/* ==========================================
   4. LINKS
   ========================================== */

/* Pink links inside content areas only */
#content-view a,
.company-info a,
.contact-info a,
#news-index .news-list a {
    color: #d42c58 !important;
}

#content-view a:hover,
.company-info a:hover,
.contact-info a:hover,
#news-index .news-list a:hover {
    color: #b3264a !important;
}

/* ==========================================
   5. NEWS / FAQ PAGE
   ========================================== */

#main #main-content #sb_content #news-index .title-main,
#main #main-content #sb_content #news-index .news-list .article .cap,
#main #main-content #sb_content #news-index .news-list .article .cap a {
    font-family: "Avenir Next", Avenir, "Segoe UI", Arial, sans-serif !important;
    font-style: normal !important;
}

#main #main-content #sb_content #news-index .news-list .article .cap a {
    font-weight: 500 !important;
    letter-spacing: -0.2px !important;
}


/* ==========================================
   6. CONTENT CARDS
   ========================================== */

#content-view .section-pd,
#content-view .container-fluid,
.company-info,
.contact-info,
#news-index .news-list {
    border-radius: 18px !important;
}


/* Softer white panels */
.company-info,
.contact-info,
#news-index .news-list {
    background: rgba(255, 255, 255, 0.96) !important;
}

/* ==========================================
   7. CONTACT CARD
   ========================================== */

.contact-info {
    padding: 24px !important;
}

.contact-info h1,
.contact-info h2,
.contact-info h3,
.contact-info .title {
    font-family: "Avenir Next", Avenir, "Segoe UI", Arial, sans-serif !important;
    font-style: normal !important;
    font-weight: 600 !important;
    font-size: 24px !important;
    margin-bottom: 18px !important;
}


/* ==========================================
   8. COMPANY / NAME CARD
   ========================================== */

.company-name,
.company-name a {
    font-family: "Avenir Next", Avenir, "Segoe UI", Arial, sans-serif !important;
    font-style: normal !important;
    font-weight: 600 !important;
    letter-spacing: -0.2px !important;
}


/* ==========================================
   9. MAP AREA
   ========================================== */

#map,
.map-wrapper,
#map-container {
    border-radius: 16px !important;
}

#content-view .map,
#content-view .map-wrapper {
    margin-top: 18px !important;
}


/* ==========================================
   10. HIDE SOCIAL MEDIA FOOTER ICONS
   ========================================== */

.social-links,
.social-icons,
.footer-social,
#footer .social,
#footer .social-links,
#footer .social-icons,
#sb_footer .social,
#sb_footer .social-links,
#sb_footer .social-icons {
    display: none !important;
}


/* ==========================================
   11. BACKGROUND SOFTENING
   ========================================== */


/* ==========================================
   12. BUTTON SHAPE / POLISH
   ========================================== */

#main-buttons .btn {
    border-radius: 999px !important;
}

#main-buttons .btn a {
    padding-left: 22px !important;
    padding-right: 22px !important;
}


/* ==========================================
   13. NEWS LIST CLEANUP
   ========================================== */

#news-index .news-list .article {
    padding-top: 22px !important;
    padding-bottom: 22px !important;
}

#news-index .news-list .article .cap {
    margin-bottom: 10px !important;
}

#news-index .news-list .article .txt {
    line-height: 1.55 !important;
}


/* ==========================================
   14. GENERAL BODY TEXT
   ========================================== */

body {
    line-height: 1.55 !important;
}


/* ==========================================
   15. MOBILE POLISH
   ========================================== */

@media (max-width: 768px) {

    .contact-info {
        padding: 18px !important;
    }

    #main-buttons .btn a {
        font-size: 16px !important;
    }

    .contact-info h1,
    .contact-info h2,
    .contact-info h3,
    .contact-info .title {
        font-size: 21px !important;
    }

    #news-index .news-list .article {
        padding-top: 18px !important;
        padding-bottom: 18px !important;
    }
}


/* Navigation / hamburger menu font */
#header .nav-wrapper #sb_menu .nav li a {
    font-family: "Avenir Next", Avenir, "Segoe UI", Arial, sans-serif !important;
    font-style: normal !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
}




/* Main content typography */
.profile-main-content {
    font-size: 16px !important;
    line-height: 1.55 !important;
}

.profile-main-content p {
    margin: 0 0 12px 0 !important;
}

/* Top navigation links */
.profile-links {
    font-weight: 600 !important;
    margin-bottom: 32px !important;
}

.profile-links a {
    font-size: 16px !important;
    text-decoration: none !important;
}

.profile-links span {
    margin: 0 8px !important;
}

/* Sections */
.profile-section {
    margin-bottom: 30px !important;
}

.profile-section > p:first-child {
    margin-bottom: 14px !important;
}

/* Final note */
.profile-note {
    margin-top: 34px !important;
    color: #666 !important;
}


/* Single FAQ / News article title */
#main #main-content #sb_content #news-single .article .cap {
    font-family: "Avenir Next", Avenir, "Segoe UI", Arial, sans-serif !important;
    font-style: normal !important;
    font-weight: 600 !important;
    letter-spacing: -0.2px !important;
    line-height: 1.25 !important;
}


/* Return to blog button - remove cursive + cleaner shape */
#main #main-content #sb_content #news-single .return-btn a,
#main #main-content #sb_content #news-single .return-btn a .txt {
    font-family: "Avenir Next", Avenir, "Segoe UI", Arial, sans-serif !important;
    font-style: normal !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
}

#main #main-content #sb_content #news-single .return-btn a {
    border-radius: 999px !important;
}




/* =========================================================
   BACKGROUND + CARD VISUAL POLISH
   ========================================================= */


/* -----------------------------------------
   1. DIM THE MAIN BACKGROUND IMAGE
   ----------------------------------------- */


/* -----------------------------------------
   2. MAKE WHITE CARDS SOFTER / TRANSLUCENT
   ----------------------------------------- */

.company-info,
.contact-info,
#news-index .news-list,
#news-single .article {
    background: rgba(255, 255, 255, 0.90) !important;

    border-radius: 18px !important;

    box-shadow:
        0 8px 30px rgba(0, 0, 0, 0.08) !important;

    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
}


/* -----------------------------------------
   3. SLIGHTLY CLEANER CARD EDGES
   ----------------------------------------- */

.company-info,
.contact-info,
#news-index .news-list,
#news-single .article {
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
}


/* -----------------------------------------
   4. GIVE HOME CARDS A LITTLE MORE DEPTH
   ----------------------------------------- */

.company-info,
.contact-info {
    box-shadow:
        0 10px 35px rgba(30, 15, 25, 0.10) !important;
}


/* -----------------------------------------
   5. MAP CARD - LESS HARSH WHITE
   ----------------------------------------- */

#content-view .map,
#content-view .map-wrapper,
#map-container {
    background: rgba(255, 255, 255, 0.90) !important;
    border-radius: 18px !important;
    box-shadow:
        0 8px 30px rgba(0, 0, 0, 0.08) !important;
}


/* -----------------------------------------
   6. MOBILE - SLIGHTLY MORE OPAQUE
   for readability
   ----------------------------------------- */

@media (max-width: 768px) {

    .company-info,
    .contact-info,
    #news-index .news-list,
    #news-single .article {
        background: rgba(255, 255, 255, 0.94) !important;
        backdrop-filter: blur(7px) !important;
        -webkit-backdrop-filter: blur(7px) !important;
    }

}


/* Keep layout gaps transparent */
#content-view,
#content-view .section-pd,
#content-view .container-fluid {
    background: transparent !important;
}