@import "bootstrap/mixins"
@import "bootstrap/variables"

#home-view
  
  h1
    text-align: center
    margin-top: 0
    
  #trailer-wrapper iframe
    display: block
    margin: 0 auto

  .game-mode-wrapper
    position: relative
    margin-bottom: 60px
    
    img
      display: block
      margin: 0 auto

    text-shadow: 2px 2px 5px black
    
    h3
      color: $yellow
      position: absolute
      top: 10px
      left: 40px
      font-size: 70px
      margin-top: 0
      
    h4
      color: #e8d9c5
      position: absolute
      top: 75px
      left: 140px
      font-size: 30px
      margin-top: 0
      
    .play-text
      position: absolute
      right: 45px
      bottom: -25px
      color: $yellow
      font-size: 90px
      font-family: Bangers
      @include transition(color .10s linear)
          
    &:hover div
      color: lighten($yellow, 20%)
    &:hover img
      filter: brightness(1.1)
      -webkit-filter: brightness(1.1)
  
#multiplayer-launch-modal
  .modal-dialog
    width: 700px

  .modal-header
    text-align: center

  .modal-body
    padding-bottom: 0px
 
  .modal-footer
    padding-top: 0px