* {

}

h1, h2, h3, h4, h5 {
  color : var(--dark-purple)!important;
}

#checkout-container {
  width : 100%;
  height : auto;
  display : flex;
  flex-direction : row;
  align-items : flex-start;
  justify-content: space-around;
  margin : 50px 0;
}

#address-form > * {
  color : white;
}

label {
  color : var(--dark-purple);
  font-family : var(--b);
  font-size : 20px;
}

input, select {
  font-family : var(--b);
  padding : 5px;
  font-size : 20px;
  background-color : white!important;
  border : 0;
  border-bottom : 3px solid var(--dark-purple);
  color : var(--dark-purple);
}

select > option {
  color : white!important;
}

#checkout-container > * {
  width : 45%;
  background-color : var(--pink);
  border : 3px solid white;
  display : flex;
  align-items: center;
  justify-content : center;
  flex-direction : column;
  border-radius : 20px;
  padding : 30px 20px;
  margin : 0;

}

#address-container > form > span {
  display : flex;
  justify-content : flex-start;
  align-items : flex-start;
  flex-direction : column;
  width : 90%;

}

span {
  margin : 3px 0;
}

#address-container > form > span > input {
  background-color : rgb(0,0,0,0.1);
  width : 90%;
}

#address-container > form > span > select {
  background-color : rgb(0,0,0,0.1);
  width : 100%;
}

#cart-container {
  display : flex;
  align-items: center;
  justify-content : center;
  flex-direction : column;
  left : 0;
}

.short-field-container {
  width : 90%;
  display : flex;
  align-items : flex-start;
  justify-content : flex-start;
  flex-direction : row;
}

.short-field-container > span  {
  display : flex;
  justify-content : flex-start;
  align-items : flex-start;
  flex-direction : column;
  width : 50%;
  margin-right : 10px;
}

.short-field-container > span > input {
  background-color : rgb(0,0,0,0.1);
  width : 70%;
}

.short-field-container > span > label {
  width : 100px;
}

.button-container {
  display : flex;
  align-items: center!important;
  justify-content : center!important;
  flex-direction : row!important;
  width : 100%;
}

@media screen and (max-width: 980px) {

  #checkout-container {
    flex-direction : column!important;
    align-items : center!important;
    justify-content : center!important;
    margin : 75px 0 0 0;
    width : 100%;
    box-shadow : 0;
  }

  #checkout-container > * {
    width : 80%;
    margin : 10px 0;
    padding : 10px;
  }

  #cart-container {
    display : none;
  }

  .short-field-container {
    width : 90%;
    flex-direction : column;
  }

  .short-field-container > span  {
    width : 90%;
    margin : 0;
  }

  .short-field-container > span > input {
    background-color : rgb(0,0,0,0.1);
    width : 100%;
  }

  .button-container {
    display : flex;
    align-items: center!important;
    justify-content : center!important;
    flex-direction : column!important;
    width : 100%;
  }

  /*.button-container > a , .button-container > a > button, .button-container > button {
    width : 90%!important;
  }*/

}