html {
  scroll-behavior: smooth;
}

body{
  font-size: 1.4rem;
  background-color: #343434;
  color: #ffffff;
}

h1, h2{
  color: #68e5c9 !important;
}

h1{
    font-size: 3.0rem;
}

hr{
  background-color: #68e5c9 !important;
  height: 2px;
}

textarea{
  min-width: 100%;
}

footer {
  color: #838383;
  background: url('../img/footer-background.png');
  background-repeat: no-repeat;
  background-position: top;
  z-index: -1;
}

i{
  background-color: #000;
  border: solid 2px #000;
  color: #68e5c9;
  padding: 1rem;
  border-radius: 100%;
}

input, textarea{
  background-color: #858585 !important;
  border-color: #858585 !important;
  color: #585858 !important;
}

a{
  text-decoration: none;
  color: #fff;
}

a:hover{
  text-decoration: none;
  color: #fff;
}

.navbar-toggler-icon{
  background-image: url('../img/toogle-icon.png') !important;
  width: 2.5rem;
  height: 2.5rem;
}

.navbar-toggler{
  border-color: rgba(0,0,0,0) !important;
}

.navbar {
  background-color: rgba(0,0,0,0) !important;
}

.navbar-brand img{
  max-width: 130%;
}

.navbar li a {
  color: #fff !important;
}

.nav-item-padding{
  padding-right: 4rem;
}

.nav-link{
  font-size: 1.4rem;
  line-height: normal;
}

.nav-link:hover{
  color: #68e5c9 !important;
}

.bgimage {
  height: 872px;
  background: url('../img/hero-background.jpg');
  background-repeat: no-repeat;
  background-position: top;
  z-index: -1;
  border-bottom: 2px solid #838383;
}

.container{
  max-width: 1210px !important;
}

.border-bottom-gray{
  border-bottom: 2px solid #838383;
}

#clientes img {
  max-width: 90%;
}

.input-group-text{
  font-size: 1.2em;
  background-color: black;
  color: #68e5c9;
  border: none;
}

#top-arrow{
  color: #838383;
}

#top-arrow img{
  width: 3rem;
}

.legenda-textarea {
  font-size: 1.2em;
  color: #68e5c9;
  border: solid 1px #000;
  background-color: #000;
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
}

.hr-33{
  width: 33%;
}

.hr-15{
  width: 15%;
}

/* MEDIA QUERYES */

/* Extra small */
@media only screen and (max-width: 575px) {
  body{
    font-size: 1rem;
  }
  
  i{
    padding: 0.6rem;
  }

  h1{
    font-size: 2.2rem;
  }

  .navbar-brand{
    max-width: 70%;
  }

  .navbar-brand img{
    max-width: 90%;
  }

  .nav-link{
    font-size: 1.5rem;
    line-height: normal;
  }

  .nav-item-padding {
    padding-right: 0.5rem;
  }

  #clientes img {
    max-width: 50%;
  }
  
  #logo-footer{
    max-width: 50%;
    margin-bottom: 2rem;
  }

  .mb-padding-top-3{
    padding-top: 3rem;
  }

  .hr-80{
    width: 80%;
  }

  .hr-33{
    width: 70%;
  }

  .hr-15{
    width: 50%;
  }

}

/* Small */
@media only screen and (min-width: 576px) and (max-width: 767px) {
  i{
    padding: 0.8rem;
  }

  .navbar-brand{
    max-width: 65%;
  }

  .navbar-brand img{
    max-width: 90%;
  }

  .nav-item-padding {
    padding-right: 0.5rem;
  }

  #clientes img {
    max-width: 80%;
  }

  #logo-footer{
    max-width: 60%;
  }

  .mb-padding-top-3{
    padding-top: 3rem;
  }

  .hr-33{
    width: 55%;
  }

  .hr-15{
    width: 30%;
  }
}

/* Medium */
@media only screen and (min-width: 768px) and (max-width: 991px) {
  
}

/* Large */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  
}

/* Extra large */
@media only screen and (min-width: 1200px) {
  body{
    font-size: 2rem;
  }
  h1 {
    font-size: 4rem;
  }
  
}