/* =====================================================================
   AmCham - Responsive layer (mobile + tablet, < 1042px)
   ---------------------------------------------------------------------
   Loaded from application/views/include/_head.php AFTER main.css with
   media="screen and (max-width: 1041px)", so the desktop design is
   never affected.

   This file only restyles the existing markup (.containervisible-xs).
   No view, form, id, name, onclick or AJAX endpoint was changed.
   To roll back: remove the <link> to this file in _head.php.
   ===================================================================== */

:root {
    --rs-navy: #132C57;
    --rs-blue: #284585;
    --rs-red: #B21A21;
    --rs-red-dark: #8F141A;
    --rs-bg: #F3F5F9;
    --rs-card: #FFFFFF;
    --rs-line: #DDE3EC;
    --rs-muted: #66758C;
    --rs-radius: 10px;
    --rs-shadow: 0 1px 2px rgba(19, 44, 87, .06), 0 4px 14px rgba(19, 44, 87, .08);
    --rs-font: "HelveticaNeue", "Helvetica Neue", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* ---------- Base ---------- */
html, body {
    background: var(--rs-bg) !important;
    -webkit-text-size-adjust: 100%;
}
body {
    font-family: var(--rs-font);
    font-size: 15px;
    line-height: 1.55;
    color: var(--rs-navy);
    overflow-x: hidden;
}
.containervisible-xs {
    font-family: var(--rs-font);
    color: var(--rs-navy);
}
.containervisible-xs img { max-width: 100%; height: auto; }
.containervisible-xs a { -webkit-tap-highlight-color: rgba(178, 26, 33, .15); }
.containervisible-xs form { height: auto; }      /* pages inject form{height:27px} */
#demo-block > br,
.containervisible-xs > br { display: none; }

/* ---------- Header (logo / title / burger) ---------- */
.containervisible-xs > .container-fluid.full-height {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1000;
    height: auto !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .25);
}
.containervisible-xs > .container-fluid > .row { height: auto !important; }
.containervisible-xs .headerr {
    background:
        linear-gradient(180deg, rgba(19, 44, 87, .55), rgba(19, 44, 87, .85)),
        url("../img/top_bag.png") center / cover no-repeat;
    padding-top: 0;
    padding-bottom: 0;
}
.containervisible-xs .content-menu {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 8px 0;
    min-height: 64px;
}
.containervisible-xs .content-menu::before,
.containervisible-xs .content-menu::after { display: none; }
.containervisible-xs .am-logo { width: auto; flex: 0 0 auto; }
.containervisible-xs .am-logo img { max-height: 54px; width: auto; }
.containervisible-xs .am-title {
    flex: 1 1 auto;
    width: auto;
    margin: 0;
    padding: 0 10px !important;
}
.containervisible-xs .am-title img { max-height: 46px; width: auto; margin: 0 auto; }
.containervisible-xs .menu-burger {
    flex: 0 0 auto;
    width: auto;
    margin: 0;
    padding: 0;
}
.containervisible-xs #menu-burger {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    transition: background .2s;
}
.containervisible-xs #menu-burger:active { background: rgba(255, 255, 255, .15); }
.containervisible-xs #menu-burger img { width: 28px; max-width: 28px; float: none; margin: 0; }

/* ---------- Slide-down navigation ---------- */
.containervisible-xs nav {
    background: var(--rs-navy);
    max-height: calc(100vh - 80px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.containervisible-xs nav ul { padding: 6px 0 !important; }
.containervisible-xs nav ul a { display: block; cursor: pointer; }
.containervisible-xs nav ul li {
    color: #fff;
    font-size: 16px;
    padding: 14px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    transition: background .15s;
}
.containervisible-xs nav ul a:last-child li { border-bottom: 0; }
.containervisible-xs nav ul a:active li,
.containervisible-xs nav ul a:hover li { background: rgba(255, 255, 255, .08); }
.containervisible-xs nav ul li .pull-right img { width: 9px; height: auto; opacity: .7; margin-top: 7px; }

/* ---------- Page bar (current page + Sign in / Join) ---------- */
.containervisible-xs .top-bar {
    background: var(--rs-blue);
    float: none;
    width: 100%;
    position: relative;
    z-index: 900;
}
.containervisible-xs .top-bar-holder {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    height: auto;
    min-height: 46px;
    padding: 0 6px;
}
.containervisible-xs .top-bar-holder > div { float: none; width: auto; }
.containervisible-xs .current-active {
    flex: 1 1 auto;
    color: #fff;
    font-weight: bold;
    font-size: 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.containervisible-xs .top-bar-panel {
    flex: 0 0 auto;
    position: static;
    color: rgba(255, 255, 255, .6);
    font-size: 14px;
    white-space: nowrap;
}
.containervisible-xs .top-bar-panel a,
.containervisible-xs #login-link {
    color: #fff;
    cursor: pointer;
    display: inline-block;
    padding: 6px 4px;
}
.containervisible-xs #login-link a { color: #fff; }

/* Sign-in dropdown */
.containervisible-xs .login-box {
    top: calc(100% + 6px) !important;      /* main.js sets an inline top */
    right: 10px;
    left: auto;
    width: 290px;
    max-width: calc(100vw - 20px);
    height: auto;
    border-radius: var(--rs-radius);
    box-shadow: 0 10px 30px rgba(19, 44, 87, .25);
    text-align: left;
}
.containervisible-xs .login-box .arrow-top { top: -10px; right: 34px; }
.containervisible-xs .login-box-content { padding: 22px 20px 18px; }
.containervisible-xs .login-box .field-header,
.containervisible-xs .directory-big-box .field-header {
    width: 100%;
    height: 44px;
    border: 1px solid var(--rs-line);
    border-radius: 8px;
    padding: 0 12px;
    font-size: 16px;
    margin-bottom: 10px;
    color: var(--rs-navy);
    background: #fff;
}
.containervisible-xs .login-forgot { font-size: 13px; line-height: 40px; color: var(--rs-blue); cursor: pointer; }
.containervisible-xs .login-submit,
.containervisible-xs #login-submit {
    background: var(--rs-red);
    color: #fff;
    font-weight: bold;
    font-size: 15px;
    height: 42px;
    padding: 0 22px;
    border-radius: 8px;
    border: 0;
}
.containervisible-xs .error_login { color: var(--rs-red); font-size: 13px; clear: both; }

/* ---------- Content area ---------- */
.containervisible-xs .middle-content { background: transparent; }

/* main.js / desktop scripts write fixed inline heights (window height,
   jScrollPane boxes). On small screens let the page scroll naturally. */
.containervisible-xs .directory-main-holder,
.containervisible-xs .descriptionscrol,
.containervisible-xs .descriptionscrol_co,
.containervisible-xs #tab-word-of-chairman,
.containervisible-xs #tab-mission-statement,
.containervisible-xs #tab-objectives,
.containervisible-xs #tab-board-of-directors {
    height: auto !important;
    overflow: visible !important;
}
.containervisible-xs .directory-main-holder { min-height: 60vh; }

/* ---------- Home slider ---------- */
.containervisible-xs #owl-main { background: var(--rs-navy); }
.containervisible-xs #owl-main .image-slider {
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
}
.containervisible-xs .image-description {
    background: var(--rs-navy);
    color: #fff;
    padding: 14px 16px 18px !important;
}
.containervisible-xs .article-title { margin: 0 0 6px; padding: 0; font-size: 19px; line-height: 1.3; color: #fff; }
.containervisible-xs .article-content { margin: 0 0 14px; padding: 0; color: rgba(255, 255, 255, .85); font-size: 14px; }
.containervisible-xs .read-more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 16px;
    background: var(--rs-red);
    color: #fff;
    border-radius: 999px;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
}
.containervisible-xs .read-more-arrow { margin: 0; }
.containervisible-xs .read-more-arrow img { display: block; }

/* Banner "Read more" / forgot-password pop-ups */
#big1resp, #big1 {
    position: fixed !important;
    z-index: 2000;
    width: calc(100vw - 32px) !important;
    max-width: 560px;
    max-height: calc(100vh - 64px);
    overflow-y: auto !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%);
    background: #fff !important;
    border-radius: 14px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .35);
    padding: 18px !important;
}
#close_welcomeresp, #close_welcome { float: right; cursor: pointer; padding: 4px; }
#welocme_pop_up1resp, #welocme_pop_up1 { z-index: 1999; }
.containervisible-xs .titlepop, #big1 .titlepop { font-size: 19px; margin: 6px 0 10px; }

/* ---------- Horizontal tabs (About / Membership) ---------- */
.containervisible-xs .top-about-nav-sections,
.containervisible-xs .tabbable > .nav-tabs {
    background: #fff;
    border-bottom: 1px solid var(--rs-line);
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.containervisible-xs .top-about-nav-sections::-webkit-scrollbar { display: none; }
.containervisible-xs .dx {
    display: flex;
    gap: 8px;
    padding: 10px 12px;
    overflow: visible;
    height: auto;
}
.containervisible-xs .xc {
    flex: 0 0 auto;
    padding: 8px 16px;
    border-radius: 999px;
    background: var(--rs-bg);
    border: 1px solid var(--rs-line);
    cursor: pointer;
    font-size: 14px;
    height: auto;
}
.containervisible-xs .xc a { color: var(--rs-navy); cursor: pointer; }
.containervisible-xs .xc.active-about-link { background: var(--rs-navy); border-color: var(--rs-navy); }
.containervisible-xs .xc.active-about-link a { color: #fff; }

.containervisible-xs .tabbable > .nav-tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    padding: 10px 12px;
    margin: 0;
    overflow: visible;     /* the Apply dropdown must not be clipped */
}
.containervisible-xs .tabbable > .nav-tabs::before,
.containervisible-xs .tabbable > .nav-tabs::after { display: none; }
.containervisible-xs .tabbable > .nav-tabs > li { float: none; margin: 0; flex: 0 0 auto; }
.containervisible-xs .tabbable > .nav-tabs > li > a,
.containervisible-xs .tabbable .dropdown > a {
    display: block;
    padding: 8px 16px !important;
    border-radius: 999px !important;
    background: var(--rs-bg) !important;
    border: 1px solid var(--rs-line) !important;
    color: var(--rs-navy) !important;
    font-size: 14px;
    line-height: 1.4;
}
.containervisible-xs .tabbable > .nav-tabs > li.active > a,
.containervisible-xs .tabbable .dropdown.open > a {
    background: var(--rs-navy) !important;
    border-color: var(--rs-navy) !important;
    color: #fff !important;
}
.containervisible-xs .tabbable .dropdown.open { background: none; }
.containervisible-xs .tabbable .dropdown-menu {
    left: auto;
    right: 0;
    margin-top: 6px;
    border: 0;
    border-radius: var(--rs-radius);
    box-shadow: 0 10px 30px rgba(19, 44, 87, .2);
    padding: 6px 0;
    min-width: 220px;
}
.containervisible-xs .tabbable .dropdown-menu > li > a { padding: 11px 18px !important; font-size: 15px; }

/* ---------- Generic text pages (About / Membership / Committees) ---------- */
.containervisible-xs .about-main-content { padding: 18px 16px 0; }
.containervisible-xs .about-section-title,
.containervisible-xs .titlecom,
.containervisible-xs #tab-who-can-join h4 {
    font-size: 20px !important;
    line-height: 1.3;
    font-weight: bold;
    color: var(--rs-red);
}
.containervisible-xs .about-main-content img { border-radius: var(--rs-radius); box-shadow: var(--rs-shadow); margin: 6px auto 4px; }
.containervisible-xs .about-content { padding: 6px 16px 24px; font-size: 15px; }
.containervisible-xs .about-content p { margin-bottom: 12px; }
.containervisible-xs .about-chairman-name { float: none; text-align: right; }

.containervisible-xs .tab-content {
    padding: 18px 16px 28px;
    font-size: 15px;
    background: #fff;
}
.containervisible-xs .descr_mme2 { font-size: 15px; }
.containervisible-xs .accordionButtonservices { padding: 4px 0 10px 22px; font-size: 15px; }
.containervisible-xs .accordionContentservices { padding: 10px 0 16px 10px; }

/* Committees */
.containervisible-xs .page_about { padding-top: 0; }
.containervisible-xs .committees { background: transparent; }
.containervisible-xs .committees::before,
.containervisible-xs .committees::after { display: none; }
.containervisible-xs .committees-main-holder {
    background: #fff;
    margin: 12px;
    padding: 6px 16px 4px;
    border-radius: var(--rs-radius);
    box-shadow: var(--rs-shadow);
    width: auto;
}
.containervisible-xs .committees-main-holder h4 { font-size: 16px; font-weight: bold; margin: 14px 0 4px !important; }
.containervisible-xs .all_co { margin-bottom: 8px; padding-top: 4px; }
.containervisible-xs .leftmenuab_co_resp {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 0;
    font-size: 15px;
    line-height: 1.4;
    border-bottom: 1px solid var(--rs-line);
}
.containervisible-xs .leftmenuab_co_resp:last-child { border-bottom: 0; }
.containervisible-xs .leftmenuab_co_resp .circle { flex: 0 0 auto; float: none; margin: 5px 0 0; width: 10px; height: 10px; }
.containervisible-xs .rightpagemenu_co { padding: 0 12px 24px; width: auto; }
.containervisible-xs .rightaboutcont_co {
    border-radius: var(--rs-radius);
    box-shadow: var(--rs-shadow);
    padding: 4px 0 18px;
}
.containervisible-xs .descriptioncom { font-size: 15px; padding: 0 16px; }

/* ---------- Search inputs / selects ---------- */
.containervisible-xs .page_aboutevents,
.containervisible-xs .top-newsletter-nav-sections,
.containervisible-xs .directory-top-bar {
    background: #fff !important;
    border-bottom: 1px solid var(--rs-line);
    height: auto;
    padding: 6px 0 12px;
}
.containervisible-xs .page_aboutevents::after { content: ""; display: table; clear: both; }
.containervisible-xs .yearsele { width: auto; float: none; padding: 10px 0 6px; font-size: 14px; font-weight: bold; }
.containervisible-xs #scrolleventsresp {
    width: 100%;
    height: 44px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid var(--rs-line);
    border-radius: 8px;
    font-size: 15px;
    background-color: #fff;
}
.containervisible-xs .search-input-events,
.containervisible-xs .search-input-newsletter,
.containervisible-xs .search-input-holder {
    width: 100%;
    height: 44px;
    margin: 10px 0 0;
    padding: 0;
    background: #fff;           /* search icons are JPGs on white */
    border: 1px solid var(--rs-line);
    border-radius: 8px;
    overflow: hidden;
}
.containervisible-xs .search-input-newsletter { float: none; left: auto; right: auto; width: auto; max-width: 560px; margin: 10px 12px 0; }
.containervisible-xs .search-icon-events,
.containervisible-xs .search-icon {
    height: 42px;
    margin: 0;
    background-color: transparent;
    background-position: 10px center;
    font-size: 16px;            /* avoids iOS zoom on focus */
    color: var(--rs-navy);
    outline: 0;
}
.containervisible-xs .search-icon-events { padding-left: 38px; }

/* ---------- Events (cards grid) ---------- */
.containervisible-xs #bodycontainersearch > table,
.containervisible-xs #bodycontainersearch td { display: block; width: 100%; }
.containervisible-xs #alllasresp { height: auto !important; overflow: visible !important; padding: 0 12px 24px !important; }
.containervisible-xs #bodycontainersearch td.events-main { padding: 0; }
.containervisible-xs #alllasresp h4 {
    font-size: 18px;
    font-weight: bold;
    color: var(--rs-red);
    margin: 22px 4px 8px;
}
.containervisible-xs #alllasresp hr { display: none; }
.containervisible-xs .custom-container > .events-main {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    padding: 0;
}
.containervisible-xs .custom-container > .events-main > .row { display: contents; }
.containervisible-xs .custom-container > .events-main > .row::before,
.containervisible-xs .custom-container > .events-main > .row::after { display: none; }
.containervisible-xs .custom-container > .events-main br { display: none; }
.containervisible-xs .custom-container > .events-main [id^="mystaff-boxresp_"] {
    width: auto;
    float: none;
    padding: 0;
    background: #fff;
    border-radius: var(--rs-radius);
    box-shadow: var(--rs-shadow);
    overflow: hidden;
    transition: transform .15s;
}
.containervisible-xs .custom-container > .events-main [id^="mystaff-boxresp_"]:active { transform: scale(.98); }
.containervisible-xs .itemjcarev { text-align: left; }
.containervisible-xs .imgab_events { background: var(--rs-bg); }
.containervisible-xs .imgab_events img {
    width: 100%;
    aspect-ratio: 5 / 3;
    object-fit: cover;
    display: block;
}
.containervisible-xs .itemjcarev .event-title {
    text-align: left;
    font-size: 14px;
    line-height: 1.35;
    margin: 10px 12px 4px;
}
.containervisible-xs .itemjcarev .event-date {
    font-size: 12.5px;
    line-height: 1.4;
    color: var(--rs-muted);
    margin: 0 12px 12px;
    text-align: left;
}

/* Event details */
.containervisible-xs .top-events-details-nav-sections { background: #fff; border-bottom: 1px solid var(--rs-line); height: auto; padding: 6px 0; }
.containervisible-xs .events-details-top { cursor: pointer; padding: 8px 0; color: var(--rs-blue); font-weight: bold; }
.containervisible-xs .events-details-content { padding: 14px 16px; font-size: 15px; }
.containervisible-xs .events-details-lower-content { background: var(--rs-bg); }
.containervisible-xs .events-details-right-info h4 { font-size: 18px; font-weight: bold; }

/* ---------- Newsletters (cards grid) ---------- */
.containervisible-xs .newsletter-main {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    padding: 14px 12px 28px;
}
.containervisible-xs .newsletter-main::before,
.containervisible-xs .newsletter-main::after { display: none; }
.containervisible-xs .newsletterboxresp { width: auto; float: none; padding: 0; }
.containervisible-xs .newsletterboxresp > br { display: none; }
.containervisible-xs .newsletterbox {
    float: none;
    height: 100%;
    background: #fff;
    border-radius: var(--rs-radius);
    box-shadow: var(--rs-shadow);
    overflow: hidden;
}
.containervisible-xs .newsletterbox a { display: block; text-decoration: none; }
.containervisible-xs .pdf-image { padding: 0; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: top; }
.containervisible-xs .namenewsresp { font-size: 13.5px; line-height: 1.35; margin: 10px; text-align: left; }

/* ---------- Useful info ---------- */
.containervisible-xs .useful-main-holder { text-align: left; padding: 6px 12px 24px; }
.containervisible-xs .useful-main-holder h4 { font-size: 17px; font-weight: bold; margin: 18px 4px 10px; }
.containervisible-xs .all-useful-links {
    padding: 0;
    background: #fff;
    border-radius: var(--rs-radius);
    box-shadow: var(--rs-shadow);
    overflow: hidden;
}
.containervisible-xs .all-useful-links > a { display: block; text-decoration: none; }
.containervisible-xs .sefull {
    padding: 12px 16px;
    border-bottom: 1px solid var(--rs-line);
    background: #fff;
}
.containervisible-xs .all-useful-links > a:last-child .sefull { border-bottom: 0; }
.containervisible-xs .sefull > br { display: none; }
.containervisible-xs .titleus { font-size: 15px; color: var(--rs-navy); float: none; width: auto; }
.containervisible-xs .linkus { font-size: 13px; color: var(--rs-blue); float: none; width: auto; word-break: break-all; font-weight: normal; }

/* ---------- Login page (Directory & Offers) ---------- */
.containervisible-xs .directory-main-holder > center { display: block; padding: 24px 12px; }
.containervisible-xs .directory-big-box {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    padding: 20px 20px 24px;
    background: #fff;
    border: 0;
    border-radius: 14px;
    box-shadow: var(--rs-shadow);
    text-align: left;
}
.containervisible-xs .directory-big-box h3 { font-size: 16px; line-height: 1.45; padding: 0; margin: 0 0 16px; }
.containervisible-xs .directory-big-box #login-submit { width: 100%; margin-top: 4px; }

/* ---------- Directory & Offers ---------- */
.containervisible-xs .directory-top-bar { padding: 0 0 12px; }
.containervisible-xs .directory-top-links-holder { display: flex; gap: 22px; }
.containervisible-xs .directory_btn { padding: 14px 0 8px; margin: 0; font-size: 15px; letter-spacing: .03em; }
.containervisible-xs .directory-select-holder { padding-top: 10px; }
.containervisible-xs .mainselect {
    float: none;
    height: 44px;
    border: 1px solid var(--rs-line);
    border-radius: 8px;
    background-color: #fff;
}
.containervisible-xs .selectDiv { height: 42px; }
.containervisible-xs .selectDefault { width: auto; padding-right: 36px; margin-top: 7px; font-size: 15px; white-space: nowrap; text-overflow: ellipsis; }
.containervisible-xs .directory-upper-holder { padding: 6px 0 24px; }
.containervisible-xs .office-single {
    display: flex;
    align-items: center;
    margin: 10px 12px !important;
    background: #fff;
    border-radius: var(--rs-radius);
    box-shadow: var(--rs-shadow);
    overflow: hidden;
}
.containervisible-xs .office-single::before,
.containervisible-xs .office-single::after,
.containervisible-xs .office-single > br { display: none; }
.containervisible-xs .office-single-image { padding: 12px; }
.containervisible-xs .office-single-image img { border-radius: 8px; aspect-ratio: 1 / 1; object-fit: cover; }
.containervisible-xs .office-information { margin: 0; padding: 12px 12px 12px 0; }
.containervisible-xs .list_title { font-weight: bold; font-size: 15px; }
.containervisible-xs .list_name { font-size: 14px; }
.containervisible-xs .list_position { font-size: 13px; }
/* the holder contains a space when closed, so :empty never matched (4/11/2026) */
.containervisible-xs .rightresp:not(:has(*)) { display: none; }
.containervisible-xs .rightresp:has(*) {
    margin: -4px 12px 12px;
    padding: 14px;
    background: #fff;
    border-radius: 0 0 var(--rs-radius) var(--rs-radius);
    box-shadow: var(--rs-shadow);
}
.containervisible-xs .info-desc-holder { margin: 0; width: 100%; }
.containervisible-xs .rightresp .directory-lower-holder {
    background: var(--rs-bg);
    border-radius: 8px;
    padding: 4px 0 12px;
}
.containervisible-xs .rightresp .info-holder { margin-top: 12px; }
.containervisible-xs .rightresp .info-desc-holder h4 { font-size: 16px; font-weight: bold; color: var(--rs-red); margin: 12px 0 4px; }
.containervisible-xs .rightresp .business_phone,
.containervisible-xs .rightresp .fax,
.containervisible-xs .rightresp .email { font-size: 14px; margin-bottom: 8px; }
.containervisible-xs .rightresp .p-info { margin-left: 0; }
.containervisible-xs .rightresp a { word-break: break-word; }
.containervisible-xs .rightresp .column2_list { display: flex; align-items: flex-start; padding: 10px 0; border-top: 1px solid var(--rs-line); }

/* ---------- Contact page ---------- */
.containervisible-xs .page_contact { margin: 0; padding: 0; width: auto; }
.containervisible-xs .contactpages { background: transparent !important; }
.containervisible-xs .contact-main-holder {
    margin: 12px;
    padding: 16px;
    background: #fff;
    border-radius: var(--rs-radius);
    box-shadow: var(--rs-shadow);
}
.containervisible-xs .contact-main-holder h4 { font-size: 17px; line-height: 1.35; margin: 0 0 10px; }
.containervisible-xs .contact-main-holder .description { font-size: 15px; margin: 0; }
.containervisible-xs .contact-main-holder .description a { color: var(--rs-blue); }

/* The contact form block sits outside .containervisible-xs in the view */
.page_contact[style] { background: transparent !important; padding: 0 12px 28px; }
#allinfocontact {
    margin: 0 12px 12px;
    padding: 16px 16px 20px;
    background: #fff;
    border-radius: var(--rs-radius);
    box-shadow: var(--rs-shadow);
}
#allinfocontact > label {
    float: none;
    display: block;
    width: 100%;
    margin: 0;
    padding: 0 !important;
}
#allinfocontact > label.field-title { font-size: 14px; font-weight: bold; margin: 12px 0 6px; }
#allinfocontact > br { display: none; }
#allinfocontact input[type="text"]:not(#FileField),
#allinfocontact textarea {
    width: 100%;
    height: 46px;
    padding: 0 12px !important;
    margin: 0;
    font-size: 16px;
    color: var(--rs-navy);
    background: #fff;
    border: 1px solid var(--rs-line);
    border-radius: 8px;
    box-shadow: inset 0 0 0 1px transparent;
    transition: border-color .15s, box-shadow .15s;
}
#allinfocontact textarea { height: 140px; padding: 10px 12px !important; resize: vertical; }
#allinfocontact input[type="text"]:not(#FileField):focus,
#allinfocontact textarea:focus { border-color: var(--rs-blue); box-shadow: 0 0 0 3px rgba(40, 69, 133, .15); outline: 0; }
#allinfocontact .upload-reg {
    height: 46px;
    background: var(--rs-bg);
    border: 1px dashed #B9C3D3;
    border-radius: 8px;
}
#allinfocontact #BrowserVisible { top: 0; height: 44px; }
#allinfocontact #upload_file { height: 44px; top: 0; }
#allinfocontact .spanc { top: 13px; left: 12px; padding: 0; font-size: 14px; }
#allinfocontact #FileField { top: 12px; left: 12px; height: 22px; font-size: 14px; }
#allinfocontact .contact {
    float: none;
    width: 100%;
    height: 48px;
    margin-top: 18px;
    border: 0;
    border-radius: 8px;
    background: var(--rs-red);
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: .02em;
}
#allinfocontact .contact:active { background: var(--rs-red-dark); }
#allinfocontact .titledata { font-size: 17px; color: var(--rs-navy); padding: 30px 0; text-align: center; }

/* ---------- Membership application forms ---------- */
.containervisible-xs #containerresp,
.containervisible-xs [id^="containerresp"] { padding: 0; }
.containervisible-xs .titlemember { font-size: 18px; padding-bottom: 8px; }
.containervisible-xs .titlemember2 { font-size: 14px; padding-bottom: 18px; }
.containervisible-xs .allinfomember .memberleft,
.containervisible-xs .allinfomember .memberright { width: 100%; float: none; }
.containervisible-xs .allinfomember .field-title {
    float: none;
    width: 100%;
    margin: 12px 0 6px;
    font-size: 14px;
    font-weight: bold;
}
.containervisible-xs .allinfomember .field { float: none; width: 100%; margin: 0; }
.containervisible-xs .allinfomember br[clear] { display: none; }
.containervisible-xs .input-xxlarge1 {
    width: 100% !important;
    height: 46px;
    padding: 0 12px !important;
    font-size: 16px;
    border: 1px solid var(--rs-line);
    border-radius: 8px;
    background-color: #fff;
}
.containervisible-xs textarea.ckeditor,
.containervisible-xs .allinfomember textarea {
    width: 100% !important;
    min-height: 140px;
    padding: 10px 12px;
    font-size: 16px;
    border: 1px solid var(--rs-line);
    border-radius: 8px;
}
.containervisible-xs .input-xxlarge1:focus,
.containervisible-xs .allinfomember textarea:focus { border-color: var(--rs-blue); box-shadow: 0 0 0 3px rgba(40, 69, 133, .15); outline: 0; }
.containervisible-xs .span_browsefile {
    min-height: 46px;
    line-height: 44px;
    padding: 0 12px;
    background: var(--rs-bg);
    border: 1px dashed #B9C3D3;
    border-radius: 8px;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.containervisible-xs .upload_browsefile { width: 100%; height: 46px; }
.containervisible-xs .field_submit,
.containervisible-xs .field_submit2 {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 20px;
}
.containervisible-xs .field_submit .t1,
.containervisible-xs .field_submit .t3 { flex: 1 1 100%; font-size: 13px; color: var(--rs-muted); }
.containervisible-xs .next1,
.containervisible-xs .next2,
.containervisible-xs .next3,
.containervisible-xs .back1,
.containervisible-xs .cancel1 {
    float: none;
    min-width: 110px;
    height: 46px;
    padding: 0 22px;
    border: 0;
    border-radius: 8px;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
}
.containervisible-xs .next1,
.containervisible-xs .next2,
.containervisible-xs .next3 { background: var(--rs-red); color: #fff; }
.containervisible-xs .back1 { background: #E6EAF1; color: var(--rs-navy); }
.containervisible-xs .cancel1 { line-height: 46px; }

/* ---------- Tablet (600px - 1041px) ---------- */
@media (min-width: 600px) {
    .containervisible-xs .custom-container > .events-main { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
    .containervisible-xs .newsletter-main { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
    .containervisible-xs .article-title { font-size: 22px; }
}

@media (min-width: 768px) {
    body { font-size: 16px; }
    .containervisible-xs .content-menu { min-height: 76px; }
    .containervisible-xs .am-logo img { max-height: 64px; }
    .containervisible-xs .am-title img { max-height: 56px; }
    .containervisible-xs .top-bar-holder { padding: 0 16px; min-height: 50px; }

    /* centred reading column */
    .containervisible-xs .middle-content,
    .containervisible-xs .page_aboutevents,
    .containervisible-xs .directory-top-bar,
    .containervisible-xs .directory-upper-holder,
    .containervisible-xs #bodycontainersearch,
    .page_contact[style] {
        float: none;
        width: auto;
        max-width: 980px;
        margin-left: auto;
        margin-right: auto;
    }
    .containervisible-xs .page_aboutevents,
    .containervisible-xs .directory-top-bar { border: 0; background: transparent !important; padding-left: 4px; padding-right: 4px; }
    .containervisible-xs .tabbable > .nav-tabs,
    .containervisible-xs .dx { justify-content: center; }
    .containervisible-xs .search-input-newsletter { margin: 10px auto 0; }
    .containervisible-xs .tab-content {
        max-width: 860px;
        margin: 18px auto 32px;
        padding: 28px 32px 36px;
        border-radius: 14px;
        box-shadow: var(--rs-shadow);
    }
    .containervisible-xs [id^="tab-"].clearfix {
        max-width: 860px;
        margin: 18px auto 32px;
        background: #fff;
        border-radius: 14px;
        box-shadow: var(--rs-shadow);
    }

    /* Home slider: image + caption side by side */
    .containervisible-xs #owl-main .item { display: grid; grid-template-columns: 3fr 2fr; background: var(--rs-navy); }
    .containervisible-xs #owl-main .image-slider { aspect-ratio: auto; height: 100%; min-height: 380px; }
    .containervisible-xs #owl-main .image-description { height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 28px !important; }
    .containervisible-xs #owl-main .read-more { align-self: flex-start; }

    /* Committees: list + details side by side */
    .containervisible-xs .committees {
        display: grid;
        grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
        gap: 18px;
        align-items: start;
        padding: 18px 16px 32px !important;
    }
    .containervisible-xs .committees > .committees-main-holder,
    .containervisible-xs .committees > .rightpagemenu_co { margin: 0; padding-left: 16px; padding-right: 16px; }
    .containervisible-xs .committees > .rightpagemenu_co { padding: 0; position: sticky; top: 100px; }

    /* Membership: 2 columns of fields */
    .containervisible-xs .allinfomember .members1 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; }

    .containervisible-xs .office-single { margin: 12px 0 !important; }
    /* the holder contains a space when closed, so :empty never matched (4/11/2026) */
.containervisible-xs .rightresp:not(:has(*)) { display: none; }
.containervisible-xs .rightresp:has(*) { margin: -6px 0 12px; }
    .containervisible-xs .office-single-image { width: 120px; flex: 0 0 120px; }

    #allinfocontact { padding: 24px 28px 28px; display: grid; grid-template-columns: 160px 1fr; gap: 14px 18px; align-items: center; }
    #allinfocontact > label.field-title { margin: 0; }
    #allinfocontact > .titledata,
    #allinfocontact > table { grid-column: 1 / -1; }
    .containervisible-xs .contact-main-holder { width: calc(100% - 24px); max-width: 956px; margin: 18px auto 14px; padding: 24px 28px; }
}

@media (min-width: 900px) {
    .containervisible-xs .custom-container > .events-main { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .containervisible-xs .newsletter-main { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Respect users who prefer less motion */
@media (prefers-reduced-motion: reduce) {
    .containervisible-xs * { transition: none !important; }
}

/* no photo: building icon instead of the "NO IMAGE AVAILABLE" picture (4/11/2026) */
.containervisible-xs img[src$="no_image.png"] {
    border: 0 !important;
    border-radius: 8px;
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-10 -10 44 44'%3E%3Crect x='-10' y='-10' width='44' height='44' fill='%23EEF2F8'/%3E%3Cg fill='none' stroke='%238E9AAD' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V5a1 1 0 0 1 1-1h9a1 1 0 0 1 1 1v16'/%3E%3Cpath d='M15 9h4a1 1 0 0 1 1 1v11'/%3E%3Cpath d='M2 21h20'/%3E%3Cpath d='M8 8h3M8 12h3M8 16h3'/%3E%3C/g%3E%3C/svg%3E");
    width: 100%;
}

/* ---------- Your Offers: add / edit form (application/views/add_offer.php, shared with desktop) ---------- */
.containervisible-xs .mo-form .mo-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--rs-line);
}
.containervisible-xs .mo-form .mo-head-text { min-width: 0; }
.containervisible-xs .mo-form .mo-back { margin-bottom: 6px; font-size: 14px; font-weight: bold; color: var(--rs-blue); cursor: pointer; }
.containervisible-xs .mo-form .mo-title { margin: 0; font-size: 22px; line-height: 1.2; font-weight: bold; color: var(--rs-navy); }
.containervisible-xs .mo-form .user_name.mo-sub { margin: 4px 0 0; font-size: 13px; color: var(--rs-muted); }
.containervisible-xs .mo-form .save_button.mo-btn {
    float: none;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    width: auto;
    height: 42px;
    margin: 0;
    padding: 0 18px;
    border-radius: 999px;
    background: var(--rs-red);
    font-size: 15px;
    font-weight: bold;
    line-height: 1;
}
.containervisible-xs .mo-form .mo-field { margin-bottom: 14px; }
.containervisible-xs .mo-form .user_field-title em { font-style: normal; color: var(--rs-red); }
.containervisible-xs .mo-form .mo-preview { display: none; }
.containervisible-xs .mo-form .mo-preview.has-pic { display: block; height: 170px; margin-bottom: 8px; border-radius: 8px; overflow: hidden; background: var(--rs-bg); }
.containervisible-xs .mo-form .mo-preview img { display: block; width: 100%; height: 100%; object-fit: cover; }
.containervisible-xs .mo-form .mo-upload.is-bad .span_browsefile { border-color: var(--rs-red); color: var(--rs-red); white-space: normal; line-height: 1.3; padding-top: 10px; padding-bottom: 10px; }
.containervisible-xs .mo-form .mo-hint { margin-top: 6px; font-size: 12px; color: var(--rs-muted); }
.containervisible-xs #first_step.mo-form .error { border-color: var(--rs-red) !important; }
.containervisible-xs #first_step.mo-form .mo-field:has(input.error, textarea.error) .field::after,
.containervisible-xs #first_step.mo-form .mo-field:has(.mo-upload .error) .mo-upload::after {
    content: "This field is required";
    display: block;
    margin-top: 5px;
    font-size: 12px;
    color: var(--rs-red);
}