.form-group.required .form-control-label::before {
  content: "*";
  color: #c00;
}

.contact-us-banner {
  background-image: url("../images/contact-us.jpg");
  background-position-y: 20%;
}

.contact-us-signup-message {
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  position: fixed;
  top: 15%;
  left: 50%;
}

.contact-us-signup-alert {
  -webkit-animation: fade 5s linear forwards;
          animation: fade 5s linear forwards;
  -webkit-box-shadow: 1px 1px 5px grey;
          box-shadow: 1px 1px 5px grey;
  padding: 1em;
}
@-webkit-keyframes fade {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fade {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.contact-us-signup-alert.show {
  display: block;
}

.not-available-color {
  fill: #ED6861;
}

.available-color {
  fill: #18A277;
}

.low-stock-color {
  fill: #ED6861;
}

@media (min-width: 544px) {
  .contact-us-landing-page {
    padding: 35px 0 50px;
  }
}
.contact-us-landing-page .form-group {
  margin-bottom: 20px;
}
@media (max-width: 768.98px) {
  .contact-us-landing-page .form-group {
    margin-bottom: 15px;
  }
  .contact-us-landing-page input.form-control {
    padding: 22px 25px;
  }
}

.contact-us-reCAPTCHA {
  font-size: 14px;
  margin-bottom: 25px;
  color: #333333;
}

.conatctUs-title {
  padding: 25px 15px 18px;
  font-size: 24px;
  color: #333333;
}
@media (max-width: 768.98px) {
  .conatctUs-title {
    padding: 20px 15px 10px;
    font-size: 20px;
  }
}
@media (max-width: 543.98px) {
  .conatctUs-title {
    padding-top: 38px;
  }
}

.contact-us-topic .custom-select {
  font-family: "ubuntuMedium";
}

@media (max-width: 768.98px) {
  .select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 9px;
  }
}

.count-chars {
  color: #333333;
  font-size: 14px;
  position: absolute;
  top: 23px;
  right: 24px;
}
@media (max-width: 768.98px) {
  .count-chars {
    right: 20px;
  }
}

.contact-us-comment .form-group {
  padding: 20px 24px 24px 21px;
  position: relative;
  border: 1px solid #E1E6ED;
  border-radius: 20px;
  margin-bottom: 10px;
}
.contact-us-comment .form-group textarea#contact-comment {
  height: 130px;
  width: 86%;
  padding: 0;
  resize: none;
  border-radius: 0;
  border: none;
}

.contact-us-submit {
  padding-top: 4px;
}
@media (max-width: 543.98px) {
  .contact-us-submit {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .contact-us-submit .col-6 {
    max-width: 100%;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    margin-bottom: 2px;
  }
  .contact-us-submit .col-6:not(:last-child) {
    margin-bottom: 17px;
  }
  .contact-us-submit .col-6 button {
    width: 100%;
    padding: 12px 28px;
  }
}

.contact-us-info {
  color: #333333;
}
@media (max-width: 768.98px) {
  .contact-us-info {
    padding: 0 15px 54px;
    font-size: 16px;
  }
}
.contact-us-info .get-in-touch-title {
  padding: 25px 0 18px;
  font-size: 24px;
}
@media (max-width: 768.98px) {
  .contact-us-info .get-in-touch-title {
    padding: 0 15px 25px 0;
    font-size: 20px;
  }
}
.contact-us-info .contact-item {
  padding-left: 5px;
}
.contact-us-info .git-element {
  padding-top: 20px;
}
.contact-us-info .git-element strong {
  font-family: ubuntuBold;
}
.contact-us-info .git-element div:first-child {
  margin-bottom: 2px;
}

@media (max-width: 768.98px) {
  .contact-us-landing-page .footer-item {
    border-bottom: none;
  }
}
