.left {
  float: left;
  width: 20%;
}

.main {
  float: left;
  width: 60%;
}

.right {
  float: left;
  width: 20%;
}

@media only screen and (max-width: 800px) {
  .left, .main, .right {
    width: 100%;
  }
}

.tab {
	overflow: hidden;
	border: 1px solid #ccc;
	background-color: #f1f1f1;
}

.tablink {
	background-color: inherit;
	float: left;
	border: none;
	outline: none;
	cursor: pointer;
	padding: 14px 16px;
	transition: 0.3s;
}

.tab button:hover {
	background-color: #ddd;
}

.tab button.active {
	background-color: #ccc;
}

.tabcontent {
	display: none;
	padding: 6px 12px;
	border: 1px solid #ccc;
	border-top: none;
	animation: fadeEffect 1s;
}

@keyframes fadeEffect {
	from { opacity: 0; }
	to { opacity: 1; }
}
