
.toggle-panel {
 	margin: 1em 0;  
}

.toggle-panel .toggle {
	background: #f2f2f1;
	padding: .5em 1em; 
    margin-bottom: 0; 
	display: table; 
  	position: relative;
	cursor: pointer; 
}

.toggle-panel .toggle:after {
	text-align: right; 
    content: "OPEN +";
    font-size: .75em;
    text-align: right;
    vertical-align: middle;
    display: table-cell;
    width: 120px;
    opacity: .3;
	transition: .25s;
}

.toggle-panel:hover .toggle span {
 	text-decoration: underline;  
}

.toggle-panel:hover .toggle:after {
	opacity: 1;     
}


.toggle-panel.open .toggle:after {
	content: "× CLOSE";
}

.toggle-panel .hidden-panel {
	height: 0;
    padding: 0 1em; 
	overflow: hidden;
	border: 1px solid #fff;
	transition: .25s;
}

.toggle-panel.open > .hidden-panel {
	height: auto;
	padding: 1em 1em;
	border: 1px solid #f2f2f1;
    background: #ffffff;
}































