body{
    scroll-behavior: smooth !important;
}
@font-face {
    font-family: 'Inter'; 
    src: url('../fonts/Inter/Inter-VariableFont_slnt\,wght.ttf') format('truetype'); 
}
.gradient-x-overlay-lg-navy-video::before {
    z-index: 2;
    background-image: linear-gradient(to top, #00000080 100%, #07070700);
    background-repeat: repeat-x;
}
.navbar-nav-item .nav-link{
    color: rgb(255, 255, 255) !important;
}

.project-bg{
    background: linear-gradient(#F7FBFF, #DDEEFF);
}

.btn-outline-white {
    color: #ffffff !important;
    border-color: #ffffff;
}

.bg-grey-light{
    background-color: rgba(240, 242, 248, 1);
}

.text-blue-dark{
    color: #103e68;
}
.bg-blue-dark{
    background-color: #103e68;
    color: #fff;
}
.bg-blue-sky{
    background-color: #0B60AC;
    color: #fff;
}

.header-sticky-top-color {
    position: fixed;
    bottom: auto;
    top: 0;
    background-color: rgba(16, 62, 104);
}

.header{
    transition: background-color .5s ease;
}

.btn-outline-white:hover {
    color: rgba(88, 197, 231, 1) !important;
    background-color: #ffffff;
    border-color: #ffffff;
}

.navbar-nav-item .nav-link.active{
    color: rgba(88, 197, 231, 1) !important;
    font-weight: bold;
}

.text-blue-light{
    color: rgba(88, 197, 231, 1);
}

.separator {
    border-right: 1px solid white;
    margin-right: 10px; 
    padding-right: 10px; 
    height: 2rem;
}

.secure-data{
    background-image: url('../img/Groupe 4305.png');
    background-repeat: no-repeat;
    background-size: cover;
}
.carousel-indicators{
    top: 100px;
}

.carousel-indicators li {
    border-radius: 100%;
    width: 10px;
    height: 10px;
    margin-right: 3px;
    margin-left: 3px;
    background-color: #dbdbdb;
    background-clip: padding-box;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    opacity: .5;
    transition: opacity 0.6s ease;
}

.carousel-indicators li.active{
    background-color: #4ec8ee;
}

.nav-pills:not(.nav-segment) .nav-link {
    color: #103E68;
}

.nav-pills:not(.nav-segment) .nav-link:hover {
    color: #50B5D4;
    background-color: transparent !important;
    border-bottom: 3px solid #50B5D4 !important;
    border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    -ms-border-radius: 0px !important;
    -o-border-radius: 0px !important;
}

.nav-pills:not(.nav-segment) .nav-link.active {
    font-weight: bold;
    color: #50B5D4 !important;
    background-color: transparent !important;
    border-bottom: 3px solid #50B5D4 !important;
    border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    -ms-border-radius: 0px !important;
    -o-border-radius: 0px !important;
}

.navbar-vertical .navbar-nav.nav-tabs .active .nav-link, .navbar-vertical .navbar-nav.nav-tabs .active.nav-link {
    border-left-color: #0B60AC !important;
    color: #0B60AC !important;
    font-weight: bold !important;
}

.bg-footer{
    background: linear-gradient(to right, #081F34 , #0B60AC);
}

div.code-toolbar>.toolbar span:hover {
    color: #fff;
    background-color: #0B60AC;
}

.nav-segment .nav-link.active {
    color: #0b60ac;
    font-weight: bold;
    background-color: #fff;
    box-shadow: 0 3px 6px 0 rgba(140,152,164,.25);
}

.pointer{
cursor: pointer;}

@media (max-width: 575px) {

}

@media (max-width: 767px) {
    
}

@media (max-width: 991px) {
    #navBar{
        background-color: rgba(16, 62, 104);
    }
    .separator {
    border-right: 0px;
}
}

@media (max-width: 1200px) {

}

.carousel-control-next .carousel-control-next-icon{
    color: red !important;
}
.form-control-flush {
    background-color: transparent;
    border-top: none;
    border-right: none;
    border-left: none;
    box-shadow: none;
    padding-right: 0;
    padding-left: 0;
    border-radius: 0;
}
.form-control-flush:focus{
    background-color: transparent !important;
    box-shadow: none;
}
