@charset "utf-8";
/* CSS Document */

.tabs {
	text-align: center;
}
.tab {
	cursor: pointer;
	padding: 10px 20px;
	margin: 0px 20px;
	background: #fff;
	display: inline-block;
}
.panels {
	width: 100%;
	overflow: hidden;
	padding: 20px 0px;
}
.panel {
	display: none;
	animation: fadein .8s;
}
@keyframes fadein {
 from {
 opacity:0;
}
to {
 opacity:1;
}
}
.radio {
	display: none;
}
#one:checked ~ .panels #one-panel, #two:checked ~ .panels #two-panel, #three:checked ~ .panels #three-panel {
	display: block;
}
#one-tab {
	color: #ffb811;
	border: 2px solid #ce8900;
	background-color: transparent;
	border-radius: 50px;
	margin-bottom: 10px;
}
#two-tab {
	color: #39b54a;
	border: 2px solid #459c5a;
	background-color: transparent;
	border-radius: 50px;
		margin-bottom: 10px;
}
#three-tab {
	color: #0071bc;
	border: 2px solid #0085ce;
	background-color: transparent;
	border-radius: 50px;
		margin-bottom: 10px;
}
#one:checked ~ .tabs #one-tab{
	color: #fff;
	border: 2px solid #ce8900;
	background-color: #ffb811;
	border-radius: 50px;
}
#two:checked ~ .tabs #two-tab {
	color: #fff;
	border: 2px solid #459c5a;
	background-color: #39b54a;
	border-radius: 50px;
}
#three:checked ~ .tabs #three-tab {
	color: #fff;
	border: 2px solid #0085ce;
	background-color: #0071bc;
	border-radius: 50px;
}
@media only screen and (min-width: 600px) {
.tab {
	padding: 10px 30px;
}
}