.submit-form {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
  font-family: 'Oxygen';
  max-width: 450px;
}

.submit-form form {
  width: 100%;
  max-width: 450px;
  margin-bottom: 0;
}

.submit-form form .inner-form {
  background: #fff;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: center;
      align-items: center;
  box-shadow: 15px 8px 15px 8px rgba(0, 0, 0, 0.15);
}

.submit-form .inner-form {
  background: #fff;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: center;
      align-items: center;
  box-shadow: 15px 8px 15px 8px rgba(0, 0, 0, 0.15);
}

.submit-form form .inner-form .input-field {
  height: 60px;
}

.submit-form form .inner-form .input-field input {
  height: 100%;
  background: transparent;
  border: 0;
  display: block;
  width: 100%;
  padding: 10px 10px;
  font-size: 16px;
  color: #555;
}

.submit-form .inner-form .input-field button {
  height: 100%;
  background: transparent;
  border: 0;
  display: block;
  width: 100%;
  padding: 10px 10px;
  font-size: 16px;
  color: #555;
}

.submit-form .inner-form .input-field button[type=button] {
  display: none;
}

.submit-form form .inner-form .input-field input[type=file] {
  display: none;
}

.submit-form form .inner-form .input-field input[type=submit] {
  display: none;
}

.submit-form form .inner-form .input-field input.placeholder {
  color: #888;
  font-size: 16px;
}

.submit-form form .inner-form .input-field input:-moz-placeholder {
  color: #888;
  font-size: 16px;
}

.submit-form form .inner-form .input-field input::-webkit-input-placeholder {
  color: #888;
  font-size: 16px;
}

.submit-form form .inner-form .input-field input:hover, .submit-form form .inner-form .input-field input:focus {
  box-shadow: none;
  outline: 0;
  border-color: #fff;
}

.submit-form .inner-form .input-field button:hover, .submit-form .inner-form .input-field button:focus {
  box-shadow: none;
  outline: 0;
  border-color: #fff;
}


.submit-form form .inner-form .input-field.first-wrap {
  -ms-flex-positive: 1;
      flex-grow: 1;
}

.submit-form form .inner-form .input-field.second-wrap {
  -ms-flex-positive: 1;
  flex-grow: 1;
}

.submit-form form .inner-form .input-field.second-wrap.custom-file-upload {
  padding: 18px;
  color: gray;
  background-color: #ffffff;
  cursor: pointer;
  font-weight: lighter;
  font-size: 18px;
}

.submit-form form .inner-form .input-field.third-wrap {
  -ms-flex-positive: 1;
  flex-grow: 1;
}

.submit-form form .inner-form .input-field.third-wrap.custom-file-upload {
  padding: 18px;
  color: gray;
  background-color: #ffffff;
  cursor: pointer;
  font-weight: lighter;
  font-size: 18px;
}

.submit-form form .inner-form .input-field.fourth-wrap {
  -ms-flex-positive: 1;
  flex-grow: 1;
}

.submit-form form .inner-form .input-field.fourth-wrap.custom-file-upload {
  padding: 14px;
  background-color: #27ae60;
  color: #ffffff;
  font-weight: bold;
  font-size: 22px;
  cursor: pointer;
}

.submit-form .inner-form .input-field.fourth-wrap {
  -ms-flex-positive: 1;
  flex-grow: 1;
}

.submit-form .inner-form .input-field.fourth-wrap.custom-button {
  padding: 14px;
  background-color: #27ae60;
  color: #ffffff;
  font-weight: bold;
  font-size: 22px;
  cursor: pointer;
}

.submit-form .inner-form .input-field.fourth-wrap.custom-button {
  padding: 14px;
  background-color: #27ae60;
  color: #ffffff;
  font-weight: bold;
  font-size: 22px;
  cursor: pointer;
}

.submit-button {

    display: inline-block;
    background: none;
    padding: 10px;
    margin: 10px;
    cursor:pointer;
    border: 2px solid #27ae60;

}

.submit-button:hover {

    display: inline-block;
    background: #27ae60;
    transition: 0.5s;
}

.submit-button >p {

    margin: 0;
    color: #27ae60;
    padding: 7px 25px 7px 25px;
    font-size: 22px;

}

.submit-button:hover >p {

    margin: 0;
    color: #ffffff;
    transition: 0.5s;

}

.more-options-button {

    display: inline-block;
    background: none;
    padding: 10px;
    margin: 10px;
    cursor:pointer;
    border: 2px solid #2c3e50;

}

.more-options-button:hover {

    display: inline-block;
    background: #2c3e50;
    transition: 0.5s;
}

.more-options-button >p {

    margin: 0;
    color: #2c3e50;
    padding: 5px 20px 5px 20px;
    font-size: 18px;

}

.more-options-button:hover >p {

    margin: 0;
    color: #ffffff;
    transition: 0.5s;

}

.slidecontainer {
  width: 100%; /* Width of the outside container */
}

/* The slider itself */
.slider {
  -webkit-appearance: none;  /* Override default CSS styles */
  appearance: none;
  width: 100%; /* Full-width */
  height: 25px; /* Specified height */
  background: #d3d3d3; /* Grey background */
  outline: none; /* Remove outline */
  opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
  -webkit-transition: .2s; /* 0.2 seconds transition on hover */
  transition: opacity .2s;
}

/* Mouse-over effects */
.slider:hover {
  opacity: 1; /* Fully shown on mouse-over */
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
.slider::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 25px; /* Set a specific slider handle width */
  height: 25px; /* Slider handle height */
  background: #27ae60; /* Green background */
  cursor: pointer; /* Cursor on hover */
}

.slider::-moz-range-thumb {
  width: 25px; /* Set a specific slider handle width */
  height: 25px; /* Slider handle height */
  background: #27ae60; /* Green background */
  cursor: pointer; /* Cursor on hover */
}