:root{
    --fixed-margin-size: 3rem;
    font-size: 1.1rem;
    --project-btn-color-1: rgb(255, 185, 0);
    --project-btn-hover-color-1: rgba(255, 185, 0,.9);
    --project-btn-color-2: rgb(0, 255, 170);
    --project-btn-hover-color-2: rgb(85, 213, 168);
    --project-alert-bg-color: rgba(255, 0, 0, 0.75);
}
@font-face {
    font-family: 'Archivo-Bold';
    src: url('../fonts/Archivo-Bold.ttf');
}
@font-face {
    font-family: 'Archivo-SemiBold';
    src: url('../fonts/Archivo-SemiBold.ttf');
}
@font-face {
    font-family: 'Archivo-ExtraBold';
    src: url('../fonts/Archivo-ExtraBold.ttf');
}
@font-face {
    font-family: 'Archivo-Black';
    src: url('../fonts/Archivo-Black.ttf');
}
@font-face {
    font-family: 'Archivo-Medium';
    src: url('../fonts/Archivo-Medium.ttf');
}
@font-face {
    font-family: 'Archivo-Light';
    src: url('../fonts/Archivo-Light.ttf');
}
@font-face {
    font-family: 'Archivo-Regular';
    src: url('../fonts/Archivo-Regular.ttf');
}
body {
    font-family: Archivo-Regular, sans-serif;
    overflow-x: hidden;
    color: #312e2e;
}
p,a,h1,h2,h3,h4,h5,h6{
    margin: 0 !important;
}

b, strong, .fw-bold  {
    font-family: Archivo-Bold, sans-serif;
}
a {
    color: #00204c;
}
.titlebar{
    background-color: #ffb900
}
.btn-info{
    background-color: #ffb900;
    border-color: #ffb900;
    color:white;
}
.btn-info:hover{
    background-color: #00204c;
    border-color: #00204c;
    color:white;
}

.btn-danger{
    background-color: #00204c;
    border-color: #00204c;
}
.btn-danger:hover{
    background-color: #ffb900;
    border-color: #ffb900;
}
.btn-primary{
    background-color: #ffb900;
    border-color: #ffb900;
    color:white;
}
.btn-primary:hover{
    background-color: #00204c;
    border-color: #00204c;
    color:white;
}


.fmt{
   /* margin-top: var(--fixed-margin-size) !important;*/
}
.fmb{
    margin-bottom: var(--fixed-margin-size) !important;
}
.fpt{
    padding-top: var(--fixed-margin-size) !important;
}
.fpb{
    padding-bottom: var(--fixed-margin-size) !important;
}
.f-bold, .fw-bold{
    font-family: Archivo-Bold, sans-serif !important;
}
.f-ligth, .fw-light{
    font-family: Archivo-Light, sans-serif !important;
}
.font-semibold{
    font-family: Archivo-SemiBold, sans-serif !important;
}
.font-extrabold{
    font-family: Archivo-ExtraBold, sans-serif !important;
}
.font-black{
    font-family: Archivo-Black, sans-serif !important;
}
.font-medium{
    font-family: Archivo-Medium, sans-serif !important;
}
.color-unset{
    color:unset;
}
.btn-custom-1 {
    --bs-btn-color: #00183c;
    --bs-btn-bg: var(--project-btn-color-1);
    --bs-btn-border-color: var(--project-btn-color-1);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg:var(--project-btn-hover-color-1);
    --bs-btn-hover-border-color: var(--project-btn-hover-color-1);
    --bs-btn-focus-shadow-rgb: 77,43,138;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--project-btn-color-1);
    --bs-btn-active-border-color: var(--project-btn-color-1);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(77,43,138, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--project-btn-color-1);
    --bs-btn-disabled-border-color: var(--project-btn-color-1);
}
.btn-outline-custom-1 {
    --bs-btn-color: var(--project-btn-color-1);
    --bs-btn-border-color: var(--project-btn-color-1);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--project-btn-color-1);
    --bs-btn-hover-border-color: var(--project-btn-color-1);
    --bs-btn-focus-shadow-rgb: 13, 110, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--project-btn-color-1);
    --bs-btn-active-border-color: var(--project-btn-color-1);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--project-btn-color-1);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--project-btn-color-1);
    --bs-gradient: none;
}
.btn-custom-2 {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--project-btn-color-2);
    --bs-btn-border-color: var(--project-btn-color-2);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg:var(--project-btn-hover-color-2);
    --bs-btn-hover-border-color: var(--project-btn-hover-color-2);
    --bs-btn-focus-shadow-rgb: 77,43,138;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--project-btn-color-2);
    --bs-btn-active-border-color: var(--project-btn-color-2);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(77,43,138, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--project-btn-color-2);
    --bs-btn-disabled-border-color: var(--project-btn-color-2);
}
.btn-outline-custom-2 {
    --bs-btn-color: var(--project-btn-color-2);
    --bs-btn-border-color: var(--project-btn-color-2);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--project-btn-color-2);
    --bs-btn-hover-border-color: var(--project-btn-color-2);
    --bs-btn-focus-shadow-rgb: 13, 110, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--project-btn-color-2);
    --bs-btn-active-border-color: var(--project-btn-color-2);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--project-btn-color-2);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--project-btn-color-2);
    --bs-gradient: none;
}
.custom-alert-1 {
    --bs-alert-color: white;
    --bs-alert-bg: var(--project-alert-bg-color);
    --bs-alert-border-color: var(--project-alert-bg-color);
    --bs-alert-link-color: white;
    font-family: Archivo-Bold, sans-serif;
}
.text-line-1 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1; /* number of lines to show */
    line-clamp: 1;
    -webkit-box-orient: vertical;
}
.text-line-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* number of lines to show */
    line-clamp: 2;
    -webkit-box-orient: vertical;
}
.text-line-3 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* number of lines to show */
    line-clamp: 3;
    -webkit-box-orient: vertical;
}
.text-line-4 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4; /* number of lines to show */
    line-clamp: 4;
    -webkit-box-orient: vertical;
}

/*** INDEX START ***/
.main-container{
    background-image: url("../images/v2/main-bg2.png");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    padding-bottom: 75px;
    border-bottom: 1px solid white;
}

.header-top-btn-box{
    color: white;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.header-top-btn-box a{
    width: max-content;
}
.header-top-btn-box a:hover{
    color:#ffb900;
}
.main-container .main-sub-title{
    color: #ffb900;
}
.main-container .main-title{
    font-size: 3.5rem;
}
.main-container .main-text-small-box{
    background-color: #ffb900;
    width: 60px;
    height: 15px;
    border-radius: 50px;
    display: block;
    margin-top: 5px;
}
.swiper-button-next-custom{
    right: -30px;
    font-size: 1.5rem;
    color: #01285f;
}
.swiper-button-prev-custom{
    left: -30px;
    font-size: 1.5rem;
    color: #01285f;
}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after, .swiper-button-next:after, .swiper-rtl .swiper-button-next:after {
    content: '';
}
.ongoing-project-container{
    color: #01285f;
    padding-top: 30px;
    padding-bottom: 80px;
    background-image: url("../images/v2/ongoing-projects.jpg");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}
.ongoing-project-container .ongoing-project-top-border{
    border-top: 1px solid #01285f;
}
.ongoing-project-item-box{
    background-color: #ffffff;
    padding: 1.5rem;
    text-align: center;
    height: 260px !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
}
.ongoing-project-item-box:hover{
    background-color: #00204c;
    color: white;
}

.project-categories-container{
    background-color: #01285f;
    color: white;
    padding-top: 30px;
    padding-bottom: 80px;
}
.project-categories-container .project-categories-top-border{
    border-top: 1px solid white;
}
.project-categories-item-box{
    background-color: #00183c;
    padding: 1.5rem;
    text-align: center;
    height: 400px !important;
    border: 1px solid #2d415e;
}

.project-categories-item-box a{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: column;
}
.project-categories-item-box:hover{
    background-color: #ffffff;
    color: #00183c;
}
.swiper-button-next-custom-categories{
    right: -30px;
    font-size: 1.5rem;
    color: white;
}
.swiper-button-prev-custom-categories{
    left: -30px;
    font-size: 1.5rem;
    color: white;
}

.other-project-container{
    color: #00204d;
    padding-top: 30px;
    padding-bottom: 80px;
    background-image: url("../images/v2/other-network.png");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}
.other-project-container .other-project-top-border{
    border-top: 1px solid #0D285F;
}
.other-project-item-box{
    background-color: #00204d;
    color: white;
    padding: 1.5rem;
    text-align: center;
    height: 300px !important;
}
.other-project-item-box a{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: column;
}
.other-project-item-box:hover{
    color: #00204d;
    background-color: white;
}
.swiper-button-next-custom-other-categories{
    right: -30px;
    font-size: 1.5rem;
    color: #00204d;
}
.swiper-button-prev-custom-other-categories{
    left: -30px;
    font-size: 1.5rem;
    color: #00204d;
}
/*** INDEX END ***/
/*** HEADER START ***/
header nav{
    background-color: #00204c;
    font-family: Archivo-SemiBold, sans-serif;
}
header .nav-link{
    color: white;
}
header .nav-link:hover{
    color: #ffb900;
}
header .navbar-nav .nav-item:not(:last-child) {
    border-right: 2px solid white;
}
header .navbar-nav .nav-item:last-child {
    padding-right: 0 !important;
}
header .navbar-nav {
    --bs-nav-link-padding-y: 0;
}

/*** HEADER END ***/


/*** FOOTER START ***/
footer{
    color: #01285f;
    padding-top: 100px;
    padding-bottom: 100px;
    background-image: url("../images/v2/footer-bg.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
footer a {
    color:unset;
    /*text-decoration: none;*/
}
footer ul {
   list-style: none;
}
footer li {
    padding: 0vw 1vw;
    margin: 0 0 1.2vw 0;
    float: left;
    border-right: 1px solid #01285f;
}
footer h1{
    font-size: 4rem;
    padding-top: 25px;
}
footer h3{
    color: #137b71;
    padding-bottom: 75px;
}
/*** FOOTER END ***/


/*Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) {
    .main-container .main-title {
        font-size: 2.5rem;
    }
    .main-container{
        padding-bottom: 100px;
    }
    footer h1{
        font-size: 3rem;
    }
    footer li {
        border-right: unset;
    }
    footer{
        padding-top: 50px;
        background-position: bottom center;
    }
    footer ul{
        padding: 0;
        margin: 0;
    }
}

.image_full{
   display:block;
  }

 .image_mobile{
  display:none;
 }


@media (max-width: 576px) {
  .image_full{
   display:none;
  }

  .image_mobile{
   display:block;
  }
}


/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767.98px) {

.image_full{
   display:none;
  }

  .image_mobile{
   display:block;
  }

}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) {
    .main-container{
        padding-bottom: 100px;
    }
    footer{
        padding-top: 50px;
    }

.image_full{
   display:none;
  }

  .image_mobile{
   display:block;
  }


}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1199.98px) {
    footer{
        padding-top: 75px;
    }
}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {

}