html, body {
	margin: 0;
	padding: 0;
}

.container {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
  	flex-direction: row;
  	flex-wrap: wrap;
  	justify-content: space-around;
	padding: 3px;
	margin: 0;
	width: 95%;
	border: 2px solid black;
}

.controlls, .code_area, .output_aream  {
  	width: 100%;
}

.banner {
	display: none;
}

textarea, iframe {
	border: 2px solid #ddd;
	height: 300px;	
	width: 100%;
	resize: none;
}

@media only screen and (min-width: 768px) {
  .code_area, .output_area {
    width: 46%;
  }
  .banner {
  	display: inline;
  	width: 100%;
  	margin: auto;
  }
}