body {
	/*background-image: linear-gradient(19deg, #21D4FD 0%, #B721FF 100%);
ccc; 
	background-repeat: no-repeat;
	font: 400 16px/1.5em "Open Sans", sans-serif;*/
}

/*
.page-content {
	max-width: 700px; 
	margin: 32px auto; 
	padding: 32px; 
	background: #fff;
}
*/

/*
a {
	color: #21D4FD; 
	transition: all 0.3s;
}
a:hover {
	color: #B721FF;
}
*/

.tabbed {
	overflow-x: hidden;
	margin: 1rem 0;
	padding-bottom: 16px;
	border-bottom: 1px solid #fff;
}

.tabbed [type="radio"] {
	/* hiding the inputs */
	display: none;
}

.tabs {
	display: flex;
	align-items: stretch;
	list-style: none;
	padding: 0;
	border-bottom: 1px solid #ccc;
}

.tab>label {
	display: block;
	margin-bottom: -1px;
	padding: 2px ;
	border: 1px solid #ccc;
	background: #eee;
	color: #666;
	font-size: 12px;
	font-weight: 600;
	/*text-transform: uppercase;*/
	letter-spacing: 1px;
	cursor: pointer;
	transition: all 0.3s;
}

.tab:hover label {
	border-top-color: #333;
	color: #333;
}

.tab-content {
	display: none;
	color: #777;
}

.tab-content ul li a {
	background: white !important;
	color: red;
	color: black;
	font-weight: normal;
	text-decoration: none;
}

.tabbed [type="radio"]:nth-of-type(1):checked~.tabs .tab:nth-of-type(1) label,
.tabbed [type="radio"]:nth-of-type(2):checked~.tabs .tab:nth-of-type(2) label,
.tabbed [type="radio"]:nth-of-type(3):checked~.tabs .tab:nth-of-type(3) label,
.tabbed [type="radio"]:nth-of-type(4):checked~.tabs .tab:nth-of-type(4) label,
.tabbed [type="radio"]:nth-of-type(5):checked~.tabs .tab:nth-of-type(5) label,
.tabbed [type="radio"]:nth-of-type(6):checked~.tabs .tab:nth-of-type(6) label,
.tabbed [type="radio"]:nth-of-type(7):checked~.tabs .tab:nth-of-type(7) label,
.tabbed [type="radio"]:nth-of-type(8):checked~.tabs .tab:nth-of-type(8) label,
.tabbed [type="radio"]:nth-of-type(9):checked~.tabs .tab:nth-of-type(9) label,
.tabbed [type="radio"]:nth-of-type(10):checked~.tabs .tab:nth-of-type(10) label,
.tabbed [type="radio"]:nth-of-type(11):checked~.tabs .tab:nth-of-type(11) label,
.tabbed [type="radio"]:nth-of-type(12):checked~.tabs .tab:nth-of-type(12) label,
.tabbed [type="radio"]:nth-of-type(13):checked~.tabs .tab:nth-of-type(13) label,
.tabbed [type="radio"]:nth-of-type(14):checked~.tabs .tab:nth-of-type(14) label,
.tabbed [type="radio"]:nth-of-type(15):checked~.tabs .tab:nth-of-type(15) label,
.tabbed [type="radio"]:nth-of-type(16):checked~.tabs .tab:nth-of-type(16) label,
.tabbed [type="radio"]:nth-of-type(17):checked~.tabs .tab:nth-of-type(17) label,
.tabbed [type="radio"]:nth-of-type(18):checked~.tabs .tab:nth-of-type(18) label,
.tabbed [type="radio"]:nth-of-type(19):checked~.tabs .tab:nth-of-type(19) label,
.tabbed [type="radio"]:nth-of-type(20):checked~.tabs .tab:nth-of-type(20) label,
.tabbed [type="radio"]:nth-of-type(21):checked~.tabs .tab:nth-of-type(21) label,
.tabbed [type="radio"]:nth-of-type(22):checked~.tabs .tab:nth-of-type(22) label,
.tabbed [type="radio"]:nth-of-type(23):checked~.tabs .tab:nth-of-type(23) label,
.tabbed [type="radio"]:nth-of-type(24):checked~.tabs .tab:nth-of-type(24) label,
.tabbed [type="radio"]:nth-of-type(25):checked~.tabs .tab:nth-of-type(25) label,
.tabbed [type="radio"]:nth-of-type(26):checked~.tabs .tab:nth-of-type(26) label,
.tabbed [type="radio"]:nth-of-type(27):checked~.tabs .tab:nth-of-type(27) label,
.tabbed [type="radio"]:nth-of-type(28):checked~.tabs .tab:nth-of-type(28) label,
.tabbed [type="radio"]:nth-of-type(29):checked~.tabs .tab:nth-of-type(29) label,
.tabbed [type="radio"]:nth-of-type(30):checked~.tabs .tab:nth-of-type(30) label,
.tabbed [type="radio"]:nth-of-type(31):checked~.tabs .tab:nth-of-type(31) label,
.tabbed [type="radio"]:nth-of-type(32):checked~.tabs .tab:nth-of-type(32) label {
	border-bottom-color: #fff;
	border-top-color: #B721FF;
	background: #fff;
	color: #222;
	color: red;
}

.tabbed [type="radio"]:nth-of-type(1):checked~.tab-content:nth-of-type(1),
.tabbed [type="radio"]:nth-of-type(2):checked~.tab-content:nth-of-type(2),
.tabbed [type="radio"]:nth-of-type(3):checked~.tab-content:nth-of-type(3),
.tabbed [type="radio"]:nth-of-type(4):checked~.tab-content:nth-of-type(4),
.tabbed [type="radio"]:nth-of-type(5):checked~.tab-content:nth-of-type(5),
.tabbed [type="radio"]:nth-of-type(6):checked~.tab-content:nth-of-type(6),
.tabbed [type="radio"]:nth-of-type(7):checked~.tab-content:nth-of-type(7),
.tabbed [type="radio"]:nth-of-type(8):checked~.tab-content:nth-of-type(8),
.tabbed [type="radio"]:nth-of-type(9):checked~.tab-content:nth-of-type(9),
.tabbed [type="radio"]:nth-of-type(10):checked~.tab-content:nth-of-type(10),
.tabbed [type="radio"]:nth-of-type(11):checked~.tab-content:nth-of-type(11),
.tabbed [type="radio"]:nth-of-type(12):checked~.tab-content:nth-of-type(12),
.tabbed [type="radio"]:nth-of-type(13):checked~.tab-content:nth-of-type(13),
.tabbed [type="radio"]:nth-of-type(14):checked~.tab-content:nth-of-type(14),
.tabbed [type="radio"]:nth-of-type(15):checked~.tab-content:nth-of-type(15),
.tabbed [type="radio"]:nth-of-type(16):checked~.tab-content:nth-of-type(16),
.tabbed [type="radio"]:nth-of-type(17):checked~.tab-content:nth-of-type(17),
.tabbed [type="radio"]:nth-of-type(18):checked~.tab-content:nth-of-type(18),
.tabbed [type="radio"]:nth-of-type(19):checked~.tab-content:nth-of-type(19),
.tabbed [type="radio"]:nth-of-type(20):checked~.tab-content:nth-of-type(20),
.tabbed [type="radio"]:nth-of-type(21):checked~.tab-content:nth-of-type(21),
.tabbed [type="radio"]:nth-of-type(22):checked~.tab-content:nth-of-type(22),
.tabbed [type="radio"]:nth-of-type(23):checked~.tab-content:nth-of-type(23),
.tabbed [type="radio"]:nth-of-type(24):checked~.tab-content:nth-of-type(24),
.tabbed [type="radio"]:nth-of-type(25):checked~.tab-content:nth-of-type(25),
.tabbed [type="radio"]:nth-of-type(26):checked~.tab-content:nth-of-type(26),
.tabbed [type="radio"]:nth-of-type(27):checked~.tab-content:nth-of-type(27),
.tabbed [type="radio"]:nth-of-type(28):checked~.tab-content:nth-of-type(28),
.tabbed [type="radio"]:nth-of-type(29):checked~.tab-content:nth-of-type(29),
.tabbed [type="radio"]:nth-of-type(30):checked~.tab-content:nth-of-type(30),
.tabbed [type="radio"]:nth-of-type(31):checked~.tab-content:nth-of-type(31) {
	display: block;
}