#menu {
	padding: 5px 0 5px 10px;
	margin: 0 0 5px 0;
}

.menu_title {
	width: 90%;
	float: none;
	padding: 8px 10px 0 0;
	font-size: 100%;
	display: block;
}

.menu_item {
	float: left;
	padding: 2px 10px 0 0;
	font-size: 100%;
}

#quick_links {
	display: none;
}

.header_link {
	font-size: 100%;
	padding: 8px 10px 10px 40px;
}

#page_title {
	padding: 8px 10px 5px 10px;
}

#content {
	padding: 40px 10px 30px 10px;
}

.homeItem {
	padding: 25px 15px;
}

#footer {
	padding-top: 30px;
}

.not_mobile {
	display: none;
}

.mobile_only {
	display: inline;
}

.dont-break-out {

  /* These are technically the same, but use both */
  overflow-wrap: break-word;
  word-wrap: break-word;

  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;

  /* Adds a hyphen where the word breaks, if supported (No Blink) */
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;

}

.mobile_left_padding {
	padding-left: 10px;
}

/* Force admin home table to not be like tables anymore */
table.home_icons, .home_icons thead, .home_icons tbody, .home_icons td, .home_icons tr { 
	display: block; 
}

.home_icons h3 {
	display: block;
	clear: both;
	padding-top: 10px;
}

.home_icons a { 
}

.home_icons td { 
	/* Behave  like a "row" */
	border: none;
}

/* Force form1 table to not be like tables anymore */
#form1 table, #form1 thead, #form1 tbody, #form1 td, #form1 tr { 
	display: block; 
}

/* page format icons */
#form1 table td table td {
	width: 50%;
	float: left;
}

#form1 .input_box {
	width: 90%;
}

#form1 select {
	min-width: auto;
	max-width: 100%;
}

#area1, #area2, #area3 {
	clear: both;
}

/* styling to make divs behave like tables */

.row_spoof_heading {
	display: none;
}

.row_spoof_0, 
.row_spoof_1 {
	width: calc(100%);
	height: auto;
	border-top: 1px #44556b solid;
	flex-wrap: wrap;
	justify-content: space-between;
}

.cell_spoof {
	border: 0;
	padding: 5px 10px;
}

.name_col {
	flex-basis: 100%;
	float: none;
	order: 1;
}

.wide_col {
	width: 100%;
	float: none;
	order: 2;
}

.date_col {
	width: 100%;
	float: none;
	order: 3;
}

.short_col {
	width: 100%;
	float: none;
	order: 4;
}

.icon_col {
	width: 60px;
	order: 9;
}

.reorder_col {
	order:  8;
}

/* tinymce fixes 
Okay, a bit of explanation: The first selector is the ID of the div when you open TinyMCE for the first time on a page. I've left these in to help with debugging in future. The second selector is the classname-based version because the divs will have different names if you open TinyMCE for a second time on the same page. 
*/

/* outer container */
#gmoxman-38, 
.moxman-container.moxman-panel.moxman-floatpanel.moxman-window.moxman-in {
	width: calc(100%) !important;
	height: 340px !important;
}

/* next container in */
#gmoxman-38-body, 
.moxman-container-body.moxman-abs-layout {
	width: calc(100%) !important;
	height: 270px !important;
}

/* next container in (this goes on for a while yet) */
#gmoxman-0,
.moxman-container.moxman-abs-layout-item.moxman-first.moxman-last {
	width: calc(100%) !important;
	height: 270px !important;
}

#gmoxman-0-body, 
.moxman-container.moxman-abs-layout-item.moxman-first.moxman-last .moxman-container-body.moxman-abs-layout {
	width: calc(100%) !important;
	height: 270px !important;
}

#gmoxman-1, 
.moxman-container.moxman-panel.moxman-abs-layout-item.moxman-first {
	width: calc(100%) !important;
	height: 270px !important;
}

#gmoxman-1-body,
.moxman-container.moxman-panel.moxman-abs-layout-item.moxman-first .moxman-container-body.moxman-abs-layout {
	width: calc(100%) !important;
	height: 270px !important;
}

#gmoxman-33,
.moxman-container.moxman-panel.moxman-abs-layout-item.moxman-last {
	left: 0 !important;
	width: calc(100%) !important;
	height: 270px !important;
}

#gmoxman-33-body,
.moxman-container.moxman-panel.moxman-abs-layout-item.moxman-last .moxman-container-body.moxman-abs-layout {
	left: 0 !important;
	width: calc(100%) !important;
	height: 270px !important;
}

#gmoxman-36,
.moxman-container.moxman-panel.moxman-abs-layout-item.moxman-last .moxman-container-body.moxman-abs-layout .moxman-container.moxman-panel.moxman-abs-layout-item.moxman-first.moxman-last {
	left: 0 !important;
	width: calc(100%) !important;
	height: 270px !important;
}

#gmoxman-36-body,
.moxman-container.moxman-panel.moxman-abs-layout-item.moxman-last .moxman-container-body.moxman-abs-layout .moxman-container.moxman-panel.moxman-abs-layout-item.moxman-first.moxman-last .moxman-container-body.moxman-abs-layout {
	left: 0 !important;
	width: calc(100%) !important;
	height: 300px !important;
}

#gmoxman-35,
.moxman-thumbnailview.moxman-abs-layout-item.moxman-last {
	left: 0 !important;
	width: calc(100%) !important;
	height: 200px !important;
}

#gmoxman-35-body,
.moxman-container-body.moxman-flow-layout {
	left: 0 !important;
	width: calc(100%) !important;
	height: 200px !important;
}

/* insert and cancel buttons divs */
.moxman-container.moxman-panel.moxman-foot {
	width: calc(100%) !important;
	height: 50px !important;
}

.moxman-container.moxman-panel.moxman-foot .moxman-container-body.moxman-abs-layout {
	width: calc(100%) !important;
	height: 50px !important;
}

/* insert */
.moxman-widget.moxman-btn.moxman-primary.moxman-abs-layout-item.moxman-first.moxman-btn-has-text {
	left: calc(70%) !important;
}

/* cancel */
.moxman-widget.moxman-btn.moxman-abs-layout-item.moxman-last.moxman-btn-has-text {
	left: calc(80%) !important;
}