@font-face {
    font-family: Raleway;
    src: url('../fonts/Raleway-Regular.ttf');
}

body {
  font-family: Raleway !important;
}

.top {
  margin-bottom: 10px;
  background-image: url('../img/template/logo-canto.png');
  background-repeat: no-repeat;
  background-size: 120px 120px;
  background-position: right top;
}

.top img {
  max-width: 100%;
  margin-bottom: 4px;
}

.navbar-custom .icon img {
  max-height: 20px;
}

@media (min-width: 992px) {
  .navbar-custom {
    border-bottom: 1px solid #1E5EA8;
    margin-top: 2.5%;
  }

  .navbar-custom .navbar-text {
    margin-top: .8rem;
  }

  .navbar-custom .navbar-nav .nav-item .nav-link {
    padding: .1rem 1rem;
  }

  .navbar-custom .navbar-nav .nav-item.active {
    border-bottom: 2px solid #0077FF;
  }
}

@media (max-width: 992px) {

  .top img {
    max-width: 120px;
  }

  .navbar-custom {
    background-color: #1E5EA8;
  }
  .navbar-custom .navbar-text {
    color: #ffffff;
  }

  .navbar-custom .navbar-nav .nav-item {
    border-bottom: 1px solid #ffffff;
  }

  .navbar-custom .navbar-nav .nav-item .nav-link {
    color: #ffffff;
  }
}

.g-bar {
  background-color: #B6D146;
  padding: 10px 0;
  margin: 20px 0;
}

.b-bar {
  background-color: #1E5EA8;
  padding: 17px 0;
  margin: 20px 0;
  position: relative;
}

.b-bar:before {
  content: ' ';
  position: absolute;
  width: 0;
  height: 0;
  left: 49%;
  top: 0;
  border-width: 16px 16px 16px 16px;
	border-style: solid;
	border-color: #ffffff transparent transparent transparent;
}

.b-bar:after {
  content: ' ';
  position: absolute;
  width: 0;
  height: 0;
  left: 49%;
  bottom: 0;
  border-width: 16px 16px 16px 16px;
	border-style: solid;
	border-color: transparent transparent #ffffff transparent;
}

.carousel-caption {
  left: 0;
  text-align: center;
}

.carousel-caption.blue {
  background-color: rgba(30, 94, 168, 0.64);
}

.carousel-caption.black {
  background-color: rgba(38, 38, 21, 0.64);
}

.carousel-caption.red {
  background-color: rgba(227, 29, 27, 0.64);
}

.carousel-caption h5 p {
  margin-top: 10px;
  margin-bottom: 0px;
}

.carousel-caption .btn-custom {
  border: .1rem solid #ffffff;
  color: #ffffff;
  padding: .1rem .75rem;
  border-radius: .5rem;
  font-weight: bold;
}

@media (min-width: 768px) {
  .carousel-caption {
    right: 55%;
    bottom: 80px;
    padding-left: 15%;
    padding-right: 10px;
  }
}

@media (max-width: 768px) {
  .carousel-caption {
    right: 25%;
    bottom: 5px;
    padding-left: 5px;
    padding-right: 10px;
  }
}

.home-service {
  margin: 5% 0;
}

.home-service .img-service {
  margin-bottom: 4px;
}

.home-service .img-service img {
  max-width: 100%;
  display: none;
}

.home-service .img-service img.active {
  display: block;
  margin-top: 1.5rem;
}

.home-service .desc-service h1 {
  color: red;
  font-size: 2rem;
}

.home-service .desc-service p {
  margin-bottom: 2px;
  font-size: .8rem;
}

.home-service .desc-service ol {
  margin: 5px 0px 0px 0px;
  padding: 0 18px;
}

.home-service .desc-service ol li {
  font-size: .8rem;
}

.contact {
  color: #0077FF;
  margin: 20px 0;
}

.contact p {
  margin-bottom: .3rem;
}

.contact .contact-form {
  margin-top: 10px;
}

.contact .contact-form .form {
  background: linear-gradient(to right, #3FD1FF, #0077FF);
  padding: 16px;
  margin-bottom: 5px;
}

.contact .contact-form .form .form-group {
  margin-bottom: .5rem;
}

.contact .contact-form .form input {
  border-radius: 0px;
  padding: .2rem .75rem;
}

.contact .contact-form .form input::-webkit-input-placeholder {
    color: #0077FF;
}

.contact .contact-form .form input:-moz-placeholder {
   color: #0077FF;
   opacity:  1;
}
.contact .contact-form .form input::-moz-placeholder {
   color: #0077FF;
   opacity:  1;
}
.contact .contact-form .form input:-ms-input-placeholder {
   color: #0077FF;
}
.contact .contact-form .form input::-ms-input-placeholder {
   color: #0077FF;
}

.contact .contact-form .form input::placeholder {
   color: #0077FF;
}

.contact .contact-form .form textarea {
  border-radius: 0px;
}

.contact .contact-form .form textarea::-webkit-input-placeholder {
    color: #0077FF;
}

.contact .contact-form .form textarea:-moz-placeholder {
   color: #0077FF;
   opacity:  1;
}
.contact .contact-form .form textarea::-moz-placeholder {
   color: #0077FF;
   opacity:  1;
}
.contact .contact-form .form textarea:-ms-input-placeholder {
   color: #0077FF;
}
.contact .contact-form .form textarea::-ms-input-placeholder {
   color: #0077FF;
}

.contact .contact-form .form textarea::placeholder {
   color: #0077FF;
}

.contact .contact-form .form .btn-custom {
  padding: .1rem .75rem;
  background-color: #ffffff;
  color: #0077FF;
  border-color: #ffffff;
  border-radius: .5rem;
}

.contact .images img {
  max-width: 100%;
}

.produtos {
  text-align: center;
  padding: 5px 0;
}

.produtos h1 {
  color: #1E5EA8;
  padding-bottom: .4rem;
}

.produtos ul {
  list-style-type: none;
  margin: 0px;
  padding: 0px 0px 1rem 0px;
  margin: 10px 0;
  border-bottom: 4px dotted #1E5EA8;
}

.produtos ul li {
  display: inline-block;
  font-size: 1.2rem;
  padding: 0 5px;
}

.produtos ul li.blue a {
  color: #1E5EA8;
}

.produtos ul li.black a {
  color: #262615
}

.produtos ul li.red a {
  color: #E31D1B;
}

.produtos ul li a {
  text-decoration: none;
}

.produtos ul li img {
  max-width: 120px;
}

.produtos .list-reciclaveis {
  text-align: left;
}

.produtos .list-reciclaveis ul {
  border: none;
  display: inline-grid;
}

.produtos .list-reciclaveis ul li {
  padding-left: 14px;
}

.produtos .list-reciclaveis ul li.bold {
  font-weight: bold;
  padding: 0 8px;
}

.swiper-container {
  margin: 4% 0;
}

.swiper-slide {
  text-align: center;
}

@media (min-width: 768px) {
  .swiper-slide {
    padding: 1rem 5rem;
  }
}

.swiper-slide a {
  text-decoration: none;
}

.swiper-slide img {
  max-width: 100%;
}

.swiper-slide p {
  margin-bottom: 0px;
  color: #262615;
}

.swiper-slide p b {
  color: #1E5EA8;
  font-size: 1.2rem;
}

.bot-border {
  background: linear-gradient(to left, #3FD1FF, #0077FF);
  padding: 10px 0;
  margin-bottom: 20px;
}

.footer h1 {
  font-size: 1.2rem;
  color: #0077FF;
  font-weight: bold;
}

.footer h1 a {
  font-size: .7rem;
  color: #E31B1B;
  border: 1px solid #E31B1B;
  text-decoration: none;
  margin-left: 5%;
}

.footer ul {
  list-style: none;
  padding: 0px;
  margin: 2rem 0px;
}

.footer ul li {
  display: inline-block;
  max-width: 140px;
}

.footer ul li img {
  max-width: 100%;
}

#map {
  border: 2px solid #0077FF;
  position: relative;
  height: 0;
  overflow: hidden;
  padding-bottom: 38%;
  margin-bottom: 20px;
  margin-top: 20px;
}