body, html{
  font-family: 'Montserrat';
  overflow-x: hidden;
}

.header-dark {
    background:url('../images/project-banner.jpg') #444;
    background-size:cover;
    width: 100%;
  }

  .navbar-brand svg{
    width:57.737px; 
    height:68.984px;
  }
  

  
  @media (max-width:768px) {
    .ct-btn-scroll{
      display: none;
    }
    .navbar-brand svg{
      width:45.737px; 
      height:46.984px;
    }

    #navcol-1{
      padding-bottom: 3%;
    }
    #banner-section h2{
      margin-left: 7% !important;
      margin-right: 7% !important;
    }
      #banner-section p{
        margin-left: 7% !important;
        margin-right: 7% !important;
      }
      #table_fi{
        padding-left: 0% !important;
        padding-right: 0% !important;
      }
  }

  .banner-home-image img{
    width: 100%;
    height: auto;
  }

  .vl {
    border-left: 1px solid #fff;
    height: auto;
  }
  .header-dark nav{
      padding-left:10%;
  }
  
  .header-dark .navbar {
    background:rgba(11, 49, 34);
    padding-top:0;
    padding-bottom:0;
    color:#fff;
    border-radius:0;
    box-shadow:none;
    border:none;
  }
  
  @media (min-width:768px) {
    .header-dark .navbar {
      padding-top:.75rem;
      padding-bottom:.75rem;
    }
  }
  
  .header-dark .navbar .navbar-brand {
    font-weight:bold;
    color:inherit;
  }
  
  .header-dark .navbar .navbar-brand:hover {
    color:#f0f0f0;
  }
  
  .header-dark .navbar .navbar-collapse span {
    margin-top:5px;
  }
  
  .header-dark .navbar .navbar-toggler {
    border-color:#747474;
  }
  
  .header-dark .navbar .navbar-toggler:hover, .header-dark .navbar-toggler:focus {
    background:none;
  }
  
  .header-dark .navbar .navbar-toggler {
    color:#eee;
  }
  
  .header-dark .navbar .navbar-collapse, .header-dark .navbar .form-inline {
    border-color:#636363;
  }
  
  @media (min-width: 992px) {
    .header-dark .navbar.navbar .navbar-nav .nav-link {
      padding-left:1.2rem;
      padding-right:1.2rem;
    }
  }

  .navbar-nav{
      margin: auto;
  }
  
  .header-dark .navbar.navbar-dark .navbar-nav .nav-link {
    color:#fff;
    font-size: large;
  }
  
  .header-dark .navbar.navbar-dark .navbar-nav .nav-link:focus, .header-dark .navbar.navbar-dark .navbar-nav .nav-link:hover {
    color:#fcfeff !important;
    background-color:transparent;
  }
  
  .header-dark .navbar .navbar-nav > li > .dropdown-menu {
    margin-top:-5px;
    box-shadow:0 4px 8px rgba(0,0,0,.1);
    background-color:#fff;
    border-radius:2px;
  }
  
  
  .header-dark .navbar .dropdown-menu .dropdown-item:focus, .header-dark .navbar .dropdown-menu .dropdown-item {
    line-height:2;
    font-size:14px;
    color:#37434d;
  }
  
  .header-dark .navbar .dropdown-menu .dropdown-item:focus, .header-dark .navbar .dropdown-menu .drodown-item:hover {
    background:#ebeff1;
  }
  
  .header-dark .navbar .action-button, .header-dark .navbar .action-button:active {
    background:#208f8f;
    border-radius:20px;
    font-size:inherit;
    color:#fff;
    box-shadow:none;
    border:none;
    text-shadow:none;
    padding:.5rem .8rem;
    transition:background-color 0.25s;
  }
  
  .header-dark .navbar .action-button:hover {
    background:#269d9d;
  }
  
  .header-dark .navbar .form-inline label {
    color:#ccc;
  }
  
  .header-dark .navbar .form-inline .search-field {
    display:inline-block;
    width:80%;
    background:none;
    border:none;
    border-bottom:1px solid transparent;
    border-radius:0;
    color:#ccc;
    box-shadow:none;
    color:inherit;
    transition:border-bottom-color 0.3s;
  }
  
  .header-dark .navbar .form-inline .search-field:focus {
    border-bottom:1px solid #ccc;
  }
  
  .header-dark .hero {
    margin-top:60px;
  }
  
  @media (min-width:768px) {
    .header-dark .hero {
      margin-top:20px;
    }
  }
  
  .header-dark .hero h1 {
    color:#fff;
    font-family:'Bitter', serif;
    font-size:40px;
    margin-top:20px;
    margin-bottom:80px;
  }
  
  @media (min-width:768px) {
    .header-dark .hero h1 {
      margin-bottom:50px;
      line-height:1.5;
    }
  }
  
  .header-dark .hero .embed-responsive iframe {
    background-color:#666;
  }

  

  #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
    
  }

  #banner-section-text{
    background-color: rgb(11, 49, 34);
    opacity: 100%;
    padding-top:5%;
    padding-bottom:5%;
  }

  #banner-section h2{
      margin-left: 20%;
      margin-right: 20%;
  }
  #banner-section p{
    margin-left: 20%;
    margin-right: 20%;
}


footer{
  background: rgba(11, 49, 34, 1);
  color:#fff;
  height: auto;
  margin:auto
}

.footer_row{
  justify-content: center;
  padding-top: 1%;
  padding-left:10%;
  padding-right:10%;
}

.footer_col{
  justify-content: center;
  text-align: center;
}

.footer_col_logo{
  padding-top: 3%;
  padding-bottom: 3%;
  margin: auto;
}

.footer_col a{
  color:#fff;
  text-decoration: none;
  cursor: pointer;
}

.hr_row{
  background-color: #fff;
  width: 80%;
}

.ct-btn-scroll {
  top: 95%;
  left: 50%;
  position: absolute;
  transform: translate(-50%, -50%);
  color: #fff;
  animation-duration: 2.5s;
  animation-name: scrolldown;
  animation-iteration-count: infinite;
  fill: #0b3122;
  cursor: pointer;
}

.footer_col_logo img{
  width: 100%;
  height: auto;
}




































#table_fi{
  padding-left: 10%;
  padding-right: 10%;
}
#app_1 {
  border-radius: 5px;
  cursor: pointer;
  transition: 0.3s;
}

#app_1:hover {opacity: 0.7;}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content (image) */
.modal-content {
  margin: auto;
  display: block;
  width: 100%;
  max-width: 900px;
}

/* Caption of Modal Image */
#caption {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  text-align: center;
  color: #ccc;
  padding: 10px 0;
  height: 150px;
}

/* Add Animation */
.modal-content, #caption {  
  -webkit-animation-name: zoom;
  -webkit-animation-duration: 0.6s;
  animation-name: zoom;
  animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
  from {-webkit-transform:scale(0)} 
  to {-webkit-transform:scale(1)}
}

@keyframes zoom {
  from {transform:scale(0)} 
  to {transform:scale(1)}
}

/* The Close Button */
.close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
}

.close:hover,
.close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
  .modal-content {
      width: 100%;
  }
}

.carousel_a_fi{
  color:black;
}

.non-clickable{
  background-color: #0b3122;
  /*  #00917C
      rgb(11, 49, 34)
  */
  color: #ddd;
}

#not-clickable{
  background-color: red !important;
  /*  #00917C
      rgb(11, 49, 34)
  */
  color: #ddd;
}



.navbar-toggler{
  color: #FFFFFF;
  border: 1px solid #FFFFFF !important;
  outline: none !important;
}

@media only screen and (max-width: 600px) {
  #languages{
      display: block !important;
  }
}

#languages{
  display: none ;
}

#languages li{
  display: inline-block !important;
}

.box {
  height: 20px;
  width: 20px;
  margin-bottom: 15px;
  margin-left: 15px;
  margin-right: 15px;
}

.yellow {
  background-color: red;
}
.green{
  background-color: #D8CA8B;
}