@font-face
	{
		font-family: canterbury;
		font-style: normal;
		font-weight: normal;
		src: url('fonts.woff/canterbury.woff') format('woff');
	}
@font-face
	{

		font-family: modernno20;
		font-style: normal;
		font-weight: normal;
		src: url('fonts.woff/modernno20.woff') format('woff');
	}
*	, 
*	::before, 
*	::after
	{
		box-sizing: border-box;
	}
h1	{
		margin-top: 0px;
    		font-family: canterbury, serif;
		color: black;
		font-weight: normal;
		text-align: center;
		font-size: 2em;	
	}
h5	{
		margin-top: 0px;
    		font-family: canterbury, serif;
		color: black;
		text-align: center;
		font-size: 100%;
	}
h6	{
		margin-top: 0px;
		margin-bottom: 0px;
    		font-family: modernno20, serif;
		color: black;
		text-align: center;
		line-height: 1.3em;
		font-size: 1em;	
	}
body	{
		background: green;
		margin:0;
    		font-family: modernno20, serif;
		color: black;
		text-align: justify;
		line-height: 1.3em;
		font-size: 1em;	
	}
.headrow
	{
		display: flex;
		flex-direction: row;
		width: 100%;
		margin: 0;
		background: pink;
	}
.searchrow
	{
		display: flex;
		flex-direction: row;
		width: 100%;
		margin: 0;
		background: bisque;
	}
.navrow
	{
		display: flex;
		flex-direction: row;
		width: 100%;
		margin: 0;
		background: lightblue;
	}
.leftcolumn
	{
		display: flex;
		flex-direction: column;
		float: left;
		width: 25%;
		margin: 0;
		background: orange;
	}
.middlecolumn
	{
		display: flex;
		flex-direction: column;
		float: left;
		width: 50%;
		margin: 0;
		background: lightgreen;
	}
.rightcolumn
	{
		display: flex;
		flex-direction: column;
		float: left;
		width: 25%;
		margin: 0;
		background: yellow;
	}
.footrow
	{
		display: flex;
		flex-direction: row;
		width: 100%;
		margin: 0;
		background: cyan;
	}
.boxheadrow1
	{
		display: block;
		width: 25%;
		height: 56px;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 35px;
	}
.boxheadrow2
	{
		display: block;
		width: 50%;
		height: 56px;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 35px;
	}
.boxheadrow3
	{
		display: block;
		width: 25%;
		height: 56px;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 35px;
	}
.boxsearchrow1
	{
		display: block;
		width: 25%;
		height: 56px;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 35px;
	}
.boxsearchrow2
	{
		display: block;
		width: 50%;
		height: 56px;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 35px;
	}
.boxsearchrow3
	{
		display: block;
		width: 25%;
		height: 56px;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 1.2em;
		font-size: 0.9em;
	}
.boxnavrow1
	{
		display: block;
		width: 25%;
		height: 56px;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 35px;
	}
.boxnavrow2
	{
		display: block;
		width: 50%;
		height: 56px;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 35px;
	}
.boxnavrow3
	{
		display: block;
		width: 25%;
		height: 56px;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 35px;
	}
.column1box7
	{
		display: block;
		overflow: hidden;
		min-height: 0;
		height: 120px;
		width: 100%;
		border: 3px solid blue !important;
		margin: 0;
		padding: 3px;
		text-align: justify;
		line-height: 1.3em;
	}
.column1box8
	{
		display: block;
		overflow: hidden;
		min-height: 0;
		height: 120px;
		width: 100%;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 130px;
	}
.column1box9
	{
		display: block;
		overflow: hidden;
		min-height: 0;
		height: 120px;
		width: 100%;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 130px;
	}
.column2box10
	{
		display: block;
		overflow: hidden;
		min-height: 0;
		height: 120px;
		width: 100%;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 40px;
	}
.column2box11
	{
		display: block;
		overflow: hidden;
		min-height: 0;
		height: 120px;
		width: 100%;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 40px;
	}
.column2box12
	{
		display: block;
		overflow: hidden;
		min-height: 0;
		height: 120px;
		width: 100%;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 40px;
	}
.column3box13
	{
		display: block;
		overflow: hidden;
		min-height: 0;
		height: 120px;
		width: 100%;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 40px;
	}
.column3box14
	{
		display: block;
		overflow: hidden;
		min-height: 0;
		height: 120px;
		width: 100%;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 40px;
	}
.column3box15
	{
		display: block;
		overflow: hidden;
		min-height: 0;
		height: 120px;
		width: 100%;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 40px;
	}
.boxfootrow1
	{
		display: block;
		overflow: hidden;
		min-height: 0;
		height: 56px;
		width: 25%;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 40px;
	}
.boxfootrow2
	{
		display: block;
		overflow: hidden;
		min-height: 0;
		width: 50%;
		height: 56px;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 40px;
	}
.boxfootrow3
	{
		display: block;
		overflow: hidden;
		min-height: 0;
		width: 25%;
		height: 56px;
		border: 3px solid blue !important;
		margin: 0;
		text-align: center;
		line-height: 40px;
	}
@media screen and (max-width: 692px)
	{
		.headrow
			{
				display: flex;
				flex-direction: column;
			}
			.boxheadrow1
				{
					order: 2;
					width: 100%;
				}
			.boxheadrow2
				{
					order: -1;
					width: 100%;
				}
			.boxheadrow3
				{
					order: 1;
					width: 100%;
				}
		.searchrow
			{
				display: flex;
				flex-direction: column;
			}
			.boxsearchrow1
				{
					order: -1;
					width: 100%;
				}
			.boxsearchrow2
				{
					order: 0;
					width: 100%;
				}
			.boxsearchrow3
				{
					order: 1;
					width: 100%;
				}
		.navrow
			{
				display: flex;
				flex-direction: column;
			}
			.boxnavrow1
				{
					order: 2;
					width: 100%;
				}
			.boxnavrow2
				{
					order: 3;
					width: 100%;
				}
			.boxnavrow3
				{
					order: -1;
					width: 100%;
				}
		.leftcolumn
			{
				display: flex;
				flex-direction: column;
				width: 100%;
			}
			.column1box7
				{
					order: 9;
					width: 100%;
				}
			.column1box8
				{
					order: 7;
					width: 100%;
				}
			.column1box9
				{
					order: 8;
					width: 100%;
				}
		.middlecolumn
			{
				display: flex;
				flex-direction: column;
				width: 100%;
			}
			.column2box10
				{
					order: 11;
					width: 100%;
				}
			.column2box11
				{
					order: 12;
					width: 100%;
				}
			.column2box12
				{
					order: 10;
					width: 100%;
				}
		.rightcolumn
			{
				display: flex;
				flex-direction: column;
				width: 100%;
			}
			.column3box13
				{
					order: 14;
					width: 100%;
				}
			.column3box14
				{
					order: 15;
					width: 100%;
				}
			.column3box15
				{
					order: 13;
					width: 100%;
				}
		.footrow
			{
				display: flex;
				flex-direction: column;
			}
			.boxfootrow1
				{
					order: 17;
					width: 100%;
				}
			.boxfootrow2
				{
					order: 18;
					width: 100%;
				}
			.boxfootrow3
				{
					order: 16;
					width: 100%;
				}
	}

/*

/*
Safari 6.1+.
div#box:nth-child  {-webkit-order: 2;}
div#col-2  {-webkit-order: 1;}
div#col-3 {-webkit-order: 3;}
Standard syntax.
div#col-1  {order: 2;}
div#col-2  {order: 1;}
div#col-3 {order: 3;}
/*

*/