@import url("https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css")
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css")
@import url('https://fonts.googleapis.com/css?family=Josefin+Sans:700&display=swap')
@import url('https://fonts.googleapis.com/css?family=Poppins:400&display=swap')
@import url('https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css')

#mlh-landing
  #header-area
    background: #4A148C
    min-height: 100vh
    padding: 2vh 0
    .mlh-Logo
      max-width: 100vmin
      padding-top: 15vh
      width: 100%
    .amFOSSLogo, .amritaLogo
      max-width: 10rem
      min-width: 15vw
      width: 100%
      margin: 0
    .header-title
      height: 100%
    h1
      color: yellow
      text-transform: uppercase
      font-size: calc(1.5rem + 2.5vmax)
      line-height: 110%
      margin: 0

    h3
      color: white
      font-size: calc(1.2rem + 1.5vmax)

  #topbar
    background: white
    padding: 1rem
    border-bottom: 1px solid rgba(0,0,0,0.4)
    img
      width: 100%
      margin: 0

    #menu
      text-align: right
      a
        font-weight: 600
        font-size: 1rem
        padding: 1rem

      a:hover
        text-decoration: none
        background: #FFEB3B
        color: black



  #footer
    background: #333
    padding: 1rem
    position: absolute
    bottom: 0
    width: 100%

    #footer-menu
      text-align: right
      a
        font-weight: 400
        padding: 0.5rem

      a:hover
        text-decoration: none


  .mlh-section
    padding: 1rem

    h3
      font-size: calc(1rem + 1.5vw)


  #registration-form
    background: #006064


  .button
    background-color: #ffc107
    padding: 1rem 1.5rem
    font-weight: 900
    color: #000
    text-align: center
    vertical-align: middle
    border: none