/*
  Header
*/

.big {
  display: block;
}

.small {
  display: none;
}

@media (max-width: 500px) {
  .big {
    display: none;
  }

  .small {
    display: block;
  }
}

#alt-contact-img {
  width: 100%;
  height: auto;
}

.contact-us-header-container {
  height: 44vw; /*87.5vh;*/
  width: 100vw;
  background-image: url('../images/contact-us/bushman-contact-us-header.jpg');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  /*background-attachment: fixed;*/
}

.contact-us-header-container p {
  font-size: 1.2vw;
}

.contact-us-header-container h3 {
  font-size: 1.8vw;
}

/*
  Read faq
*/
.faq-stop {
  background-color: #e9000a;
  margin: 1%;
  z-index: 3;
}

.stop-hand {
  height: 70%;
  width: auto;
}

/*
  Contact Us Main
*/
.contact-us-main {
  height: auto;
  margin-left: 3%;
  margin-right: 3%;
  padding: 5% 0;
  margin-bottom: 0;
}

.contact-us-main .left-area .juno-logo {
  width: 120px;
  height: auto;
  max-width: 100%;
}

.contact-us-main .left-area .social-icon {
  width: 80px;
  height: auto;
  max-width: 100%;
}

input, textarea {
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  outline: none;
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border: 1px solid #DDDDDD;
}

input:focus, textarea:focus {
  box-shadow: 0 0 5px rgba(81, 203, 238, 1);
  border: 1px solid rgba(0, 0, 0, 0.2);
  box-shadow: 2px 4px 8px #888888;
  transition: box-shadow .1s ease-in-out;
}

/* contact us input validation images */
.mid-area input[type=number]::-webkit-inner-spin-button,
.mid-area input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Remove the input number changer on firefox */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance:textfield;
}

.mid-area {
  padding-left: 5%;
  padding-right: 5%;
}

.mid-area input:required:invalid, input:focus:invalid, textarea:required:invalid, textarea:focus:invalid {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAeVJREFUeNqkU01oE1EQ/mazSTdRmqSxLVSJVKU9RYoHD8WfHr16kh5EFA8eSy6hXrwUPBSKZ6E9V1CU4tGf0DZWDEQrGkhprRDbCvlpavan3ezu+LLSUnADLZnHwHvzmJlvvpkhZkY7IqFNaTuAfPhhP/8Uo87SGSaDsP27hgYM/lUpy6lHdqsAtM+BPfvqKp3ufYKwcgmWCug6oKmrrG3PoaqngWjdd/922hOBs5C/jJA6x7AiUt8VYVUAVQXXShfIqCYRMZO8/N1N+B8H1sOUwivpSUSVCJ2MAjtVwBAIdv+AQkHQqbOgc+fBvorjyQENDcch16/BtkQdAlC4E6jrYHGgGU18Io3gmhzJuwub6/fQJYNi/YBpCifhbDaAPXFvCBVxXbvfbNGFeN8DkjogWAd8DljV3KRutcEAeHMN/HXZ4p9bhncJHCyhNx52R0Kv/XNuQvYBnM+CP7xddXL5KaJw0TMAF8qjnMvegeK/SLHubhpKDKIrJDlvXoMX3y9xcSMZyBQ+tpyk5hzsa2Ns7LGdfWdbL6fZvHn92d7dgROH/730YBLtiZmEdGPkFnhX4kxmjVe2xgPfCtrRd6GHRtEh9zsL8xVe+pwSzj+OtwvletZZ/wLeKD71L+ZeHHWZ/gowABkp7AwwnEjFAAAAAElFTkSuQmCC) !important;
  background-position: right top;
  background-repeat: no-repeat;
  -moz-box-shadow: none;
}

.mid-area input:required:valid, textarea:required:valid {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAepJREFUeNrEk79PFEEUx9/uDDd7v/AAQQnEQokmJCRGwc7/QeM/YGVxsZJQYI/EhCChICYmUJigNBSGzobQaI5SaYRw6imne0d2D/bYmZ3dGd+YQKEHYiyc5GUyb3Y+77vfeWNpreFfhvXfAWAAJtbKi7dff1rWK9vPHx3mThP2Iaipk5EzTg8Qmru38H7izmkFHAF4WH1R52654PR0Oamzj2dKxYt/Bbg1OPZuY3d9aU82VGem/5LtnJscLxWzfzRxaWNqWJP0XUadIbSzu5DuvUJpzq7sfYBKsP1GJeLB+PWpt8cCXm4+2+zLXx4guKiLXWA2Nc5ChOuacMEPv20FkT+dIawyenVi5VcAbcigWzXLeNiDRCdwId0LFm5IUMBIBgrp8wOEsFlfeCGm23/zoBZWn9a4C314A1nCoM1OAVccuGyCkPs/P+pIdVIOkG9pIh6YlyqCrwhRKD3GygK9PUBImIQQxRi4b2O+JcCLg8+e8NZiLVEygwCrWpYF0jQJziYU/ho2TUuCPTn8hHcQNuZy1/94sAMOzQHDeqaij7Cd8Dt8CatGhX3iWxgtFW/m29pnUjR7TSQcRCIAVW1FSr6KAVYdi+5Pj8yunviYHq7f72po3Y9dbi7CxzDO1+duzCXH9cEPAQYAhJELY/AqBtwAAAAASUVORK5CYII=) !important;
  background-position: right top;
  background-repeat: no-repeat;
}

.mid-area input {
  background-color: #b2b0b0;
}

.mid-area input::placeholder {
  text-transform: uppercase;
  color: black;
}

.mid-area input:hover:not(.submit-btn) {
  border: 1px solid rgba(0, 0, 0, 0.2);
  box-shadow: 2px 4px 8px #888888;
  transition: box-shadow .1s ease-in-out;
}

.mid-area .batch-number input, .mid-area .dom input {
  width: 5%;
}


.batch-number-label, .dom-label {
  margin-bottom: 0;
}

.product-info-container {
  width: 100%;
  min-width: 100%;
  position: relative !important;
}

.batch-number {
  position: absolute !important;
  left: 0% !important;
}

.dom {
  position: absolute !important;
  left: 17vw;
  width: 100%;
}

.mid-area textarea {
  width: 100%;
  background-color: #b2b0b0;
  resize: none;
}

.mid-area textarea::placeholder {
  color: black;
}

.submit-btn {
  border-radius: 5px;
  width: 60%;
  background-color: #e5dfdf !important;
  border: 1px solid black;
  font-weight: bold;
  transition: color .5s ease-in-out, background-color .5s ease-in-out;
}

.submit-btn:hover {
  background-color: grey !important;
  color: white;
}

.dom-bn-img {
  height: 130px;
  width: 90%;
}


#phone-img {
  height: auto;
  width: 8%;
}

#mail-img {
  height: auto;
  width: 6.5%;
}
.contact-us-main .left-area .icon-img {
  margin-top: -1%;
}

@media (max-width: 1024px) {
  .batch-number, .dom {
    position: static !important;
  }
}

@media (max-width: 768px) {
  .order1 p {
    font-size: 20px;
  }

  .mid-area {
    padding: 0;
  }

  .dom-bn-img {
    height: 200px;
  }

  .mid-area .batch-number input, .mid-area .dom input {
    width: 12%;
    height: 40px;
  }

  .mid-area input {
    height: 40px;
  }

  .stop-hand {
    height: 80%;
  }
}


/*
  FAQS
*/

.faqs-section {
  background-color: #fff200;
  height: auto;
  padding: 5% 0;
}

.faq-answers {
  padding-left: 4%;
  padding-right: 4%;
}

.faq-answers .faq-col {
  padding-left: 3%;
  padding-right: 3%;
}

.faqs-section .faq-circle-img {
  height: 150px;
  width: auto;
}

.mid-align {
  display: grid;
  align-content: center;
}

.mid-align-flex {
  display: flex;
  align-items: center;
}