*, *:before, *:after 
{
	-webkit-box-sizing: inherit;
	-moz-box-sizing: inherit;
	box-sizing: inherit;
	margin:0px;
	word-wrap: break-word;
}

html
{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	max-width: 100%;
}

body
{
	padding:0px;
	font-family: sans-serif;
	display: flex;
  	flex-direction: column;
  	min-height: 100vh;
    justify-content: space-between;

}

/*patch for wp admin bar size*/
body.customize-support
{ min-height: calc(100vh - 32px); }


@media screen and (max-width: 782px)
{
	body.customize-support
	{ min-height: calc(100vh - 46px); }
	html #wpadminbar { 	min-width: 0px; }
	html #wpadminbar #wp-admin-bar-wp-logo>.ab-item .ab-icon:before
	{ top:10px; }
}

header, footer{
	flex: 0 0 auto;
}

main{
	flex:1 0 auto
}

#function-area{
	flex: 0 0 0px;
}

section
{
	max-width: 1200px;
	margin: auto;
	display: block;
}


main section
{
	padding: 100px 0px;
}

.double-view{
	display: flex;
	flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
	
}
.double-view > div
{
	max-width: 50%;
}

.toggle-box
{
	display: block;
}

.toggle-box > input
{
	display: none;
}

.toggle-box > div
{
	overflow: hidden;
    max-height: 0;
    transition: max-height 0.15s ease-out;
}

.toggle-box >input:checked ~ div
{
    max-height: 500px;
    transition: max-height 0.25s ease-in;
}

.toggle-box > div p
{
	padding: 10px;
}

.showable
{
	padding: 10px;
	margin: 5px;
	border: 1px solid black;	
}


/*override these custom settings*/
.bgA, .bgA-hover:hover{
	background-color: #c7d6c4;
}
.bgB, .bgB-hover:hover{
	background-color: #434343;
}
.bgC, .bgC-hover:hover{
	background-color: #80bd80;
}

/*nav menu*/
ul.main-navigation-list, .main-navigation-list ul{
	padding:0px;
	display:flex;
    justify-content: center;
    flex-wrap: wrap;
}

.main-navigation-list li{
	margin:0px;
	list-style: none;
	flex:1 1 200px;
	text-align: center;
	border:1px solid black;
	margin: 2px;
	max-width: 300px;
	background-color:#80bd80;
}

.main-navigation-list a{
	color:inherit;
	text-decoration: inherit;
	display: block;
	padding: 10px;
}

.main-navigation-list{
	
	font-size: 14pt;
	color:black;
}
