/* Place all the styles related to the Gigs controller here.
   They will automatically be included in application.css. */

.form-wrapper {
  background-color: #FFF;
  padding: 10px;
}
/* Place all the styles related to the StaticPages controller here.
   They will automatically be included in application.css. */

.home-background {
  background: url(/assets/flames-84666565dbda536a79d1a782f99b4a13ddfb16118c4667cd9e871c926736d7c2.jpg);
  background-size: cover;
  width: 100%;
  background-position: center;
  height: 100vh;
  z-index: 10;
}

.pattern-background {
  background: url(/assets/pattern-f9829b8817acc54234bdff1baad77fc2bb8656bf305d4ec5ba34a69f5db5b6ae.jpg);
  padding: 20px;
  border-radius: 20px;
  margin-bottom: 20px;
}

.dark-background {
  background: url(/assets/dark-background-df49e0ae0b1b30db51c81b4d75bd26b978744681c87e826ecc32f9dab6606f98.png);
  background-repeat: repeat;
  z-index: 0;
  padding-top: 60px;
}

.border-radius {
  border-style: solid;
  border-radius: 5px;
  border-width: thin;
  border-color: #CDCDCD;
  background-color: rgba(255,255,255,0.9);
  margin: 15px;
  padding: 5px;
}

.content-container {
  width: 80%;
  margin: auto;
}

.section {
  margin-top: 60px
}

.big-logo {
  margin-top: 30vh;
  transition: all 1s ease-in-out;
  perspective: 800px;
  perspective-origin: 50% 100px;
}

.big-logo:hover {
  transform: rotateZ(720deg);
}

.full-image {
  width: 100%;
  padding: 20px;
}

.white-text {
  color: white;
}

.page-wrapper {
  width: 90%;
  margin: auto;
  margin-top: 50px;
}

.footer {
  padding: 20px;
  background-color: #333333;
  color: white;
  margin-top: 30;
}

.flex-wrapper {
  margin: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.image-wrapper {
  width: 380px;
  height: 300px;
  margin: 10px;
  overflow: hidden;
}

.nav-logo {
  width: 45px;
  position: absolute;
  top: -0px;
}

.logo-medium {
  width: 155px;
}

.photo {
  max-width: 100%;
  max-height: 100%;
}

.form-center {
  width: 80%;
  margin: auto;
}

.list-font {
  font-weight: bold;
  font-size: 1.3em;
  margin-top: 20px;
}

.list-font li {
  margin-bottom: 6px;
}

.spacing {
  letter-spacing: 2px;
  padding-top: 5px;
}

.small-fb {
  width: 30px;
}

.thin-font {
  font-weight: lighter;
}

/* ---------------------------------------------- *
 * Mouse animate icon
 * ---------------------------------------------- */
.mouse-icon {
  position: absolute;
  left: 50%;
  bottom: 40px;
  border: 2px solid #fff;
  border-radius: 16px;
  height: 40px;
  width: 24px;
  margin-left: -15px;
  display: block;
  z-index: 10;
  opacity: 0.7;
}
.mouse-icon .wheel {
  -webkit-animation-name: drop;
  -webkit-animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-delay: 0s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-play-state: running;
          animation-name: drop;
          animation-duration: 1s;
          animation-timing-function: linear;
          animation-delay: 0s;
          animation-iteration-count: infinite;
          animation-play-state: running;
}
.mouse-icon .wheel {
  position: relative;
  border-radius: 10px;
  background: #fff;
  width: 2px;
  height: 6px;
  top: 4px;
  margin-left: auto;
  margin-right: auto;
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */

body {
  width: 100%
}

.nav-wrapper {
  padding-left: 10px;
}

.nav-color {
  background-color: #CDCDCD;
}

.nav-container {
  width: 95%;
  margin: auto;
  padding: 5px;
}