/* <buy> */
@media (min-width:768px)
{
  #buy_content
  {
    width: 640px;
    margin-left: calc(50% - 320px);
    margin-right: calc(50% - 320px);
  }

  #buy_form
  {
    margin-left: 12%;
    margin-right: 12%;
  }
}

@media (max-width:768px)
{
  #buy_content
  {
    width: 88%;
    margin-left: 6%;
    margin-right: 6%;
  }

  #buy_form
  {
    margin-left: 6%;
    margin-right: 6%;
  }
}

@media (max-width:320px)
{
  #buy_content
  {
    width: 280px;
    margin-left: 20px;
    margin-right: 20px;
  }

  #buy_form
  {
    margin-left: 20px;
    margin-right: 20px;
  }
}

#buy_content
{
  height: auto;
  border-radius: 20px;
  border: 1px solid #B7B7B7;
  background-color: #0D0D0D;
  margin-top: 2vh;
  margin-bottom: 4vh;
  display: block;
}

.title_h1_buy
{
  font-size: calc(1.375rem + 1vw);
  margin-left: 8%;
  margin-right: 6%;
  margin-top: 30px;
  margin-bottom: 26px;
  font-family: 'Tinos', serif;
  font-weight: 700;
  color: #FEFEFD;
}

.title_h3_buy
{
  font-size: calc(1.3rem + .4vw);
  color: #B7B7B7;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  margin-bottom: 12px;
}

form
{
  display: flex;
  flex-direction: column;
  width: 100%;
}

form input, form textarea
{
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  border: 1px solid #B7B7B7;
  margin-top: 6px;
  margin-bottom: 6px;
  padding-left: 6px;
  padding-right: 6px;
  padding-top: 2px;
  padding-bottom: 2px;
  background-color: #E7E7E4;
  font-size: 16px;
  color: #000000;
  resize: none;
  outline: none;
}

form input::placeholder, form textarea::placeholder
{
  color: #808080;
}

form input:focus, form textarea:focus
{
  border: 1px solid #FF3700;
}

form button
{
  font-family: 'Roboto Mono', monospace;
  font-weight: 400;
  margin-top: 18px;
  margin-bottom: 45px;
  width: 100px;
  padding: 4px;
  background-color: #FF3700;
  border: 1px solid #FF3700;
  color: #FFFFFF;
  font-size: 14px;
  cursor: pointer;
  border-radius: 6px;
}

form button:hover
{
  background-color: #B51500;
}
/* </buy> */
