.contato{
  .internal-header{
    background-image: url('../img/contato/header-bg.png');
  }
  .c-title{
    margin-bottom: 30px;
    font-family: Rubik;
    color: $color-main;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
  }

  .contato-telefones{
    margin-bottom: 50px;
    padding-bottom: 50px;
    border-bottom: 1px solid #ccc;
    .ct-title{
      margin-bottom: 30px;
      font-family: Rubik;
      color: $color-main;
      font-size: 24px; /* Approximation due to font substitution */
      font-weight: bold;
      text-align: center;
      text-transform: uppercase;
    }
    .ct-container{
      align-items: flex-end;
      width: 870px;
      max-width: 100%;
      margin: 0 auto 20px;
      .ct-item{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        .icon{
          margin-bottom: 10px;
        }
        p{
          color: #282828;
          font-size: 20px; /* Approximation due to font substitution */
          font-weight: bold;
          text-align: center;
        }
      }
    }
    .ct-text{
      p{
        color: #282828;
        font-size: 18px; /* Approximation due to font substitution */
        font-weight: 400;
        line-height: 24px; /* Approximation due to font substitution */
        text-align: center;
      }
    }
  }
  .contato-form{
    overflow:hidden;
    margin-bottom: 50px;
    .form{
      display: flex;
      flex-wrap: wrap;
      float:none;
      .col-4{
        .form-field{
          .form-text{
            border-right-width: 0px;
          }
          select{
            color: #020304;
            font-family: 'Rubik';
            font-weight: normal;
            font-style: normal;
            font-size: 16px;
            line-height: 1.1;
          }
        }
        &:nth-child(3n + 3){
          .form-field{
            .form-text{
              border-right-width: 1px;
            }
          }
        }
      }
      .form-field{
        margin-bottom: 0;
        .form-text{
          border-color: #dbdbdb;
          border-bottom-width: 0px;
        }
        &.form-field-textarea{
          margin-bottom: 30px;
          .form-text{
            width: calc(100% - 1px);
            border-bottom-width: 1px;
          }
        }
        &.error{
          .form-text{
            border-color: red;
          }
        }
      }
      .form-msg{
        .msg-error,
        .msg-success{
          display: none;
          font-size: 16px;
        }
      }
      .form-submit{
        width: 100%;
        color: #FFFFFF;
        font-weight: bold;
        background: $color-sec;
        text-transform: uppercase;
        &:hover{
          background:$color-main;
        }
      }
    }
  }
  @media(max-width: $width-mobile){
    .internal-header{
      background-image: url('../img/contato/header-bg-mobile.png');
    }
    .contato-telefones{
      .ct-container{
        .ct-item{
          max-width:100%;
          flex-basis: 100%;
          flex-direction: row;
          justify-content: unset;
          background: $color-sec;
          padding-top: 5px;
          margin-bottom: 10px;
          .icon{
            margin-right: 10px;
            transform: scale(.8);
            &.icon-phone-blue{
              @include sprite($phone-white);
            }
            &.icon-whatsapp-linear-blue{
              @include sprite($whatsapp-white-linear);
            }
            &.icon-telefone-blue{
              @include sprite($telefone-white);
              zoom: .7;
            }
          }
          p{
            color: #FFF;
          }
        }
      }
    }
    .contato-form{
      .col-4,
      .col-8,
      .col-10,
      .col-2{
        max-width: 100%;
        flex-basis: 100%;
      }
      .form-field{
        .form-text{
          border-right-width: 1px!important;
        }
      }
      .form-msg{
        margin-bottom: 20px;
      }
    }
  }
}