* {
	margin:0;
	font-family: sans-serif;
}

body{
	display: flex;
	overflow: hidden;
}

header{
	display: flex;
    background-color: #2196F3;
    position: fixed;
    color: #fff;
	width: 100%;
	box-shadow: #0005 0px 4px 8px;
	
}

header p{
	padding: 1em 2em;
}

.schedule{
	margin: 2em 2em;
	width: 40%;
	overflow: scroll;
}
	.timeslot{
		margin: 2em 0;
		border-bottom: 1px solid #0004;
	}
	.timeslot span{
		font-weight: bold;
		font-size: 24pt;
		color: #673ab7;
	}
		.event{
			margin: 1em 4em;
		}
		h5{
			font-size: 18pt;
			font-weight: 100;
		}
		h6{
			font-size: 12pt;
			font-weight: 100;
			color:#5a5a5a;
		}
.description {
	width: 80%;	
}
	.picture{
		min-height: 240px;
		background-color: #9c2780;
	}
/* Room Color. Up to 16? */
.room{
    padding: .5em;
    width: 4em;
    text-align: center;
}

.room1{background-color:#F44336; color:#fff;}
.room2{background-color:#E91E63; color:#fff}
.room3{background-color:#9c27b0; color:#fff}
.room4{background-color:#673ab7; color:#fff}
.room0{background-color:#009688; color:#fff}
.room6{background-color:#005e8a; color:#fff}
.room7{background-color:#000; color:#fff}
.room8{background-color:#000; color:#fff}
.room9{border:3px solid #000; color:#000}
.room10{border:3px solid #000; color:#000}
.room11{border:3px solid #000; color:#000}
.room12{border:3px solid #000; color:#000}
.room13{border:3px solid #000; color:#000}
.room14{border:3px solid #000; color:#000}
.room15{border:3px solid #000; color:#000}
.room16{border:3px solid #000; color:#000}



@media(min-width: 320px) and (max-width: 910.5px) {
	.description{
	    width: 80%;
	    display: none;
	}
	
	.schedule{
		width:100%;
		height:auto !important;
	}
	
	body{
		overflow: scroll;
	}


}