.header-banner-home {
    min-height:200px;
/*     background-image: url('https://www.adalta.be/_site/images/background/login0.png');
    background-image: url('https://images.unsplash.com/photo-1634928383272-fb29837c6003?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1170&q=80%27');
    background-size: cover;
  */  
    background-color: #343a40  ;
    padding:40px 40px 0px 40px;
    margin-left: -40px;
    margin-right: -40px;
    margin-top:-30px;
    margin-bottom:40px;
}
.works-title {
    padding-bottom:8px;
}
.works-title a, .works-title span {
    font-size: 24px;
    color:#109cb5;


}
.works-image img {
    border: 1px solid #dddddd;
}

.header-banner h1, .header-banner p {
    color:#ffffff;  
}

.bg-white {
    background: #ffffff;
    
}

.bg-grey {
    background: #f5f5f5;
    
}



.btn-shadowed {
box-shadow: 0px 5px 0px 0px rgba(41, 47, 67, 0.5);
}

.btn.btn-primary {

    border-color: #232839;
    background: #292f43;
    color: #FFF;

}
.btn.btn-lg {

    padding: 10px 30px;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 600;

}

.text-center {
    text-align: center;
}
.text-uppercase {
    text-transform: uppercase !important;
}

/*====================================
Titles
======================================*/
img {

    vertical-align: middle;
    max-width: 99%;

}
p {
    /* font-family: "Open Sans", sans-serif; */
    
}
div {
    /* font-family: "Open Sans", sans-serif; */
    
}
h1, h2, h3, h4, h5, h6 {

    /*font-family: "Open Sans", sans-serif;*/
    width: 100%;
    padding: 0px;
    font-weight: 300;
    margin: 0px 0px 10px;
    

}

h1 {

    font-size: 36px;
    line-height: 50px;
    font-weight: 300;
    color: #0077b6;

}

h3 {

    font-size: 28px;
    line-height: 40px;
    color: #0077b6;

}

h4 {

    font-size: 18px;
    /* line-height: 40px; */
    color: #666666;
    line-height: 1.5;

}

.invert h1, .invert h2, .invert h3, .invert h4, .invert h5, .invert h6 {

    color: #FFF;

}

.container-fluid {
    z-index:100000;
}

/*===============================

Heading Wrapper
=================================*/

.container-grey {
 margin-top:30px;
}

.container-white {
    background-color: white;
    margin:-30px -30px -30px -30px;
}

.container-dark {
    background-color: 1d3557;
    margin:-30px -30px -30px -30px;
}

.heading-wrapper {

 font-family: "Open Sans", sans-serif;
    width: 100%;
    margin-bottom: 20px;

}
.above-heading {

    text-transform: uppercase;
    margin-top: 0px;
    margin-bottom: 5px;
    font-size: 13px;
    font-weight: 600;

}
.under-heading, .above-heading {

    width: 100%;
    color: #7F8FA4;
    font-size: 15px;
    line-height: 20px;
    margin-top: 0px;
    margin-bottom: 20px;
    font-weight: 300;

}

/*================================
navbar top
==================================*/
.navbar-top {
     background: #f2f4f8 ;
    padding-top:8px; 
    padding-bottom:15px;
    margin-top: 35px;
}

.navbar-expand-lg .navbar-nav .nav-link {

    padding-right: .8rem;
    padding-left: .8rem;
    padding-top:10px;



    margin-left: auto !important;


}

.navbar-nav > li {

    position: relative;
    display: block;
    float: left;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 20px;
    padding: 0px 15 0px 15px;
    
    text-decoration: none;
    color: #FFF;


}

/*==================================
Sections
====================================*/
.section {

    float: left;
    width: 100%;
    background: #fff;
    padding: 80px 0px;
    overflow-x: hidden;
    margin-left: -40px;
    margin-right: -40px;

}

.section-small {

    float: left;
    width: 100%;
    background: #fff;
    padding: 30px 0px;
    overflow-x: hidden;

}

.section.section-highlight, .section-small.section-highlight {

    background: #f5f5f5;

}

.section.invert {

    background: #0e1721;

}
.section.invert > p {

    background: #0e1721;
    color:#fff;

}

.invert {

    color: #F0F0F0;

}

.app-footer.app-footer-default {

    background: #112035;
    color: #80909A;
    font-size: 13px;

}

.app-footer {

    float: left;
    width: 100%;

}
.app-footer.app-footer-default .app-footer-line.darken {

    background: #112035;

}

.app-footer .app-footer-line {

    float: left;
    width: 100%;
    padding: 10px;

}

.check-line {
    text-indent: -32px;
    margin-left: 50px;
}
.check-icon {
    
    padding-right: 8px;
    font-size:20px;
    color:#32CD32;
}

.icon-bicolor {
    font-size:20px;
    /*color:#32CD32;*/
    --fa-primary-color: red;
    --fa-secondary-color: gold;
    --fa-secondary-opacity: 1.0;
    
}

/*==================================
Animation image home
====================================*/


@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

.this-animate.this-animated {

    opacity: 1;

}
.animated {

    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;

}

/*============================================
Color palette

https://coolors.co/e63946-f1faee-a8dadc-457b9d-0f1d30

==============================================*/
.color-red {
    color:#e63946;
}

.color-smokewhite {
    color:#f1faee;
}

.color-smokeWhite {
    color:#f1faee;
}

.color-lightBlue {
    color:#a8dadc;
}

.color-greyBlue {
    color:#1d3557;
}

.color-greyBlue-dark {
    color:#0f1d30;
}

.color-mauve {
    color:#540d6e;
}
.color-orange {
    color:#f28100;
}
.color-green {
    color:#00af4c;
}



/*=============================================
Form bootstrap
==============================================*/

form label {

    color: #0077b6;
}
.field-error .control-label,
.field-error .help-block,
.field-error .form-control-feedback {
    color: #e62739;
}

.field-success .control-label,
.field-success .help-block,
.field-success .form-control-feedback {
    color: #2780e3;
}

.has-feedback label ~ .form-control-feedback {
    top: 30px;
}

.form-horizontal .has-feedback .form-control-feedback {

    right: 25px;
    

}

.has-feedback {

    position: relative;

}

.form-control-feedback {

    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    display: block;
    
    line-height: 34px;
    text-align: center;
    pointer-events: none;

}


.nav-top-info-left {
    float:left;
    color:white;
}

.nav-top-color {
    color:#2bb0fd;
}

.nav-top-color > a {
    color:#2bb0fd;
}

.nav-top-info-right {
    float:right;
    color:white;
}

/*============================
ATOLL
==============================*/
.sidenav-icon {
    font-style: normal;
    line-height: 25px;
    font-size: 18px;
    /* color:#666666;*/
    text-align: center;
    width: 30px;
    display: inline-block;
}



/*
#sidebarnav {
    background-color: #454f53;
}
.left-sidebar {
    background-color: #454f53;
}
*/
.item-check-icon {
    color: green;
    padding-left:10px;
}

.item-check-text {
    color: #444444;
    padding-left:10px;
}

.item-check-icon {
    color: green;
    padding-left:10px;
}


/*================================
CARD
==================================*/
.card-title-icon {
    
    padding-left:10px;
    font-size:2.6em;
}


.card-title-text {
    
    padding-left:10px;
    text-transform: uppercase;
    font-size:1.4em;
    
}

.card-sub-title-center {
    color: #000;
    font-size: 1.2em;
    text-align: center;
    display: block;
}

.card-title-center {
    text-align: center;
    display: block;
}

.card-body-center {
    text-align: center;
    display: block;
}
.card-body-center p {
    padding: 10px 20px;
}

/*======================
CARD DARK
=========================*/
#card-dark {
    
    background-color: #0e1721;
}

#card-dark h3, #card-dark h6, #card-dark .above-heading, #card-dark p {
    color:#fff;
}

#card-dark h6 {
    padding-top:20px;
}

#card-dark .border {
    
    border: 1px solid #7F8FA4 !important;
}

#card-dark .card {
    background-color: #0e1721;
}

/*================================
Block Address Top
===================================*/
.topbar {
    padding-top: 40px;
}
.left-sidebar {
    margin-top:40px;
}
.page-wrapper {
    margin-top:40px;
}
@media (max-width: 875px) {
    #block-atoll-topNavbar {
        visibility: hidden;
    }

    .topbar {
        padding-top: 0px;
    }

    .left-sidebar {
        margin-top:0px;
    }

    .page-wrapper {
        margin-top:0px;
    }
}

@media (max-width: 875px) {
    h1 {
        font-size: 26px;
        line-height: 35px;
    }
}