@charset "utf-8";
/* CSS Expander THRdesign */
h2 {
	/* [disabled]text-align: center; */
}
p {
	/* [disabled]font-size: 13px; */
}
input {
  display: none;
  visibility: hidden;
}
label {
display: block;
    padding: 0.5em 0.5em;
    text-align: center;
    color: #7a706f;
    background-color: rgba(0,0,0,0.2);
    width: 160px;
    border-radius: 10px;
	margin-bottom: 10px;
}
label:hover {
  color: #000;
}
label::after {
	font-weight: 300;
	font-size: 26px;
	content: "+";
	vertical-align: middle;
	display: inline-block;
	width: 38px;
	height: 38px;
	margin-left: 10px;
	/* [disabled]background: radial-gradient(ellipse at center, #acb302 50%, transparent 50%); */
}
#expand_1 {
  	height: 0px;
    overflow: hidden;
	-moz-transition: height 1s ease-in-out;
  	-webkit-transition: height 1s ease-in-out;
  	-o-transition: height 1s ease-in-out;
	-ms-transition: height 1s ease-in-out;
    transition: height 1s ease-in-out;
    background-image: linear-gradient(to top, rgba(189,189,189,0.4) 0%, rgba(255,255,255,1) 50%);
	border-bottom-color: rgba(81,81,1,1);
    border-bottom-width: 1px;
    border-bottom-style: dotted;
}
#expand_2 {
  	height: 0px;
    overflow: hidden;
	-moz-transition: height 1s ease-in-out;
  	-webkit-transition: height 1s ease-in-out;
  	-o-transition: height 1s ease-in-out;
	-ms-transition: height 1s ease-in-out;
    transition: height 1s ease-in-out;
    background-image: linear-gradient(to top, rgba(189,189,189,0.4) 0%, rgba(255,255,255,1) 50%);
	border-bottom-color: rgba(81,81,1,1);
    border-bottom-width: 1px;
    border-bottom-style: dotted;
}
#expand_3 {
  	height: 0px;
    overflow: hidden;
	-moz-transition: height 1s ease-in-out;
  	-webkit-transition: height 1s ease-in-out;
  	-o-transition: height 1s ease-in-out;
	-ms-transition: height 1s ease-in-out;
    transition: height 1s  ease-in-out;
    background-image: linear-gradient(to top, rgba(189,189,189,0.4) 0%, rgba(255,255,255,1) 50%);
	border-bottom-color: rgba(81,81,1,1);
    border-bottom-width: 1px;
    border-bottom-style: dotted;
}
section {
  padding: 10px 20px;
	text-align: center;
}
#toggle_1:checked ~ #expand_1 {
  height: auto;
}
#toggle_1:checked ~ label.tog1::after {
  content: "-";
}
#toggle_2:checked ~ #expand_2 {
  height: auto;
}
#toggle_2:checked ~ label.tog2::after {
  content: "-";
}
#toggle_3:checked ~ #expand_3 {
  height: auto;
}
#toggle_3:checked ~ label.tog3::after {
  content: "-";
}

label, input[type="checkbox"] {
    cursor: pointer;
	clear: both;
	
}

@media all and (max-width: 640px) {
label {
display: block;
    padding: 0.2em 0.5em;
}
}