@font-face {
  font-family: futura-book;
  src: url("futura-book.ttf");
}
@font-face {
  font-family: futura-medium;
  src: url("futura-book.ttf");
}
@font-face {
  font-family: futura-oblique;
  src: url("futura-book.ttf");
}
@font-face {
  font-family: futura-demi;
  src: url("futura-pt-demi.otf");
}
@font-face {
  font-family: futura-bold;
  src: url("futura-book.ttf");
}

html, body {
    height:100%;
}

body {
	background-color: #131312;
	padding-top: 0px;
	padding-bottom: 0px;
  	font-family: futura-medium;

  	background: url(../images/black.png) no-repeat center center fixed; 
  	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;

    display:flex;
    align-items:center;
}

.logo {
	position: absolute;
	top: 0;
	left: 0;
	margin-left: 40px;
	margin-top: 40px;
}

.row {
	display:flex;
    align-items:center;
}

.webcam {
	height: 600px;
	width: 337.5px;

	display:flex;
    align-items:center;
}

.webcam img {
	position: absolute;
	left: 0px;
}

.circle {
	margin: 0px auto;
	background-color: #fff;
	border-radius: 50%;
	width: 150px;
	height: 150px; 
	color: black;
	display:flex;
	align-items:center;
	text-align: center;
}

.circle-grey {
	background-color: #777;
}

.circle font {
	width: 100%;
	text-align: center;
	font-size: 80px;
}