/* -------------------------------------------------------------
	Swapnil Associates — Joomla 5 template
	Faithful rebuild of the original swapnilassociates.com design
--------------------------------------------------------------- */

/* Embed Fonts */
@font-face {
    font-family: 'TitilliumText22LLight';
    src: url('../css/fonts/titilliumtext22l002-webfont.woff') format('woff'),
         url('../css/fonts/titilliumtext22l002-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'TitilliumText22LRegular';
    src: url('../css/fonts/titilliumtext22l003-webfont.woff') format('woff'),
         url('../css/fonts/titilliumtext22l003-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'TitilliumText22LSemibold';
    src: url('../css/fonts/titilliumtext22l005-webfont.woff') format('woff'),
         url('../css/fonts/titilliumtext22l005-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* Bootstrap Reset */
html, body {
    margin: 0;
    padding: 0;
}

body {
    background-color: #CECFD3;
    background-image: url('../images/styles/style1/main_texture.png');
    background-repeat: repeat;
    overflow-x: hidden;
    line-height: 24px;
    font-family: "TitilliumText22LRegular", Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #333;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "TitilliumText22LRegular", Arial, Helvetica, sans-serif;
    font-weight: normal;
    color: #555;
}

a:link { color: #006699; }
a:visited { color: #571586; }
a:hover { text-decoration: underline; }

p { margin-bottom: 18px; }

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

.container {
    width: 1170px;
    margin: 0 auto;
    padding-left: 15px;
    padding-right: 15px;
}

#content_wraper {
    background-color: #fff;
    margin-top: 25px;
    margin-bottom: 25px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0,0,0,.15);
    padding-bottom: 20px;
}

/* Header
--------------------------------------------------------------- */
#header {
    padding: 25px 0 20px;
    overflow: hidden;
}

#logo {
    float: left;
    width: 45%;
}

#logo img.logo {
    max-height: 90px;
}

#logo .site-description {
    font-family: "TitilliumText22LLight", Arial, sans-serif;
    font-size: 15px;
    color: #777;
    margin-top: 6px;
    letter-spacing: .5px;
}

#header_right {
    float: right;
    width: 50%;
    text-align: right;
    padding-top: 20px;
}

#topmenu ul {
    list-style: none;
    margin: 0 0 8px;
    padding: 0;
}

#topmenu li {
    display: inline-block;
    margin-left: 18px;
}

#topmenu li a {
    font-size: 12px;
    color: #666;
    text-decoration: none;
}

#topmenu li a:hover { color: #d01720; }

#search form {
    display: inline-block;
}

#search .inputbox {
    border: 1px solid #ccc;
    padding: 6px 10px;
    font-size: 13px;
    border-radius: 3px;
}

#search .button {
    background: #7E939E;
    color: #fff;
    border: none;
    padding: 6px 14px;
    font-size: 13px;
    border-radius: 3px;
    cursor: pointer;
}

/* Nav toggle (hamburger) — hidden on desktop, shown only on mobile */
.nav-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 34px;
    background: #556d7d;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    vertical-align: middle;
}

.nav-toggle__bar {
    display: block;
    width: 20px;
    height: 2px;
    background: #fff;
    border-radius: 1px;
    transition: transform .25s ease, opacity .25s ease;
}

.nav-toggle.is-open .nav-toggle__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.is-open .nav-toggle__bar:nth-child(2) { opacity: 0; }
.nav-toggle.is-open .nav-toggle__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Main Menu
--------------------------------------------------------------- */
#mainmenu {
    background-image: -moz-linear-gradient(#324, #456);
    background-image: -webkit-linear-gradient(#324, #456);
    background-image: -o-linear-gradient(#324, #456);
    background-image: -ms-linear-gradient(#324, #456);
    background-image: linear-gradient(#324, #456);
    border-radius: 5px;
    border-top: 5px solid #d01720;
    margin: 0 0 20px;
}

.mainmenu ul.nav-menu,
.mainmenu ul.menu,
.mainmenu ul.nav {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: nowrap;
    padding-left: 10px;
}

.mainmenu > ul > li,
.mainmenu ul.nav-menu > li,
.mainmenu ul.menu > li {
    display: inline-block;
    position: relative;
    flex: 0 0 auto;
    white-space: nowrap;
}

.mainmenu > ul > li > a,
.mainmenu ul.nav-menu > li > a,
.mainmenu ul.menu > li > a {
    display: block;
    color: #fff;
    text-decoration: none;
    padding: 14px 18px;
    font-size: 15px;
    font-family: "TitilliumText22LSemibold", Arial, sans-serif;
}

.mainmenu > ul > li > a:hover,
.mainmenu > ul > li.active > a,
.mainmenu > ul > li.current > a,
.mainmenu ul.nav-menu > li > a:hover,
.mainmenu ul.nav-menu > li.active > a,
.mainmenu ul.menu > li > a:hover,
.mainmenu ul.menu > li.active > a {
    background-image: -moz-linear-gradient(#d01720, #c00);
    background-image: -webkit-linear-gradient(#d01720, #c00);
    background-image: -o-linear-gradient(#d01720, #c00);
    background-image: linear-gradient(#d01720, #c00);
    color: #fff;
}

/* Dropdown submenus */
.mainmenu li.parent > a::after,
.mainmenu li.parent > span::after {
    content: " ▾";
    font-size: 10px;
}

/* Top-level separators render as spans */
.mainmenu .mod-menu__separator,
.mainmenu .separator {
    display: block;
    color: #fff;
    text-decoration: none;
    padding: 13px 18px;
    font-size: 15px;
    font-family: "TitilliumText22LSemibold", Arial, sans-serif;
    cursor: default;
}

.mainmenu li.parent:hover > .mod-menu__separator,
.mainmenu li.parent:hover > .separator {
    background-image: linear-gradient(#d01720, #c00);
}

/* Dropdown: Joomla renders children in ul.nav-child */
.mainmenu ul ul,
.mainmenu ul.nav-child,
.mainmenu .nav-child {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 100;
    display: none;
    min-width: 230px;
    background-color: #6e8493;
    border-radius: 0 0 4px 4px;
    padding: 5px 0;
    margin: 0;
    list-style: none;
}

.mainmenu li:hover > ul,
.mainmenu li:hover > .nav-child {
    display: block;
}

.mainmenu ul ul li,
.mainmenu ul.nav-child li {
    display: block;
    position: relative;
    white-space: normal;
}

.mainmenu ul ul a,
.mainmenu ul.nav-child a,
.mainmenu ul ul .mod-menu__separator,
.mainmenu ul.nav-child .mod-menu__separator {
    display: block;
    color: #fff;
    padding: 9px 18px;
    font-size: 13px;
    text-decoration: none;
    border-bottom: 1px solid rgba(255,255,255,.15);
}

.mainmenu ul ul a:hover,
.mainmenu ul.nav-child a:hover {
    background-color: #556d7d;
    color: #fff;
}

.mainmenu ul ul ul,
.mainmenu ul.nav-child ul.nav-child {
    top: 0;
    left: 100%;
    border-radius: 0 4px 4px 4px;
}

/* Content
--------------------------------------------------------------- */
#content {
    padding: 0;
}

#content_inner {
    padding-top: 10px;
}

.row {
    overflow: hidden;
    margin-left: -15px;
    margin-right: -15px;
}

.row-fluid { overflow: hidden; }

.span3  { width: 25%;   float: left; padding: 0 15px; box-sizing: border-box; }
.span4  { width: 33.33%; float: left; padding: 0 15px; box-sizing: border-box; }
.span8  { width: 66.66%; float: left; padding: 0 15px; box-sizing: border-box; }
.span12 { width: 100%;  float: left; padding: 0 15px; box-sizing: border-box; }

/* Sidebar left: sidebar floats left, content floats right */
#sidebar.sidebar_left {
    float: left;
    width: 33.33%;
    padding: 0 15px;
    box-sizing: border-box;
}

#sidebar.sidebar_right {
    float: right;
    width: 33.33%;
    padding: 0 15px;
    box-sizing: border-box;
}

#sidebar.sidebar_left ~ #middlecol,
#middlecol.span8 {
    float: right !important;
    width: 66.66%;
}

#sidebar.sidebar_right ~ #middlecol,
#middlecol.span8 {
    float: left !important;
    width: 66.66%;
}

#middlecol .inside {
    padding: 0 10px;
}

/* Sidebar
--------------------------------------------------------------- */
#sidebar .inside {
    padding: 0 10px;
}

#sidebar .sidebar_module {
    margin-bottom: 25px;
}

#sidebar .sidebar_module h3.sidebar_module_heading,
#sidebar .moduletable h3,
#sidebar .card h3,
#sidebar .sidebar-right h3 {
    background-color: #556d7d;
    color: #fff;
    font-size: 16px;
    font-family: "TitilliumText22LSemibold", Arial, sans-serif;
    padding: 12px 15px;
    margin: 0 0 0;
    border-radius: 4px 4px 0 0;
}

#sidebar .sidebar_module_content,
#sidebar .moduletable .sidebar_module_content,
#sidebar .card-body {
    background-color: #ebebf0;
    padding: 15px;
    border-radius: 0 0 4px 4px;
}

#sidebar ul.menu,
#sidebar ul.nav {
    list-style: none;
    margin: 0;
    padding: 0;
}

#sidebar ul.menu li a,
#sidebar ul.nav li a {
    display: block;
    padding: 8px 12px;
    border-bottom: 1px solid #C9CED5;
    color: #555;
    text-decoration: none;
    font-size: 13px;
}

#sidebar ul.menu li a:hover,
#sidebar ul.menu li.active a,
#sidebar ul.nav li a:hover,
#sidebar ul.nav li.active a {
    background-color: #D7DBE0;
    color: #333;
}

/* Slideshow
	Also usable inside article content (.item-page .sw-slideshow) —
	e.g. a photo slider embedded directly in an article body — using
	the exact same markup/JS as the homepage slideshow.
--------------------------------------------------------------- */
#iceslideshow {
    margin-bottom: 20px;
    position: relative;
}

.item-page .sw-slideshow {
    margin: 20px 0;
}

#iceslideshow .sw-slideshow,
.item-page .sw-slideshow {
    position: relative;
    overflow: hidden;
    border-radius: 5px;
}

#iceslideshow .sw-slideshow .sw-slide,
.item-page .sw-slideshow .sw-slide {
    display: none;
    position: relative;
}

#iceslideshow .sw-slideshow .sw-slide.active,
.item-page .sw-slideshow .sw-slide.active {
    display: block;
}

#iceslideshow .sw-slideshow img,
.item-page .sw-slideshow img {
    width: 100%;
    display: block;
}

#iceslideshow .sw-slideshow .sw-caption,
.item-page .sw-slideshow .sw-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,.55);
    color: #fff;
    padding: 15px 20px;
    font-size: 18px;
    font-family: "TitilliumText22LRegular", Arial, sans-serif;
}

#iceslideshow .sw-slideshow .sw-caption a,
.item-page .sw-slideshow .sw-caption a { color: #fff; text-decoration: none; }

#iceslideshow .sw-arrow,
.item-page .sw-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,.4);
    color: #fff;
    border: none;
    font-size: 24px;
    width: 36px;
    height: 48px;
    cursor: pointer;
    z-index: 10;
}

#iceslideshow .sw-arrow.prev,
.item-page .sw-arrow.prev { left: 0; border-radius: 0 4px 4px 0; }
#iceslideshow .sw-arrow.next,
.item-page .sw-arrow.next { right: 0; border-radius: 4px 0 0 4px; }

#iceslideshow .sw-dots,
.item-page .sw-dots {
    position: absolute;
    bottom: 10px;
    right: 15px;
    z-index: 10;
}

#iceslideshow .sw-dots button,
.item-page .sw-dots button {
    width: 11px;
    height: 11px;
    border-radius: 50%;
    border: 1px solid #fff;
    background: transparent;
    margin-left: 5px;
    cursor: pointer;
}

#iceslideshow .sw-dots button.active,
.item-page .sw-dots button.active {
    background: #d01720;
    border-color: #d01720;
}

/* Thumbnail strip — article-embedded sliders only (e.g. office photos) */
.sw-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 12px 0 20px;
}

.sw-thumb {
    width: 84px;
    height: 60px;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 4px;
    overflow: hidden;
    background: none;
    cursor: pointer;
    opacity: .65;
    transition: opacity .2s ease, border-color .2s ease;
}

.sw-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.sw-thumb:hover { opacity: 1; }

.sw-thumb.active {
    opacity: 1;
    border-color: #d01720;
}

@media (max-width: 480px) {
    .sw-thumb { width: 64px; height: 46px; }
}

/* Simple photo gallery grid — used on article pages (e.g. Photo Gallery) */
.simple-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 14px;
    margin: 20px 0;
}

.simple-gallery a {
    display: block;
    overflow: hidden;
    border-radius: 6px;
    box-shadow: 0 1px 6px rgba(0,0,0,.18);
}

.simple-gallery img {
    width: 100%;
    height: 160px;
    object-fit: cover;
    display: block;
    transition: transform .3s ease;
}

.simple-gallery a:hover img {
    transform: scale(1.08);
}

@media (max-width: 480px) {
    .simple-gallery { grid-template-columns: repeat(2, 1fr); }
}

/* Lightbox — used for .simple-gallery clicks (built by template.js) */
.lightbox-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.85);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease;
}

.lightbox-overlay.is-open {
    opacity: 1;
    visibility: visible;
}

.lightbox-image {
    max-width: 90vw;
    max-height: 85vh;
    border-radius: 4px;
    box-shadow: 0 10px 40px rgba(0,0,0,.5);
}

.lightbox-close {
    position: absolute;
    top: 20px;
    right: 25px;
    background: none;
    border: none;
    color: #fff;
    font-size: 34px;
    line-height: 1;
    cursor: pointer;
}

.lightbox-prev,
.lightbox-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255,255,255,.15);
    border: none;
    color: #fff;
    width: 44px;
    height: 56px;
    font-size: 28px;
    cursor: pointer;
    border-radius: 4px;
}

.lightbox-prev { left: 20px; }
.lightbox-next { right: 20px; }

.lightbox-close:hover,
.lightbox-prev:hover,
.lightbox-next:hover {
    background: rgba(255,255,255,.3);
}

/* Breadcrumbs */
.mod-breadcrumbs__wrapper {
    margin-bottom: 15px;
    font-size: 12px;
    color: #777;
}

.mod-breadcrumbs__wrapper a { color: #006699; text-decoration: none; }

.mod-breadcrumbs__divider {
    display: none !important;
}

.mod-breadcrumbs .breadcrumb-item {
    display: inline-block;
}

.mod-breadcrumbs .breadcrumb-item + .breadcrumb-item::before {
    content: "/";
    padding: 0 8px;
    color: #777;
}

/* Ice Carousel / What we offer
--------------------------------------------------------------- */
#icecarousel {
    border-top: 1px solid #ebebf0;
    border-bottom: 1px solid #ebebf0;
    padding: 20px 0;
    margin-bottom: 20px;
}

#icecarousel h3.module-title,
#icecarousel .module-title {
    color: #556d7d;
    font-size: 22px;
    margin: 0 0 15px;
    font-family: "TitilliumText22LRegular", Arial, sans-serif;
}

.icecarousel-row {
    overflow: hidden;
    margin: 0 -10px;
}

.icecarousel-item {
    float: left;
    width: 20%;
    box-sizing: border-box;
    padding: 0 10px;
    margin-bottom: 15px;
}

.icecarousel-inner {
    background-color: #EBEBF0;
    border-radius: 4px;
    overflow: hidden;
}

.icecarousel-inner img {
    width: 100%;
    display: block;
}

.icecarousel-caption {
    padding: 10px 12px;
    font-size: 13px;
    text-align: center;
    line-height: 1.4;
}

.icecarousel-caption a { color: #556d7d; text-decoration: none; }
.icecarousel-inner:hover .icecarousel-caption { background-color: #ebedf0; }

/* Welcome / Intro text */
#ice_message {
    background-color: #6E8493;
    border-top: 1px solid #7F93A1;
    border-bottom: 1px solid #7F93A1;
    color: #fff;
    padding: 20px 25px;
    margin-bottom: 20px;
    font-size: 15px;
}

#ice_message h1, #ice_message h2, #ice_message h3,
#ice_message strong { color: #fff; }

/* Intro articles */
.com-content-article .readmore,
.item-page .readmore {
    display: inline-block;
    margin-top: 5px;
}

.com-content-article .readmore a,
.item-page .readmore a {
    background: #d01720;
    color: #fff;
    padding: 6px 16px;
    border-radius: 3px;
    text-decoration: none;
    font-size: 13px;
}

/* Homepage middle section — "Who can apply?" / "Manpower Business Cons and Pros" / "Fraud Awareness Tips!" */
.blog-items.masonry-3 {
    overflow: hidden;
    margin-left: -15px;
    margin-right: -15px;
}

.blog-items.masonry-3 .com-content-category-blog__item {
    width: 33.33%;
    float: left;
    padding: 0 15px;
    box-sizing: border-box;
}

.blog div.img {
    float: left;
    margin-bottom: 12px;
    overflow: hidden;
}

.blog div.img a img {
    transition: opacity .2s ease-out;
}

.blog div.img a:hover img {
    opacity: .85;
}

/* Footer
--------------------------------------------------------------- */
#footer {
    background-color: #556d7d;
    margin: 25px 0px 0;
    border-radius: 5px;
    color: #fff;
    padding: 25px 0 10px;
}

#footer .row { margin: 0; }

#footer h3 {
    color: #fff;
    font-size: 16px;
    font-family: "TitilliumText22LSemibold", Arial, sans-serif;
    margin-bottom: 12px;
}

#footer ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#footer ul li a {
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    line-height: 1.9;
}

#footer ul li a:hover { color: #d01720; }

#footer #ice_about {
    border-right: 1px solid #486273;
    box-shadow: 1px 0 #6D808C;
    padding-right: 25px;
}

#footer .moduletable,
#footer .card { margin-bottom: 15px; }

/* Copyright area
--------------------------------------------------------------- */
#copyright_area {
    /* background-color: #556d7d;
    border-top: 4px solid #d01720; */
    padding: 10px 0;
    margin-top: -10px;
}

#copyright_area .container { position: relative; }

#copyright_area p#copyright {
    color: #1d1d1d;
    font-size: 12px;
    margin: 0;
}

#copyrightmenu {
    position: absolute;
    right: 15px;
    top: 0;
}

#copyrightmenu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#copyrightmenu li {
    display: inline-block;
    margin-left: 15px;
}

#copyrightmenu li a {
    color: #1d1d1d;
    font-size: 12px;
    text-decoration: none;
}

#copyrightmenu li a:hover { color: #fff; }

/* Go to top */
#gotop {
    position: fixed;
    right: 25px;
    bottom: 25px;
    z-index: 200;
    display: none;
}

#gotop.gotop_active { display: block; }

#gotop .scrollup {
    display: block;
    background-color: #6E8493;
    background-color: rgba(85,109,125,.5);
    color: #fff;
    padding: 10px 14px;
    border-radius: 4px;
    text-decoration: none;
    font-size: 12px;
}

#gotop .scrollup:hover { background-color: #556d7d; }


.pagenavigation .pagination {
        display: flex;
        justify-content: space-between;
        gap: 1rem;
        margin: 20px 0;
        padding: 0;
    }

.item-page .com-content-article__body > div.img:first-child {
    display: none;
}




/* Page headings */
.page-header h1, .page-header h2 {
    color: #556d7d;
    font-size: 24px;
    margin-bottom: 15px;
}

/* Utility */
.clearfix:before, .clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after { clear: both; }

/* Responsive */
@media (max-width: 1199px) {
    .container { width: 960px; }
    .icecarousel-item { width: 25%; }
}

@media (max-width: 979px) {
    .container { width: 100%; padding-left: 15px; padding-right: 15px; box-sizing: border-box; }

    /* Header: logo left, hamburger right, on one row */
    #header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 12px 0;
    }

    #logo { float: none; width: auto; text-align: left; }
    #logo img.logo { max-height: 46px; }

    #header_right {
        float: none;
        width: auto;
        text-align: right;
        padding-top: 0;
    }

    #content_wraper {
        margin-top: 0px;
    }
    #sidebar.sidebar_left {

        padding: 0 5px;

    }

    #sidebar.sidebar_right {
        padding: 0 5px;

    }

    #topmenu, #search { display: none; }

    .icecarousel-item { width: 50%; }
    .span3, .span4, .span8, .span12 { float: none; width: 100%; }
    .blog-items.masonry-3 .com-content-category-blog__item { float: none; width: 100%; }
    #footer #ice_about { border-right: none; box-shadow: none; }
    #footer_mods .row-fluid > div { width: 50%; float: left; box-sizing: border-box; }

    /* Nav toggle appears; menu bar collapses behind it until opened */
    .nav-toggle { display: inline-flex; }

    #mainmenu { padding: 0; }

    .mainmenu {
        max-height: 0;
        overflow: hidden;
        transition: max-height .3s ease;
    }

    #mainmenu.is-open .mainmenu {
        max-height: 80vh;
        overflow-y: auto;
    }

    .mainmenu ul.nav-menu,
    .mainmenu ul.menu,
    .mainmenu ul.nav {
        display: block;
        flex-wrap: wrap;
    }

    .mainmenu > ul > li,
    .mainmenu ul.nav-menu > li,
    .mainmenu ul.menu > li {
        display: block;
        width: 100%;
        white-space: normal;
    }

    /* Submenus become inline accordions (tap to open) instead of hover flyouts */
    .mainmenu ul ul,
    .mainmenu ul.nav-child,
    .mainmenu .nav-child {
        position: static;
        border-radius: 0;
    }

    .mainmenu li.is-open > ul,
    .mainmenu li.is-open > .nav-child {
        display: block;
    }

    .mainmenu li.parent > .mod-menu__separator {
        cursor: pointer;
    }
}

@media (max-width: 480px) {
    .icecarousel-item { width: 100%; }
    #footer_mods .row-fluid > div { width: 100%; float: none; }
}
