 <style>
     @font-face {
        font-family: 'Inter';
        src: url('Fonts/Proxima Nova/proximanova_boldit.otf') format('otf');
    }
    .section {
      height: 100%;
      margin: 0;
      background-image:linear-gradient(to right, rgba(0, 0, 0, 40) 14%, rgba(0, 0, 0, 0) 50%), /* Dark to transparent gradient */
      url('../../v2/images/NY High-Line Bg.jpeg'); /* Background image */
      background-size: cover;
      background-position: center;
    }

    .hero{
      color: white;
      height: 100vh;
      display: flex;
      align-items: center;
      position: relative; /* Make the container position relative for absolute positioning of QR code */
    }

    .overlay {
      padding: 30px;
      border-radius: 8px;
      max-width: 500px;
      margin-left: 50px;
    }

    .title {
      font-size: 4rem;
      font-weight: bold;
    }

#logo{
	width:60px;
	height:60px;
}
    .subtitle {
      font-size: 1.rem;
      margin-bottom: 20px;
      text-transform: uppercase;
      color: #e0e0e0;
      font-weight: bold;
    }

    .description {
      font-size: 1.2rem;
      margin-bottom: 10px;
      font-weight: bold;
    }

    .qr-code-container {
      position: absolute; /* Position it at the bottom right */
      bottom: 20px;
      right: 20px;
      background-color: white; /* White background for QR code */
      border-radius: 10px; /* Rounded corners */
      padding: 10px; /* Optional padding */
      box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); /* Optional shadow */
    }

    .qr-code {
      width: 50px; /* Set width of QR code */
      height: 50px; /* Set height of QR code */
    }
	
		@media (max-width: 1199px) {
	.section{
		Background-image:url('../../v2/images/NY High-Line Bg.jpeg');
	}
	.overlay {
    padding: 0px;
	margin-left: 0px;
	}
	}
  </style>