@import url(https://fonts.googleapis.com/css?family=Oswald);
html {
  background: #f0a800 !important; }

body {
  background: transparent !important;
  color: #8D5103 !important; }

h1, h2, h3, h4, h5, h6 {
  font-family: "Oswald", Arial, Helvetica, sans-serif !important;
  font-weight: 400 !important; }

header {
  padding-top: 60px;
}

main {
  padding-top: 20px;
  max-height: 50vh; }
  @media (min-width: 768px) {
    main {
      padding-top: 60px; } }

.logo {
  opacity: 0.7; }

.form {
  padding-top: 28px;
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.beer-name {
  margin: 0;
  height: 245px;
  display: flex;
  justify-content: center;
  align-items: center;
}

@media (min-width: 600px) {
  .beer-name {
    padding-top: 30px;
    height: 105px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}

.main-content span {
  font-family: "Oswald", Arial, Helvetica, sans-serif !important;
  white-space: nowrap;
  padding-left: 3px;
  padding-right: 10px;
}

.hardcore_mode {
  font-family: "Oswald", Arial, Helvetica, sans-serif !important;
  width: 20px;
  height: 20px;
  position: relative;
  display: inline-block;
  margin-left: 10px;
  background: #fcfff4;
  background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  border-radius: 50px;
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5); }
  .hardcore_mode label {
    width: 20px;
    height: 20px;
    cursor: pointer;
    position: absolute;
    left: 0px;
    top: 0px;
    background: linear-gradient(top, #222 0%, #45484d 100%);
    border-radius: 50px; }
    .hardcore_mode label:after {
      content: "";
      width: 16px;
      height: 16px;
      position: absolute;
      top: 2px;
      left: 2px;
      background: #8D5103;
      background: linear-gradient(top, #8D5103 0%, black 100%);
      opacity: 0;
      border-radius: 50px; }
    .hardcore_mode label:hover::after {
      opacity: 0.3; }
  .hardcore_mode input[type=checkbox] {
    visibility: hidden; }
    .hardcore_mode input[type=checkbox]:checked + label:after {
      opacity: 1; }

.input-container {
  display: inline-flex;
  flex-wrap: nowrap;
}

/* end .roundedOne */
.generate {
  font-family: "Oswald", Arial, Helvetica, sans-serif !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  padding: 6px 20px !important;
  color: #fff;
  background: #8D5103; }

.social {
  padding: 60px 0 20px; }

footer {
  position: absolute;
  bottom: 10px;
  left: 0;
  right: 0;
  color: white;
  font-size: 12px; }
  @media (min-width: 768px) {
    footer {
      bottom: 30px; } }
  footer .footer-content {
    padding-top: 10px;
    border-top: 1px solid white; }
    footer .footer-content a {
      text-decoration: underline;
      color: rgba(255, 255, 255, 0.7); }
      footer .footer-content a:hover {
        color: #fff; }

	footer .footer-content-counter {
		padding-top: 20px;
		color: #8D5103 !important;
	}

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */
/* Small devices (tablets, 768px and up) */
/* Medium devices (desktops, 992px and up) */
/* Large devices (large desktops, 1200px and up) */