.floating-label-form-group .help-block {
    display: none;
}

#id_field_5 {
    border: 1px solid grey;
}

.btn-round {
    border-radius: 4px;

}

form.mezzanine-form input,
form.mezzanine-form textarea {
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 3px;
    font-size: 18px;
    padding: 9px 10px;
}

::-webkit-input-placeholder {
    font-size: 15px;
    padding: 5px 5px;

}
::-moz-placeholder {
    font-size: 15px;
    padding: 5px 5px;
}
:-ms-input-placeholder {
    font-size: 15px;
    padding: 5px 5px;
}
::placeholder {
    font-size: 15px;
    padding: 5px 5px;
}

.page_title {
    color: orange;
}

.Portfolio-box,
.clear,
.contact-info-box span,
.featured-box-col2,
.service-list-col2,
.social-link,
.team-leader-box {
    overflow: hidden
}

.topic_heading {
    padding-bottom: 10px;
}


.item_title {
    padding-top: 20px;
    margin-top: 15px;
}

/* .featured-box-col1, .service-list-col1 {
    width: 50px;
    float: left;
} */

/* .featured-box-col1 i, .service-list-col1 i {
    display: block;
    font-family: FontAwesome;
    font-style: normal
} */


/* .service-list {
    padding: 0;
    font-size: 14px;
    margin-bottom: 40px
}


.
.main-section {
    padding: 70px 0
} */

.service-list-col1 {
    font-size: 10px;
    color: #222;
    padding-right: 10px;
    padding-left: 20px;
}

.item_paragraph {
    margin-top: 10px;
    margin-bottom: 10px;
    padding-left: 30px;
}


.heading_3 {
    margin-top: 10px;
    margin-left: 30px;
}

.icon {
    position: relative;
    top: 40px;


}

.subtitle {
font-size: 20px;
margin-top: -4px;
margin-left: 20px;
}

.title {
text-align: center;
margin-top: -20px;
width: 100%;


}

.subtitle_contact_us{
 text-align: center;
 width: 100%;
}




.content {
margin-left: 20px;
}

#comment .floating-label-form-group label{
    opacity: 1;
    font-size: 21px;
    top: 0;
}

#comment .floating-label-form-group label {
    opacity: 1;
    font-size: 21px;
    top: 0;
}

#comment .floating-label-form-group input, #comment .floating-label-form-group textarea {
    width: 100%;
}

.author {
    color: white;
    text-decoration: none;
}

.comments {
    color: white;
    text-decoration: white;
}

.inline_text {
font-size: 18px;
font-weight: normal;
color: #708090;
}

/* Three image containers (use 25% for four, and 50% for two, etc) */
.column_images {
  float: left;
  width: 50%;
  padding: 5px;
}

/* Clear floats after image containers */
.row_images::after {
  content: "";
  clear: both;
  display: table;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 500px) {
  .column_images {
    width: 100%;
  }
}


.img-circle {
    margin-left: 0px;
    padding-right: 0px;
    border-radius: 80%;
    border: 2px solid white;
    width: 48px;
    height: 48px;
    -moz-box-shadow: 10px 10px 5px grey;
    -webkit-box-shadow: 2px 2px 5px grey;
    box-shadow: 2px 2px 5px grey;
    -moz-border-radius:25px;
    -webkit-border-radius:25px;
    border-radius:25px;
}

#title {
    background: white;
    font-style: italic;
    margin: auto;
    width: 100%;
    border: 3px solid white;
    padding: 10px;
    text-align: center;
    }

#content_container {
    margin: auto;
    width: 50%;
    border: 3px solid white;
    padding: 10px;
    margin-bottom: 10px;
    margin-top: 20px;
    }

#users_info {
    float: right;
    color: white;
    font-size: 12px;
    display: inline-block;
    vertical-align: middle;
    margin-left: auto;
    padding-left: auto;
    margin-right: 0px;
    padding-right: 0px;
    padding-top: 5px;
    }

#profile_name {
    text-align: center;
    padding-left: 0px;
    margin-left: 0px;
    margin-top: 0px;
    color: orangered;
    font-size: 12px;
    font-weight: bold;
    }

#logout {
    text-align: left;
    font-size: 10px;
    margin-top: 0px;
    padding-top: 0px;
    padding-left: 0px;
    margin-left: 0px;
    color: white;

    }

    #login {
    text-align: left;
    font-size: 10px;
    margin-top: 0px;
    padding-top: 0px;
    padding-left: 0px;
    margin-left: 0px;
    color: white;

    }



.profile_info{
margin-left: 40px;

}

.menu_show {
padding-left: 6px;
font-size: 14px;
}

.messages_error{
font-size: 1em;
color: red;
margin-top: -10px;
padding-top: -10px;
border-top: -10px;
padding-bottom: 10px;
background-color: #FFFF99;
}

/* ========= Forced Dark Theme (no toggle) ========= */
:root {
    --bg-dark: #0e1014;
    --text-dark: #e6e6ea;
    --muted-dark: #9aa4b2;
    --card-dark: #151924;
    --border-dark: #232a3b;
    --link-dark: #8ab4ff;
    --navbar-dark: #0b132b; /* deep navy */
}

html[data-theme="dark"] body {
    background-color: var(--bg-dark);
    color: var(--text-dark);
}

/* Typography & links */
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6 { color: var(--text-dark); }

html[data-theme="dark"] .text-muted { color: var(--muted-dark) !important; }
html[data-theme="dark"] a { color: var(--link-dark); }
html[data-theme="dark"] a:hover { opacity: .9; }

/* Surfaces */
html[data-theme="dark"] .section,
html[data-theme="dark"] .card,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .modal-content { background: var(--card-dark); color: var(--text-dark); }

html[data-theme="dark"] .card,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .modal-content { border-color: var(--border-dark); }

html[data-theme="dark"] .footer {
    background: var(--card-dark);
    color: var(--muted-dark);
    border-top: 1px solid var(--border-dark);
}

/* Navbar (Argon) */
html[data-theme="dark"] #navbar-main.bg-default { background: var(--navbar-dark) !important; }
html[data-theme="dark"] .navbar.navbar-dark .nav-link { color: var(--text-dark) !important; }
html[data-theme="dark"] .navbar .navbar-brand img { filter: none; } /* adjust if you need an inverted logo */

/* Dropdown items */
html[data-theme="dark"] .dropdown-item { color: var(--text-dark); }
html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .dropdown-item:focus { background:#1f2740; color: var(--text-dark); }

/* Buttons that use light variant */
html[data-theme="dark"] .btn-outline-light { color: var(--text-dark); border-color: var(--text-dark); }
html[data-theme="dark"] .btn-outline-light:hover { background: var(--text-dark); color:#000; }

/* Forms */
html[data-theme="dark"] .form-control {
    background: var(--card-dark);
    color: var(--text-dark);
    border-color: var(--border-dark);
}
html[data-theme="dark"] .form-control::placeholder { color: var(--muted-dark); }

/* Tables */
html[data-theme="dark"] .table { color: var(--text-dark); }
html[data-theme="dark"] .table thead th { border-bottom-color: var(--border-dark); }
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table th { border-top-color: var(--border-dark); }

/* Code blocks */
html[data-theme="dark"] pre,
html[data-theme="dark"] code,
html[data-theme="dark"] kbd {
    background: var(--card-dark);
    color: var(--text-dark);
    border: 1px solid var(--border-dark);
}

/* Hero shape contrast */
html[data-theme="dark"] .shape.shape-style-1 .span-50,
html[data-theme="dark"] .shape.shape-style-1 .span-75,
html[data-theme="dark"] .shape.shape-style-1 .span-100,
html[data-theme="dark"] .shape.shape-style-1 .span-150 { opacity: .25; }

/* --- Soft color backgrounds for icon tiles --- */
.bg-soft-primary { background-color: rgba(94,114,228,0.1) !important; }
.bg-soft-success { background-color: rgba(45,206,137,0.1) !important; }
.bg-soft-danger  { background-color: rgba(245,54,92,0.1) !important; }

/* --- Dark Theme Adjustments --- */
[data-theme="dark"] .bg-soft-primary { background-color: rgba(94,114,228,0.25) !important; }
[data-theme="dark"] .bg-soft-success { background-color: rgba(45,206,137,0.25) !important; }
[data-theme="dark"] .bg-soft-danger  { background-color: rgba(245,54,92,0.25) !important; }

[data-theme="dark"] .text-muted { color: #b5b9c3 !important; }

/* Service card containers in dark mode */
[data-theme="dark"] .info {
    background-color: #1b1e29;
    border-radius: 10px;
    padding: 1rem;
}

/* Hero section separator blending */
[data-theme="dark"] .section-hero .fill-white { fill: #151924 !important; }

/* Claris Partner band — looks great in dark *and* light */
.partner-band {
    /* Subtle dark gradient so white logos pop */
    background: linear-gradient(180deg, #0b132b 0%, #11162a 100%);
    border: 1px solid rgba(255,255,255,0.06);
}

.partner-logo {
    display: block;
    height: 56px;              /* constrained by HTML height, keeps crisp logos */
    max-width: 100%;
    object-fit: contain;
    opacity: 0.92;
    filter: drop-shadow(0 2px 6px rgba(0,0,0,0.35));
    transition: opacity .2s ease, transform .2s ease, filter .2s ease;
}

.partner-logo:hover {
    opacity: 1;
    transform: translateY(-1px);
    filter: drop-shadow(0 4px 10px rgba(0,0,0,0.45));
}

/* Tweak for light theme (if you re-enable a toggle later) */
html[data-theme="light"] .partner-band {
    background: linear-gradient(180deg, #1a2040 0%, #242a48 100%);
    border-color: rgba(0,0,0,0.08);
}

/* Tighten the small bullets on phones */
@media (max-width: 575.98px) {
    .partner-band .list-inline-item {
        display: block;
        margin: .35rem 0 !important;
    }
}

/* --- tighten hero → content gap --- */
.section.section-hero { padding-bottom: 1rem; }              /* was ~6rem in Argon */
.section.section-hero .shape-container { padding-bottom: 1rem; }
.section-hero .separator { margin-top: -10px; }              /* pull content closer */
.section-hero .separator svg { height: 60px; }               /* match the new viewBox */

/* partner band spacing tuned */
.partner-band { margin-top: 1rem; }
@media (min-width: 768px) {
    .partner-band { margin-top: 1.25rem; }
}

/* ---- Compact hero: kill big Argon spacing ---- */
.section.section-hero.hero-plain {
    padding-top: 5rem !important;
    padding-bottom: 0 !important;      /* no space below */
    min-height: 0 !important;           /* in case Argon sets a min-height */
}
.section.section-hero.hero-plain .shape-container {
    padding-top: .5rem !important;
    padding-bottom: 0 !important;
}

/* Tighten elements inside */
.hero-plain .brand-name {
    font-size: clamp(1.9rem, 4vw, 2.8rem);
    font-weight: 800;
    line-height: 1.15;
    margin: .25rem 0 .25rem;
}
.hero-plain .lead { margin: 0; }
.hero-plain .brand-mark img { border-radius: 12px; box-shadow: 0 4px 14px rgba(0,0,0,.35); }

/* Subtle particles so it feels lighter */
.hero-plain .shape.shape-style-1 [class^="span-"] { opacity: .16; }
[data-theme="dark"] .hero-plain .shape.shape-style-1 [class^="span-"] { opacity: .20; }

/* If the next section still looks far, trim its top margin */
.partner-band { margin-top: .75rem !important; }
/* CTA polish */
.cta-wrap .btn { min-width: 240px; }
@media (max-width: 575.98px) {
    .cta-wrap .btn { width: 100%; min-width: 0; }
}

/* Subtle focus + hover for primary */
.cta-primary { transition: transform .12s ease, box-shadow .12s ease; }
.cta-primary:focus,
.cta-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(0,0,0,.25);
}

/* Outline button contrast for dark theme */
[data-theme="dark"] .cta-secondary {
    border-color: rgba(255,255,255,.6);
    color: #fff;
}
[data-theme="dark"] .cta-secondary:hover,
[data-theme="dark"] .cta-secondary:focus {
    background: rgba(255,255,255,.08);
    border-color: #fff;
    color: #fff;
}

/* Badge tweaks for consistency on dark */
[data-theme="dark"] .badge-info { background: #11cdef; color: #0b1b2b; }
[data-theme="dark"] .badge-success { background: #2dce89; color: #06241a; }

/* Shared layout */
.cta-wrap .btn { min-width: 240px; }
@media (max-width: 575.98px) { .cta-wrap .btn { width: 100%; min-width: 0; } }

/* ---- High contrast defaults ---- */
.cta-contrast {
    font-weight: 700;
    letter-spacing: .2px;
    transition: opacity .15s ease, transform .12s ease, box-shadow .12s ease;
}

/* Solid button: use a slightly brighter primary on dark for sharper contrast */
[data-theme="dark"] .cta-secondary-solid.btn-primary {
    background-color: #6f84ff;  /* brighter than Argon default for clarity */
    border-color: #6f84ff;
    color: #fff;
}
[data-theme="dark"] .cta-secondary-solid.btn-primary:focus {
    box-shadow: 0 0 0 .2rem rgba(111,132,255,.35);
}

/* Outline button: full white border/text for contrast on dark */
[data-theme="dark"] .cta-primary-outline {
    border-color: #ffffff;
    color: #ffffff;
}
[data-theme="dark"] .cta-primary-outline:focus {
    box-shadow: 0 0 0 .2rem rgba(255,255,255,.25);
}

/* ---- "Faded on hover" behavior (both buttons) ---- */
.cta-contrast:hover,
.cta-contrast:focus {
    opacity: .85;              /* subtle fade */
    transform: translateY(-1px);
}

/* Optional: reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
    .cta-contrast { transition: opacity .15s ease; }
    .cta-contrast:hover, .cta-contrast:focus { transform: none; box-shadow: none; }
}

/* Keep edges crisp (avoids “blurry” feel) */
.cta-contrast {
    box-shadow: none;
    text-shadow: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html, body {
    font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, "Apple Color Emoji",
    "Segoe UI Emoji", "Segoe UI Symbol", sans-serif !important;
    font-weight: 400;
}

/* Make headings use the same family (Argon does this by default, this enforces it) */
h1, h2, h3, h4, h5, h6,
.display-1, .display-2, .display-3, .display-4 {
    font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif !important;
    font-weight: 700; /* Argon’s headings are bold by default */
}

/* Optional: tighten letter-spacing a touch for displays */
.display-1, .display-2, .display-3, .display-4 {
    letter-spacing: .2px;
}