@charset "UTF-8";
/* menu styles */
input.state_checkbox[type=checkbox] {
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px; }

.burger_menu {
  background-color: #c40f0f;
  color: #fff;
  display: block;
  float: left;
  max-width: 250px;
  padding: 1.5em; }
  .burger_menu h3 {
    font-family: 'Berkshire Swash', cursive;
    font-size: 24px;
    font-weight: normal;
    margin: 0; }

label {
  display: block;
  font-family: Arial, Verdana, sans-serif;
  font-size: 18px;
  margin: 3px 0;
  padding-left: 1em;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
  label:after {
    content: "✔";
    display: none;
    left: 0;
    position: absolute; }

fieldset {
  border: 1px solid #fff;
  display: block; }

legend {
  font-family: 'Berkshire Swash', cursive;
  font-size: 20px; }

svg {
  width: 60%; }

/* special hide extra cheese option if first cheese isn't added */
.extra_cheese_label {
  display: none; }

.cheese:checked ~ .burger_menu .extra_cheese_label {
  display: block; }

/* menu ticks */
.seeds:checked ~ .burger_menu .seeds_label:after,
.onion:checked ~ .burger_menu .onion_label:after,
.lettuce:checked ~ .burger_menu .lettuce_label:after,
.tomato:checked ~ .burger_menu .tomato_label:after,
.gherkins:checked ~ .burger_menu .gherkins_label:after,
.cheese:checked ~ .burger_menu .cheese_label:after,
.extra_cheese:checked ~ .burger_menu .extra_cheese_label:after,
.extra_patty:checked ~ .burger_menu .extra_patty_label:after,
.ketchup:checked ~ .burger_menu .ketchup_label:after {
  display: inline; }

/* hide extras by default */
#seeds,
#onion,
#lettuce,
#tomato,
#gherkins,
#cheese_2,
#cheese_1,
#ketchup,
#patty_1 {
  display: none; }

/* default position of extras when only they are displayed */
#patty_2 {
  transform: translate(0, -105px); }

#gherkins {
  transform: translate(0, -60px); }

#onion {
  transform: translate(0, -40px); }

#tomato {
  transform: translate(-350px, -110px); }

#cheese_1 {
  transform: translate(0, -55px); }

#ketchup {
  transform: translate(0, -150px); }

#patty_1 {
  transform: translate(0, -150px); }

#bottom_bun {
  transform: translate(0, -220px); }

/* show extra based on checkboxes */
.seeds:checked ~ svg #seeds,
.onion:checked ~ svg #onion,
.lettuce:checked ~ svg #lettuce,
.tomato:checked ~ svg #tomato,
.gherkins:checked ~ svg #gherkins,
.cheese:checked ~ svg #cheese_2,
.cheese:checked ~ .extra_cheese:checked ~ svg #cheese_1,
.ketchup:checked ~ svg #ketchup,
.extra_patty:checked ~ svg #patty_1 {
  display: block; }

/* change position of extras based on others being shown */
.cheese:checked ~ svg #patty_2,
.gherkins:checked ~ svg #patty_2 {
  transform: translate(0, -67px); }

.cheese:checked ~ svg #tomato {
  transform: translate(-350px, -40px); }

.cheese:checked ~ svg #gherkins,
.cheese:checked ~ svg #onion,
.gherkins:checked ~ .cheese:checked ~ svg #patty_2,
.gherkins:checked ~ svg #cheese_1,
.gherkins:checked ~ .cheese:checked ~ .extra_cheese:checked ~ svg #patty_1,
.gherkins:checked ~ .cheese:checked ~ .extra_cheese:checked ~ .extra_patty:checked ~ svg #bottom_bun,
.gherkins:checked ~ .cheese:checked ~ .extra_cheese:checked ~ svg #ketchup {
  transform: translate(0, 0); }

.gherkins:checked ~ svg #ketchup,
.cheese:checked ~ svg #ketchup {
  transform: translate(0, -110px); }

.gherkins:checked ~ .cheese:checked ~ svg #ketchup,
.cheese:checked ~ .extra_cheese:checked ~ svg #ketchup {
  transform: translate(0, -40px); }

.gherkins:checked ~ svg #patty_1,
.cheese:checked ~ svg #patty_1 {
  transform: translate(0, -112px); }

.gherkins:checked ~ .cheese:checked ~ svg #patty_1 {
  transform: translate(0, -45px); }

.gherkins:checked ~ svg #bottom_bun,
.cheese:checked ~ svg #bottom_bun {
  transform: translate(0, -180px); }

.extra_patty:checked ~ svg #bottom_bun {
  transform: translate(0, -150px); }

.gherkins:checked ~ .cheese:checked ~ svg #bottom_bun,
.gherkins:checked ~ .extra_patty:checked ~ svg #bottom_bun {
  transform: translate(0, -120px); }

.cheese:checked ~ .extra_cheese:checked ~ svg #bottom_bun,
.cheese:checked ~ .extra_patty:checked ~ svg #bottom_bun {
  transform: translate(0, -130px); }

.gherkins:checked ~ .cheese:checked ~ .extra_cheese:checked ~ svg #bottom_bun {
  transform: translate(0, -80px); }

.gherkins:checked ~ .cheese:checked ~ .extra_patty:checked ~ svg #bottom_bun {
  transform: translate(0, -50px); }

/*# sourceMappingURL=svg_burger.css.map */