@charset "UTF-8";
/* CSS Document */

html {
	/*https://www.webfx.com/blog/web-design/responsive-background-image/*/
}

body {
	font-family: 'Open Sans', sans-serif;
}

.container {
  min-height: 100vh; 
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;

}

#hero {
  background: linear-gradient(rgba(40, 58, 90, 0.3), rgba(40, 58, 90, 0.1)), url("../assets/img/girl-in-field.png") center right no-repeat;
  background-size: cover;	
}


h1 {
  font-family: 'Berkshire Swash', cursive;
  font-size: 48px;
  font-weight: 700;
  line-height: 56px;
  color: #fff;	 
}

h2 {
   color: #525252;
  font-size: 36px;
  font-weight: 700;
}

/*Large devices*/
@media (min-width: 992px) { 
	#hero {	
	background-position: center center;
	}
}
/*Medium devices*/
@media (min-width: 768px) { 
	#hero {	
	background-position: center center;
	}
}
/*Small devices*/
@media (min-width: 481px) {
	#hero {	
	background-position: center center;
	}	
}
/*Extra-small devices*/
@media screen and (max-width: 480px) {
	#hero {	
	background-position: center center;
	}	
}