html {
		font-size: 16px;
		height: 100%;
		width: 100%;
	}
	
	body {
		height: 100%;
		margin: 0;
		font-family: Oswald;
		font-style: normal;
		font-size: 1.6rem;
    }
	
	h1 {
		text-transform: uppercase;
	}

    .bg-image {
      background: url('../img/background.png') no-repeat center center/cover;
      position: relative;
      height: 100%;
    }

    .overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.6);
    }

    .content {
      position: relative;
      z-index: 2;
      color: white;
	  animation: fadeIn 1s ease-out;
    }

    .social-icons a {
      color: #fc5000;
      font-size: 2.4rem;
      margin: 0 10px;
      transition: 0.3s;
    }

    .social-icons a:hover {
      color: #ffac85;
      transform: scale(1.2);
    }
	
	.logo {
      max-width: 360px;
      margin-bottom: 20px;
    }
	
	footer {
		position: absolute;
		bottom: 0;
		width: 100%;
		background: rgba(0,0,0,0.4);
		color: #aaa;
		font-size: 1rem;
	}
	
	@keyframes fadeIn {
		from {
			opacity: 0;
			transform: translateY(60px);
		}
		to {
			opacity: 1;
			transform: translateY(0);
		}
	}
	
	@media (max-width: 576px) {
		h1 {
			font-size: 1.8rem;
		}
		.logo {
			max-width: 300px;
		}
	}