@font-face {
    font-family: Roboto;
    src: url(../../_fonts/roboto-v29-latin-ext_latin-regular.woff);
}

@font-face {
    font-family: Roboto-Medium;
    src: url(../../_fonts/Roboto-Medium.woff);
}


html, body{
	background: url(../_img/bg.jpg) no-repeat center center fixed; 
	font-family: Roboto, "Helvetica Neue", Arial, sans-serif !important;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height:100% !important; /* important to vertically align the container */
	margin:0 auto;
    padding:0;
	font-size: 15px;
}

.vertical-center {
	min-height: 100%;  /* Fallback for browsers do NOT support vh unit */
	min-height: 100vh; /* These two lines are counted as one <img draggable="false" class="emoji" alt="🙂" src="https://s.w.org/images/core/emoji/72x72/1f642.png">       */
	display: flex;
	align-items: center;
}

.whiteBox {
    max-width: 900px;
    background: white;
    box-shadow: 4px 4px 20px rgb(0 0 0 / 20%);
    -webkit-transition: width 2s;
    transition: width 2s;
    -webkit-transition: height 2s;
    transition: height 2s;
} 
h1, h2, h3, h4, h5 {
	font-family: Roboto-Medium; 
	font-weight: 500;
}

.content {
	height: 100%;
	width: 100%;
  }