.wraper-main {
  display: flex;
  width: 100%;
}
.naslov {
  text-align: center;
  padding:7px 0 7px 0;
  margin: 2px;
  color: #3a3a3a;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  background-color: #ffc107;

}
h3 {
  text-align: center;

}
.ro {
  display: flex;
  
}

.form-value {
 width: 20px;
}
.final-16 {
  width: 25%;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  background-color: #ced4da;
  
}
.final-8 {
  width: 25%;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  background-color: #fff;
}
.padding-8 {
  padding-top: 35px;
}
.padding-8a {
  padding-top: 90px;
}
.padding-4 {
  padding-top: 60px;
}
.padding-4a {
  padding-top: 130px;
}
.padding-2 {
  padding-top: 150px;
}
.padding-2a {
  padding-top: 300px;
}
.form-contro:disabled, .form-control[readonly] {
  background-color: #e9ecef;
  opacity: 1;
}
.form-contro {
  display: block;
  text-align: center;
  font-family:Arial, Helvetica, sans-serif;
  width: 160px;
  padding: 0.375rem 0.75rem;
  font-size: 0.9rem;
  font-weight: 500;

  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0.25rem;
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

@media screen and (max-width: 991px) {
  .wraper-main {
    width: 270%;
  }
  h3 {
    font-size: 20px !important;
  }
}