* {
	box-sizing: border-box;
}
body {
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
}
.logo {
	text-align: center;
	padding-bottom: 15px;
}
.sidenav {
	height: 100%;
	width: 350px;
	position: fixed;
	z-index: 1;
	top: 0;
	left: 0;
	background-color: #111;
	overflow-x: hidden;
}
.sidenav img {
	padding: 10px;
}
.sidenav h1 {
	Color: white;
	font-family: 'Nixieone';
	font-size: 29px;
}
.sidenav a {
	color: white;
	padding: 16px;
	text-decoration: none;
	display: block;
	font-family: Times, Times New Roman, serif;
}
.sidenav a:hover {
	background-color: #fdad5c;
	color: black;
}
a[href*="https://meet.google.com/"] {
	background: url(image/meet_32dp.png) no-repeat 5% 50%;
	padding-left: 55px;
}
a[href*="https://www.youtube.com/"] {
	background: url(image/youtube_32.png) no-repeat 5% 50%;
	padding-left: 55px;
}
.content {
	margin-left: 350px;
	padding-left: 20px;
	font-family: Times, Times New Roman, serif;
	overflow: auto;
}
.column.left {
	float: left;
	padding-left: 10px;
}
.column.left img {
    vertical-align: -9px;
}
.column.right {
	float: left;
	padding-left: 30px;
}
.column.right img{
	vertical-align: -9px;
}
video, #cssfilters-video, #screenshot-img {
	width: 400px;
	height: 300px;
}
video, #cssfilters-stream {
	background: rgba(255, 255, 255, 0.5);
	border: 3px solid #ccc;
}
.audio {
	padding-top: 5px;
}
.mic {
}
button {
	padding: 10px;
	background-color: #6a67ce;
	color: #FFFFFF;
	border: 0px;
	cursor: pointer;
	border-radius: 5px;
}
#output {
	background-color: #F9F9F9;
	padding: 10px;
	width: 100%;
	margin-top: 20px;
	line-height: 30px;
}
.hide {
	display: none;
}
.show {
	display: block;
}
.footer {
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        text-align: center;
        font-size: 12px;
}
.footer a {
        color: black;
}
.footer a:hover {
	color: red;
}