/*====================================================================
   Custom CSS File for most of Desktop and Mobile look for Kipya Template
   Developed by Amazing LWEGATECH LTD team.
===================================================================**/
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-weight: 300;
    position: relative;
    font-family: 'Poppins', sans-serif;
}

body {
    overflow-x: hidden;
}
/*---------MENU - Transparent -----------*/
.menu ul{display: inline-flex;gap: 40px;padding-right: 2rem;align-items: center;list-style: none}
.menu .menu-item-has-children .sub-menu{display: block;width: auto;border: none;color:#12182d;border-radius: 0px;
    background-color: #fff;}
.d-telephone i { font-size: 24px; border: 3px solid;border-radius: 50%;color: #fff;padding: 6px 10px;background: #223f99;margin-right: 10px;}
.d-telephone p {  float: right; color: #fff; font-weight: 600;}
.d-telephone p span {font-weight: 100;font-size: 13px;}
h1.entry-title{color: #fff;font-weight: 700;}

/*---------None-transparent-----------*/
.wrapper .navbar {
    width: 100%;
    background: #fff;
    border-bottom: 6px solid;
    border-color: #223f99;
}
.wrapper .navbar ul li a{
    color: #111 !important;
}
.wrapper .navbar .container-fluid .img-fluid img {
    width: 100px;
    margin-top: -10px !important;
    margin-left: 52px;
}
.wrapper .navbar ul li p {
    color: #111;
}
.wrapper .navbar ul li span {
    font-weight: 300;
}
.wrapper .navbar-nav .nav-item .activ{
    color: #223f99 !important;
    font-weight: 900 !important;
}
.navbar {
    position: fixed !important;
    top: 0px !important;
    z-index: 999;
    width: 100%;
}

.navbar .container-fluid .img-fluid img {
    width: 150px;
    margin-top: -10px !important;
    margin-left: 52px;
}

.navbar .container-fluid .btn {
    outline: none !important;
    border: none;
}

.navbar .navbar-nav {
    gap: 46px;
    align-items: center;
    padding-right: 2rem;
    margin: 0 auto;
}
.navbar-nav .nav-item .active{
    font-weight: 900 !important;
    color: #EAD268 !important;
}
.navbar ul li a {
    color: #fff;
    border-top: 4px solid;
    border-color: transparent;
}
.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    background-color: #223f99 !important;
}
.navbar .nav-link:focus-visible {
    border-top: 2px solid;
    border-color: transparent;
}

.navbar a:hover {
    border-color: #223f99;
    color: #223f99;
    transition: 0.9s;
}


.navbar-expand-lg .navbar-nav .dropdown-menu {
    width: 300px;
    border: none;
    border-radius: 0px;
    background-color: #fff;
}

.navbar-expand-lg .navbar-nav .dropdown-menu .dropdown-item {
    border-top: 1px solid;
    padding: 10px;
    font-weight: 300;
    padding-left: 30px;
    transition: 0.2s;
    color: #111 ;
    border-color: rgb(109, 107, 107);
}

.navbar-expand-lg .navbar-nav .dropdown-menu .no-border {
    border-top: none;
}

.navbar-expand-lg .navbar-nav .dropdown-menu .dropdown-item:hover {
    color: #fff !important;
    background-color: #223f99;
    border: none;
}

.navbar-expand-lg .navbar-nav .dropdown-menu .dropdown-item:active {
    color: #fff;
    background-color: #223f99 !important;
    border: none;
}
.d-telephone {
    margin-bottom: -25px;
}

/*
|============
|   Breadcrumbs 
|============
*/
.header-section {
  background-image: linear-gradient(rgb(0 0 0 / 50%), rgb(0 0 0 / 50%)), url(images/bread-img.jpg);
  padding: 140px 0;
  background-repeat: no-repeat;
  background-size: cover;
  margin-top: 50px;
  padding-bottom: 50px;
  position: relative;
}
.sub-header-content {
  color: #fff;
}
.sub-header-content .subtitle-nav{
    float: left;
}

.sub-header-content .subpage-nav {
  text-align: right !important;
  margin-top: 10px;
 float: right;
}
.sub-header-content .breadcrumb {
  background-color: transparent;
  justify-content: end;
}
.sub-header-content .breadcrumb li:after{
  padding: 8px;
  content: "/\00a0";
}
.sub-header-content .breadcrumb li:last-child:after{
    content:"";
}
.sub-header-content .breadcrumb li a {
  font-weight: 600;
  color: #fff;
  text-decoration: none;
}
.sub-header-content .breadcrumb > .active {
  color: #fff;
  opacity: 0.8;
}
.dropdown:hover>.dropdown-menu {
    display: block;
}

.navbar .offcanvas {
    width: 80% !important;
    height: 434px;
}

.carousel-inner .carousel-item img {
    filter: contrast(0.5);
    object-fit: cover;
    height: 42rem;
}

.carousel-inner .carousel-caption {
    text-align: start;
}

.carousel-inner .carousel-item h5 {
    font-size: 3.25rem;
    font-weight: 900;
}

.carousel-inner .carousel-caption p {
    font-size: 22px;
    font-weight: 200;
}

.carousel-inner .carousel-caption .btn {
    color: #fff;
    border: transpareant;
    background: #223f99;
    border-radius: 45px;
    padding: 15px;
}

.carousel-inner .carousel-caption .btn:hover {
    color: #223f99;
    background: #fff;
}

.about-section {
    padding: 30px 2px 30px 2px;
}

.about-section img {
    height: 100%;
    object-fit: cover;
}

.about-section h1 {
    color: #223f99;
    font-size: 40px;
    font-weight: 800;
}

.about-section p {
    margin-top: 40px;
}

.about-section .btn {
    color: #fff;
    border: transparent;
    background: #223f99;
    border-radius: 13px;
    padding: 8px;
}

.about-section .btn:hover {
    opacity: 0.9;
    color: #fff;
    background: #223f99;
}

.about-section .btn:focus {
    opacity: 0.9;
    color: #fff;
    background: #223f99;
}

/*ABOUT PAGE*/
.about-container {
    padding: 51px 2px 64px 2px;
}

.about-container img {
    height: 100%;
    object-fit: cover;
}

.about-container h1 {
    color: #223f99;
    font-size: 40px;
    font-weight: 900;
     margin-bottom: 40px;
}
.about-container h3, .about-container h4 {
    color: #223f99;
    font-weight: 700;
}
 .about-details{
    background-image: url(../images/about-back-img.svg);
 }
  .about-details h1{
    text-align: center;
    color: #223f99;
    font-weight: 900;
    margin-bottom: 50px;
 }
.about-details .row{
    margin: 30px 35px 30px 45px;
 }
.about-details .card{
    margin: 2px 3px 30px 2px;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    border: none;
    border-radius: 30px;
    text-align: center;
}
.about-details .middle{
    text-align: left;
}
.about-details .card .card-img{
    text-align: center;
    padding: 20px 10px 20px 10px;
}
.about-details .card .card-img img{
    width: auto;
    height: auto;
}
.about-details i{
    font-size: 50px;
    text-align: center;
    align-self: center;
    background: #223f991f;
    padding: 13px;
    color: #223f99;
    width: 90px;
    border-radius: 32px;
    margin: 35px 0px 10px 0px;
}
.about-details h4{
    color: #223f99;
    font-weight: 900;
    margin-bottom: 1rem;
}
.about-details ul li{
    list-style: none;
    text-align: left;
    margin-bottom: 0.6rem;
}
.about-details ul li strong{font-weight: 600;}
.about-details ul li::before{
    font-family: FontAwesome;
    content: '✓';
    color: #223f99;
    display: inline-block;
    vertical-align: middle;
    font-weight: 900;
    margin-right: 1rem;
}

.services {
    padding: 40px;
    background-image: linear-gradient(336deg, #223f99, #12182d);
}

.services h1 {
    color: #fff;
    text-align: center;
    font-weight: 900;
    padding-bottom: 25px;
}

.services .row {
    justify-content: center;
    text-decoration: none;
    color: #fff;
}

.services .card {
    width: 400px;
    border: 1px solid;
    border-color: #ffffff36;
    margin: 16px 127px 0px 37px;
    border-radius: 3px;
    background: transparent;
    color: #fff;
}

.services .card:hover {
    background: #fff;
    color: #223f99;
    transition: 0.5s;
}
.services .card:hover> .row {
    background: #fff;
    color: #223f99;
}
.services .card .img-fluid {
    height: 100%;
    object-fit: cover;
}

.services .card h5 {
    font-weight: 900;
}

.services .card p {
    font-size: 15px
}
.services-btn{
    text-align: center;
    padding-top:30px;
}
.services .btn {
    border-color: #fff;
    color: #fff;
    font-size: 20px;
}
.services .btn:active, .services .btn:focus, .services .btn:hover {
    background: #fff;
    color: #223f99;
    transition: 0.5s;
}
.service-wrap{
    margin: 50px 2px 50px 2px;
    font-size: 15px;
}

.service-wrap img{
    width: 100%;
    height: 400px;
    object-fit: cover;
}
.shadow{
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
.service-wrap h2{
    color: #223f99;
    text-transform: uppercase;
    font-weight: 800;
}
.detail-content h3{
    color: #223f99;
}
.detail-content ul li{
    list-style: none;
    line-height: 1.5rem;
    padding-bottom: 10px;
}
.detail-content ul li::before{
    font-family: FontAwesome;
    content: "\f04b";
    display: inline-block;
    vertical-align: middle;
    font-weight: 900;
    margin-right: 1rem;
    color: #223f99;
}
.detail-content em{
    font-weight: bold;
    font-size: 14px;
}

/*---------Why Us-----------*/
.why-wrap{
    margin: 50px 2px 50px 2px;
    font-size: 15px;
}
.why-wrap .row{
    --bs-gutter-x: 0rem !important;
}
.why-wrap img{
    width: 100%;
    height: 450px;
    object-fit: cover;
}
.why-wrap h2{
    color: #223f99;
    text-transform: uppercase;
    font-weight: 800;
}

.why-wrap .col-1{
    background: #223f9924;
    padding: 40px 5px 20px 21px;
    border-top-left-radius: 70px;
}
.why-wrap .col-2{
    background: #223f99;
    color: #fff;
    margin-top: -111px;
    padding: 40px 5px 2px 21px;
    border-bottom-right-radius: 70px;
}
.why-wrap .col-1:hover,
.why-wrap .col-2:hover{
    background: #111;
    color: #fff;
    transition: 0.5s;
}
/** ==========================================================
Upcoming Events
===========================================================**/
.upcoming-events{background-color: rgba(101, 93, 93, 0.05);padding:30px 15px;}
.upcoming-events h2{color: #223F99;font-weight: 600;margin-bottom: 20px;}
.kpy_event{align-self: center;margin-bottom: 10px;background-color: #fff;}
.kpy_event img{max-height: 80px; width: auto;border-radius: 50%;}
.kpy_event .kpy_dm{background-image: linear-gradient(to bottom, #223F99, #127A00); color: #fff;text-align: center;padding:5px;border-radius: 15px;}
.kpy_dm .date{font-weight: 700;font-size: 30px;display: block;margin-bottom: -10px;margin-top: -5px;}
.kpy_dm .month{font-weight: 400;font-size: 12px;display: block;margin-bottom: 5px;}
.kpy_event h2{font-weight: 600;font-size: 20px;color: #333 !important;}
.kpy_event .location{color: #666 !important;font-size: 11px;display: -webkit-box; -webkit-line-clamp: 3;  -webkit-box-orient: vertical;  overflow: hidden;}
.kpy_event .location i{font-weight: 700 !important;color:#223F99}
.kpy_event .time{color: #444 !important;font-size: 14px;}
.kpy_event .time i{font-weight: 700 !important;color:#223F99}
.kpy_event .link i{font-weight: 700 !important;color:#223F99}

/** ==========================================================
Services Pages
===========================================================**/
.services-section{margin-top: 30px;margin-bottom: 30px;}
.services-section h1, h2,h3,h4{font-weight: 700 !important;}
.services-section li{margin-bottom: 10px;}
.services-section strong{font-weight: 500;}
.sidemenu  h3{font-weight: 600;font-size: 22px;}
.sidemenu ul{list-style-type: none;padding-left: 0px;}
.sidemenu li{background-color: #223f99;border-left:5px solid #EFBB56;padding-left: 10px;line-height: 40px;}
.sidemenu li a{color: #fff;}
.sidemenu li a:focus{color:#223f99}
.sidemenu li:hover{background-color: #FBF084;border-left:5px solid #223f99;color:#223f99;}
.sidemenu li a:hover{color: #223f99;}
.sidemenu li a:active{background-color: #847705;border-left:5px solid #223f99;color:#223f99;}

/*---------Portfolio-----------*/
.portfolio .social i {
    font-size: 16px;
    border-radius: 50%;
    padding: 5px 9px;
    color: #fff;
    margin-right: 10px;
    margin-top: 45px;
}
.portfolio .social a {
    margin-top: 45px;
}
.portfolio .bi-linkedin {
    background-color: #223f99;
}

.portfolio .bi-envelope-fill {
    background-color: #7e2a12ba;
}

.portfolio .bi-twitter {
    background-color: #223f99;
}

.portfolio .bi-telephone-fill {
    background-color: #008000;
}

.portfolio .social i:hover {
    opacity: 0.5;
}
.portfolio .row{
    margin: 50px 0px 30px 0px !important;
}
.portfolio .row img{
    width: 100%;
    height: 227px;
    object-fit: cover;
}
.portfolio .row h5{
    color: #223f99;
    font-weight: 700;
} 
.portfolio .row h6{
    font-size: 18px;
} 
.contact{
    padding: 60px 0px 60px 0px;
}

.contact .card{
    border-top: 7px solid;
    border-top-color: #223f99;
    text-align: center;
}
.contact .card i{
    font-size: 70px;
}
.contact h1{
    color: #223f99;
    padding-bottom: 20px;
}
.contact h5{
    color: #223f99;
}
.contact span{
    font-weight: 600;
}.service-wrap{
   padding:20px 5px 40px 5px;
}
.service-wrap .card img{
    max-height: 300px;
    object-fit:cover;
} 
.service-wrap .card h5{
    color: #223f99;
    font-weight: 800;
}
.service-wrap .card .button{
    text-align: end;
    margin-right: 10px;
    margin-bottom: 6px;
}
.service-wrap .card .btn{
    color: #fff;
    border: transparent;
    background: #223f99;
    border-radius: 13px;
    padding: 8px;
}

.document-section h1 {
    text-align: center;
    font-weight: 900;
    padding-bottom: 25px;
    color: #223f99;
}
.document-section a {
    font-weight: 600;
}
footer {
    background-image: linear-gradient(rgb(0 0 0), rgb(0 0 0 / 75%)), url(images/footer-bg.jpg);
    background-position: center;
    background-size: cover;
    color: #fff;
    overflow: hidden;
    background-repeat: no-repeat;
}

footer span {
    font-size: 20px;
}

footer .container {
    padding: 69px 5px 74px 5px;
}

footer h4 {
    font-weight: 900;
    margin-bottom: 23px;
    color: #223f99;
}
footer h4:after {
    content: "";
    display: block;
    margin: auto;
    width: 27%;
    border-bottom: 2px solid;
    border-bottom-color: #d70e0e;
    margin-left: 0px;
}

footer .social{
    text-align: center;
}
footer .social i {
    font-size: 15px;
    border: 1px solid;
    border-radius: 50%;
    padding: 5px 9px;
    color: #fff;
    margin-right: 10px;
}

footer .bi-facebook {
    background-color: #223f99;
}

footer .bi-envelope-fill {
    background-color: #f00;
}

footer .bi-twitter {
    background-color: #223f99;
}

footer .bi-telephone-fill {
    background-color: #008000;
}

footer .social i:hover {
    opacity: 0.5;
}

footer ul li a {
    text-decoration: none;
    line-height: 45px;
    font-size: 14px;
    color: #bbb;
    letter-spacing: 2px;
}

footer ul li {
    list-style: none;
}

footer .rights {
    text-align: center;
    padding-bottom: 30px;
    opacity: 0.6;
}




/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/
/*----Navbar-----*/
@media (max-width:991px) {
    .navbar .navbar-nav {
        gap: 5px !important;
    }

    .navbar .nav-link:active,
    :focus-visible {
        color: #223f99 !important;
        opacity: 0.9 !important;
    }

    .navbar-expand-lg .navbar-nav .dropdown-menu {
        width: 100% !important;
    }

    .navbar-expand-lg .navbar-nav .dropdown-menu .dropdown-item {
        color: #223f99 !important;
        border-color: #223f99;
    }
    .navbar-expand-lg .navbar-nav .dropdown-menu .no-border {
        border-top: 1px solid;
        border-color: #223f99;
    }
        .navbar-expand-lg .navbar-nav .dropdown-menu .b-border {
        border-bottom: 1px solid;
        border-color: #223f99;
    }

    .navbar .container-fluid .img-fluid img {
        margin-left: 0px !important;
    }
    .navbar ul li a {
    border-top: none;
}
    .navbar .navbar-nav{
      align-items: initial;
      padding-right: unset;
    }
    .dropdown-toggle::after{
        float: right;
    }
}

/*-------button-------*/
@media (min-width:991px) {
    .navbar .container-fluid .btn {
        display: none;
    }
}

/* responsive slider */
@media (max-width:786px) {
    .carousel-inner .carousel-item img {
        height: 30rem;
    }
}

@media (max-width:428px) {
    .carousel-inner .carousel-item img {
        height: 28rem;
    }
}


.carousel-inner .carousel-item .carousel-caption {
    width: 550px;
    padding-bottom: 50px;
}

@media (max-width: 658px) {
    .carousel-inner .carousel-item .carousel-caption {
        width: 16.5rem;
        height: 17rem;
        font-size: 12px;
    }
}

/*----Telephone----*/
@media (max-width:1149px) {
    .d-telephone {
        font-size: 11px;
    }
}

@media (max-width:1149px) {
    .d-telephone {
        display: none;
    }
}

@media (max-width:991px) {
    .d-telephone {
        display: block;
    }
}

/*-------Caption-------*/
@media (max-width:666px) {
    .carousel-inner .carousel-item .carousel-caption {
        padding-bottom: 0px !important;
    }
}

@media (max-width:658px) {
    .carousel-inner .carousel-item .carousel-caption {
        width: auto !important;
        height: auto !important;
    }

    .carousel-inner .carousel-item h5 {
        font-size: 2.25rem !important;
    }

    .carousel-inner .carousel-caption p {
        font-size: 20px !important;
    }
}

/*-----Button slider-----*/
@media (max-width:591px) {
    .carousel-inner .carousel-caption .btn {
        padding: 8px !important;
        margin-top: 36px !important;
        margin-bottom: 31px !important;
    }
}

@media (max-width:483px) {
    .carousel-inner .carousel-caption .btn {
        padding: 7px !important;
        margin-top: 10px !important;
        margin-bottom: 31px !important;
    }
    h1.entry-title {
        color: #fff;
        font-weight: 700;
        top: 150px;
        text-align: center;
    }
}

/*--------About--------*/
@media (max-width:767px) {
    .about-section {
        padding: 18px 0px 45px 0px !important;
        width: 100% !important;
    }
}

@media (max-width:1195px) {
    .about-section h1 {
        font-size: 47px !important;
    }
}
@media (max-width:1105px) {
    .about-section h1 {
        font-size: 35px !important;
    }
}
@media (max-width: 1026px){
    .about-details .row .col-md-3, .about-details .row .col-md-5{
    width: 100%;
 }
}
@media (max-width: 654px){
    .about-details .row {
    margin: 0px;
}
}
/*--------Services--------*/
@media (max-width:1207px) {
    .services .card {
        width: 399px !important;
    }
}

@media (max-width:1205px) {
    .services .card {
        width: 398px !important;
    }
}

@media (max-width:1199px) {
    .services .card {
        width: 316px !important;
    }
}

@media (max-width:1039px) {
    .services .card {
        width: 315px !important;
    }
}

@media (max-width:1037px) {
    .services .card {
        width: 313px !important;
    }
}

@media (max-width:1033px) {
    .services .card {
        width: 292px !important;
    }

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

@media (max-width:991px) {
    .services .card {
        width: 100% !important;
    }

    .services .card p {
        font-size: 15px;
    }

    .services .card .img-fluid {
        width: 100% !important;
        height: 145px !important;
        object-fit: cover !important;
    }
        .service-content .row{
    flex-direction: column-reverse !important;
}
    .navbar .offcanvas .nav-link {
        color: #223f99 !important;
        text-transform: uppercase;
        margin-bottom: 10px;
    }
}

@media (max-width:935px) {
    .services .card {
        margin-left: 100px;
    }
}

/*------Footer-------*/
@media(max-width:767px) {
    footer {
        text-align: center;
    }

    footer h4 {
        padding-top: 35px;
    }

    footer .container {
        padding: 0px;
    }
    footer h4:after {
    content: "";
    display: block;
    margin-left: auto !important;
    width: 27%;
}
}
@media (max-width:559px){
    footer h4:after {
    content: "";
    display: block;
    margin-left: auto !important;
    width: 10%;
}
}
/*----------Breadcrumbs-----------*/
@media (max-width:805px){
    .sub-header-content .subpage-nav {
        display: none;
}
}
/*----------Contact-------------*/
@media (max-width: 575px){
    .contact .card{
        margin-top: 30px;
}
}
/*-------------Portifolio--------------*/
@media (max-width: 575px){
    .portfolio .reverse .row{
    flex-direction: column-reverse !important;
}
}
/*----------Why Us-----------*/
@media (max-width: 1199px){
    .why-wrap .col-2{
        margin-top: -209px !important;
}
}
@media (max-width: 991px){
    .why-wrap .col-1,
    .why-wrap .col-2{
        width: 100% !important;
}
    .why-wrap .col-1{
        margin-bottom: 20px;
    }
    .why-wrap .col-2{
        margin-top: 20px !important;
    }
    .why-wrap .row{
       margin-top: 25px;
    }
    .why-wrap img {
      height: auto;
      object-fit: unset;
      border-radius: 12px;
    }
    .why-wrap .col-2{
    background: #223f9924;
    color: #111;
    }
}