main {
	float:left;
	margin-top: 10px;
	background: #fff;
}
section {
	display: none;
	padding: 10px;
	border-top: 1px solid #ddd;
	border: 1px solid #ddd;
	border-radius: 0px 5px 5px 5px;
	color: #888888;
}
input {
	display: none;
}

label {
	display: inline-block;
	margin: 0 0 -1px;
	padding: 15px 10px;
	font-weight: 600;
	text-align: center;
	color: #bbb;
	border: 1px solid transparent;
}

label:hover {
	color: #888;
	cursor: pointer;
}

input:checked + label {
	color: #555;
	border: 1px solid #ddd;
	border-top: 2px solid red;
	border-bottom: 1px solid #fff;
}

#tab1:checked ~ #content1,
#tab2:checked ~ #content2,
#tab3:checked ~ #content3,
#tab4:checked ~ #content4,
#tab5:checked ~ #content5, 
#tab6:checked ~ #content6,
#tab7:checked ~ #content7, 
#tab8:checked ~ #content8,
#tab9:checked ~ #content9, 
#tab10:checked ~ #content10, 
#tab11:checked ~ #content11, 
#tab12:checked ~ #content12 {
	display: block;
}

@media screen and (max-width: 650px) {
  label {
	font-size: 0;
  }
  label:before {
	margin: 0;
	font-size: 18px;
  }
}

@media screen and (max-width: 400px) {
  label {
	padding: 15px;
  }
}

ul.enlarge {
	list-style-type:none; 
}

ul.enlarge li {
	display: inline-block; 
	position: relative; 
	z-index: 0; 
	margin:10px 40px 0 20px; 
}

ul.enlarge span {
	position: absolute; 
	left: -9999px; 
}

ul.enlarge img {
	border:1px solid #c4c4c4;
	padding: 5px;
	background-color: white;
}

ul.enlarge li:hover {
	z-index: 50; 
	cursor:pointer; 
}

ul.enlarge li:hover span { 
	top: 0px; 
	left: -20px; 
}

ul.enlarge li:hover:nth-child(2) span{
	left: -100px; 
}
ul.enlarge li:hover:nth-child(3) span{
	left: -200px; 
}