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

.banner-home-image img{
  width: 100%;
  height: auto;
  background-size:cover;
  background-repeat: no-repeat;
}

.header-dark {
    background-size:cover;
    width: 100%;
    height: auto;
    background-attachment: fixed;
  }

  .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%;
    }
    #icons{margin-left: 2% !important; margin-right: 2% !important; padding-top: 5%; padding-bottom: 5%; text-align: center;}
    #banner-section h2{
        margin-left: 7% !important;
        margin-right: 7% !important;
    }
    #banner-section-p{
      margin-left: 7% !important;
      margin-right: 7% !important;
    }
    .icons-p {
      margin-left: 0% !important;
      margin-right: 0% !important;
    }

  }
  .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%;
  }

  @media only screen and (max-width: 600px) {
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
    }
  }
  

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

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

.icons-p{
  margin-left:5%;
  margin-right: 5%;
}

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;
}

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

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

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

#languages{
  display: none ;
}

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

#icons img{
  width: 130px;
}

#icons{margin-left: 20%; margin-right: 20%; padding-top: 5%; padding-bottom: 5%; text-align: center;}

#mirembajtjetext{
  text-align: center;
}

#siguritext{
  text-align: center;
}

#inovaciontext{
  text-align: center;
}
/* 
.mirembajtjeimg{display: block;}
.mirembajtjetext{display: none; border: 1px solid #fff; padding-top: 10%; padding-bottom: 10%; }
.mirembajtje:hover .mirembajtjeimgg{display: none; }
.mirembajtje div img{animation: fadeout 1s ease-in-out; transition: all 1s ease-in-out;}
.mirembajtje:hover .mirembajtjetext{animation: fade 1s ease-in-out;display: block;}
@keyframes fade {0%   { opacity: 0; }100% { opacity: 1; }}
@keyframes fadeout {0%   { opacity: 0; }100% { opacity: 1; }}

.siguriimg{display: block;}
.siguritext{display: none; border: 1px solid #fff; padding-top: 10%; padding-bottom: 10%; }
.siguri:hover .siguriimgg{display: none; }
.siguri div img{animation: fadeout 1s ease-in-out; transition: all 1s ease-in-out;}
.siguri:hover .siguritext{animation: fade 1s ease-in-out;display: block;}

.inovacionimg{display: block;}
.inovaciontext{display: none; border: 1px solid #fff; padding-top: 10%; padding-bottom: 10%; }
.inovacion:hover .inovacionimgg{display: none; }
.inovacion div img{animation: fadeout 1s ease-in-out; transition: all 1s ease-in-out;}
.inovacion:hover .inovaciontext{animation: fade 1s ease-in-out;display: block;} */


/* MEDIA QUERIES */

/* ----------- iPhone 4 and 4S ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2) {
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* ----------- iPhone 5, 5S, 5C and 5SE ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* ----------- iPhone 6, 6S, 7 and 8 ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* ----------- iPhone 6+, 7+ and 8+ ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) { 
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* Portrait */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* ----------- iPhone X ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3) { 
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 
    #banner-section{
      color: white;
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 
    #banner-section{
      color: white;
      /* background: linear-gradient(rgba(255, 255, 255, 0.74), rgba(255, 255, 255, 0.74)), url('../images/vendbanimi1.jpg'); */
      background-size:cover;
      width: 100%;
      height: auto;
      font-size: 14px;
    }
}

.banner-section-icons{
  background: linear-gradient(rgba(255, 255, 255, 0.84), rgba(255, 255, 255, 0.84)), url('../images/vendbanimi1.jpg'); 
  background-size:cover;
  width: 100%;
  color:#0b3122;
  background-attachment: fixed;
}