body{
	/*overflow: hidden;*/
}
.cms-wrapper{
	/*background-color: #9dceff;*/
	border-radius: 10px;
	position: relative;
	padding: 20px;
	/*min-height: calc(100vh - 100px);*/
	height: calc( 100vh - 42px - 74.5px );
	overflow: auto;
}
.cms-top-controls{
	display: inline-block;
	margin-left: 12px;
	vertical-align: top;
}
.cms-body{
	display: flex;
	width: calc(100%);
}
.cms-left-wrapper{
	width: 400px;
	overflow: hidden;
}
.cms-left{
	overflow: hidden;
	display: flex;
	column-count: 2;
	width: 820px;
}
.cms-menu{
	display: inline-block;
	vertical-align: top;
	float: left;
	width: 400px;
	/*padding-right: 20px;*/
	margin-right: 20px;
	/*border-right: solid 1px #e0e0e0;*/
	min-height: calc(100vh - 160px);
}
/*.cms-menu li{
	padding: 8px 14px;
	color: #fff;
	font-weight: 900;
	border-radius: 10px;
	cursor: pointer;
	background-color: #0080ff;
	display: inline-block;
}
.cms-menu li:hover{
	opacity: .6;
}*/
.cms-menu li:not(.cms-button),
.cms-items li:not(.cms-button){
	display: block;
	cursor: pointer;
	padding: 12px 20px;

	/*border-top: solid 1px #ddd;*/
	margin-bottom: 20px;
    background-color: var(--body-bg);
	border: solid 1px #ddd;
}
.cms-menu li:not(.cms-button) p,
.cms-items li:not(.cms-button) p{
	margin: 0;
}
.cms-menu li:not(.cms-button):last-of-type,
.cms-items li:not(.cms-button):last-of-type{
	margin-bottom: 0;
}
.cms-menu li:not(.cms-button).selected,
.cms-items li:not(.cms-button).selected{
	/*background-color: #e0e0e0;*/
	opacity: .2;
}
/*.cms-menu li.selected{
	background-color: #015cb7;
}*/
.cms-button{
	padding: 8px 14px;
	color: #000;
	/*font-weight: 900;*/
	/*border-radius: 10px;*/
	cursor: pointer;
	background-color: #abd5ff;
	/*display: table;*/
	margin-right: 8px;
	margin-bottom: 8px;
	border: solid 1px #000;
	display: inline-block;
	line-height: 16px;
}
.cms-button a{
	color: #000;
}
.cms-menu li:hover,
.cms-items li:hover{
	opacity: .2;
}
.cms-button.selected a,
.cms-button:hover a,
.cms-button.selected,
.cms-button:hover{
	color: #fff;
}
.cms-button.selected,
.cms-button:hover{
	background-color: #0080ff;
}
.site-item-inactive{
	opacity: .6;
}
.site-item-hidden{
	display: none !important;
}
.cms-menu,
.cms-items{
	display: inline-block;
	vertical-align: top;
	width: 400px;
}
.cms-menu ul,
.cms-items ul{
	height: calc(100vh - 233px - 40px);
	overflow: auto;
	border-bottom: solid 1px #ddd;
	background-color: var(--box-bg);
	margin-bottom: 0;
	padding: 20px;
}
.cms-selected-item-history,
.cms-selected-item-wrapper{
	margin-bottom: 0;
	height: calc(100vh - 236px);
	overflow: auto;
	display: inline-block;
	width: calc(100% - 420px);
}
.cms-selected-item-history{
	width: 400px;
	margin-left: 20px;
}


.cms-content{
	display: inline-block;
	width: calc(100% - 420px);
	margin-left: 20px;
}

.cms-wrapper input,
.cms-wrapper textarea{
	border-radius: 4px;
	outline: none;
	appearance: none;
	border: solid 1px #c4c4c4;
	padding: 6px 12px;
	/*width: calc(100% - 24px);*/
	/*margin-top: 8px;*/
	width: 500px;
	/*box-shadow: 0 6px 16px rgba(0,0,0,.1);*/
}
.menu-modal input{
	max-width: calc( 100% - 24px );
}
.cms-wrapper textarea{
	height: 200px;
}
.cms-wrapper input{
	text-overflow: ellipsis;
	white-space: pre;
}



/*stages:*/
/*stage 2:*/
.cms-wrapper[data-stage="2"] .cms-menu{
	/*width: calc(100%);*/
}
.cms-wrapper[data-stage="2"] .cms-items{
	width: 400px;
	opacity: 0;
}

/*stage 3:*/
.cms-wrapper[data-stage="3"] .cms-menu{
	/*width: 400px;*/
}
.cms-wrapper[data-stage="3"] .cms-items{
	overflow: auto;
	opacity: 1;
}
.cms-wrapper[data-stage="3"] .cms-left{
	transform: translateX(-420px);
}


/*stage 4:*/
.cms-wrapper[data-stage="4"] .cms-menu{
	width: 0;
	overflow: hidden;
	opacity: 0;
	padding: 0;
	margin-right: 0px;
}
.cms-wrapper[data-stage="4"] .cms-items{
	width: 400px;
}

.cms-wrapper:not([data-stage="4"]) .cms-content{
	/*display: none;*/
}
.cms-wrapper[data-stage="4"] .cms-content{
	width: calc(100% - 420px);
	margin-left: 20px;
}
/*.cms-wrapper[data-stage="4"] */







/*input styles:*/
.checkbox-wrapper input {
	margin-right: 5px;
	vertical-align: -12px;
	margin-bottom: 8px;
}
.cms-wrapper input[type="checkbox"],
.cms-wrapper input[type="radio"] {
	appearance: none;
	border: solid 1px #ced6dd;
	width: 18px;
	height: 18px;
	transition: ease all .2s;
	position: relative;
	cursor: pointer;
	vertical-align: -4px;
	border-radius: 4px;
	padding: 0;
	background-color: #ffffff;
}
.cms-wrapper input[type="radio"] {
	border-radius: 50%;
}
.cms-wrapper input[type="checkbox"]:checked{
	background-color: #434B54;
	border-color: #434B54;
}
.cms-wrapper input[type="checkbox"]:checked::before,
.cms-wrapper input[type="radio"]:checked::before {
	opacity: 1;
}
.cms-wrapper input[type="checkbox"]::before,
.cms-wrapper input[type="radio"]::before {
	/*content: '';*/
	content: '\2713';
	color: #fff;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	transition: ease all .2s;
	opacity: 0;
	height: 18px;
	border-radius: 4px; 
}
.cms-wrapper input[type="radio"]::before {
	content: '';
	background-color: #434B54;
	width: 12px;
	height: 12px;
	border-radius: 50%;
}
.cms-field-wrapper{
	position: relative;
}
.cms-field-wrapper:not([data-fieldType="hidden"]):not([data-fieldType="none"]) li:first-of-type,
.cms-field-title,
.cms-field-title ~ li:not(.cms-field-title){
	margin-bottom: 20px;
}
.cms-selected-item-row:last-of-type .cms-field-wrapper,
.cms-field-wrapper li:last-of-type{
	margin-bottom: 0 !important;
}

.cms-selected-item-history-inner,
.cms-field-wrapper:not([data-fieldType="hidden"]):not([data-fieldType="none"])
/*.cms-parent-item*/
{
	padding: 20px;
	background-color: var(--box-bg);
	/*border-radius: 10px;*/
	margin-bottom: 20px;
	border:  solid 1px #ddd;
}
.cms-selected-item-history-inner .cms-field-wrapper p:first-of-type{
	margin-top: 0;
}
.cms-field-wrapper .switch-button{
	height: 22px;
	width: 28px;
	border-radius: 0 !important;
	overflow: visible;
}
.cms-field-wrapper .switch-button-checkbox + .switch-button-label::before {
	border-radius: 0 !important;
	height: 28px;
	width: 28px;
	left: -6px;
	top: -9px;
}
.cms-field-wrapper .switch-button-checkbox:checked + .switch-button-label::before {
	background-color: #abd5ff;
	transform: translateX(28px);
}
.cms-field-wrapper .switch-button-checkbox{
	width: 50px !important;
	display: block;
	height: 24px !important;
	margin-bottom: 0 !important;
}
.cms-field-wrapper .switch-button-checkbox + .switch-button-label{
	transform: translateY(-100%);
	/*width: 30px;*/
}

.mce-top-part::before,
.mce-tinymce{
	box-shadow: none !important;
}
.mce-tinymce *{
	transition: unset;
}

.cms-wrapper select{
	/*appearance: none;*/
	vertical-align: top;
	display: inline-block;
	border: solid 1px var(--text-color);
	color: var(--text-color);
	outline: none;
	padding: 8px 20px 8px 12px;
	background-color: var(--box-bg);
	cursor: pointer;
}
.cms-wrapper select[multiple]{
	padding: 0;
}
.cms-wrapper select[multiple] option{
	padding: 8px 18px;
}
.cms-wrapper select option.cms-option-inactive{
	color: #a8a8a8;
}
.cms-field-helper{
	display: inline-block;
}
.cms-field-helper-text{
	display: none;
}
.cms-button-discrete{
	background-color: transparent;
	border-color: var(--text-color);
	color: var(--text-color);
}
.cms-button-red{
	background-color: #ffc4c4;
	color: #000;
	border-color: #000;
}
.cms-button-red:hover{
	background-color: lightcoral;
	color: #fff;
}
.cms-button-seperator{
	position: relative;
	margin: 0 13px 0 4px;
}
.cms-button-seperator::before{
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	background-color: #e0e0e0;
	width: 1px;
	left: 50%;
	transform: translateX(-50%);
}




.cms-field-wrapper[data-fieldtype="json"] .cms-field-title{
	padding-right: 32px;
}


.overlay-dialog-wrapper{
	text-align: center;
}
.publish-request-tab-wrapper,
.publish-actioned-tab-wrapper{
	max-height: calc(100vh - 400px);
	overflow: auto;
}
.publish-actioned-tab{
	border: solid 1px var(--text-color);
	margin-bottom: 12px;
}
.publish-actioned-tab:last-of-type{
	margin-bottom: 0;
}
.delete-dialog-title{
	font-size: 18px;
	margin-top: 0px;
	margin-bottom: 8px;
	display: block;
	font-weight: bold;
}
.overlay-dialog-wrapper span{
	display: inline-block;
	margin-top: 12px;
}
.overlay-dialog-wrapper *{
	z-index: 1;
	position: relative;
}
ul.cms-history-changed {
	/*padding: 20px;*/
	border: solid 1px #000;
}
.cms-history-changed li{
	margin-bottom: 0px !important;
	padding: 6px 12px;
	background-color: #fff;
}
.cms-history-changed li:nth-of-type(2n){
	background-color: #ddd;
}
.publish-request-tab{
	display: none;
}
.publish-request-tab:last-of-type{
	display: block;
}


/*image uploading*/
.image-dialog-wrapper{
	width: 800px;
}
.visually-hidden {
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
}

/* Separate rule for compatibility, :focus-within is required on modern Firefox and Chrome */
input.visually-hidden:focus + label {
	outline: thin dotted;
}
input.visually-hidden:focus-within + label {
	outline: thin dotted;
}
#cms-new-image-dropbox{
	height: 200px;
	border: dashed 6px #ddd;
	position: relative;
	margin: 40px 0;
}
#cms-new-image-dropbox label{
	font-size: 26px;
	color: #ddd;
	font-weight: bold;
	position: relative;
	width: 100%;
	display: block;
	text-align: center;
	padding: 90px 0;
	cursor: pointer;
}
#cms-new-image-preview{
	/*margin-top: 30px;*/
	max-height: 600px;
	overflow: auto;
}
.cms-image-new-item{
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: solid 1px #ddd;
	position: relative;
}
.cms-image-new-item .cms-image-new-item-img{
	width: 140px;
	display: inline-block;
	vertical-align: text-top;
}
.cms-image-new-item .cms-image-new-item-fields{
	width: calc(100% - 160px);
	margin-left: 20px;
	display: inline-block;
	vertical-align: text-top;
}
.cms-image-new-item:last-of-type{
	border-bottom: none;
}
.cms-image-new-item-fields span{
	text-align: left;
	margin-bottom: 8px;
	white-space: pre;
	text-overflow: ellipsis;
	overflow: hidden;
	display: block;
}
.cms-new-image-options{
	display: none !important;
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: solid 1px #ddd;
	text-align: left;
}
.cms-new-image-options p{
	margin-top: 0;
	text-align: left;
}
.cms-new-image-options input{
	width: 100px;
	display: inline-block;
}

.cms-image-box-images{
	height: 250px;
	overflow-x: auto;
	overflow-y: hidden;
	display: flex;
	flex-direction: row;
}
.cms-image-box-images .cms-image-item{
	height: 250px;
}
.cms-image-box-images img{
	display: inline-block;
	max-width: unset;
	max-height: 100%;
}


.cms-image-upload-error,
.cms-image-upload-success{
	position: relative;
}
.cms-image-upload-error::before,
.cms-image-upload-success::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: solid 4px;
}
.cms-image-upload-error::before{
	border-color: red;
	background-color: rgba(255, 97, 97, 0.2);
}
.cms-image-upload-success::before{
	border-color: lightseagreen;
	background-color: rgba(97, 255, 97, 0.2);
}

.cms-button.cms-button-hidden{
	display: none !important;
}


.cms-field-html-cheatsheet-wrapper{
	display: none;
	position: fixed;
	z-index: 1;
}
.cms-field-html-cheatsheet-content{
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	background-color: var(--box-bg);
	padding: 20px 10px;
	z-index: 120;
	width: calc(100% - 40px);
	max-width: 800px;
	max-height: calc(100% - 240px);
	overflow: auto;
}
.cms-field-html-cheatsheet-item label{
	display: block;
	margin-bottom: 8px;
}
.cms-field-html-cheatsheet-content em{
	display: block;
	border-bottom: solid 1px var(--text-color);
	margin: 20px 0;
}



body.mce-fullscreen .cms-selected-item-history,

body.mce-fullscreen .cms-items{
	opacity: 0 !important;
}
body.mce-fullscreen .cms-top select,
body.mce-fullscreen .cms-top .cms-top-controls *:not(.cms-button-manage-images){
	opacity: 0;
}
body.mce-fullscreen .cms-top .cms-button-manage-images{
	position: fixed;
	top: 60px;
	left: 50%;
	transform: translateX(-50%) !important;
	z-index: 15;
}
div.mce-fullscreen{
	left: 50% !important;
	transform: translateX(-50%) !important;
	width: calc(100% - 40px) !important;
	max-width: 1040px !important;
	top: 100px !important;
	height: calc(100vh - 124px) !important;
	border: solid 1px #c5c5c5 !important;
}
div.mce-fullscreen > .mce-container-body{
	height: 100% !important;
	position: absolute !important;
	top: 0 !important;
	bottom: 0 !important;
	right: 0 !important;
	left: 0 !important;
}
div.mce-fullscreen > .mce-container-body iframe{
	height: 100% !important;
}
div.mce-fullscreen .mce-edit-area{
	position: absolute !important;
	bottom: 28px !important;
	left: 0 !important;
	right: 0 !important;
	top: 28px !important;
}
div.mce-fullscreen .mce-statusbar{
	position: absolute !important;
	bottom: 0 !important;
	left: 0 !important;
	right: 0 !important;
	height: 28px !important;
}
.mce-container textarea.mce-textbox{
	color: #595959 !important;
}


.mce-container,
.mce-container *,
.mce-widget,
.mce-widget *,
.mce-reset,
.mce-ico{
	color: var(--text-color) !important;
}
.mce-btn.mce-active,
.mce-btn.mce-active:hover,
.mce-btn.mce-active:focus,
.mce-btn.mce-active:active{
	background-color: var(--body-bg) !important;
	border-color: color: var(--text-color) !important;
}
div.mce-edit-area,
.mce-btn,
.mce-panel{
	background-color: var(--box-bg) !important;
}

/*body.mce-fullscreen .cms-field-wrapper[data-fieldtype="html"]{
	left: 50% !important;
	transform: translateX(-50%) !important;
	width: calc(100% - 40px) !important;
	max-width: 1200px !important;
	top: 100px !important;
	height: calc(100vh - 124px) !important;
	border: solid 1px #c5c5c5 !important;
	position: fixed;
}*/




.cms-field-wrapper[data-fieldtype="batchcontent"] {
	margin-top: 101px;
}
.cms-field-wrapper[data-fieldtype="batchcontent"]::before {
	content: '';
	position: absolute;
	top: -52px;
	left: 50%;
	width: 100px;
	transform: translateX(-50%);
	border-top: solid 1px #ddd;
}