/* LG CSS Library v0.5.6 */

/* Rounded Gallery images */
/* ==========================================
   FLATSOME GALLERY IMAGES
   12px Rounded Corners
========================================== */

.gallery-col .gallery-box,
.gallery-col .box-image,
.gallery-col .box-image img,
.gallery-col .box-image .overlay {
    border-radius: 12px !important;
}

.gallery-col .box-image {
    overflow: hidden !important;
}


/* ==========================================
   WORDPRESS VIDEO PLAYERS
   12px Rounded Corners
========================================== */

.wp-video,
.wp-video .mejs-container,
.wp-video .mejs-inner,
.wp-video .mejs-mediaelement,
.wp-video .mejs-layers,
.wp-video video {
    border-radius: 12px !important;
}

.wp-video .mejs-container {
    overflow: hidden !important;
}

/* Keep video within rounded container */

.wp-video video {
    display: block;
}

/* Rounded bottom corners for player controls */

.wp-video .mejs-controls {
    border-radius: 0 0 12px 12px !important;
}


/* ==========================================
   FLATSOME ROW IMAGES
   12px Rounded Corners
========================================== */

.row .img .img-inner,
.row .img .img-inner img,
.row .box-image,
.row .box-image img {
    border-radius: 12px !important;
}

/* Prevent images and hover effects from extending past corners */

.row .img .img-inner,
.row .box-image {
    overflow: hidden !important;
}


/* ==========================================
   FLATSOME BANNERS
   12px Rounded Corners
========================================== */

/* Main banner container */

.banner {
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* Banner inner container */

.banner .banner-inner {
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* Banner background */

.banner .banner-bg {
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* Banner background images */

.banner .banner-bg img {
    border-radius: 12px !important;
}

/* Banner overlays */

.banner .banner-bg .overlay,
.banner .banner-bg .video-overlay {
    border-radius: 12px !important;
}


/* ==========================================
   FLATSOME VIDEO BANNERS
   12px Rounded Corners
========================================== */

/* Video banner container */

.banner.has-video {
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* Video background */

.banner .video-bg,
.banner video.video-bg {
    border-radius: 12px !important;
}

/* Video overlay */

.banner .video-overlay {
    border-radius: 12px !important;
}

/* Prevent video from extending outside banner */

.banner.has-video .banner-bg {
    overflow: hidden !important;
    border-radius: 12px !important;
}

/* Maintain video sizing */

.banner video.video-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* ==========================================
   FLATSOME IMAGE BANNERS
   HOVER EFFECT PROTECTION
========================================== */

/* Prevent zoom effects from escaping corners */

.banner.has-hover {
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* Keep background and hover effects clipped */

.banner.has-hover .banner-bg {
    border-radius: 12px !important;
    overflow: hidden !important;
}


/* ==========================================
   FLATSOME UX IMAGE ELEMENTS
   12px Rounded Corners
========================================== */

.img .img-inner,
.img .img-inner img {
    border-radius: 12px !important;
}

.img .img-inner {
    overflow: hidden !important;
}


/* ==========================================
   GENERAL VIDEO ELEMENTS INSIDE ROWS
   12px Rounded Corners
========================================== */

.row .video,
.row .video video {
    border-radius: 12px !important;
}

.row .video {
    overflow: hidden !important;
}

/* Header Contact card */
/* ========================================== STEAMBOAT TABLES - HEADER CONTACT CARDS Compact Two-Column Design ========================================== */ /* Main Container */ .lg-office-contact { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; width: 100%; max-width: 620px; margin: 0; } /* Contact Cards */ .lg-office-card { background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.15); border-radius: 10px; padding: 10px 14px; min-width: 0; transition: background 0.2s ease; } /* Card Hover */ .lg-office-card:hover { background: rgba(255, 255, 255, 0.08); } /* Office Headings */ .lg-office-title { display: flex; align-items: center; gap: 7px; color: #ffffff; font-size: 11px; font-weight: 700; letter-spacing: 0.3px; line-height: 1.3; margin-bottom: 7px; } /* Gold Accent Dot */ .lg-office-dot { display: inline-block; width: 6px; height: 6px; min-width: 6px; background: #e0b56b; border-radius: 50%; } /* Contact Details */ .lg-office-details { display: flex; flex-direction: column; gap: 4px; } /* Contact Links */ .lg-office-details a { display: flex; align-items: center; gap: 7px; color: rgba(255, 255, 255, 0.85); font-size: 11px; font-weight: 400; line-height: 1.3; text-decoration: none; overflow-wrap: anywhere; transition: color 0.2s ease; } /* Link Hover */ .lg-office-details a:hover { color: #e0b56b; } /* Contact Icons */ .lg-office-icon { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; min-width: 20px; border-radius: 5px; background: rgba(255, 255, 255, 0.08); color: #e0b56b; font-size: 11px; font-weight: 600; } /* ========================================== MOBILE RESPONSIVE ========================================== */ @media (max-width: 767px) { .lg-office-contact { grid-template-columns: 1fr; max-width: 100%; gap: 8px; } .lg-office-card { padding: 10px 12px; } .lg-office-title { font-size: 11px; } .lg-office-details a { font-size: 11px; } }