@font-face {
  font-family: "codigo36";
  src: url("../fonts/c39hrp36dltt.ttf") format("truetype");
}

@font-face {
  font-family: "codigo48";
  src: url("../fonts/C39HRP_7.ttf") format("truetype");
}

@font-face {
  font-family: "codigo72";
  src: url("../fonts/c39p72dltt.ttf") format("truetype");
}



#content_one {
  position: relative;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 500;
  text-align: center;
  bottom: 90px;
  font-size: 25px;
}

#content_two {
  position: relative;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 500;
  text-align: center;
  bottom: 90px;
  font-size: 25px;
}

#content_tree {
  position: relative;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 500;
  text-align: center;
  bottom: 90px;
  font-size: 25px;
}

.code36 {
  font-family: "codigo36";
  font-size: 30px;
  text-align: center;
}

.code48 {
  font-family: "codigo48";
  font-size: 50px;
  text-align: center;
}

#code72_one {
  font-family: "codigo72";
  font-size: 100px;
  text-align: center;
  margin-top: 30px;
}

#code72_two {
  font-family: "codigo72";
  font-size: 90px;
  text-align: center;
}

#code72_tree {
  font-family: "codigo72";
  font-size: 90px;
  text-align: center;
}



.font {
  font-family: Arial, Helvetica, sans-serif;
}

button {
  margin-left: 10px;
  padding: 15px 32px;
  border-radius: 8px;
  border: none;
  color: white;
  background-color: #439c46;
}

button:hover {
  margin-left: 10px;
  padding: 15px 32px;
  border-radius: 8px;
  box-shadow: 2px 2px 12px black;
  border: none;
  color: white;
  background-color: rgb(4, 157, 4);
  cursor: pointer;
}

input[type="text"] {

}

input[type="text"]:hover,
textarea:hover {
}

input[type="submit"] {
  background: #006699;
  color: #ffffff;
}
main{
    display: flex;
    flex-direction: column;
    align-items: center;
}

#barcodegorilla-image{
    display: flex;
    height: calc(100vh - 560px);
    align-items: flex-end;
    min-height: 150px;
    max-height: 290px;
}

#barcodegorilla-image>img{
    width: 280px;
    height: auto;
}

#search-form{
    padding: 20px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#search{
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 582px;
    width: 100%;
    /* width: 582px; */
    height: 44px;
    padding: 5px 8px 0 14px;
    border: 1px solid rgb(223, 225, 229);
    border-radius: 24px;
}

#search:hover, #search:active{
    box-shadow:  0 1px 6px rgb(32 33 36 / 28%)
}

#search>input{
    font-size: 18px;
    color: #333;
    flex-grow: 1;
    height: 34px;
    outline: none;
    border: 1px solid transparent;
}

#svg-search{
    /* background-color: red; */
    padding-right: 13px;
}

#svg-search svg{
    width: 20px;
    height: 20px;
}