.no-border {
	border : none !important;
}

.web-page-main-content-header,
.web-page-core-content {
	border-bottom : 1px solid #f1f1f1;
	display       : flex;
	margin        : 0 1rem;
}

.web-page-main-content-header {
	flex-direction : row;
	padding        : 0 5px 0.75rem 5px;
}

.web-page-core-content {
	flex-direction : column;
	opacity        : 0;
	padding        : 0.75rem 5px;
	position       : absolute;
	transform      : translateY(50px);
	transition     : opacity 0.3s, transform 0.3s;
	z-index        : -1;
}

.active.web-page-core-content {
	opacity   : 1;
	position  : relative;
	transform : translateY(0px);
	z-index   : 9;
}

.main-content-header-buttons {
	display        : inline-flex;
	flex-direction : column;
}

.ui.loading.segment.main-content-header-buttons {
	border     : none;
	box-shadow : none;
	margin     : 0;
	padding    : 0;
}

.web-page-header-button {
	background : none;
	border     : none;
	color      : #4183c4;
	cursor     : pointer;
	font       : 1.1rem Lato,'Helvetica Neue',Arial,Helvetica,sans-serif;
	flex-grow  : 1;
	margin-top : 0.13rem;
	padding    : 0;
	text-align : right;
	transition : transform 0.3s;
}

.web-page-header-button:hover {
	color     : #0e438c;
	transform : translate(-0.15rem, 0);
}

.main-content-header-header-left {
	align-items : baseline;
	display     : flex;
	flex        : 0 0 auto;
}

.main-content-header-right,
.main-content-header-center {
	display         : flex;
	flex-direction  : column;
	justify-content : center;
}

.main-content-header-center {
	flex     : 1 1 auto;
	overflow : hidden;
}

.main-content-header-right {
	flex-grow       : 0;
	flex-shrink     : 0;
	justify-content : right;
}

.main-content-header-center-top {
	display     : flex;
	flex        : 0 0 auto;
	margin-left : 0.5rem;
}

.web-page-color {
	background-color : #f0f0f0;
	border-radius    : 50%;
	display          : none;
	flex-shrink      : 0;
	height           : 10px;
	margin           : 0 7px;
	width            : 10px;
}

.main-content-header-title.not-editing .web-page-color {
	display : inline-block;
}

.main-content-header-right-bottom {
	align-items     : center;
	display         : flex;
	flex-direction  : column;
	flex-grow       : 1;
	height          : 2rem;
	justify-content : center;
	min-width       : 7.8rem;
}

.main-content-header-unsaved {
	border-bottom : 1px solid #9f3a38;
	color         : #444;
	text-align    : right;
}

.main-content-header-title {
	align-items   : center;
	border-radius : 5px;
	display       : flex;
	flex          : 1 0 auto;
	margin        : 0;
	margin-right  : 1rem;
	padding       : 0 0.5rem;
}

.can-edit-page .not-editing.main-content-header-title:hover,
.can-edit-page .not-editing.web-page-core-content:hover {
	background : #f8f8f8;
	cursor     : pointer;
}

.can-edit-page .not-editing.web-page-core-content:hover {
	border-bottom : none;
	box-shadow    : 0 0 4px 0.55rem #f8f8f8;
}

.main-content-header-title.not-editing {
	max-width : 100%;
	overflow  : hidden;
}

.locked.main-content-header-title {
	background     : none !important;
	pointer-events : none !important;
}

.locked.main-content-header-title>.main-content-header-title-text {
	border : none;
}

.locked.main-content-header-title .main-content-header-title-text {
	display : block !important;
}

.locked.main-content-header-title .main-content-header-title-input {
	display : none !important;
}

.main-content-header-title-text {
	color         : #0e336c;
	font-size     : 2rem;
	overflow      : hidden;
	text-overflow : ellipsis;
	white-space   : nowrap;
}

.can-edit-page .main-content-header-title-text {
	border-bottom : 1px dotted #0033cc;
}

.main-content-header-title-editor {
	align-items : center;
	display     : flex;
	flex        : 1 0 auto;
}

.main-content-header-title-input {
	border        : 1px solid #b9b9b9;
	border-radius : 2px;
	display       : none;
	padding       : 0.2rem 0.5rem;
	width         : 100%;
}

.main-content-header-title-input:focus {
	border-bottom  : 0.15rem solid #0e336c;
	box-shadow     : 0 0 7px #ccc;
	outline        : none;
	padding-bottom : calc(0.05rem + 1px);
}

.main-content-header-title:not(.not-editing) .main-content-header-title-text {
	display : none;
}

.main-content-header-title:not(.not-editing) .main-content-header-title-input {
	display : block;
}

.web-page-main-content-header .header-tabs {
	display     : flex;
	flex        : 0 0 auto;
	margin-left : 1rem;
}

.web-page-main-content-header .header-tab,
.web-page-main-content-header .header-tab-filler {
	align-items : center;
	display     : flex;
	height      : 2.75rem;
}

.web-page-main-content-header .header-tab {
	color      : #555;
	cursor     : pointer;
	flex       : 0 0 auto;
	font-size  : 1.15rem;
	padding    : 0 1rem;
	transition : 0.25s;
}

.web-page-main-content-header .header-tab:hover {
	transform : scale(1.05);
}

.web-page-main-content-header .header-tab.active {
	color       : #222;
	cursor      : default;
	font-size   : 1.2rem;
	font-weight : bold;
	transform   : scale(1);
}

.web-page-main-content-header .header-tab:first-of-type {
	padding-left : 0 !important;
}

.web-page-main-content-header .header-tab-filler {
	flex : 1 1 auto;
}

.web-page-header-image {
	position        : relative;
	display         : flex;
	align-items     : center;
	justify-content : center;
}

.web-page-header-image[hidden] {
	display : none;
}

.web-page-header-image .page-image {
	max-height : 80px;
	max-width  : 200px;
}

.web-page-header-image .page-default-image {
	background : #c8c8c8;
	height     : 80px;
	position   : relative;
	width      : 80px;
}

.web-page-header-image .page-default-image:before {
	background      : url(../img/picture-o.png) center no-repeat;
	background-size : contain;
	bottom          : 20%;
	content         : '';
	left            : 20%;
	position        : absolute;
	right           : 20%;
	top             : 20%;
}

.web-page-header-image .page-image-edit {
	bottom   : -5px;
	position : absolute;
	right    : -5px;
}

.header-title-extra {
	align-items : center;
	display     : flex;
}

.header-title-extra .back-link {
	align-items : center;
	color       : #0e336c;
	display     : flex;
	margin-left : 0.5rem;
}

.header-title-extra .back-link:hover {
	color : #1e70bf;
}

.header-title-extra .back-icon {
	font-size : 1.3rem;
	margin    : 0 0.3rem;
}

.header-title-extra .book-icon {
	font-size : 1.15rem;
	margin    : 0 0.3rem;
}

.page-description-value {
	padding-top : 10px;
}

.description-template-container {
	width: 75vw;
}

.description-template-container .action {
	width: 5px;
}

.description-template-container .title {
	width: 250px;
}

.web-page-description-switch-type,
.internal.page-description-content,
.editing.web-page-description.internal .page-description-content,
.editing.web-page-description.internal .web-page-no-description {
	display : none;
}

.editing.web-page-description.internal .internal.page-description-content {
	display : block;
}

.editing.web-page-description .web-page-description-switch-type {
	color      : #303030;
	display    : flex;
	margin-top : 0.3rem;
}

.web-page-public-description-select-type {
	cursor  : pointer;
	opacity : 0.8;
	padding : 0 1rem 0.2rem 0;
}

.web-page-public-description-select-type.active-description {
	color       : #1047a4;
	font-weight : 900;
	opacity     : 1;
}

.no-page-image .main-content-header-center-top,
.no-page-image .main-content-header-title.not-editing,
.no-page-image.web-page-main-content-header .header-tabs {
	margin : 0;
	padding : 0;
}