#diaryHeader 	{display:block; background-color:#1F4E7D; color:#ffffff; border:none; padding:6px 0;}
.colHeader 		{background-color:#1F4E7D; color:#ffffff; border:none; text-align:left; margin:0; padding:0;}
.diaryoffset	{margin-left:10%; clear:both;}

.diaryTypeHeader {display:block; margin:auto; max-width:98%; text-align:center;}
.diaryTypeHeaderContainer {display:block;  text-align:center; margin:auto;}
.diaryTypeHeaderDateContainer {display:inline-block;  text-align:center;  margin:auto;}
.diaryTypeForm {margin:auto; text-align:center;}


.diaryFullSlimButtons {margin:auto; display:inline-block; text-align:center;}
.diaryFullSlim { padding:5px; display:inline;}



/* <435 pixel layout required (just new line everything? */
/* time/date doesn't always appear correctly on narrow (435? 690?) windows */

/* Wide / medium / narrow (960px, 690px) split */	
@media only screen and (max-width:689px) 
{
	.diaryFullSlimBuildEquip {display:inline-block;}
	.diaryFullSlimDeptBooker {display:inline-block;}

	.narrowClear {clear:both;}
	.veryNarrowClear {clear:both;}
	.wideButton {display:none;}

	.diaryColName 	{float:left; width:45%; }
	.diaryColStatus {clear:left; float:right; width:45%; min-width:110px; min-height:25px;}
	.diaryColDelCol {float:right; width:45%; min-height:25px;}
	.diaryColRoom 	{float:left; width:45%; }
	.diaryColTimes 	{clear:left; float:left; width:90%; }

	.diaryColEquipNL	{float:left; width:80%;}
	.diaryColNotesNL, .diaryColRepliesNL	{clear:both; width:100%;}
}

@media only screen and (min-width:960px)
{
	.diaryFullSlimBuildEquip {display:inline-block; max-width:48%;}
	.diaryFullSlimDeptBooker {display:inline-block; max-width:48%;}

	.narrowClear {display:none;}
	.veryNarrowClear {display:none;}
	.narrowButton {display:none;}

	.diaryColName 	{float:left;  width:150px; min-height:25px;}
	.diaryColStatus {float:right; width:110px; min-height:25px;}
	.diaryColDelCol {float:right; width:150px; min-height:25px;}
	.diaryColRoom 	{float:left;  width:180px; min-height:25px;}
	.diaryColTimes 	{float:right; width:200px; min-height:25px;}
	.diaryColEquipNL, .diaryColNotesNL, .diaryColRepliesNL	{float:right; width:650px; min-height:25px;}
}

@media only screen and (min-width:690px) and (max-width:959px)
{
	.diaryFullSlimBuildEquip {display:inline-block; max-width:48%;}
	.diaryFullSlimDeptBooker {display:inline-block; max-width:48%;}

	.narrowClear {clear:both;}
	.veryNarrowClear {display:none;}
	.narrowButton {display:none;}

	.diaryColName 	{float:left;  width:125px; min-height:25px;}
	.diaryColStatus {float:right; width:95px; min-height:25px;}
	.diaryColDelCol {float:right; width:120px; min-height:25px;}
}
/* Or: */
@media only screen and (min-width:690px) and (max-width:739px)
{
	.diaryColRoom 	{float:left;  width:100px; min-height:25px;}
	.diaryColTimes 	{float:right; width:110px; min-height:25px;}
	.diaryColEquipNL, .diaryColNotesNL, .diaryColRepliesNL	{float:right; width:510px; min-height:25px;}
}

@media only screen and (min-width:740px) and (max-width:780px)
{
	.diaryColRoom 	{float:left;  width:130px; min-height:25px;}
	.diaryColTimes 	{float:right; width:115px; min-height:25px;}
	.diaryColEquipNL, .diaryColNotesNL, .diaryColRepliesNL	{float:right; width:510px; min-height:25px;}
}

@media only screen and (min-width:780px) and (max-width:849px)
{
	.diaryColRoom 	{float:left;  width:180px; min-height:25px;}
	.diaryColTimes 	{float:right; width:115px; min-height:25px;}
	.diaryColEquipNL, .diaryColNotesNL, .diaryColRepliesNL	{float:right; width:510px; min-height:25px;}
}
@media only screen and (min-width:850px) and (max-width:899px)
{
	.diaryColRoom 	{float:left;  width:180px; min-height:25px;}
	.diaryColTimes 	{float:right; width:165px; min-height:25px;}
	.diaryColEquipNL, .diaryColNotesNL, .diaryColRepliesNL	{float:right; width:530px; min-height:25px;}
}
@media only screen and (min-width:900px) and (max-width:959px)
{
	.diaryColRoom 	{float:left;  width:180px; min-height:25px;}
	.diaryColTimes 	{float:right; width:200px; min-height:25px;}
	.diaryColEquipNL, .diaryColNotesNL, .diaryColRepliesNL	{float:right; width:600px; min-height:25px;}
}