@charset "UTF-8";
/* Hasan */
html {
  scroll-behavior: smooth;
}
.blog-item.home .blog-content {
    padding: 10px;
    display: block;
}
.blog-item.home {
    display: block;
}
.border-R{
    border: 1px solid;
    border-radius: 10px;
}
.blog-meta.bg-light.d-flex.align-items-center {
    border-radius: 10px 10px 0 0;
}
 .category-filter-area {
        padding: 20px 0;
        background-color: #ffffff;
    }

    .category-filter {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
        margin-bottom: 15px;
    }

    .category-filter .category-btn {
        padding: 6px 16px;
        border-radius: 16px;
        background-color: #ffffff;
        color: #000000;
        font-size: 13px;
        font-weight: 600;
        font-family: sans-serif;
        text-transform: uppercase;
        border: 1px solid #000000;
        transition: all 0.2s ease;
        cursor: pointer;
    }

    .category-filter .category-btn:hover {
        background-color: #e0e0e0;
        color: #000000;
    }

    .category-filter .category-btn.active {
        background-color: #000000;
        color: #ffffff;
        border-color: #000000;
    }

   
    .blog-item {
        display: none;
    }

    .blog-item.active {
        display: block;
    }

    @media (max-width: 576px) {
        .category-filter .category-btn {
            padding: 5px 12px;
            font-size: 12px;
        }
    }

    .pagination-wrap {
        margin-top: 30px;
        text-align: center;
    }

    .pagination-wrap .pagination {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 0;
        margin: 0;
        list-style: none;
    }

    .pagination-wrap .pagination li a {
        display: inline-block;
        padding: 6px 12px;
        color: #000000;
        border: 1px solid #000000;
        background-color: #ffffff;
        font-size: 14px;
        font-family: sans-serif;
        text-decoration: none;
        transition: all 0.2s ease;
    }

    .pagination-wrap .pagination li a:hover,
    .pagination-wrap .pagination li a.active {
        background-color: #000000;
        color: #ffffff;
        border-color: #000000;
    }

    .pagination-wrap .pagination li a.disabled {
        color: #666666;
        border-color: #666666;
        background-color: #ffffff;
        cursor: not-allowed;
    }

    /* Style for Previous/Next arrows */
    .pagination-wrap .pagination li.prev a,
    .pagination-wrap .pagination li.next a {
        padding: 6px 16px;
    }

    /* Responsive adjustments for pagination */
    @media (max-width: 576px) {
        .pagination-wrap .pagination li a {
            padding: 5px 10px;
            font-size: 12px;
        }
    }

    .author-info {
        display: flex;
        align-items: center;
    }

    .author-photo {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        margin-right: 10px;
    }

.sidebar ul li::before {
    color: #2c5282;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
    font-weight: bold;
}

.sidebar ul li.has-subheadings > ul {
    display: none;
    padding-left: 20px;
}

.sidebar ul li.has-subheadings > ul > li::before {
    color: #718096;
}


    .sidebar ul li a {
        color: #2c5282;
        text-decoration: none;
        font-size: 16px;
    }

    
.sidebar ul li.has-subheadings > a {
    cursor: pointer;
}

.sidebar ul li.has-subheadings > a::after {
    font-size: 10px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}


    .newsletter {
        margin-top: 20px;
    }

    .newsletter h4 {
        color: #1a3c5e;
        font-size: 18px;
        margin-bottom: 10px;
        font-weight: bold;
    }

    .newsletter p {
        color: #4a5568;
        font-size: 14px;
        margin-bottom: 15px;
        line-height: 1.5;
    }

    .newsletter button {
        background-color: #2b6cb0;
        color: white;
        padding: 10px 20px;
        border: none;
        border-radius: 5px;
        font-size: 16px;
        cursor: pointer;
        width: 100%;
    }

    .newsletter button:hover {
        background-color: #2c5282;
    }

    /* New Blog Content Styles */
    .blog-post-txt {
        font-family: 'Montserrat', sans-serif;
        max-width: 800px;
        margin: 0 auto;
        color: #2d3748;
        line-height: 1.8;
    }

    .blog-post-txt h1,
    .blog-post-txt h2,
    .blog-post-txt h3,
    .blog-post-txt h4 {
        color: #1a3c5e;
        font-weight: 700;
        margin-top: 2rem;
        margin-bottom: 1rem;
    }

    .blog-post-txt h1 {
        font-size: 2.5rem;
    }

    .blog-post-txt h2 {
        font-size: 2rem;
        border-bottom: 2px solid #e2e8f0;
        padding-bottom: 0.5rem;
    }

    .blog-post-txt h3 {
        font-size: 1.5rem;
    }

    .blog-post-txt p {
        font-size: 1.125rem;
        margin-bottom: 1.5rem;
    }

    .blog-post-txt ul,
    .blog-post-txt ol {
        margin-bottom: 1.5rem;
        padding-left: 1.5rem;
    }

    .blog-post-txt ul li,
    .blog-post-txt ol li {
        margin-bottom: 0.75rem;
        position: relative;
    }

    .blog-post-txt ul li::before {
        content: '\f058';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        color: #2b6cb0;
        position: absolute;
        left: -1.5rem;
    }

    .blog-post-txt a {
        color: #007bff;
        text-decoration: none;
        transition: color 0.3s ease;
    }

    .blog-post-txt a:hover {
        color: #0056b3;
        text-decoration: underline;
    }

    .blog-post-txt blockquote {
        border-left: 4px solid #2b6cb0;
        background: #f8f9fa;
        padding: 1.5rem;
        margin: 1.5rem 0;
        font-style: italic;
        color: #4a5568;
        border-radius: 5px;
    }

    .blog-post-txt img {
        max-width: 100%;
        height: auto;
        border-radius: 8px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        margin: 1.5rem 0;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .blog-post-txt pre {
        background: #1a202c;
        color: #e2e8f0;
        padding: 1.5rem;
        border-radius: 8px;
        overflow-x: auto;
        margin: 1.5rem 0;
        font-size: 0.875rem;
    }

    .blog-post-txt code {
        background: #f1f5f9;
        color: #d53f8c;
        padding: 0.2rem 0.4rem;
        border-radius: 4px;
        font-size: 0.875rem;
    }

    .blog-post-txt pre code {
        background: none;
        padding: 0;
    }

    .blog-post-txt table {
        width: 100%;
        border-collapse: collapse;
        margin: 1.5rem 0;
    }

    .blog-post-txt table th,
    .blog-post-txt table td {
        border: 1px solid #e2e8f0;
        padding: 0.75rem;
        text-align: left;
    }

    .blog-post-txt table th {
        background: #2b6cb0;
        color: white;
        font-weight: 600;
    }

    .blog-post-txt table tr:nth-child(even) {
        background: #f8f9fa;
    }

    @media (max-width: 767px) {
        .blog-post-txt h1 {
            font-size: 2rem;
        }

        .blog-post-txt h2 {
            font-size: 1.75rem;
        }

        .blog-post-txt h3 {
            font-size: 1.25rem;
        }

        .blog-post-txt p {
            font-size: 1rem;
        }

        .blog-post-txt img {
            margin: 1rem 0;
        }
    }

    .blog-post-txt h2,
    .blog-post-txt img {
        transition: opacity 0.5s ease;
    }

    .blog-post-txt h2.aos-animate,
    .blog-post-txt img.aos-animate {
        opacity: 1;
    }

.blog-banner-image {
    background-size: contain;
    background-position: center right;
    background-repeat: no-repeat;
    height: 280px;
    width: 100%;
}

.blog-meta {
    font-size: 16px;
}

.blog-title {
    font-size: 30px;
    font-weight: 700;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .page-header-area .row {
        flex-direction: column;
        text-align: center;
    }

    .blog-banner-image {
        height: 200px;
        background-position: center;
        margin-top: 20px;
    }

    .text-start {
        text-align: center !important;
    }
}

.cta-container {
            display: flex;
            align-items: center;
            justify-content: space-between;
            background-color:#f8f9fa ;
            color: #2c5282;
            padding: 10px 20px;
            border-radius: 10px;
            width: 100%;
            max-width: 650px;
            margin: 20px auto;
            font-family: Arial, sans-serif;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }
        .cta-text {
            font-size: 20px;
        }
        .cta-text span {
            color: #2c5282;
        }
        .cta-button {
            background-color: #2c5282;
            color: #ffffff;
            border: none;
            padding: 8px 15px;
            border-radius: 20px;
            font-size: 14px;
            cursor: pointer;
            transition: background-color 0.3s;
            white-space: nowrap;
        }
        .cta-button:hover {
            background-color: #e0e0e0;
        }
        @media (max-width: 480px) {
            .cta-container {
                flex-direction: column;
                text-align: center;
                max-width: 300px;
            }
            .cta-button {
                margin-top: 10px;
                width: 100%;
            }
        }


    @media (max-width: 767.98px) {
  .breadcrumb-nav {
    display: none !important;
  }
}
/* Hasan CSS End */
body {
    color      : #151515;
    font-size  : 0.9375rem;
    font-family: "Montserrat", sans-serif;
    font-weight: 400;
    line-height: 1.6;
    margin     : 0
}

@media only screen and (max-width:575.98px) {
    body {
        font-size: 1rem
    }
}

::-moz-selection {
    background : #080b1a;
    color      : #FFFFFF;
    text-shadow: none
}

::selection {
    background : #080b1a;
    color      : #FFFFFF;
    text-shadow: none
}

hr {
    border            : 0;
    border-top        : 1px solid #eee;
    -webkit-box-sizing: content-box;
    box-sizing        : content-box;
    display           : block;
    height            : 1px;
    margin            : 1em 0;
    padding           : 0;
    overflow          : visible
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle
}

fieldset {
    border : 0;
    margin : 0;
    padding: 0
}

legend {
    -webkit-box-sizing: border-box;
    box-sizing        : border-box;
    color             : inherit;
    display           : table;
    max-width         : 100%;
    padding           : 0;
    white-space       : normal
}

textarea {
    resize: vertical
}

a {
    -webkit-transition: 0.4s;
    transition        : 0.4s;
    outline           : none;
    text-decoration   : none
}

a:active,
a:focus,
a:hover {
    color          : inherit;
    outline        : none;
    text-decoration: none
}

input:active,
input:focus,
textarea:active,
textarea:focus {
    outline: none
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 400;
    color      : #151515;
    line-height: 1.2
}

.h1,
h1 {
    font-size    : 40px;
    font-weight  : 700;
    margin-bottom: 25px
}

@media (max-width:1200px) {

    .h1,
    h1 {
        font-size: calc(30px)
    }
}

.h2,
h2 {
    font-size    : 34px;
    font-weight  : 600;
    margin-top   : -5px;
    margin-bottom: 18px
}

@media (max-width:1200px) {

    .h2,
    h2 {
        font-size: calc(1.35rem + 1.2vw)
    }
}

.h3,
h3 {
    font-size    : 30px;
    margin-bottom: 10px
}

@media (max-width:1200px) {

    .h3,
    h3 {
        /* font-size: calc(1.3125rem + 0.75vw) */
        font-size: 20px;
    }
}

.h4,
h4 {
    font-size: 1.5rem
}

@media (max-width:1200px) {

    .h4,
    h4 {
        /* font-size: calc(1.275rem + 0.3vw) */
        font-size: 18px;
    }
}

.h5,
h5 {
    font-size: 1.25rem
}

.h6,
h6 {
    font-size: 1rem
}

p {
    margin-bottom: 16px
}

p:last-child {
    margin-bottom: 0
}

ul {
    margin : 0;
    padding: 0
}

ul li {
    list-style: none
}

b,
strong {
    font-weight: 700
}

figure {
    margin: 0
}

img {
    max-width: 100%
}

button {
    background-color  : transparent;
    border            : none;
    cursor            : pointer;
    outline           : none;
    padding           : 0;
    -webkit-box-shadow: none;
    box-shadow        : none;
    -webkit-transition: 0.4s;
    transition        : 0.4s
}

button:active,
button:focus {
    outline           : none;
    -webkit-box-shadow: none;
    box-shadow        : none
}

.btn-img-popup,
[data-mfp-src] {
    cursor: -webkit-zoom-in;
    cursor: zoom-in
}

.parallax {
    background-repeat: no-repeat;
    background-size  : cover
}

.form-message.alert {
    margin-bottom: 0;
    margin-top   : 10px;
    position     : absolute;
    width        : 100%
}

.row:not(.g-0) {
    margin-left : -15px;
    margin-right: -15px
}

.row:not(.g-0)>* {
    position     : relative;
    padding-left : 15px;
    padding-right: 15px
}

.bg-white {
    background-color: #FFFFFF
}

.bg-offwhite {
    background-color: #f8f9fc
}

.bg-brand {
    background-color: #080b1a
}

.bg-blackSoft {
    background-color: #222222
}

.text-brand {
    color: #080b1a
}

.fix {
    overflow: hidden
}

.fix-x {
    overflow-x: hidden
}

.fix-y {
    overflow-y: hidden
}

.section-title {
    margin-bottom: 50px
}

@media only screen and (max-width:767.98px) {
    .section-title {
        margin-bottom: 40px
    }
}

.section-title h6 {
    margin-bottom : 13px;
    font-weight   : 400;
    text-transform: uppercase
}

@media only screen and (max-width:767.98px) {
    .section-title h2 {
        font-size: 24px
    }
}

.section-title--light {
    color: #bbbbbb
}

.section-title--light h2,
.section-title--light h6 {
    color: #FFFFFF
}

.bg-img {
    background     : no-repeat center center;
    background-size: cover
}

@media screen and (min-width:1200px) {
    .container {
        max-width: 1200px
    }
}

.container-fluid {
    padding: 0 100px
}

@media only screen and (min-width:992px) and (max-width:1199.98px) {
    .container-fluid {
        padding: 0 15px
    }
}

@media only screen and (max-width:767.98px),
only screen and (min-width:768px) and (max-width:991.98px) {
    .container-fluid {
        padding: 0 30px
    }
}

@media only screen and (max-width:479.98px) {
    .container-fluid {
        padding: 0 15px
    }
}

.btn-outline {
    border       : 2px solid #080b1a;
    border-radius: 100px;
    color        : #151515;
    display      : inline-block;
    font-size    : 18px;
    font-weight  : 600;
    line-height  : 1;
    padding      : 18px 55px
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .btn-outline {
        padding  : 18px 50px;
        font-size: 16px
    }
}

@media only screen and (max-width:767.98px) {
    .btn-outline {
        padding  : 15px 40px;
        font-size: 15px
    }
}

.btn-outline:hover {
    background-color: #080b1a;
    color           : #FFFFFF
}

.slick-list .slick-slide {
    border: 0 solid transparent !important
}

.slick-list .slick-slide>div>div {
    vertical-align: middle;
}

.slick-dots {
    display         : -webkit-box;
    display         : -ms-flexbox;
    display         : flex;
    margin-top      : 35px;
    -webkit-box-pack: center;
    -ms-flex-pack   : center;
    justify-content : center;
    height          : 12px
}

@media only screen and (min-width:1200px),
only screen and (min-width:992px) and (max-width:1199.98px) {
    .slick-dots {
        -webkit-box-pack: start;
        -ms-flex-pack   : start;
        justify-content : flex-start
    }
}

.slick-dots li {
    margin-right: 10px
}

.slick-dots li button {
    border       : 2px solid #080b1a;
    border-radius: 50%;
    text-indent  : -100000px;
    height       : 12px;
    width        : 12px
}

.slick-dots li.slick-active button {
    background-color: #080b1a
}

.slick-dots--light li button {
    border-color: #FFFFFF
}

.slick-dots--light li.slick-active button {
    background-color: #FFFFFF
}

.slick-row-5 .slick-list {
    margin: 0 -2.5px
}

.slick-row-5 .slick-list .slick-slide {
    margin: 0 2.5px
}

.slick-row-10 .slick-list {
    margin: 0 -5px
}

.slick-row-10 .slick-list .slick-slide {
    margin: 0 5px
}

.slick-row-15 .slick-list {
    margin: 0 -7.5px
}

.slick-row-15 .slick-list .slick-slide {
    margin: 0 7.5px
}

.slick-row-20 .slick-list {
    margin: 0 -10px
}

.slick-row-20 .slick-list .slick-slide {
    margin: 0 10px
}

.slick-row-25 .slick-list {
    margin: 0 -12.5px
}

.slick-row-25 .slick-list .slick-slide {
    margin: 0 12.5px
}

.slick-row-30 .slick-list {
    margin: 0 -15px
}

.slick-row-30 .slick-list .slick-slide {
    margin: 0 15px
}

.btn-scroll-top {
    background-color  : #080b1a;
    border-radius     : 50%;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
    box-shadow        : 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
    color             : #FFFFFF;
    cursor            : pointer;
    font-size         : 1.5625rem;
    display           : block;
    text-align        : center;
    line-height       : 60px;
    position          : fixed;
    bottom            : -60px;
    right             : 30px;
    height            : 60px;
    width             : 60px;
    z-index           : 999;
    opacity           : 0;
    visibility        : hidden;
    -webkit-transition: 0.4s;
    transition        : 0.4s
}

@media (max-width:1200px) {
    .btn-scroll-top {
        font-size: calc(1.28125rem + 0.375vw)
    }
}

@media only screen and (max-width:767.98px) {
    .btn-scroll-top {
        line-height: 50px;
        height     : 50px;
        width      : 50px
    }
}

.btn-scroll-top:hover {
    background-color: #182141
}

.btn-scroll-top.show {
    bottom    : 30px;
    opacity   : 1;
    visibility: visible
}

.blockquote,
blockquote {
    background-color: #f8f9fc;
    color           : #151515;
    font-size       : 1.25rem;
    line-height     : 1.4;
    padding         : 42px 44px 80px;
    position        : relative;
    margin-bottom   : 20px
}

@media only screen and (max-width:767.98px) {

    .blockquote,
    blockquote {
        padding: 20px 22px 60px
    }
}

.blockquote:before,
blockquote:before {
    content    : "\f10e";
    font-family: "FontAwesome";
    position   : absolute;
    right      : 40px;
    bottom     : 40px
}

@media only screen and (max-width:767.98px) {

    .blockquote:before,
    blockquote:before {
        right : 30px;
        bottom: 20px
    }
}

.blockquote-title,
blockquote-title {
    color         : #080b1a;
    text-transform: uppercase;
    font-size     : 0.875rem;
    font-weight   : 700;
    letter-spacing: 1.5px;
    line-height   : 1
}

.main-menu {
    -ms-flex-line-pack: center;
    align-content     : center;
    -webkit-box-pack  : end;
    -ms-flex-pack     : end;
    justify-content   : flex-end
}

.main-menu>li {
    margin-right: 15px;
    position    : relative
}

.main-menu>li:last-child {
    margin-right: 0
}

.main-menu>li>a {
    color         : #FFFFFF;
    display       : block;
    line-height   : 1;
    letter-spacing: 1.62px;
    text-transform: uppercase;
    position      : relative
}

@media only screen and (min-width:992px) and (max-width:1199.98px) {
    .main-menu>li>a {
        font-size: 14px
    }
}

.main-menu>li.has-submenu {
    margin-right : 15px;
    padding-right: 10px;
    position     : relative
}

.main-menu.nav li a {
    padding: 10px 1px;
    text-decoration: none;
}

.main-menu.nav li a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 4px;
    width: 100%;
    height: 2px;
    background: linear-gradient(to right, #355ee1, #27d1e0); 
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.main-menu.nav li a:hover::after {
    transform: scaleX(1);
}

.main-menu>li.has-submenu:after {
    color      : #FFFFFF;
    content    : "\f107";
    font-size  : 14px;
    line-height: 2.2;
    font-family: "FontAwesome";
    position   : absolute;
    right      : -5px;
    top        : 0
}

.main-menu>li.has-submenu .submenu-nav {
    background-color  : #FFFFFF;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    box-shadow        : 0 1px 3px rgba(0, 0, 0, 0.1);
    border-bottom     : 2px solid #080b1a;
    position          : absolute;
    left              : -25px;
    top               : 100%;
    -webkit-transform : translateY(50px);
    transform         : translateY(50px);
    -webkit-transition: 0.4s;
    transition        : 0.4s;
    opacity           : 0;
    visibility        : hidden;
    pointer-events    : none;
    min-width         : 250px;
    margin-top        : 40px;
    z-index           : 99
}

@media only screen and (min-width:992px) and (max-width:1199.98px) {
    .main-menu>li.has-submenu .submenu-nav {
        min-width : 220px;
        margin-top: 38px
    }
}

.main-menu>li.has-submenu .submenu-nav:before {
    content : "";
    position: absolute;
    height  : 40px;
    width   : 100%;
    left    : 0;
    bottom  : 100%
}

.main-menu>li.has-submenu .submenu-nav>li>a {
    color         : #151515;
    display       : block;
    font-size     : 15px;
    letter-spacing: inherit;
    text-transform: capitalize;
    padding       : 10px 20px
}

.main-menu>li.has-submenu .submenu-nav>li:hover>a {
    background-color: #080b1a;
    color           : #FFFFFF
}

.main-menu>li.has-submenu .submenu-nav-mega {
    display    : -webkit-box;
    display    : -ms-flexbox;
    display    : flex;
    margin-left: -300px;
    padding    : 0;
    width      : 1080px
}

@media only screen and (min-width:992px) and (max-width:1199.98px) {
    .main-menu>li.has-submenu .submenu-nav-mega {
        width      : 960px;
        margin-left: -245px
    }
}

.main-menu>li.has-submenu .submenu-nav-mega .mega-menu-item {
    border-right           : 1px solid #eee;
    padding                : 30px;
    -ms-flex-preferred-size: 25%;
    flex-basis             : 25%
}

.main-menu>li.has-submenu .submenu-nav-mega .mega-menu-item:last-child {
    border-right: 0
}

.main-menu>li.has-submenu .submenu-nav-mega .mega-menu-item>a {
    display: none
}

.main-menu>li.has-submenu .submenu-nav-mega .mega-menu-item ul li {
    margin-bottom: 10px
}

.main-menu>li.has-submenu .submenu-nav-mega .mega-menu-item ul li:last-child {
    margin-bottom: 0
}

.main-menu>li.has-submenu .submenu-nav-mega .mega-menu-item ul li a {
    color      : #151515;
    font-size  : 14px !important;
    font-weight: 500;
    line-height: 1
}

.main-menu>li.has-submenu .submenu-nav-mega .mega-menu-item ul li a:hover {
    color: #080b1a
}

.main-menu>li.has-submenu:hover>.submenu-nav {
    -webkit-transform: none;
    transform        : none;
    opacity          : 1;
    visibility       : visible;
    pointer-events   : visible
}

.res-mobile-menu {
    margin: 0 -10px
}

.res-mobile-menu .slicknav_btn {
    display: none
}

.res-mobile-menu .slicknav_menu {
    padding: 0
}

.res-mobile-menu .slicknav_nav {
    background-color: #080b1a;
    display         : block !important;
    padding         : 20px 30px
}

.res-mobile-menu .slicknav_nav li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    position     : relative
}

.res-mobile-menu .slicknav_nav li:last-child {
    border-bottom: 0
}

.res-mobile-menu .slicknav_nav li a {
    color         : #FFFFFF;
    font-size     : 16px;
    padding       : 12px 0;
    margin        : 0;
    text-transform: capitalize;
    position      : relative
}

.res-mobile-menu .slicknav_nav li a .slicknav_arrow {
    background-color : hsla(0deg, 0%, 100%, 0.1);
    color            : #FFFFFF;
    font-size        : 14px;
    display          : block;
    text-align       : center;
    margin           : 0;
    position         : absolute;
    right            : 0;
    top              : 50%;
    -webkit-transform: translateY(-50%);
    transform        : translateY(-50%);
    height           : 35px;
    line-height      : 35px;
    width            : 35px
}

.res-mobile-menu .slicknav_nav li a a {
    padding: 0
}

.res-mobile-menu .slicknav_nav li a:hover {
    color           : #FFFFFF;
    background-color: transparent
}

.res-mobile-menu .slicknav_nav li img {
    display: none
}

.res-mobile-menu .slicknav_nav li ul {
    border-top  : 1px solid rgba(255, 255, 255, 0.2);
    margin      : 0;
    padding-left: 10px
}

.res-mobile-menu .slicknav_nav li ul li a {
    font-size: 13px;
    color    : rgba(255, 255, 255, 0.7)
}

.res-mobile-menu .slicknav_nav .slicknav_open>.slicknav_item {
    position: relative
}

.res-mobile-menu .slicknav_nav .slicknav_open>.slicknav_item .slicknav_arrow {
    background-color: black
}

.sp-top {
    padding-top: 110px
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .sp-top {
        padding-top: 90px
    }
}

@media only screen and (max-width:767.98px) {
    .sp-top {
        padding-top: 60px
    }
}

.sp-top-wt {
    padding-top: 105px
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .sp-top-wt {
        padding-top: 85px
    }
}

@media only screen and (max-width:767.98px) {
    .sp-top-wt {
        padding-top: 57px
    }
}

.sp-y {
    padding: 100px 0
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .sp-y {
        padding: 90px 0
    }
}

@media only screen and (max-width:767.98px) {
    .sp-y {
        padding: 60px 0
    }
}

.sm-top {
    margin-top: 110px
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .sm-top {
        margin-top: 90px
    }
}

@media only screen and (max-width:767.98px) {
    .sm-top {
        margin-top: 60px
    }
}

.sm-top-wt {
    margin-top: 105px
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .sm-top-wt {
        margin-top: 85px
    }
}

@media only screen and (max-width:767.98px) {
    .sm-top-wt {
        margin-top: 57px
    }
}

.sm-y {
    margin: 110px 0
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .sm-y {
        margin: 90px 0
    }
}

@media only screen and (max-width:767.98px) {
    .sm-y {
        margin: 60px 0
    }
}

.header-area {
    background-color  : #080b1a;
    padding           : 30px 0;
    -webkit-transition: 0.4s;
    transition        : 0.4s
}

.header-area.sticky {
    -webkit-animation: slideInDown 0.6s forwards;
    animation        : slideInDown 0.6s forwards;
    padding          : 15px 0 15px;
    position         : fixed;
    left             : 0;
    top              : 0;
    width            : 100%;
    z-index          : 99
}

@media only screen and (max-width:767.98px),
only screen and (min-width:768px) and (max-width:991.98px) {
    .header-area.sticky {
        padding: 20px 0
    }
}

.header-area.sticky .logo-dark {
    display: none
}

.header-area.sticky .main-menu .submenu-nav {
    margin-top: 25px
}

.header-area.sticky .main-menu .submenu-nav:before {
    height: 25px
}

.header-area.transparent:not(.sticky) {
    background-color: transparent;
    position        : fixed;
    left            : 0;
    top             : 0;
    width           : 100%;
    z-index         : 99
}

.header-area.transparent:not(.sticky) .logo-light {
    display: none
}

.header-area.transparent:not(.sticky) .main-menu>li.has-submenu:after {
    color      : #080b1a;
    font-weight: 600
}

.header-area.transparent:not(.sticky) .main-menu>li>a {
    color      : #080b1a;
    font-weight: 600
}

.header-area.transparent:not(.sticky) .header-action a,
.header-area.transparent:not(.sticky) .header-action button {
    color      : #080b1a;
    font-weight: 600
}

.header-action {
    color    : #FFFFFF;
    font-size: 16px
}

@media only screen and (max-width:767.98px),
only screen and (min-width:992px) and (max-width:1199.98px) {
    .header-action {
        font-size: 20px
    }
}

.header-action a {
    color: #FFFFFF; 
    font-size: 18px;
    font-weight: 500;
}

@media only screen and (max-width:575.98px) {
    .header-action a.tel-no {
        display: none
    }
}

.header-action [class*=btn-] {
    color      : #FFFFFF;
    margin-left: 20px
}

.footer-area {
    background-color: #f8f9fc
}

.widget-item {
    margin-top: 38px
}

.widget-item .widget-title {
    color        : #080b1a;
    font-size    : 22px;
    font-weight  : 600;
    line-height  : 1;
    margin-top   : -1px;
    margin-bottom: 22px
}

@media only screen and (max-width:767.98px) {
    .widget-item .widget-title {
        margin-bottom: 15px
    }
}

.widget-item address {
    line-height  : 2;
    margin-bottom: 0;
    font-weight  : 500
}

.widget-list li {
    line-height: 2
}

.widget-list li a {
    color             : #151515;
    font-weight       : 500;
    -webkit-transition: 0.2s;
    transition        : 0.2s
}

.widget-list li a:hover {
    color       : #080b1a;
    padding-left: 5px
}

.about-widget img {
    max-width    : 200px;
    margin-bottom: 20px
}

.copyright-txt {
    margin-top : 25px;
    font-weight: 500
}

@media only screen and (max-width:767.98px) {
    .copyright-txt {
        margin-top: 15px
    }
}

.off-canvas-wrapper {
    position          : fixed;
    left              : 0;
    top               : 0;
    -webkit-transition: 0.3s;
    transition        : 0.3s;
    opacity           : 0;
    visibility        : hidden;
    pointer-events    : none;
    height            : 100vh;
    width             : 100vw;
    z-index           : 9999
}

.off-canvas-wrapper.active {
    opacity       : 1;
    visibility    : visible;
    pointer-events: visible
}

.off-canvas-wrapper.active .off-canvas-inner {
    -webkit-transform: none;
    transform        : none
}

.off-canvas-wrapper.active .btn-close {
    display: block
}

.off-canvas-wrapper.active .off-canvas-overlay {
    opacity   : 1;
    visibility: visible
}

.off-canvas-wrapper .close-btn {
    color        : #080b1a;
    font-size    : 50px;
    line-height  : 1;
    position     : absolute;
    right        : 0;
    top          : 0;
    z-index      : 9;
    background   : #FFFFFF;
    width        : 100%;
    text-align   : right;
    padding-right: 15px;
    padding-top  : 10px
}

.off-canvas-wrapper .close-btn .btn-close {
    margin-left: auto
}

.off-canvas-wrapper .close-btn i {
    line-height: 1
}

.off-canvas-wrapper .close-btn:hover {
    color: #080b1a
}

.off-canvas-cog .off-canvas-content {
    padding-right: 30px;
    padding-left : 30px
}

@media only screen and (max-width:767.98px) {
    .off-canvas-cog .off-canvas-content {
        padding-right: 15px;
        padding-left : 15px
    }
}

.off-canvas-overlay {
    background-color  : rgba(0, 0, 0, 0.8);
    cursor            : url("../img/icons/cancel-white.png"), auto;
    position          : absolute;
    left              : 0;
    top               : 0;
    opacity           : 0;
    visibility        : hidden;
    -webkit-transition: 0.4s;
    transition        : 0.4s;
    height            : 100%;
    width             : 100%;
    z-index           : 2
}

.off-canvas-inner {
    background-color  : #FFFFFF;
    position          : absolute;
    right             : 0;
    top               : 0;
    -webkit-transform : translateX(100%);
    transform         : translateX(100%);
    -webkit-transition: 0.45s;
    transition        : 0.45s;
    height            : 100%;
    z-index           : 3;
    overflow-y        : auto
}

.off-canvas-content {
    width                : 380px;
    height               : 100%;
    display              : -webkit-box;
    display              : -ms-flexbox;
    display              : flex;
    -webkit-box-orient   : vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction   : column;
    flex-direction       : column;
    -webkit-box-pack     : justify;
    -ms-flex-pack        : justify;
    justify-content      : space-between;
    padding              : 100px 0 80px;
    overflow-y           : auto;
    overflow-x           : hidden
}

@media only screen and (max-width:767.98px) {
    .off-canvas-content {
        padding: 65px 0 30px
    }
}

@media only screen and (max-width:575.98px) {
    .off-canvas-content {
        width: 280px
    }
}

.log-in-content-wrap h2 {
    font-size    : 30px;
    font-weight  : 500;
    margin-bottom: 46px;
    margin-top   : -7px
}

.log-in-content-wrap .sign-up-notification {
    text-align: center;
    margin-top: 15px;
    font-size : 15px
}

.log-in-content-wrap .sign-up-notification a {
    color      : #080b1a;
    font-weight: 500
}

.social-icons a {
    font-size   : 14px;
    color       : #151515;
    margin-right: 10px
}

.social-icons a:last-child {
    margin-right: 0
}

.social-icons a:hover {
    color: #080b1a
}

.copyright-content {
    margin-top: 5px;
    font-size : 14px
}

.form-input-item {
    margin-top: 20px
}

.form-input-item input {
    background-color: #f8f9fc;
    border          : none;
    display         : block;
    font-size       : 16px;
    padding         : 15px 20px;
    width           : 100%
}

.form-input-item .btn-submit {
    background-color: #080b1a;
    border          : 2px solid #080b1a;
    color           : #FFFFFF;
    display         : block;
    font-size       : 15px;
    font-weight     : 500;
    padding         : 12px 20px;
    width           : 100%
}

.form-input-item .btn-submit:hover {
    color           : #080b1a;
    background-color: transparent
}

.form-input-item--outline input {
    background-color: transparent;
    border          : 2px solid #080b1a
}

.form-input-item--outline .btn-submit {
    background-color: transparent
}

.icon-box-item {
    display          : -webkit-box;
    display          : -ms-flexbox;
    display          : flex;
    -webkit-box-align: center;
    -ms-flex-align   : center;
    align-items      : center
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .icon-box-item {
        display: block
    }
}

@media only screen and (max-width:767.98px) {
    .icon-box-item {
        margin-top: 40px
    }
}

.icon-box-item .icon-box__icon {
    text-align             : center;
    margin-right           : 20px;
    -ms-flex-preferred-size: 50px;
    flex-basis             : 50px;
    width                  : 50px
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .icon-box-item .icon-box__icon {
        margin-right : 0;
        margin-bottom: 20px
    }
}

.icon-box-item .icon-box__info {
    -ms-flex-preferred-size: calc(100% - 50px);
    flex-basis             : calc(100% - 50px);
    width                  : calc(100% - 50px)
}

@media only screen and (min-width:1200px) {
    .icon-box-item .icon-box__info {
        -ms-flex-preferred-size: 215px;
        flex-basis             : 215px;
        width                  : 215px
    }
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .icon-box-item .icon-box__info {
        -ms-flex-preferred-size: 100%;
        flex-basis             : 100%;
        width                  : 100%
    }
}

.icon-box-item .icon-box__info h5 {
    font-weight  : 500;
    line-height  : 1;
    margin-bottom: 10px
}

.brand-accordion .card {
    border       : 1px solid #eee !important;
    border-radius: 0;
    margin-bottom: 15px;
    padding      : 20px
}

.brand-accordion .card:last-child {
    margin-bottom: 0
}

.brand-accordion .card .card-header {
    background-color: transparent;
    padding         : 0;
    border          : none
}

.brand-accordion .card .card-header button {
    font-weight       : 600;
    padding           : 0;
    -webkit-transition: none;
    transition        : none;
    -webkit-box-shadow: none;
    box-shadow        : none;
    position          : relative;
    width             : 100%;
    text-align        : left
}

.brand-accordion .card .card-header button:after {
    content          : "+";
    position         : absolute;
    right            : 0;
    font-size        : 20px;
    color            : #080b1a;
    line-height      : 1;
    top              : 50%;
    -webkit-transform: translateY(-50%);
    transform        : translateY(-50%)
}

.brand-accordion .card .card-header button[aria-expanded=true] {
    color        : #080b1a;
    margin-bottom: 10px
}

.brand-accordion .card .card-header button[aria-expanded=true]:after {
    content: "-"
}

.brand-accordion .card .card-body {
    padding    : 0;
    font-size  : 13px;
    line-height: 2
}

.brand-accordion .card .card-body p {
    margin-bottom: 0
}

.single-skill-bar {
    margin-top: 30px
}

.single-skill-bar .skills-info {
    margin-bottom: 20px
}

.single-skill-bar .skills-info .skill-percent,
.single-skill-bar .skills-info .skill-title {
    font-weight   : 600;
    line-height   : 1;
    text-transform: uppercase;
    margin        : 0
}

.single-skill-bar .skills-info .skill-percent {
    font-weight: 600
}

.single-skill-bar .progress {
    background-color: #f8f9fc;
    border-radius   : 0;
    height          : 10px
}

.single-skill-bar .progress .progress-bar {
    background-color: #080b1a
}

.cd-timeline-wrap {
    margin-top: 70px;
    position  : relative
}

.cd-timeline-wrap:before {
    border           : 2px solid #080b1a;
    border-radius    : 50%;
    color            : #080b1a;
    content          : "\f19d";
    font-family      : "FontAwesome";
    font-size        : 25px;
    height           : 70px;
    left             : 50%;
    line-height      : 65px;
    position         : absolute;
    text-align       : center;
    top              : -70px;
    -webkit-transform: translateX(-50%);
    transform        : translateX(-50%);
    width            : 70px
}

@media only screen and (max-width:767.98px),
only screen and (min-width:768px) and (max-width:991.98px) {
    .cd-timeline-wrap:before {
        top              : -50px;
        left             : -5px;
        -webkit-transform: none;
        transform        : none;
        line-height      : 45px;
        height           : 50px;
        width            : 50px
    }
}

.cd-timeline-wrap .cd-timeline {
    margin : 0;
    padding: 90px 0 100px
}

@media only screen and (max-width:767.98px) {
    .cd-timeline-wrap .cd-timeline {
        padding: 60px 0 70px
    }
}

.cd-timeline-wrap .cd-timeline:before {
    background-color: #080b1a
}

.cd-timeline-wrap .cd-timeline:after {
    background-color: #080b1a;
    border-radius   : 50%;
    bottom          : 0;
    content         : "";
    height          : 20px;
    left            : 50%;
    margin-left     : -10px;
    position        : absolute;
    width           : 20px
}

@media only screen and (max-width:767.98px),
only screen and (min-width:768px) and (max-width:991.98px) {
    .cd-timeline-wrap .cd-timeline:after {
        left       : 0;
        margin-left: 10px
    }
}

.cd-timeline-wrap .cd-timeline-block {
    margin: 0 0 100px
}

@media only screen and (max-width:767.98px) {
    .cd-timeline-wrap .cd-timeline-block {
        margin: 0 0 30px
    }
}

.cd-timeline-wrap .cd-timeline-block:last-child {
    margin: 0
}

.cd-timeline-wrap .cd-timeline-block:nth-child(2n) .cd-timeline-content {
    text-align: left
}

.cd-timeline-wrap .cd-timeline-img {
    background-color  : #f8f9fc;
    border            : 2px solid #080b1a;
    -webkit-box-shadow: none;
    box-shadow        : none;
    height            : 35px;
    margin-left       : -17.5px;
    top               : 25px;
    width             : 35px;
    z-index           : 1
}

@media only screen and (max-width:767.98px),
only screen and (min-width:768px) and (max-width:991.98px) {
    .cd-timeline-wrap .cd-timeline-img {
        margin-left: 3px
    }
}

.cd-timeline-wrap .cd-timeline-img .dot {
    background-color : #080b1a;
    border-radius    : 50%;
    display          : block;
    height           : 10px;
    left             : 50%;
    position         : absolute;
    top              : 50%;
    -webkit-transform: translate(-50%, -50%);
    transform        : translate(-50%, -50%);
    width            : 10px
}

.cd-timeline-wrap .cd-timeline-content {
    background-color  : transparent;
    -webkit-box-shadow: none;
    box-shadow        : none;
    padding           : 10px 0 0;
    text-align        : right
}

@media only screen and (max-width:767.98px),
only screen and (min-width:768px) and (max-width:991.98px) {
    .cd-timeline-wrap .cd-timeline-content {
        text-align: left
    }
}

.cd-timeline-wrap .cd-timeline-content:before {
    display: none
}

.cd-timeline-wrap .cd-timeline-content h5 {
    color         : #080b1a;
    font-weight   : 600;
    margin-bottom : 5px;
    text-transform: uppercase
}

@media only screen and (max-width:767.98px) {
    .cd-timeline-wrap .cd-timeline-content h5 {
        font-size: 16px
    }
}

.cd-timeline-wrap .cd-timeline-content p {
    margin: 0
}

.cd-timeline-wrap .cd-timeline-content p span {
    font-weight: 600
}

.cd-timeline-wrap .cd-timeline-content .cd-description {
    color     : #151515;
    font-size : 15px !important;
    opacity   : 1 !important;
    padding   : 0;
    text-align: left
}

@media only screen and (max-width:767.98px),
only screen and (min-width:768px) and (max-width:991.98px) {
    .cd-timeline-wrap .cd-heading {
        margin-bottom: 10px
    }
}

.single-subject-by-faq-wrap {
    margin-top: 50px
}

.single-subject-by-faq-wrap h2 {
    font-weight  : 600;
    font-size    : 2rem;
    margin-bottom: 38px
}

@media (max-width:1200px) {
    .single-subject-by-faq-wrap h2 {
        font-size: calc(1.325rem + 0.9vw)
    }
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .single-subject-by-faq-wrap h2 {
        margin-bottom: 30px
    }
}

@media only screen and (max-width:767.98px) {
    .single-subject-by-faq-wrap h2 {
        margin-bottom: 25px
    }
}

.service-details-thumb .slick-dots {
    position         : absolute;
    bottom           : 30px;
    left             : 50%;
    -webkit-transform: translateX(-50%);
    transform        : translateX(-50%)
}

.service-details-info {
    margin-top: 35px
}

@media only screen and (max-width:767.98px) {
    .service-details-info {
        margin-top: 30px
    }
}

.service-details-info h3 {
    font-weight  : 600;
    margin-bottom: 15px
}

.service-details-info h4 {
    font-weight  : 500;
    margin-bottom: 20px
}

.service-details-info .service-feature li {
    position     : relative;
    padding-left : 40px;
    margin-bottom: 15px
}

.service-details-info .service-feature li:last-child {
    margin-bottom: 0
}

.service-details-info .service-feature li:before {
    content    : "ﰮ";
    font-family: "Material Design Icons";
    font-size  : 30px;
    line-height: 1;
    position   : absolute;
    top        : 4px;
    left       : 0
}

.how-we-works-content {
    margin-top: -15px
}

.how-we-works-content .icon-box-item {
    -webkit-box-align: start;
    -ms-flex-align   : start;
    align-items      : flex-start;
    margin-top       : 40px
}

.how-we-works-content .icon-box-item .icon-box__info {
    width                  : 100%;
    -ms-flex-preferred-size: auto;
    flex-basis             : auto
}

.pagination-wrap {
    border-top : 1px solid #eee;
    padding-top: 10px;
    margin-top : 55px
}

@media only screen and (max-width:767.98px) {
    .pagination-wrap {
        margin-top: 40px
    }
}

.pagination-wrap .pagination li.prev {
    margin-right: auto
}

.pagination-wrap .pagination li.next {
    margin-left: auto
}

.pagination-wrap .pagination li a {
    color      : #080b1a;
    font-weight: 600;
    margin     : 0 10px
}

.sidebar-single {
    background-color: #f8f9fc;
    padding         : 30px;
    margin-top      : 40px
}

@media only screen and (max-width:767.98px),
only screen and (min-width:768px) and (max-width:991.98px) {
    .sidebar-single {
        margin-top: 30px
    }
}

.sidebar-heading {
    font-size    : 26px;
    margin-bottom: 23px;
    font-weight  : 500
}

@media only screen and (max-width:575.98px) {
    .sidebar-heading {
        font-size: 22px
    }
}

.service-list li {
    border-bottom: 1px solid #eee;
    padding      : 13px 0
}

.service-list li:first-child {
    padding-top: 0
}

.service-list li:last-child {
    padding-bottom: 0;
    border-bottom : 0
}

.service-list li a {
    color         : #151515;
    font-weight   : 600;
    vertical-align: middle
}

.service-list li a i,
.service-list li a img {
    margin-right  : 15px;
    vertical-align: middle;
    font-size     : 25px;
    height        : 25px;
    width         : 25px
}

.service-list li a:hover {
    color       : #151515;
    padding-left: 10px
}

@media only screen and (min-width:1200px) {
    .service-details-wrapper .service-details-content {
        padding-right: 70px
    }
}

@media only screen and (min-width:1200px) {
    .service-details-wrapper .sidebar-wrap {
        margin-left: -30px
    }
}

.member-desc h2 {
    font-size    : 2rem;
    margin-bottom: 8px
}

@media (max-width:1200px) {
    .member-desc h2 {
        font-size: calc(1.325rem + 0.9vw)
    }
}

.member-desc h5 {
    opacity      : 0.8;
    font-size    : 16px;
    line-height  : 1;
    font-weight  : 500;
    margin-bottom: 25px
}

.member-social-icons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.member-social-icons a {
    color      : #FFFFFF;
    display    : block;
    font-size  : 18px;
    text-align : center;
    line-height: 40px;
    height     : 40px;
    width      : 50px
}

.member-social-icons a.facebook {
    background-color: #3B5999
}

.member-social-icons a.twitter {
    background-color: #1DA1F2
}

.member-social-icons a.linkedin {
    background-color: #0077B5
}

.member-social-icons a.reddit {
    background-color: #FF4500
}

.member-social-icons a.pinterest {
    background-color: #CB2028
}

.contact-info p {
    position    : relative;
    padding-left: 85px
}

.contact-info p strong {
    position: absolute;
    width   : 75px;
    left    : 0;
    top     : 0
}

.contact-info p strong:after {
    content : ":";
    right   : 0;
    position: absolute;
    top     : 0
}

.mem-achieve-item {
    margin-top: 50px
}

.mem-achieve-item h4 {
    font-weight: 600
}

@media only screen and (min-width:1200px) {

    .mem-achieve-item .history-content-wrap,
    .mem-achieve-item .skill-bar-wrap {
        max-width: 75%
    }
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .mem-achieve-item .history-content-wrap .icon-box-item {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

.mem-achieve-item .history-content-wrap .icon-box-item .icon-box__icon {
    margin-right           : 20px;
    margin-bottom          : 0;
    -ms-flex-preferred-size: 100px;
    flex-basis             : 100px;
    width                  : 100px
}

.mem-achieve-item.member-education {
    margin-bottom: 55px
}

@media only screen and (max-width:767.98px) {
    .mem-achieve-item.member-education {
        margin-bottom: 40px
    }
}

.blog-content-wrapper .blog-item .blog-content {
    padding-top   : 35px;
    padding-bottom: 30px
}

.blog-content-wrapper.blog-list .blog-item .blog-content {
    padding-top   : 25px;
    padding-bottom: 20px
}

@media only screen and (min-width:1200px),
only screen and (min-width:768px) and (max-width:991.98px),
only screen and (min-width:992px) and (max-width:1199.98px) {
    .blog-content-wrapper.blog-list .blog-item .blog-content {
        padding-left: 0
    }
}

.single-sidebar-item-wrap {
    margin-bottom: 50px
}

.single-sidebar-item-wrap:last-child {
    margin-bottom: 0
}

.single-sidebar-item-wrap .sidebar-title {
    /* font-size     : 18px; */
    /* line-height   : 1; */
    font-weight   : 600;
    text-transform: uppercase;
    position      : relative;
    padding-bottom: 30px;
    margin-bottom : 30px;
    margin-top    : -3px
}

.single-sidebar-item-wrap .sidebar-title:before {
    background-color: #080b1a;
    content         : "";
    position        : absolute;
    left            : 0;
    bottom          : 0;
    height          : 3px;
    width           : 30px
}

.sidebar-list li a {
    border        : 1px solid #eee;
    border-bottom : 0;
    color         : #222222;
    display       : block;
    font-weight   : 600;
    font-size     : 14px;
    line-height   : 1;
    text-transform: uppercase;
    padding       : 20px
}

.sidebar-list li a:hover {
    color: #080b1a
}

.sidebar-list li:last-child a {
    border-bottom: 1px solid #eee
}

.sidebar-body .latest-blog-widget .single-blog-item {
    display      : -webkit-box;
    display      : -ms-flexbox;
    display      : flex;
    margin-bottom: 20px
}

.sidebar-body .latest-blog-widget .single-blog-item:last-child {
    margin-bottom: 0
}

.sidebar-body .latest-blog-widget .single-blog-item .post-info {
    -ms-flex-preferred-size: calc(100% - 75px);
    flex-basis             : calc(100% - 75px)
}

.sidebar-body .latest-blog-widget .single-blog-item .post-info h6 {
    font-weight: 600;
    font-size  : 14px
}

.sidebar-body .latest-blog-widget .single-blog-item .post-info h6 a {
    color: #222222
}

.sidebar-body .latest-blog-widget .single-blog-item .post-info h6 a:hover {
    padding-left: 0
}

.sidebar-body .latest-blog-widget .single-blog-item .post-info h6 a:before {
    display: none
}

.sidebar-body .latest-blog-widget .single-blog-item .post-thumb {
    max-width              : 65px;
    -ms-flex-preferred-size: 65px;
    flex-basis             : 65px;
    max-height             : 65px;
    overflow               : hidden;
    margin-right           : 10px
}

.sidebar-newsletter {
    background-color: #f8f9fc;
    padding         : 56px 30px 60px
}

@media only screen and (min-width:992px) and (max-width:1199.98px) {
    .sidebar-newsletter {
        padding: 56px 10px 60px
    }
}

.sidebar-newsletter h3 {
    color        : #080b1a;
    font-size    : 26px;
    font-weight  : 600;
    line-height  : 1;
    margin-bottom: 26px
}

.sidebar-newsletter form input {
    background-color: #eeeeee;
    font-weight     : 500;
    border          : none;
    display         : block;
    outline         : none;
    padding         : 15px;
    width           : 100%
}

@media only screen and (min-width:992px) and (max-width:1199.98px) {
    .sidebar-newsletter form input {
        padding: 15px 10px
    }
}

.sidebar-newsletter form button {
    border-color      : #080b1a;
    font-weight       : 600;
    width             : 100%;
    padding           : 10px 15px;
    margin-top        : 15px;
    -webkit-transition: 0.3s;
    transition        : 0.3s
}

.sidebar-newsletter form button:hover {
    background-color: #080b1a;
    color           : #FFFFFF
}

.sidebar-body .instagram-feed .instagram-gallery {
    margin: -5px -2.5px 0
}

.sidebar-body .instagram-feed .instagram-gallery .instagram-item {
    max-width: calc(33.333% - 5px);
    display  : inline-block;
    margin   : 5px 2.5px 0
}

.sidebar-body .instagram-feed .insta-follow {
    color        : #151515;
    font-size    : 15px;
    font-weight  : 400;
    line-height  : 1;
    margin-top   : 29px;
    margin-bottom: 0
}

.sidebar-body .instagram-feed .insta-follow a {
    color      : #000000;
    font-weight: 600
}

.sidebar-body .instagram-feed .insta-follow i {
    margin-right: 5px
}

.blog-post-details .blog-post-thumb {
    margin-bottom: 50px
}

@media only screen and (max-width:767.98px) {
    .blog-post-details .blog-post-thumb {
        margin-bottom: 40px
    }
}

.blog-post-details .blog-post-txt h2 {
    font-weight  : 600;
    margin-bottom: 18px
}

.blog-post-details .blog-post-txt img {
    margin-bottom: 15px
}

.blog-post-details .share-article {
    margin-top: 50px
}

.blog-post-details .share-article h6 {
    font-weight   : 600;
    font-size     : 14px;
    text-transform: uppercase
}

.blog-post-details .share-article .member-social-icons {
    border-top : 1px solid #eee;
    padding-top: 20px;
    margin-top : 20px
}

.blog-post-details .comment-area-wrapper .btn-outline {
    border-radius: 0;
    border-width : 1px
}

.author-info {
    border-top   : 8px solid #f8f9fc;
    border-bottom: 1px solid #eee;
    padding      : 20px 0
}

.author-info .author-thumb {
    border-radius: 50%;
    overflow     : hidden;
    height       : 100px;
    width        : 100px;
    margin       : 0 auto 15px
}

.author-info .author-txt {
    text-align: center
}

.author-info .author-txt h5 {
    font-weight  : 600;
    font-size    : 15px;
    margin-bottom: 0
}

.author-info .author-txt h5 .designation {
    display    : block;
    font-weight: 400;
    margin-top : 5px
}

.author-info .author-txt .member-social-icons {
    -webkit-box-pack: center;
    -ms-flex-pack   : center;
    justify-content : center;
    margin-top      : 15px
}

.author-info .author-txt .member-social-icons a {
    color       : #151515;
    display     : inline-block;
    height      : auto;
    width       : auto;
    margin-right: 15px;
    line-height : 1
}

.author-info .author-txt .member-social-icons a:last-child {
    margin-right: 0
}

.comment-area-wrapper {
    margin-top: 55px
}

.comment-area-wrapper h3 {
    font-size    : 26px;
    margin-bottom: 30px
}

@media only screen and (max-width:767.98px) {
    .comment-area-wrapper h3 {
        margin-bottom: 25px
    }
}

.single-comment-wrap {
    font-size    : 15px;
    line-height  : 1.6;
    margin-bottom: 35px
}

.single-comment-wrap:last-child {
    margin-bottom: 0
}

.single-comment-wrap.comment-reply {
    margin-left: 50px
}

@media only screen and (max-width:767.98px) {
    .single-comment-wrap.comment-reply {
        margin-left: 20px
    }
}

.single-comment-wrap .author-thumb {
    border-radius          : 3px;
    margin-right           : 15px;
    height                 : 70px;
    max-width              : 70px;
    -ms-flex-preferred-size: 70px;
    flex-basis             : 70px;
    overflow               : hidden
}

.single-comment-wrap .comments-info {
    margin-top             : -4px;
    -ms-flex-preferred-size: calc(100% - 70px);
    flex-basis             : calc(100% - 70px)
}

.single-comment-wrap .comment-footer {
    margin-top: 8px
}

.single-comment-wrap .comment-footer a {
    font-size: 14px;
    color    : #151515
}

.single-comment-wrap .comment-footer a strong {
    color: #222222
}

.single-comment-wrap .comment-footer a.btn-reply {
    color: #222222
}

.single-comment-wrap .comment-footer a.btn-reply:hover {
    color: #080b1a
}

.single-input-item {
    color        : #151515;
    margin-bottom: 30px
}

.single-input-item .custom-control-label,
.single-input-item label {
    color        : #151515;
    display      : block;
    margin-bottom: 10px;
    font-weight  : 500;
    position     : relative
}

.single-input-item .custom-control-label.required:after,
.single-input-item label.required:after {
    content    : "*";
    color      : red;
    margin-left: 2px
}

.single-input-item input,
.single-input-item textarea {
    border            : 1px solid #eee;
    color             : #151515;
    font-weight       : 500;
    display           : block;
    outline           : none;
    padding           : 15px 20px;
    -webkit-transition: 0.3s;
    transition        : 0.3s;
    width             : 100%
}

.single-input-item input:focus,
.single-input-item textarea:focus {
    border-color: #080b1a
}

.single-input-item .nice-select {
    line-height: 30px;
    height     : 50px;
    width      : 100%
}

.single-input-item .nice-select .current {
    color      : #8d8d8d;
    font-weight: 400
}

.single-input-item .nice-select .list {
    font-size: 14px
}

.contact-method h3 {
    font-weight  : 600;
    margin-bottom: 43px
}

.contact-method.contact-form-area {
    padding: 45px 0 45px 30px
}

@media only screen and (max-width:767.98px),
only screen and (min-width:768px) and (max-width:991.98px) {
    .contact-method.contact-form-area {
        padding: 45px 30px 45px 30px
    }
}

.contact-method.contact-information {
    background-color : #080b1a;
    height           : 100%;
    color            : #FFFFFF;
    padding          : 45px 30px;
    display          : -webkit-box;
    display          : -ms-flexbox;
    display          : flex;
    -webkit-box-align: center;
    -ms-flex-align   : center;
    align-items      : center
}

@media only screen and (min-width:1200px),
only screen and (min-width:992px) and (max-width:1199.98px) {
    .contact-method.contact-information {
        -webkit-box-pack: center;
        -ms-flex-pack   : center;
        justify-content : center
    }
}

.contact-method.contact-information h3 {
    color: #FFFFFF
}

.contact-method.contact-information .member-social-icons a {
    height      : auto;
    width       : auto;
    margin-right: 15px;
    opacity     : 0.9
}

.contact-method.contact-information .member-social-icons a:last-child {
    margin-right: 0
}

.contact-content-wrap {
    -webkit-box-shadow: 0 10px 60px 0 rgba(71, 74, 182, 0.12);
    box-shadow        : 0 10px 60px 0 rgba(71, 74, 182, 0.12)
}

.Button-Outline-Secondary,
.tp-caption.Button-Outline-Secondary {
    color           : #FFFFFF;
    font-size       : 14px;
    line-height     : 51px;
    font-weight     : 700;
    font-style      : normal;
    text-decoration : none;
    background-color: #080b1a;
    border-color    : #080b1a;
    border-style    : solid;
    border-width    : 3px 3px 3px 3px;
    border-radius   : 30px 30px 30px 30px
}

.Button-Outline-Secondary:hover,
.tp-caption.Button-Outline-Secondary:hover {
    color           : #FFFFFF;
    text-decoration : none;
    background-color: #080b1a;
    border-color    : #080b1a;
    border-style    : solid;
    border-width    : 3px 3px 3px 3px;
    border-radius   : 30px 30px 30px 30px;
    cursor          : pointer
}

#rev_slider_11_1 .uranus.tparrows,
#rev_slider_11_2 .uranus.tparrows {
    width             : 50px;
    height            : 50px;
    background        : rgba(255, 255, 255, 0);
    -webkit-transform : translateY(-50%) !important;
    transform         : translateY(-50%) !important;
    left              : 30px !important;
    opacity           : 0;
    -webkit-transition: 0.4s;
    transition        : 0.4s
}

@media only screen and (max-width:767.98px) {

    #rev_slider_11_1 .uranus.tparrows,
    #rev_slider_11_2 .uranus.tparrows {
        left: 5px !important
    }
}

#rev_slider_11_1 .uranus.tparrows.tp-rightarrow,
#rev_slider_11_2 .uranus.tparrows.tp-rightarrow {
    left : auto !important;
    right: 30px
}

@media only screen and (max-width:767.98px) {

    #rev_slider_11_1 .uranus.tparrows.tp-rightarrow,
    #rev_slider_11_2 .uranus.tparrows.tp-rightarrow {
        right: 5px
    }
}

#rev_slider_11_1 .uranus.tparrows:before,
#rev_slider_11_2 .uranus.tparrows:before {
    width             : 50px;
    height            : 50px;
    line-height       : 50px;
    font-size         : 40px;
    -webkit-transition: all 0.3s;
    transition        : all 0.3s
}

#rev_slider_11_1 .uranus.tparrows:hover:before,
#rev_slider_11_2 .uranus.tparrows:hover:before {
    opacity: 0.75
}

#slide-27-layer-7,
#slide-28-layer-3 {
    color: #080b1a
}

#slide-28-layer-1,
#slide-28-layer-2,
#slide-29-layer-7 {
    color: #FFFFFF
}

#rev_slider_11_1:hover .uranus.tparrows,
#rev_slider_11_2:hover .uranus.tparrows {
    opacity: 1
}

#rev_slider_11_1 .rev-btn,
#rev_slider_11_2 .rev-btn {
    text-transform: uppercase
}

@media only screen and (min-width:1200px) {
        .about-content {
        margin-left: 55px;
        padding-right: 80px;
        padding-left: 20px;
    }
}

.about-content h6 {
    margin-bottom: 13px
}

.about-content .about-since {
    color        : #484848;
    display      : inline-block;
    font-size    : 24px;
    font-weight  : 300;
    line-height  : 1;
    position     : relative;
    padding-right: 20px;
    margin-bottom: 30px
}

@media only screen and (max-width:767.98px) {
    .about-content .about-since {
        margin-bottom: 20px
    }
}

.about-content .about-since:after {
    background-color : #b4b4b4;
    content          : "";
    position         : absolute;
    left             : 100%;
    top              : 50%;
    -webkit-transform: translateY(-50%);
    transform        : translateY(-50%);
    height           : 2px;
    width            : 110px
}

.about-content .btn-about {
    color      : #151515;
    font-size  : 16px;
    font-weight: 500;
    display    : inline-block;
    margin-top : 15px
}

@media only screen and (max-width:767.98px) {
    .about-content .btn-about {
        margin-top: 5px;
        font-size : 15px;
    }
}

.about-content .btn-about i {
    font-size         : 20px;
    line-height       : 3px;
    vertical-align    : middle;
    -webkit-transition: 0.3s;
    transition        : 0.3s
}

.about-content .btn-about:hover i {
    padding-left: 5px
}

@media only screen and (min-width:1200px) {
    .about-content--2 {
        margin-left  : 0;
        padding-right: 40px
    }
}

.about-thumb {
    overflow: hidden
}

@media only screen and (max-width:767.98px) {
    .about-thumb {
        margin-bottom: 35px
    }
}

.about-thumb img {
    width             : 100%;
    -webkit-transition: 0.4s;
    transition        : 0.4s
}

.about-thumb--2 {
    margin-right: -250px
}

.home-two-about-area {
    background-color   : #f8f9fc;
    background-image   : url("../img/about-2-bg.jpg");
    background-position: center right;
    background-repeat  : no-repeat
}

@media only screen and (min-width:1200px) and (max-width:1599.98px),
only screen and (min-width:992px) and (max-width:1199.98px) {
    .home-two-about-area {
        background-size: 1100px auto
    }
}

@media only screen and (max-width:767.98px),
only screen and (min-width:768px) and (max-width:991.98px) {
    .home-two-about-area {
        background-image: none
    }
}

.home-two-about-area .about-content {
    padding-top   : 100px;
    padding-bottom: 100px
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .home-two-about-area .about-content {
        padding-top   : 40px;
        padding-bottom: 90px
    }
}

@media only screen and (max-width:767.98px) {
    .home-two-about-area .about-content {
        padding-bottom: 60px;
        padding-top   : 0
    }
}

.video-button-thumb {
    position: relative
}

.video-button-thumb:after {
    content         : "";
    background-color: #080b1a;
    opacity         : 0.5;
    height          : 100%;
    width           : 100%;
    position        : absolute;
    left            : 0;
    top             : 0
}

.video-button-thumb .btn-play {
    border-radius    : 50%;
    background-color : #FFFFFF;
    color            : #080b1a;
    font-size        : 18px;
    text-align       : center;
    line-height      : 60px;
    height           : 60px;
    width            : 60px;
    position         : absolute;
    top              : 50%;
    left             : 50%;
    -webkit-transform: translate(-50%, -50%);
    transform        : translate(-50%, -50%);
    z-index          : 2
}

.video-button-thumb .btn-play:hover {
    background-color: #080b1a;
    color           : #FFFFFF
}

.video-button-thumb .btn-play i {
    padding-left: 5px
}

.service-area-top {
    padding : 110px 0 130px;
    position: relative;
    z-index : 1
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .service-area-top {
        padding: 90px 0 135px
    }
}

@media only screen and (max-width:767.98px) {
    .service-area-top {
        padding: 60px 0 135px
    }
}

.service-area-top:before {
    background-color: rgba(8, 11, 26, 0.9);
    content         : "";
    position        : absolute;
    left            : 0;
    top             : 0;
    height          : 100%;
    width           : 100%;
    z-index         : -1
}

.service-content-area {
    margin-top: -170px;
    position  : relative;
    z-index   : 1
}

.service-item {
    margin-top        : 30px;
    -webkit-transition: 0.4s;
    transition        : 0.4s;
    position          : relative;
    text-align        : center;
    overflow          : hidden
}

.service-item .service-txt {
    background-color: #f8f9fc;
    padding         : 25px 0
}

.service-item .service-txt h5 {
    font-weight  : 600;
    margin-bottom: 0
}

@media only screen and (max-width:767.98px) {
    .service-item .service-txt h5 {
        font-size: 16px
    }
}

.service-item .service-content {
    background-color  : rgba(8, 11, 26, 0.95);
    color             : #FFFFFF;
    display           : -webkit-box;
    display           : -ms-flexbox;
    display           : flex;
    -webkit-box-pack  : center;
    -ms-flex-pack     : center;
    justify-content   : center;
    -webkit-box-align : center;
    -ms-flex-align    : center;
    align-items       : center;
    padding           : 15px 30px;
    position          : absolute;
    -webkit-transition: 0.4s;
    transition        : 0.4s;
    left              : -100%;
    top               : 0;
    height            : 100%;
    width             : 100%;
    pointer-events    : none
}

@media only screen and (max-width:767.98px) {
    .service-item .service-content {
        padding: 15px
    }
}

.service-item .service-content h5 {
    color        : #FFFFFF;
    font-weight  : 500;
    margin-bottom: 18px
}

.service-item .service-content h5 a {
    color: #FFFFFF
}

.service-item:hover {
    -webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.26);
    box-shadow        : 0 1px 5px 0 rgba(0, 0, 0, 0.26)
}

.service-item:hover .service-content {
    left: 0
}

.non-opacity:after,
.non-opacity:before {
    display: none
}

.testimonial-item {
    background-color  : #FFFFFF;
    -webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.11);
    box-shadow        : 0 1px 5px 0 rgba(0, 0, 0, 0.11);
    display           : -webkit-box !important;
    display           : -ms-flexbox !important;
    display           : flex !important;
    -webkit-box-align : center;
    -ms-flex-align    : center;
    align-items       : center;
    padding           : 40px;
    outline           : none
}

@media only screen and (min-width:992px) and (max-width:1199.98px) {
    .testimonial-item {
        padding: 30px 20px
    }
}

@media only screen and (max-width:575.98px) {
    .testimonial-item {
        display: inline-block !important;
        padding: 30px 20px
    }
}

.testimonial-item .testimonial-txt {
    -ms-flex-preferred-size: calc(100% - 140px);
    flex-basis             : calc(100% - 140px);
    max-width              : calc(100% - 140px);
    font-weight            : 400
}

@media only screen and (max-width:575.98px) {
    .testimonial-item .testimonial-txt {
        -ms-flex-preferred-size: 100%;
        flex-basis             : 100%;
        max-width              : 100%;
        text-align             : center
    }
}

.testimonial-item .testimonial-txt img {
    margin-bottom: 20px
}

@media only screen and (max-width:575.98px) {
    .testimonial-item .testimonial-txt img {
        margin-left : auto;
        margin-right: auto
    }
}

.testimonial-item .testimonial-txt .client-name {
    font-size    : 20px;
    font-weight  : 600;
    margin-top   : 10px;
    line-height  : 1;
    margin-bottom: 0
}

.testimonial-item .testimonial-txt .client-name .designation {
    font-size  : 15px;
    font-weight: 400;
    color      : #6a6a6a
}

.testimonial-item .testimonial-thumb {
    border-radius            : 50%;
    height                   : 110px;
    margin-left              : 30px;
    -ms-flex-preferred-size  : 110px;
    flex-basis               : 110px;
    max-width                : 110px;
    overflow                 : hidden;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order           : 1;
    order                    : 1
}

@media only screen and (max-width:575.98px) {
    .testimonial-item .testimonial-thumb {
        -webkit-box-ordinal-group: 1;
        -ms-flex-order           : 0;
        order                    : 0;
        margin-bottom            : 30px;
        margin-left              : auto;
        margin-right             : auto
    }
}

.testimonial-item--2 {
    background-color  : transparent;
    -webkit-box-shadow: none;
    box-shadow        : none;
    padding           : 0;
    display           : block !important
}

.testimonial-item--2 .testimonial-txt {
    font-size  : 24px;
    font-weight: 300;
    max-width  : 100%
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .testimonial-item--2 .testimonial-txt {
        font-size: 20px
    }
}

@media only screen and (max-width:767.98px) {
    .testimonial-item--2 .testimonial-txt {
        font-size: 18px
    }
}

.testimonial-item--2 .testimonial-txt .client-name {
    margin-top: 25px
}

.testimonial-item--3 {
    -webkit-box-shadow: none;
    box-shadow        : none
}

.testimonial-thumbnail-item {
    position: relative;
    z-index : 1
}

.testimonial-thumbnail-item:after {
    border       : 15px solid #f3f4f6;
    border-bottom: 0;
    content      : "";
    position     : absolute;
    left         : 0;
    bottom       : 0;
    height       : 85%;
    width        : 100%;
    z-index      : -1
}

.testimonial-thumbnail-item:before {
    background-image   : url("../img/testimonial/bg-dot.png");
    background-size    : cover;
    background-repeat  : no-repeat;
    background-position: center center;
    content            : "";
    position           : absolute;
    left               : 0;
    bottom             : 0;
    height             : 85%;
    width              : 100%;
    z-index            : -1
}

.testimonial-arrows-2 {
    text-align: right;
    margin-top: 20px
}

@media only screen and (max-width:767.98px) {
    .testimonial-arrows-2 {
        text-align: center
    }
}

.testimonial-arrows-2 button {
    margin-left       : 15px;
    color             : #9f9f9f;
    -webkit-transition: 0.5s;
    transition        : 0.5s;
    font-size         : 18px;
    line-height       : 1
}

.testimonial-arrows-2 button:first-child {
    margin-left: 0
}

.testimonial-arrows-2 button:hover {
    color: #080b1a
}

@media only screen and (min-width:1200px) {
    .testimonial-area .section-title {
        padding-right: 50px
    }
}

.testimonial-area .testimonial-content-wrap {
    margin-right: -5px
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .testimonial-area .testimonial-content-wrap {
        margin-top: 50px
    }
}

@media only screen and (max-width:767.98px) {
    .testimonial-area .testimonial-content-wrap {
        margin-top: 35px
    }
}

@media only screen and (min-width:1200px) {
    .testimonial-area .testimonial-area-right {
        padding-left: 60px
    }
}

.testimonial-area--2 {
    padding-top: 90px
}

@media only screen and (max-width:767.98px) {
    .testimonial-area--2 {
        padding: 60px 0
    }
}

.testimonial-content .slick-list {
    margin       : -15px 0;
    padding-left : 5px;
    padding-right: 5px
}

.testimonial-content .slick-list .slick-slide {
    margin: 15px 0
}

.tagline {
    font-size  : 18px;
    line-height: 1
}

.tagline strong {
    font-weight: 500
}

.tagline .tag-no {
    font-weight: 600;
    position   : relative
}

.tagline .tag-no:after {
    background-color: #a2a2a4;
    content         : "";
    position        : absolute;
    left            : 0;
    bottom          : -2px;
    height          : 2px;
    width           : 100%
}

.testimonial-grid .slick-list {
    margin: 0 -10px
}

.testimonial-grid .slick-list .slick-slide {
    padding: 0 10px
}

.testimonial-content--3 .slick-dots {
    -webkit-box-pack: center;
    -ms-flex-pack   : center;
    justify-content : center
}

.team-mem-item {
    -webkit-transition: 0.4s;
    transition        : 0.4s
}

.team-mem-item .member-info {
    text-align      : center;
    background-color: #FFFFFF;
    padding         : 15px 10px
}

.team-mem-item .member-info h5 {
    font-weight: 600;
    font-size  : 18px;
    line-height: 1
}

.team-mem-item .member-info h5 a {
    color: #151515
}

.team-mem-item .member-info h5 a:hover {
    color: #182141
}

.team-mem-item .member-info .designation {
    font-weight: 400;
    color      : #080b1a
}

.team-mem-item .member-pic img {
    width: 100%
}

.team-mem-item--2 {
    position  : relative;
    margin-top: 40px
}

.team-mem-item--2 .member-info {
    background-color  : transparent;
    padding           : 0;
    position          : absolute;
    top               : -15px;
    left              : -110px;
    width             : 100%;
    opacity           : 0;
    visibility        : hidden;
    -webkit-transition: 0.4s;
    transition        : 0.4s;
    -webkit-transform : translateY(-20px);
    transform         : translateY(-20px)
}

@media only screen and (max-width:767.98px) {
    .team-mem-item--2 .member-info {
        left: -80px
    }
}

.team-mem-item--2 .member-info:after {
    background-image           : url("../img/team/team-arrow.png");
    background-repeat          : no-repeat;
    background-position        : center center;
    content                    : "";
    position                   : absolute;
    -webkit-transform          : translateY(-10px);
    transform                  : translateY(-10px);
    -webkit-transition         : 0.4s;
    transition                 : 0.4s;
    -webkit-transition-duration: 0.8s;
    transition-duration        : 0.8s;
    top                        : 100%;
    right                      : -15px;
    height                     : 40px;
    width                      : 100%
}

.team-mem-item--2 .member-pic {
    text-align: center
}

.team-mem-item--2 .member-pic img {
    max-height: 400px;
    width     : auto;
    margin    : auto
}

.team-mem-item--2:hover .member-info {
    opacity          : 1;
    visibility       : visible;
    -webkit-transform: none;
    transform        : none
}

.team-mem-item--2:hover .member-info:after {
    -webkit-transform: none;
    transform        : none
}

@media screen and (min-width:1500px) {
    .team-area-wrapper .section-title {
        padding-right: 100px
    }
}

@media screen and (min-width:1500px) {
    .team-area-wrapper .team-content-wrap {
        padding-left: 45px
    }
}

.team-area-wrapper .team-content-wrap .slick-dots {
    -webkit-box-pack: center;
    -ms-flex-pack   : center;
    justify-content : center
}

.team-area-wrapper .team-content-wrap .slick-list {
    margin: 0 -15px
}

@media only screen and (max-width:767.98px) {
    .team-area-wrapper .team-content-wrap .slick-list {
        margin: 0 -10px
    }
}

.team-area-wrapper .team-content-wrap .slick-list .slick-slide {
    margin: 0 15px
}

@media only screen and (max-width:767.98px) {
    .team-area-wrapper .team-content-wrap .slick-list .slick-slide {
        margin: 0 10px
    }
}

.team-area-left {
    background-color: #080b1a;
    padding         : 110px 100px 105px;
    height          : 100%
}

@media only screen and (min-width:1200px) and (max-width:1599.98px) {
    .team-area-left {
        padding: 90px 25px
    }
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .team-area-left {
        padding: 90px
    }
}

@media only screen and (max-width:767.98px) {
    .team-area-left {
        padding: 60px 30px 50px
    }
}

@media only screen and (max-width:575.98px) {
    .team-area-left {
        padding: 60px 15px 50px
    }
}

.team-area-right {
    position: relative;
    padding : 110px 100px 0
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .team-area-right {
        padding: 80px 100px 0
    }
}

@media only screen and (max-width:767.98px) {
    .team-area-right {
        padding: 50px 30px 0
    }
}

.team-area-right--2:before {
    background-color: rgba(255, 255, 255, 0.85);
    content         : "";
    position        : absolute;
    left            : 0;
    top             : 0;
    height          : 100%;
    width           : 100%
}

.team-page-area-wrapper .team-mem-item {
    margin-top        : 30px;
    -webkit-transition: 0.4s;
    transition        : 0.4s
}

.team-page-area-wrapper .team-mem-item:hover {
    -webkit-transform: translateY(-10px);
    transform        : translateY(-10px)
}

.blog-item {
    background-color  : #f8f9fc;
    -webkit-transition: 0.4s;
    transition        : 0.4s;
    margin-top        : 30px
}

.blog-item .blog-content {
    padding: 50px 30px 45px
}

@media only screen and (max-width:767.98px) {
    .blog-item .blog-content {
        padding: 30px 15px 25px
    }
}

.blog-item .blog-content h2 {
    font-weight  : 600;
    margin-bottom: 15px
}

.blog-item .blog-content h2 a {
    color: #151515
}

.blog-item .blog-content h2 a:hover {
    color: #182141
}

.blog-item .blog-content .blog-meta {
    display         : -webkit-box;
    display         : -ms-flexbox;
    display         : flex;
    -webkit-box-pack: justify;
    -ms-flex-pack   : justify;
    justify-content : space-between;
    margin-top      : 20px
}

.blog-item .blog-content .blog-meta a {
    /* color       : #151515; */
    font-weight : 400;
    margin-right: 10px
}

.blog-item .blog-content .blog-meta a:last-child {
    margin-right: 0
}

@media only screen and (max-width:575.98px) {
    .blog-item .blog-content .blog-meta a {
        font-size: 14px
    }
}

.blog-item:hover {
    -webkit-box-shadow: 0 10px 60px 0 rgba(71, 74, 182, 0.16);
    box-shadow        : 0 10px 60px 0 rgba(71, 74, 182, 0.16);
    -webkit-transform : translateY(-10px);
    transform         : translateY(-10px)
}

.brand-logo-item img {
    margin: 2px;
}

.counter-item {
    margin-top: 40px
}

.counter-number {
    color        : #f8f9fc;
    margin-bottom: 10px;
    position     : relative;
    font-size    : 20px;
    font-weight  : 600
}

@media only screen and (max-width:767.98px) {
    .counter-number {
        font-size: 20px
    }
}

.counter-number.plus:after {
    content     : "+";
    position    : absolute;
    padding-left: 5px
}

.counter-txt {
    color        : #f8f9fc;
    font-size    : 24px;
    font-weight  : 600;
    margin-bottom: 0
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .counter-txt {
        font-size: 20px
    }
}

@media only screen and (max-width:767.98px) {
    .counter-txt {
        font-size: 16px
    }
}

.fun-fact-area {
    padding : 80px 0 75px;
    position: relative
}

.fun-fact-area:before {
    background-color: rgba(8, 11, 26, 0.92);
    content         : "";
    position        : absolute;
    left            : 0;
    top             : 0;
    height          : 100%;
    width           : 100%
}

.page-header-area .page-header-content-inner {
    height           : 460px;
    display          : -webkit-box;
    display          : -ms-flexbox;
    display          : flex;
    -webkit-box-align: center;
    -ms-flex-align   : center;
    align-items      : center;
    -webkit-box-pack : center;
    -ms-flex-pack    : center;
    justify-content  : center;
    color            : #FFFFFF
}

@media only screen and (min-width:768px) and (max-width:991.98px) {
    .page-header-area .page-header-content-inner {
        height: 400px
    }
}

@media only screen and (max-width:767.98px) {
    .page-header-area .page-header-content-inner {
        height: 350px
    }
}

.page-header-area .page-header-content-inner h2 {
    color    : #FFFFFF;
    font-size: 3.4375rem
}

@media (max-width:1200px) {
    .page-header-area .page-header-content-inner h2 {
        font-size: calc(1.46875rem + 2.625vw)
    }
}

@media only screen and (max-width:575.98px) {
    .page-header-area .page-header-content-inner h2 {
        font-size: 25px
    }
}

@media only screen and (min-width:1200px) {
    .page-header-area .page-header-content-inner p {
        max-width: 110%;
        margin   : auto
    }
}

.breadcrumb-wrap {
    margin-top: 25px
}

@media only screen and (max-width:767.98px) {
    .breadcrumb-wrap {
        margin-top: 15px
    }
}

.breadcrumb-wrap .breadcrumb {
    background-color: transparent;
    border-radius   : 0;
    -webkit-box-pack: center;
    -ms-flex-pack   : center;
    justify-content : center;
    padding         : 0;
    margin          : 0
}

.breadcrumb-wrap .breadcrumb li:last-child a:after {
    display: none
}

.breadcrumb-wrap .breadcrumb li a {
    color      : #FFFFFF;
    font-weight: 500;
    font-size  : 14px;
    line-height: 1;
    position   : relative
}

.breadcrumb-wrap .breadcrumb li a:after {
    content       : "-";
    margin        : 0 20px;
    pointer-events: none
}

@media only screen and (max-width:767.98px) {
    .breadcrumb-wrap .breadcrumb li a:after {
        margin: 0 10px
    }
}

.breadcrumb-wrap .breadcrumb li a.current {
    pointer-events: none;
    opacity       : 0.8
}

.history-item {
    margin-top: 40px
}

@media only screen and (min-width:1200px) {
    .history-item {
        padding-right: 20px
    }
}

.history-item h6 {
    font-weight: 700;
    color      : #080b1a
}

.history-item h3 {
    font-size  : 22px;
    font-weight: 500
}

.pricing-plan-buttons ul li a {
    background-color: transparent;
    border          : 2px solid #080b1a;
    color           : #151515;
    display         : inline-block;
    font-size       : 14px;
    font-weight     : 500;
    padding         : 13px 40px;
    text-transform  : uppercase;
    position        : relative;
    overflow        : hidden;
    z-index         : 1
}

@media only screen and (max-width:767.98px) {
    .pricing-plan-buttons ul li a {
        padding: 10px 20px
    }
}

.pricing-plan-buttons ul li a:before {
    background-color: #080b1a;
    content         : "";
    position        : absolute;
    left            : -100%;
    top             : 0;
    height          : 100%;
    width           : 100%;
    z-index         : -1
}

.pricing-plan-buttons ul li a.active {
    color: #FFFFFF
}

.pricing-plan-buttons ul li a.active:before {
    -webkit-transition: 0.3s;
    transition        : 0.3s;
    left              : 0
}

.pricing-plan-item {
    text-align        : center;
    background-color  : #f8f9fc;
    padding           : 60px 25px;
    -webkit-transition: 0.3s;
    transition        : 0.3s;
    margin-top        : 30px
}

.pricing-plan-item .plan-name {
    font-weight  : 600;
    margin-bottom: 0;
    font-size    : 18px;
    line-height  : 1
}

.pricing-plan-item .plan-price {
    display          : -webkit-box;
    display          : -ms-flexbox;
    display          : flex;
    -webkit-box-align: end;
    -ms-flex-align   : end;
    align-items      : flex-end;
    -webkit-box-pack : center;
    -ms-flex-pack    : center;
    justify-content  : center;
    margin           : 30px 0
}

@media only screen and (max-width:767.98px) {
    .pricing-plan-item .plan-price {
        margin: 15px 0
    }
}

.pricing-plan-item .plan-price .dollar {
    font-weight: 600;
    font-size  : 24px;
    line-height: 1
}

.pricing-plan-item .plan-price .price {
    font-weight  : 700;
    font-size    : 50px;
    line-height  : 1;
    padding-right: 3px
}

.pricing-plan-item .plan-price .price-type {
    font-weight: 500
}

.pricing-plan-item .plan-price .dollar,
.pricing-plan-item .plan-price .price-type {
    margin-bottom: 8px;
    display      : block
}

.pricing-plan-item .price-list li {
    margin-bottom: 10px;
    font-weight  : 500
}

.pricing-plan-item .price-list li:last-child {
    margin-bottom: 0
}

.pricing-plan-item .price-list li:before {
    content     : "\f5e1";
    font-family : "Material Design Icons";
    margin-right: 5px
}

.pricing-plan-item .pricing-plan-footer {
    margin-top: 50px
}

@media only screen and (max-width:767.98px) {
    .pricing-plan-item .pricing-plan-footer {
        margin-top: 30px
    }
}

.pricing-plan-item .pricing-plan-footer .btn-outline {
    border-radius : 6px;
    font-size     : 14px;
    text-transform: uppercase
}

@media only screen and (min-width:1200px),
only screen and (min-width:992px) and (max-width:1199.98px) {
    .pricing-plan-item .pricing-plan-footer .btn-outline {
        padding-left : 40px;
        padding-right: 40px
    }
}

.pricing-plan-item:hover {
    -webkit-transform: translateY(-10px);
    transform        : translateY(-10px)
}

.achievements-section {
    background-color: #f8f9fc;
}

.flip-box {
    background-color: transparent;
    width           : 100%;
    height          : 300px;
    perspective     : 1000px;
    margin-bottom   : 30px;
}

.flip-box-inner {
    position       : relative;
    width          : 100%;
    height         : 100%;
    text-align     : center;
    transition     : transform 0.6s;
    transform-style: preserve-3d;
}

.flip-box:hover .flip-box-inner {
    transform: rotateY(180deg);
}

.flip-box-front,
.flip-box-back {
    position                   : absolute;
    width                      : 100%;
    height                     : 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility        : hidden;
    border-radius              : 10px;
    overflow                   : hidden;
    box-shadow                 : 0 8px 20px rgba(0, 0, 0, 0.1);
}

.flip-box-front {
    background-color: #ffffff;
    display         : flex;
    flex-direction  : column;
    justify-content : center;
    align-items     : center;
    padding         : 20px;
}

.flip-box-front img {
    width        : 80px;
    height       : 80px;
    object-fit   : contain;
    margin-bottom: 15px;
}

.flip-box-front h5 {
    margin     : 0;
    font-size  : 18px;
    font-weight: 600;
}

.flip-box-back {
    background-color: #000000;
    color           : white;
    transform       : rotateY(180deg);
    padding         : 20px;
    display         : flex;
    flex-direction  : column;
    justify-content : center;
}

.flip-box-back h5 {
    margin-bottom: 10px;
    font-size    : 18px;
}

.flip-box-back p {
    font-size    : 14px;
    margin-bottom: 15px;
}

.flip-box-back a {
    color          : #fff;
    text-decoration: underline;
}

.flip-box .flip-box-front h5 {
    color      : #000000;
    font-weight: 500;
}

.flip-box .flip-box-back h5 {
    color      : #ffffff;
    font-weight: 500;
}

.achievement-section {
    background-color: #f8f9fc;
    padding         : 60px 0;
}

.achievement-box {
    background     : #fff;
    border-radius  : 12px;
    transition     : transform 0.4s ease, box-shadow 0.4s ease;
    transform-style: preserve-3d;
    box-shadow     : 0 10px 25px rgba(0, 0, 0, 0.1);
    transform      : perspective(800px) rotateX(0deg) rotateY(0deg);
}

.achievement-box:hover {
    transform : perspective(800px) rotateX(2deg) rotateY(2deg) scale(1.03);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
}

.achievement-box h5 {
    font-size  : 18px;
    font-weight: 600;
    color      : #333;
}

.achievement-box p {
    font-size: 14px;
    color    : #555;
}

.tech-wrapper {
    display        : flex;
    flex-wrap      : wrap;
    justify-content: center;
    gap            : 20px;
}

.tech-card {
    background     : rgba(255, 255, 255, 0.897);
    backdrop-filter: blur(10px);
    border         : 1px solid rgba(255, 255, 255, 0.2);
    border-radius  : 20px;
    width          : 150px;
    text-align     : center;
    padding        : 20px;
    cursor         : pointer;
    box-shadow     : 0 10px 20px rgba(0, 0, 0, 0.08);
    transition     : transform 0.3s ease, box-shadow 0.3s ease;
}

.tech-card:hover {
    transform : translateY(-6px) scale(1.03);
    box-shadow: 0 14px 24px rgba(0, 0, 0, 0.25);
}

.tech-card img {
    padding-bottom: 10px;
    width         : 60px;
    height        : 60px;
    object-fit    : contain;
    margin-bottom : 0px;
}

.tech-card p {
    font-size  : 14px;
    margin     : 0;
    color      : #222;
    font-weight: 500;
}

@media (max-width: 575.98px) {
    .tech-card {
        width  : 100px;
        padding: 10px;
    }

    .tech-card img {
        width         : 40px;
        height        : 40px;
        padding-bottom: 10px;
    }

    .tech-card p {
        font-size: 12px;
    }
}

.tech-box {
    width          : 120px;
    height         : 80px;
    margin         : 10px;
    background     : #fff;
    border-radius  : 12px;
    box-shadow     : 0 8px 20px rgba(0, 0, 0, 0.1);
    display        : flex;
    justify-content: center;
    align-items    : center;
    transition     : transform 0.3s ease;
}

.tech-box:hover {
    transform : translateY(-5px) scale(1.05);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.15);
}

.tech-box img {
    max-width : 90%;
    max-height: 90%;
    object-fit: contain;
}

.tech-grid {
    display  : flex;
    flex-wrap: wrap;
    gap      : 5px;
}

.nav-pills .nav-link {
    border-radius   : 0;
    background-color: #ffffff;
    color           : #000;
    text-align      : left;
    margin-bottom   : 5px;
    box-shadow      : 0 8px 20px rgba(0, 0, 0, 0.1);
}

.nav-pills .nav-link.active {
    background-color: #000 !important;
    color           : #fff !important;
}

.nav-pills .nav-link:hover {
    background-color: #333;
    color           : #fff;
}

@media (min-width: 1200px) {
    .col-xl-5 {
        flex : 0 0 auto;
        width: 100.666667% !important;
    }
}

.counter-number {
    font-size  : 30px;
    font-weight: 700;
    color      : #ffffff;
    line-height: 1.2;
}

.counter-txt.small-text {
    font-size  : 20px;
    color      : #f1f1f1;
    font-weight: 500;
    margin-top : 10px;
}

p.client-testimonial {
    margin-bottom: 40px;
}

.popup-modal {
    display         : none;
    position        : fixed;
    z-index         : 1000;
    left            : 0;
    top             : 0;
    width           : 100%;
    height          : 100%;
    background-color: rgba(0, 0, 0, 0.6);
    align-items     : center;
    justify-content : center;
}

.popup-modal .popup-content {
    background   : #fff;
    padding      : 30px;
    border-radius: 10px;
    text-align   : center;
    width        : 90%;
    max-width    : 400px;
    margin       : auto;
    position     : relative;
}

.popup-modal .close-popup {
    position : absolute;
    top      : 10px;
    right    : 15px;
    font-size: 24px;
    cursor   : pointer;
}

.form-input {
    display      : block;
    width        : 100%;
    padding      : 8px 10px;
    margin       : 8px 0;
    border       : 1px solid #ccc;
    border-radius: 4px;
}

.slider-area-wrapper {
    max-height: 500px;
    overflow  : hidden;
}

.rev_slider_wrapper,
.rev_slider {
    max-height: 500px !important;
}

.slider-area-wrapper {
    max-height: 500px;
    overflow  : hidden;
}

.rev_slider_wrapper,
.rev_slider {
    max-height: 500px !important;
}

.rev-btn {
    font-size  : 13px !important;
    line-height: 1.7 !important;
}

.service-content-inner-working-section {
    text-align: left;
}

.text-white {
    font-size: 36px;
}

.text-white .new-project-title {
    font-size: 30px;
}

.accordion-item {
    border       : none;
    margin-bottom: 16px;
    border-radius: 12px;
    overflow     : hidden;
    box-shadow   : 0 4px 6px rgba(0, 0, 0, 0.1);
    transition   : all 0.3s ease;
}

.ccordion-item:hover {
    transform : translateY(-2px);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

.accordion-button {
    padding         : 20px 25px;
    font-weight     : 600;
    color           : #333;
    background-color: #ffffff;
    transition      : all 0.3s ease;
}

.accordion-button:not(.collapsed) {
    color           : #ffffff;
    background-color: #000000;
}

.accordion-button:focus {
    box-shadow  : none;
    border-color: rgba(0, 0, 0, .125);
}

.accordion-button::after {
    background-size: 20px;
    transition     : all 0.3s ease;
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.accordion-body {
    padding         : 25px;
    background-color: #ffffff;
}

@media only screen and (max-width: 767.98px) {
    .text-white .new-project-title {
        font-size: 24px;
    }

    .counter-number {
        font-size: 20px;
    }

    .counter-txt.small-text {
        font-size: 14px;
    }
}

@media (min-width: 768px) {
    .brand-logo-work-item img {
        max-height: 100px;
    }
}

.brand-logo-work-item {
    padding   : 10px;
    text-align: center;
}

.brand-logo-work-item img {
    max-height: 100%;
    width     : 60%;
    margin    : auto;
    object-fit: contain;
}

#what-we-do {
    background: #ffffff;
}

#what-we-do .section-title {
    text-align   : center;
    font-weight  : bold;
    margin-bottom: 20px;
}

#what-we-do .card {
    padding           : 1rem !important;
    border            : none;
    margin-bottom     : 1rem;
    -webkit-transition: .5s all ease;
    -moz-transition   : .5s all ease;
    transition        : .5s all ease;
    display           : flex;
    flex-direction    : column;
    height            : 100%;
}

#what-we-do .card:hover {
    -webkit-box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
    -moz-box-shadow   : 5px 7px 9px -4px rgb(158, 158, 158);
    box-shadow        : 5px 7px 9px -4px rgb(158, 158, 158);
}

#what-we-do .card .card-block {
    padding-left: 50px;
    padding-top : 30px;
    position    : relative;
    flex-grow   : 1;
}

#what-we-do .card .card-block a {
    color          : #000000 !important;
    font-weight    : 700;
    text-decoration: none;
}

#what-we-do .card .card-block a i {
    display: none;
}

#what-we-do .card:hover .card-block a i {
    display    : inline-block;
    font-weight: 700;
}

#what-we-do .card .card-block:before {
    font-family       : FontAwesome;
    position          : absolute;
    font-size         : 39px;
    color             : #000000;
    left              : 0;
    -webkit-transition: -webkit-transform .2s ease-in-out;
    transition        : transform .2s ease-in-out;
}

#what-we-do .card .block-1:before {
    content: "\f0e7";
}

#what-we-do .card .block-2:before {
    content: "\f0eb";
}

#what-we-do .card .block-3:before {
    content: "\f00c";
}

#what-we-do .card .block-4:before {
    content: "\f209";
}

#what-we-do .card .block-5:before {
    content: "\f0a1";
}

#what-we-do .card .block-6:before {
    content: "\f218";
}

#what-we-do .card:hover .card-block:before {
    -webkit-transform : rotate(360deg);
    transform         : rotate(360deg);
    -webkit-transition: .5s all ease;
    -moz-transition   : .5s all ease;
    transition        : .5s all ease;
}

#what-we-do .row {
    display  : flex;
    flex-wrap: wrap;
}

#what-we-do .col-xs-12,
#what-we-do .col-sm-6,
#what-we-do .col-md-4,
#what-we-do .col-lg-4,
#what-we-do .col-xl-4 {
    display      : flex;
    margin-bottom: 30px;
}

#what-we-do .card {
    flex: 1 1 auto;
}

h3.card-title {
    font-size: 22px;
}

.video-fixed-box {
    width        : 100%;
    max-width    : 500px;
    aspect-ratio : 1 / 1;
    position     : relative;
    overflow     : hidden;
    border-radius: 8px;
}

.video-fixed-box iframe {
    position: absolute;
    top     : 0;
    left    : 0;
    width   : 100%;
    height  : 100%;
    border  : none;
}

.paragraph {
    color: #fff;
}

@media screen and (max-width: 600px) {
    .video-fixed-box {
        width       : 100%;
        max-width   : 100%;
        aspect-ratio: 16 / 9;
    }

    .about-content h6 {
        margin-top: 13px;
        font-size : 24px;
    }

    .about-content {
        margin-top: 15px;
    }

    .text-white {
        font-size: 24px;
    }
}

#aiSlider .carousel-item {
    height: 500px;
}

#aiSlider .carousel-item img {
    height    : 100%;
    object-fit: cover;
    filter    : brightness(0.85);
}

#aiSlider .carousel-caption {
    top       : 50%;
    left      : 5%;
    transform : translateY(-50%);
    text-align: left;
}

.carousel-indicators [data-bs-target] {
    width           : 12px;
    height          : 12px;
    border-radius   : 50%;
    background-color: #fff;
    opacity         : 0.5;
    transition      : opacity 0.3s;
}

.carousel-indicators .active {
    opacity         : 1;
    background-color: #000;
}

.form-select {
    line-height: 2.5;
    border     : 1px solid #eee;
    color      : #646464;
}

@media (max-width: 576px) {
    .carousel-caption h2 {
        font-size: 1.25rem;
    }

    .carousel-caption p {
        font-size: 0.95rem;
    }

    .carousel-caption {
        bottom: 15%;
    }
}

@media (max-width: 769px) {
    .tech-box {
        width : 65px;
        height: 65px;
        margin: 5px;
    }

    .tech-grid {
        gap: 0px;
    }

    h1 {
        font-size: 30px !important;
    }

    h2 {
        font-size: 24px !important;
    }

    h3 {
        font-size: 20px !important;
    }

    h4 {
        font-size: 18px !important;
    }

    h5 {
        font-size: 17px !important;
    }

    p {
        font-size: 16px !important;
    }

    ul li,
    ol li {
        font-size: 15px;
    }
}

.logo-digiprima-indexpage {
    min-width: 200px;
}

.intl-tel-input,
.intl-tel-input .form-control {
    width     : 100% !important;
    height    : 45px;
    box-sizing: border-box;
}

.intl-tel-input input {
    padding-left: 56px !important;
    height      : 45px !important;
}

.iti {
    width     : 100% !important;
    height    : 45px !important;
    box-sizing: border-box;
}

.form-control {
    height       : 45px !important;
    border-radius: 6px;
}

h1 {
    font-size: 40px !important;
   }

h6 {
    font-size: 18px !important;
}

p {
    font-size: 16px !important;
}

ul, ol {
    font-size: 15px !important;
}

ul li, ol li {
    margin-bottom: 0.5rem;
}
@media (max-width: 575.98px) {
    .tech-card p {
        font-size: 12px !important;
    }
}

.tech-wrapper {
    row-gap: 40px;
    column-gap: 25px;
}

.glass-bg {
    background: rgba(255, 255, 255, 0.35);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border-radius: 20px;
    padding: 2rem;
}

.custom-accordion-btn {
    background: linear-gradient(145deg, #ffffff, #e6e6e6);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
    color: #333;
    font-weight: 600;
    border-radius: 10px !important;
    transition: all 0.3s ease-in-out;
}

.custom-accordion-btn:focus {
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.25);
}

.accordion-item {
    background-color: rgba(255, 255, 255, 0.8);
    transition: transform 0.2s ease-in-out;
}

.accordion-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
}

.accordion-body {
    font-size: 1rem;
    line-height: 1.6;
}
 .sidebar {
    padding: 20px;
    background: #f8f9fa;
    border-radius: 5px;
    position: sticky;
    top: 100px;
    max-width: 300px;
    font-family: Arial, sans-serif;
    max-height: 80vh;       
    overflow-y: auto;         
    border: 1px solid #000;   
  }

.sidebar h6 {
    color: #000;
    font-size: 14px !important;
    font-weight: bold;
    margin-bottom: 10px;
    border-bottom: 2px solid #000;
    padding-bottom: 5px;
}

.sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sidebar ul li a {
    position: relative;
    display: inline-block;
    color: #000;
    text-decoration: none;
    font-size: 14px;
    padding: 4px 8px;
    border-radius: 4px;
    transition: color 0.3s ease;
}

.sidebar ul li a::after {
    content: '';
    position: absolute;
    left: 8px;
    right: 8px;
    bottom: 0;
    height: 2px;
    background-image: linear-gradient(to right, #355ee1, #27d1e0);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.sidebar ul li a:hover::after,
.sidebar ul li a.active::after {
    transform: scaleX(1);
}

.sidebar::-webkit-scrollbar {
    width: 6px;
}

.sidebar::-webkit-scrollbar-thumb {
    background-color: #888;
    border-radius: 10px;
}
#toc-list ul {
    padding-left: 20px;
}

    .toc-toggle {
        display: none;
        background: #f8f9fa;
        border: none;
        padding: 10px;
        width: 100%;
        text-align: left;
        font-size: 16px;
        cursor: pointer;
    }

    .toc-toggle i {
        float: right;
    }

    @media (max-width: 767px) {
        #toc-list {
            display: none;
        }

        #toc-list.active {
            display: block;
        }

        .toc-toggle {
            display: block;
        }
    }

    .newsletter {
        margin-top: 20px;
    }

    .newsletter h4 {
        color: #1a3c5e;
        font-size: 18px;
        margin-bottom: 10px;
        font-weight: bold;
    }

    .newsletter p {
        color: #4a5568;
        font-size: 14px;
        margin-bottom: 15px;
        line-height: 1.5;
    }

    .newsletter button {
        background-color: #2b6cb0;
        color: white;
        padding: 10px 20px;
        border: none;
        border-radius: 5px;
        font-size: 16px;
        cursor: pointer;
        width: 100%;
    }

    .newsletter button:hover {
        background-color: #2c5282;
    }


    .blog-post-txt {
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
        max-width: 800px;
        margin: 0 auto;
        color: #2d3748;
        line-height: 1.8;
    }

    .blog-post-txt h1, .blog-post-txt h2, .blog-post-txt h3, .blog-post-txt h4 {
        color: #1a3c5e;
        font-weight: 700;
        margin-top: 2rem;
        margin-bottom: 1rem;
    }

    .blog-post-txt h1 {
        font-size: 2.5rem;
    }

    .blog-post-txt h2 {
        font-size: 2rem;
        border-bottom: 2px solid #e2e8f0;
        padding-bottom: 0.5rem;
    }

    .blog-post-txt h3 {
        font-size: 1.5rem;
    }

    .blog-post-txt p {
        font-size: 1.125rem;
        margin-bottom: 1.5rem;
    }

    .blog-post-txt ul, .blog-post-txt ol {
        margin-bottom: 1.5rem;
        padding-left: 1.5rem;
    }

    .blog-post-txt ul li, .blog-post-txt ol li {
        margin-bottom: 0.75rem;
        position: relative;
    }

    .blog-post-txt ul li::before {
        content: '\f058';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        color: #2b6cb0;
        position: absolute;
        left: -1.5rem;
    }

    .blog-post-txt a {
        color:rgb(0, 0, 0);
        text-decoration: none;
        transition: color 0.3s ease;
    }

    .blog-post-txt a:hover {
        color:rgb(0, 0, 0);
        text-decoration: underline;
    }

    .blog-post-txt blockquote {
        border-left: 4px solid #2b6cb0;
        background: #f8f9fa;
        padding: 1.5rem;
        margin: 1.5rem 0;
        font-style: italic;
        color: #4a5568;
        border-radius: 5px;
    }

    .blog-post-txt img {
        max-width: 100%;
        height: auto;
        border-radius: 8px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        margin: 1.5rem 0;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .blog-post-txt pre {
        background: #1a202c;
        color: #e2e8f0;
        padding: 1.5rem;
        border-radius: 8px;
        overflow-x: auto;
        margin: 1.5rem 0;
        font-size: 0.875rem;
    }

    .blog-post-txt code {
        background: #f1f5f9;
        color: #d53f8c;
        padding: 0.2rem 0.4rem;
        border-radius: 4px;
        font-size: 0.875rem;
    }

    .blog-post-txt pre code {
        background: none;
        padding: 0;
    }

    .blog-post-txt table {
        width: 100%;
        border-collapse: collapse;
        margin: 1.5rem 0;
    }

    .blog-post-txt table th, .blog-post-txt table td {
        border: 1px solid #e2e8f0;
        padding: 0.75rem;
        text-align: left;
    }

    .blog-post-txt table th {
        background: #2b6cb0;
        color: white;
        font-weight: 600;
    }

    .blog-post-txt table tr:nth-child(even) {
        background: #f8f9fa;
    }

    @media (max-width: 767px) {
        .blog-post-txt h1 {
            font-size: 2rem;
        }

        .blog-post-txt h2 {
            font-size: 1.75rem;
        }

        .blog-post-txt h3 {
            font-size: 1.25rem;
        }

        .blog-post-txt p {
            font-size: 1rem;
        }

        .blog-post-txt img {
            margin: 1rem 0;
        }
    }

    .blog-post-txt h2, .blog-post-txt img {
        transition: opacity 0.5s ease;
    }

    .blog-post-txt h2.aos-animate, .blog-post-txt img.aos-animate {
        opacity: 1;
    }

    .btn-outline-dark:hover {
    color: #fff !important;
    background-color: #343a40 !important; 
    border-color: #343a40 !important;
}
.blog-post-txt ul, .blog-post-txt ol {
    margin-bottom: 10px!important;
    margin-top: 10px!important;
}
.breadcrumb-nav {
    /* position: sticky; */
    top: 76px;
    z-index: 1000;   
    text-transform: capitalize;
    background-color: #fff;
    border-radius: 0px 0px 10px 10px;
    border: 1px solid black;
    padding: 10px 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
 .blog-post-txt p {
       margin-bottom: 0px!important;
}
.blog-post-txt ul li, .blog-post-txt ol li {
    margin-bottom: 0px!important;
}
.breadcrumb-nav .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
 
.breadcrumb {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
}
 
.breadcrumb li {
    display: inline;
    color: #000;
    font-size: 14px;
}
 
.breadcrumb li a {
    color: #000;
    text-decoration: none;
    padding: 0 10px;
    position: relative;
}
 
/* Gradient underline effect */
.breadcrumb li a::after {
    content: '';
    position: absolute;
    left: 10px;
    bottom: -2px;
    width: calc(100% - 20px);
    height: 2px;
    background: linear-gradient(to right, #355ee1, #27d1e0);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}
 
.breadcrumb li a:hover::after {
    transform: scaleX(1);
}
 
.breadcrumb li + li:before {
    content: ">> ";
    color: #000;
    padding: 0 5px;
    font-weight: bold;
}
 
@media (max-width: 767.98px) {
    /* .breadcrumb-nav {
        display: none !important;
    } */
 
    page-header-area .page-header-content-inner {
            height: 300px;
        }
}
/* a {
  border: 1px solid red;
} */
