.wof_container
{
	width:100%;
	margin:auto;
	max-width:940px;
	padding-bottom:50px;
}

.wof_container h2
{
	font-size: 20pt;
	letter-spacing: 0pt;
	font-weight: bold;
	margin-top: 10px;
	margin-bottom: 20px;
	color: #794d01;
}

.wof_container>ul
{
	display:flex;
}


.wof_container>ul>li
{
	/*width:33%;
	display:inline-block;*/
	flex:1;

}

.wof_container>ul>li button 
{
	width:100%;
	border: none;
	background-color: transparent;
	cursor:pointer;

	

}

.wof_container>ul>li button .logo img
{
	transition: all 100ms cubic-bezier(0.395, 0.095, 0.405, 1.000);
}
.wof_container>ul>li button:hover .logo img
{
	transform: scale(1.2);
}

.wof_container>ul>li h3
{
	font-size: 15pt;
	color: #794d01;
	font-weight: 400;
	letter-spacing: 1pt;
	
	color: #794d01;
	width: fit-content;
	padding: 5px 20px;
	padding-bottom: 10px;
	border-radius: 15pt;
	margin: auto;
	margin-top: 10px;
	margin-bottom: 20px;
}



.wof_container>ul>li.open h3
{
	background-color: #956d29;
	color: #fffdf1;
}

.wof_container>ul>li button img
{
	height:70px;
	display: block;
	margin:auto;
}


.wof_container .wof_panel_content .wof_number .logo
{
	border-radius: 8px;
	width:100%;
	height:100px;
	overflow:hidden;
}

.wof_container .wof_panel_content .wof_number .logo img
{
	width:100%;
}

.wof_container .wof_panel_content
{
	width:100%;
	margin: auto;
	display: flex;
	justify-content:space-evenly;
}

.wof_container .wof_panel_content .wof_number
{

	width:32%;
}

.wof_container .wof_panel_content .wof_number h4
{
	font-size: 8pt;
	text-align: center;
	color:var(--clear);
	margin-top: 5px;
}

.wof_container .wof_panel_content .wof_number .number
{
	
	text-align: center;
	font-size: 25pt;
	font-weight: 300;
}

.wof_container .wof_panel_content .wof_number .description
{
	padding:0px 5px;
	font-size: 12pt;
	line-height: 20pt;
}


.wof_panel
{
	transition: all 100ms cubic-bezier(0.395, 0.095, 0.405, 1.000); 
	overflow: hidden;
	height: 0px;
}

.wof_panel.open
{
	height:auto;
}

@media only screen and (max-width: 700px)
{
	.wof_container>ul>li h3
	{
		font-size: 11pt;
		padding: 5px 15px;
	}

	.wof_container .wof_panel_content .wof_number .description {
		font-size: 11pt;
		line-height: 18pt;
	}
}


@media only screen and (max-width: 750px)
{
	.wof_container .wof_panel_content .wof_number .logo {
		height: 75px;
	}

	.wof_container .wof_panel_content .wof_number .number {
		
		font-size: 18pt;
		margin-top: 10px;
		margin-bottom: 10px;
	}


}

@media only screen and (max-width: 700px)
{
	.wof_container>ul>li h3
	{
		font-size: 11pt;
		padding: 5px 15px;
	}
}

@media only screen and (max-width: 550px)
{
	.wof_container>ul>li h3
	{
		font-size: 11pt;
		padding: 5px 15px;
	}

}

@media only screen and (max-width: 450px)
{
	.wof_container .wof_panel_content
	{
		display: block;
	}

	.wof_container .wof_panel_content .wof_number {
		width: calc(95% - 10px);
		margin: auto;
	}

	 .wof_container .wof_panel_content .wof_number .logo {
		text-align: center;
	}

	.wof_container .wof_panel_content .wof_number .logo img {
		width: 230px;
	}
}

@media only screen and (max-width: 400px)
{
	.wof_container > ul > li button img
	{
  		height: 60px;
	}

	.wof_container>ul>li h3
	{
		font-size: 8pt;
	}
}