@import "projects.css";
@import "contact.css";

body::after {
    content: '';
    background: linear-gradient(-45deg, #EE7752, #E73C7E, #23A6D5, #23D5AB) ;
    background-repeat: no-repeat;
    background-size: 400% 400%;
    background-attachment: fixed;
    opacity: 0.85;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: -1;
    animation: Gradient 15s ease infinite;
}

@keyframes Gradient {
	0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
}

a {
  color: white;
  text-decoration: none;
  font-family: arial, sans-serif;
  font-weight: 300;
}

h1, h2, h3, h4, h5, h6, p, span {
  color: white;
}

.home-content {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -o-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  /*padding-top: 200px;
  padding-bottom: 200px;*/
  height: calc(100vh - 19.5vh);
  align-items: center;
}

.home-inner-content {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -o-box-orient: vertical;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -moz-box-align: center;
  -o-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  padding: 0 50px;
  max-width: 100%;
}

.home-info-content {
    background-color: black;
    padding-top: 1em;
    padding-bottom: 1em;
}

.projects_home, .contact_home {
    margin: auto;
    padding-left: 15px;
    padding-right: 15px;
}

@media (min-width: 576px) {
    .home-content {
        height: calc(100vh - 82px)
    }
}