/* ===== Global Styles ===== */
body {
    font-family: "Open Sans", "Times New Roman", serif;
    font-weight: 400;
    font-style: normal;
    background: #FFFFFF;
}


/* ===== Navbar ===== */
.navbar-brand {
    padding: 16px 0;
}
.navbar-brand img {
    width: 160px;
    margin-right: 30px;
}

.navbar-expand-lg {
    background: #FFFFFF;
    padding: 0;
    box-shadow: 0 10px 35px 0 rgba(0,0,0,.1);
    border: 0;
}

.navbar-nav.ms-auto li {
    display: inline-block;
}
.navbar-nav.ms-auto li a {
    font-size: 14px;
    color: #000;
    font-weight: 500;
    background: transparent;
    border-radius: 5px;
    padding: 25px 0 25px 40px !important;
    display: block;
    letter-spacing: 0.2px;
    text-transform: none;
}
.navbar-nav.ms-auto li a:hover,
.navbar-nav.ms-auto li a:focus {
    background: transparent;
    color: #1686cb;
}
.navbar-nav.ms-auto li a i {
    margin-right: 5px;
}
.navbar-nav.ms-auto li a img {
    width: 24px;
    margin-right: 4px;
    margin-top: -2px;
}

/* Dropdown */
.navbar-nav.ms-auto .dropdown-menu {
    padding: 0;
    border: 0;
    border-radius: 0;
}
.navbar-nav.ms-auto .dropdown-menu li {
    display: block;
}
.navbar-nav.ms-auto .dropdown-menu li a.dropdown-item {
    display: block;
    border-bottom: 1px solid #f3f3f3;
    border-radius: 0;
    padding: 12px 14px !important;
    font-size: 14px;
}
.navbar-nav.ms-auto .dropdown-menu li a.dropdown-item i {
    color: #1480c8;
}
.navbar-nav.ms-auto .dropdown-menu li a.dropdown-item img {
    width: 18px;
    margin-right: 10px;
}

/* Navbar Toggler */
.navbar-toggler {
    padding: 4px;
    font-size: 8px;
    border-radius: 50%;
    color: #000;
    margin: 2px 0 0 15px;
    border: 1px solid #000;
}
.navbar-toggler:hover,
.navbar-toggler:focus {
    outline: 0;
    box-shadow: none;
}

/* ===== Custom Columns (5 cols) ===== */
.col-xs-15, .col-sm-15, .col-md-15, .col-lg-15 {
    position: relative;
    min-height: 1px;
    padding: 0 10px;
}
.col-xs-15 { width: 20%; float: left; }
@media (min-width: 768px)  { .col-sm-15 { width: 20%; float: left; } }
@media (min-width: 992px)  { .col-md-15 { width: 20%; float: left; } }
@media (min-width: 1200px) { .col-lg-15 { width: 20%; float: left; } }

/* ===== Hero Section ===== */
.hero-section {
    background: url("../img/home-bg.jpg") center/cover no-repeat;
    padding: 60px 0;
    position: relative;
    z-index: 5;
}
.hero-section:before {
    content: "";
    background: #00000070;
    position: absolute;
    inset: 0;
    z-index: 0;
}

/* ===== Headings & Sections ===== */
.sectionline {
    background: #1685cb;
    color: #FFF;
    padding: 20px 0;
    width: 100%;
}
.sectionline p {
    font-size: 22px;
    font-weight: 500;
    text-align: center;
    margin: 0;
}

.headig-main {
    position: relative;
    display: block;
}
.headig-main h1 {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 15px;
    color: #FFF;
}
.headig-main h2 {
    font-size: 22px;
    color: #FFF;
    margin-bottom: 25px !important;
}
.headig-main p {
    font-size: 14px;
    font-weight: 400;
    color: #FFF;
    margin: 0 0 25px;
}

/* Buttons */
.headig-main .btn.btn-light {
    font-size: 14px;
    font-weight: 600;
    padding: 8px 10px;
    color: #FFF;
    background: #1480c8;
    border: 0;
    border-radius: 0;
}
.headig-main .btn.btn-light.w-100 {
    width: 100%;
    font-weight: 400;
    color: #000;
    background: #FFF;
    padding: 6px 4px;
}
.headig-main .btn.btn-light:hover,
.headig-main .btn.btn-light:focus {
    color: #000;
    background: #FFF;
}

/* Small Button */
.headig-main .b-hoem {
    background: transparent;
    border: 1px solid #ffffff6b;
    padding: 4px 8px;
    color: #FFF;
    font-size: 11px;
}

/* ===== Cards ===== */
.card {
    background: #FFF;
    border-radius: 0;
    box-shadow: none;
    padding: 24px;
    margin-bottom: 20px;
    border: 1px solid #efefef;
    min-height: 300px;
    transition: none;
}
.card:hover { transform: none; }

/* ===== Footer ===== */
footer {
    background-color: #343a40;
}
.footer-nav {
    position: fixed;
    bottom: 0;
    width: 100%;
    background: white;
    display: flex;
    justify-content: space-around;
    padding: 5px 0;
    box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
.footer-nav a {
    text-decoration: none;
    color: #000;
    font-size: 14px;
    text-align: center;
    flex: 1;
    padding: 8px 0;
}
.footer-nav a.active { color: #007bff; }
.footer-nav a img {
    width: 20px;
    margin-right: 10px;
    vertical-align: sub;
}

/* ===== Responsive ===== */
@media (max-width: 991px) {
    .navbar-nav.ms-auto li.m-non { display: none; }
    .navbar-nav.ms-auto li { display: block; width: 100%; }
    .navbar-nav.ms-auto { border-top: 1px solid #f3f3f3; margin-top: 15px; }
    .navbar-nav.ms-auto li a { padding: 10px 15px !important; border-bottom: 1px solid #f3f3f3; border-radius: 0; }
    .navbar-brand { margin: auto; position: absolute; top: 0; left: 50%; transform: translateX(-50%); padding: 12px 0; }
    .navbar-brand img { width: 120px; margin: 0; }
    .navbar-expand-lg { padding: 15px 0; position: relative; }
    .hero-section { padding: 50px 0; }
    .headig-main h1, .headig-main p { display: none !important; }
    .headig-main .form-control { padding: 6px 10px; font-size: 14px; margin-bottom: 10px; }
    .howitwo, .rating-card { margin-bottom: 20px; }
    .footer-nav a { font-size: 14px; }
}
