@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: 30px;
  	font-family: futura-medium;
}

.row {
	padding-top: 30px;
	padding-bottom: 30px;
	display:flex;
	align-items:center;
	text-align: center;
}

#row-3 {
	padding-top: 0px;
}

.webcam {
	height: 100%;
	width: 100%;
	display:flex;
    align-items:center;
    overflow: hidden;
}

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

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

.circle-left {
	float: right;
}

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

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