div.dateSelection
{
	width: 100%;
	overflow: hidden;
}

div.dateSelection div.inputContainer
{
	float: left;
	width: auto;
}

ul.noStyle, ul.noStyle li
{
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
}


div.dateSelection div.inputContainer:nth-of-type(1) select 	/* Year field */
{
	width: 8em;
}

div.dateSelection div.inputContainer:nth-of-type(2) select
{
	width: 8em;
}

div.dateSelection div.inputContainer:nth-of-type(3) select
{
	width: 8em;
}

/* DEFAULT INPUT STYLES */
input[type=text],
input[type=email],
input[type=password],
input[type=number],
input[type=tel],
input[type=date],
select
{

	margin-bottom: 2px;
	padding: 1px;
	border: 1px solid rgb(128,128,128);
	border-radius: 3px;
	font-family: inherit;
}

body#adm input[type=email],body#adm input[type=password]
{
	width: 20em;
}

main div.regAttension input[type=text],
main div.regAttension input[type=email],
main div.regAttension input[type=password],
main div.regAttension input[type=number],
main div.regAttension input[type=tel],
main div.regAttension input[type=date],
main div.regAttension input[type=datetime-local],
main div.regAttension select,

.ui-dialog div.regAttension input[type=text],
.ui-dialog div.regAttension input[type=email],
.ui-dialog div.regAttension input[type=password],
.ui-dialog div.regAttension input[type=number],
.ui-dialog div.regAttension input[type=tel],
.ui-dialog div.regAttension input[type=date],
.ui-dialog div.regAttension select
{
	float: left;
	width: 25em;
	margin-bottom: 2px;
	padding: 0.6em;
	border: 1px solid rgb(128,128,128);
	border-radius: 0.5em;
	font-size: 1.2rem;
	background-color: white;
	box-sizing: border-box;
	color: #001a00;
	border-color: #001a00;
}


@media screen and (max-width: 590px)
{
	div.inputSearchContainer
	{
		width: 100%;
	}
	html body input:not([type="radio"]), html body select
	{
		width: 100% !important;	
	}
	html body input[type="checkbox"]
	{
		width: auto !important;	
		display: inline-block !important;
	}


	html body div.inputContainer ul.radioContainer li
	{
		clear: left;
		margin-bottom: 1em;
	}
}




main div.regAttension select[disabled], main div.regAttension input[disabled],
.ui-dialog div.regAttension select[disabled], .ui-dialog div.regAttension input[disabled]
{
	background-color: silver;
}

div#footer a.suggestionFormToggle
{
	display: block;
	width: 24px;
	height: 24px;
	background-position: center center;
	background-repeat: no-repeat;
	opacity: 0.5;
	-moz-opacity: 0.5;
}

div#footer a.suggestionFormToggle:hover,
div#footer a.suggestionExists
{
	opacity: 1;
	-moz-opacity: 1;
}

div#footer div.tools a
{
	float: left;
	display: block;
	margin-right: 10px;
	width: auto;
	height: auto;
	background-position: 5px center;
	background-repeat: no-repeat;
	background-color: rgb(240,240,240);
	padding: 10px 20px 10px 40px;
	border: 1px solid rgb(200,200,200);
	text-decoration: none;
	opacity: 0.8;
	-moz-opacity: 0.8;
}

div#footer div.tools a:hover
{
	background-color: white;
	border-color: rgb(100,100,100);
}

div.inputContainer ul.fieldSuggestion
{
	background-color: rgb(255,255,210);
	border: 1px solid rgb(200,200,150);
	float: left;
	list-style-type: none;
	margin: 0;
	padding: 10px;
	width: 20em;
}

ul.fieldSuggestion li
{
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 2px dotted rgb(200,200,150);
}

ul.fieldSuggestion li:last-child
{
	border: none;
	padding-bottom: 0px;
}

div#footer div.tools a.siteChangeSuggestion		{ background-image: url(/images/controlPanel/status/suggest.png); }
div#footer div.tools a.siteErrorReport			{ background-image: url(/images/controlPanel/status/error_s.png); }
div#footer div.tools a.siteHelp					{ background-image: url(../images/controlPanel/general/help-icon24.png); }
div.inputContainer a.formChangeSuggestion
{
	display: block;
	float: left;
	background-image: url(/images/controlPanel/status/suggest.png);
	
}

div#feedBackForm
{
	width: 30em;
	height: 7em;
	display: none;
}

form input.unsaved,
span.unsaved
{
		background-color: yellow;
}


ul.inline
{
	margin: 0px;
	padding: 0;
	width: 100%;
	overflow: hidden;
	list-style-type: none;
}

.noClear
{
	clear: none !important;
}

ul.noMargin
{
	margin: 0;
	padding-left: 15px;
}

ul.inline li
{
	float: left;
	margin-right: 50px;
}


h1.success, h2.success, h3.success, h4.success
{
	background-image: url(/images/controlPanel/submit/submitSaveContinue.png);
	padding-left: 40px;
	background-repeat: no-repeat;
	color: rgb(0, 170, 0);
}


form ul.radioContainer
{
	list-style-type: none;
	padding: 0;
	margin: 0;
	clear: both;
	overflow: hidden;
}

main div.regAttension, .ui-dialog div.regAttension
{
	border-left: 3px solid var(--middleBlue);
	padding-left: 1.5em;
}

main fieldset#filterContainer div.regAttension
{
	border: 0;
}


form div.regAttension ul.radioContainer li input
{
	clear: left;
	float: left;
	display: block;
	margin-top: 7px;
	margin-right: 10px;
}
form div.regAttension ul.radioContainer li label
{
	width: auto;
	display: block;
	float: left;

	margin-right: 10px;
	margin: 0;

	padding: 5px;
	clear: none;
}

form div.regAttension ul.radioContainer li
{
	margin-bottom: 2px;
	overflow: hidden;
}

form div.regAttension ul.radioContainer li:hover
{
	border-color: rgb(150,150,150);
	background-color: rgb(240,240,240);
}

form div.regAttension ul.radioContainer li label img
{
	display: block;
	float: left;
	margin-right: 6px;
}

form div.regAttension ul.radioContainer li label span
{
	display: block;
	margin-top: 2px;
	margin-left: 35px;
}

div.submitContainer
{
	clear: both;
}

div.submitContainer div.buttonContainer /* a kind of regAttension */
{
	display: flex;
	flex-direction: column;
	align-items:flex-start;
}


form div.regAttension input.submit	{ margin-right: 9px; }
form fieldset div.regAttension input.submit	{ margin-right: 0px; }



form div.submitContainer div.buttonContainer input.submit,
form div.submitPreRender input.submit,
form div.formDeleteContainer input.submit,
input.submit.bigButton,
a.bigButton
{
	font-size: 1.3em;
	min-width: 15em;
	margin-bottom: 0.5em;
	text-decoration: none;

	
	background-repeat: no-repeat;
	background-position: 10px center;
	padding: 9px 10px 9px 38px;
	text-align: left;
	display: inline-block;

	color: rgb(70,70,70);
	border: 1px solid rgb(200,230,200);
	background-color: rgb(245,245,245);
	border-radius: 10px;
	cursor: pointer;
}

@media screen and (max-width: 590px)
{
	form div.submitContainer div.buttonContainer input.submit,
	form div.submitPreRender input.submit,
	form div.formDeleteContainer input.submit,
	input.submit.bigButton,
	a.bigButton
	{
		width: 100%;
		background-color: rgb(8, 158, 45);
		text-align: center;
		color: white;
		padding: 12px;
	}
}


form div.submitContainer div.buttonContainer input.engineBack
{
	float: left;
	clear: left;
	margin-left: 0px;
	background-image: url(/images/controlPanel/submit/engineBack.png);
	background-color: rgb(255,255,200);
	border-color: rgb(240,240,180);
	min-width: 10em;
}



form div.submitContainer div.buttonContainer input.submit:hover,
form div.submitPreRender input.submit:hover,
form div.formDeleteContainer input.submit:hover,
a.bigButton:hover
{
	background-color: rgb(245,255,245);
	border-color: rgb(90,90,90);
	color: black;
}



form div.submitContainer div.buttonContainer input.submit:hover,
form div.submitPreRender input.submit:hover,
form div.formDeleteContainer input.submit:hover
{
	background-color: rgb(245,255,245);
	border-color: rgb(90,90,90);
	color: black;
}

div#mainContainer form div.submitContainer div.buttonContainer div.logNote
{
	float: left;
	width: 300px;
}

body#kontrollpanelen div#mainContainer div.logContainer
{
	max-height: 1000px;
	overflow-y: scroll;
}

body#kontrollpanelen div#mainContainer div.logContainer fieldset.logFilter
{
	margin-bottom: 10px;
}

div#mainContainer div.logContainer table
{
	border: 1px solid silver;
}

body#kontrollpanelen div#mainContainer div.logContainer a.getMoreLogs
{
	margin-top: 1.5em;
}

div#mainContainer div.logContainer div.logContentMinimized
{
	padding: 10px;
	display: none;
	overflow: hidden;
}



/* Can be used with links or submit buttons */
main #_submitSaveList { background-image: url(/images/controlPanel/submit/submitSaveList.png); }
main #_submitSaveContinue,
main #_submitSaveContinue2,
main .submitSaveContinue,
main ._submitSaveContinue { background-image: url(/images/controlPanel/submit/submitSaveContinue.png); }
main .submitSaveHide 		{ background-image: url(/images/controlPanel/submit/hide.png); }
main .submitCombine 		{ background-image: url(/images/controlPanel/submit/combine.png); }
main .submitShow 		{ background-image: url(/images/controlPanel/submit/show.png); }
main #_submitSavePublish { background-image: url(/images/controlPanel/submit/submitSavePublish.png); }
main #_submitSaveCreateNewVersion { background-image: url(/images/controlPanel/tools/addSmall.png); }
main #_submitCreateContent { background-image: url(/images/controlPanel/tools/add.png); }
main #_submitSaveCreateNew,
main ._submitSaveCreateNew { background-image: url(/images/controlPanel/tools/add.png); }
main #_submitSaveActivateVersion { background-image: url(/images/controlPanel/submit/submitSaveActivateVersion.png); }
main #_submitDelete,
main ._submitDelete				{ background-image: url(/images/controlPanel/submit/submitDelete.png); }
main #_submitSaveUnPublish { background-image: url(/images/controlPanel/submit/submitSaveUnPublish.png); }


fieldset.add
{
	border-color: green;
	border-style: solid;
}
fieldset.add legend
{
	background-image: url(/images/controlPanel/tools/add.png);
	background-repeat: no-repeat;
	background-position: 5px center;
	padding-left: 40px;
	padding-top: 10px;
	padding-bottom: 10px;
}

/*form input[type=submit]
{

	background-image: url(/images/controlPanel/general/dotGreen.png);
	background-repeat: no-repeat;
	border: 1px solid black;
	font-size: 16px;
}*/

div.inputContainer input.checkBox
{
	float: left;
	width: auto;
	border: 0px;
}

div.inputContainer select
{
	width: 236px;
}

div.inputContainer label
{
	float: left;
	clear: left;
	width: 15em;
	font-size: 12px;
}

div.inputContainer ul.inline li label
{
	float: none;
}

div.inputContainer
{
	overflow: hidden;
	margin-bottom: 3px;
}

form div.inputError /*Input container with error */
{
	
}

.error
{
	color: red;
}

input.assertError, select.assertError
{
	border-color: rgb(255,0,0);
	background-color: rgb(255,210,210);
}

main div.inputContainer.inputError input,
main div.inputContainer.inputError select,
main div.inputContainer.inputError textarea
{
	border: 1px solid rgb(128,0,0);
	background-color: rgb(255,240,240);
}



main div.regAttension,
.ui-dialog div.regAttension
{
	/*margin: 5px 0 5px 0;
	border: 1px solid rgb(150,170,200);
	background-color: rgb(230,230,230);
	padding: 7px 4px 7px 4px;
	overflow: hidden;
	color: rgb(40,70,90);*/
	margin-top: 0.5em;
	margin-bottom: 1em;
	/*border: 1px solid rgb(240,240,240);*/
	
	padding: 1.5em;
}

main div.regAttension:hover,
.ui-dialog div.regAttension:hover
{
	background-color: rgb(251,251,251);
	background: linear-gradient(to right, rgb(248,248,248) , transparent);
}

/*main div.regAttension input:focus, main div.regAttension select:focus
{
	box-shadow: 0 0 10px rgb(20,40,80);
	outline: none;
}*/

main div.regAttension label
{
	margin-top: 0.5em;
	font-size: 1.1em;
}

div.regAttension div.regText
{
	margin-left: 0em;
	margin-top: 1.5em;
	font-size: 0.9em;
	color: rgb(100,100,100);
	max-width: 60em;
}


form div.warningMsg /* reg attension warning */
{
	background-color: rgb(250,250,210);
	border-color: rgb(150,150,50);
	color: black;
}

form div.warningMsg h3, form div.warningMsg h4
{
	color: black;
}


form label.tbLabel,
div.regAttension label.tbLabel
{
	width: auto;
}



div.regAttension p
{
	font-style: italic;
	margin-bottom: 5px;
	margin-top: 5px;
}

form div.textarea label /*labels for formcreator textareas */
{
	display: block; /* for avoiding line break on char counter */
	width: 99%;
}

div.inputContainer div.formCharCount
{
	float: left;
	margin-left: 20px;
}

form textarea
{
	clear: left;
	display: block;
	margin-bottom: 5px;
}

form div.formDeleteContainer
{
	border-color: rgb(200,150,150);
	background-color: rgb(240,230,230);
	overflow: hidden;
	clear: right;
}

div.formHeader
{
	overflow: hidden;
}

div.formHeader div.left
{
	float: left;
}

div.formHeader div.right
{
	float: right;
}

form div.formDeleteContainer strong { color: auto; }

form div.formDeleteContainer label
{
	width: 7em;
	color: rgb(122,30,30);
}

form div.formDeleteContainer input#_submitDelete
{
	float: right;
	color: rgb(100,50,50);
	border-color: rgb(180,140,140);
	margin-right: 9px;
}

form div.formDeleteContainer input#_submitDelete:hover
{
	color: white;
	background-color: rgb(100,0,0);
	border-color: black;
}

form div.formDeleteContainer p
{
	color: rgb(128,0,0);
	clear: both;
}

div.engineTextBox
{
	border: 1px solid rgb(225,180,120);
	margin-top: 3px;
	margin-bottom: 8px;
	background-color: rgb(255,245,210);
	font-size: 11px;
	color: black;
}

div.engineTextBox strong
{
	color: inherit !important;
}

div.engineTextBox.textBoxError.ERROR_SYSTEM
{
	position: absolute;
	margin-left: auto;
	margin-right: auto;
}
/* Make textboxes outside content to be centered on screen */
div.engineTextBox.textBoxError.ERROR_SYSTEM
{
	width: 600px;
	position: absolute;
	z-index: 1000;
	left: 50%;
	margin-top: -50px;
	margin-left: -300px;
	min-width: 300px;
}

html body .ui-dialog div.engineTextBox.ERROR_SYSTEM
{
	position: static;
	margin: 0;
	left: 0;
	top: 0;
	width: auto;
}
/*
div#content div.engineTextBox.textBoxError
{
	width: auto;
	position: relative;
	top:0;
	left: 0;
	margin-top: 0;
	margin-left: 0;
}*/
/* Error centering end */


div#content div.engineTextBox h3
{
	margin: 0px;
	color: black;
	font-size: 12px;
	margin: 0px 4px 2px 4px;
	padding: 2px 0px 2px 0px;
	border-bottom: 1px solid rgb(225,180,120);
}

div.engineTextBox div
{
	padding: 4px;
}


div.textBoxError
{
	background-color: rgb(200,50,50);
	color: white;
	border-color: black;
}


main div.textBoxError h3
{
	color: white;
	border-color: black;
}

div.textBoxError a
{
	color: rgb(220,220,220);
}

div.textBoxError a:hover
{
	color: rgb(255,255,255);
}

div.cpActionDoneMsg
{
	overflow: hidden;
	margin-bottom: 20px;
	border-bottom: 1px solid rgb(0,205,50);
	padding-bottom: 10px;
}

div#content div.cpActionDoneMsg h1
{
	background-image: none;
	letter-spacing: 0;
	color: rgb(0,120,0);
	padding: 0;
	margin-bottom: 10px;
}

div.cpQuestionBox
{
	overflow: hidden;
	margin-bottom: 20px;
	border-bottom: 2px solid rgb(205,205,0);
	padding-bottom: 10px;
	padding-right: 150px;
}

div#content div.cpQuestionBox h1
{
	background-image: none;
	letter-spacing: 0;
	color: rgb(120,120,0);
	padding: 0;
	margin-bottom: 10px;
}


div#controlPanel
{
	padding: 10px;
	color: black;
	overflow: hidden;
	font-family: verdana;
	font-size: 12px;
	background-color: white;

	background-position: 98.3% 0%;
	background-repeat: no-repeat;
	border: 1px solid rgba(255,255,255,0);
}

body#kontrollpanelen div#controlPanel
{
	/*background-image: url(/images/controlPanel/cpBg_sv.png);*/
}

body.unsaved div#controlPanel
{
	/*background-image: url(/images/controlPanel/cpBg_unsaved_sv.png);*/
	border-color: orange;
}

div#controlPanel div#unsavedNotice
{
	display: none;
	float: right;
	background-color: yellow;
	color: black;
	font-size: 1.5em;
	padding: 5px;
	border: 1px solid rgb(120,120,120);
	cursor: default;
}
body.unsaved div#controlPanel div#unsavedNotice
{
	display: block;
}

div#content div.adminThisPage
{
	padding-top: 25px;
	padding-bottom: 25px;
	margin-bottom: 20px;
}

div#content div.adminThisPage a
{
	color: black;
}

div#content div.cpGood
{
	background-image: url(/images/controlPanel/changeDoneBg.png);
	background-position: 99% 1%;
	background-repeat: no-repeat;
	border-color: rgb(0,205,50);
}

div#content div.cpBad
{
	background-image: url(/images/controlPanel/errorBg.png);
	background-position: 99% 1%;
	background-repeat: no-repeat;
	border-color: rgb(128,0,0);
	padding-top: 20px; /* to make sure the background images does not get covered*/
}

div#content div.cpQuestion
{
	background-image: url(/images/controlPanel/questionBg.png);
	background-position: 99% 1%;
	background-repeat: no-repeat;
	border-color: rgb(128,128,0);
	padding-top: 20px; /* to make sure the background images does not get covered*/
}

div#controlPanel h1
{
	margin-bottom: 30px;
	margin-top: 0px;
	font-size: 24px;
	color: black;
	/*background-image: url(/images/controlPanel/cpH1bg.png);*/
	background-repeat: no-repeat;
	padding: 4px 0px 0px 5px;
	font-weight: normal;
	font-family: verdana;
	letter-spacing: 1px;
}

div#controlPanel h1 img.cpH1Icon
{
	display: block;
	margin-right: 10px;

	float: left;
}

div.cpBad h1
{
	background-image: none;
}

div#controlPanel h2, div#controlPanel h3, div#controlPanel strong,
div#controlPanel h2 a, div#controlPanel h3
{
	color: rgb(0,50,80);
}


div#controlPanel div#cpHud
{
	overflow: hidden;
}

a.admLinkSmallIcon
{
	display: block;
	float: left;
	clear: left;
	width: auto;

	margin-bottom: 5px;
	text-decoration: none;

	background-position: 2px 2px;
	background-repeat: no-repeat;
	background-size: 24px 24px;
	padding: 7px 5px 8px 32px;
	color: black;
}

a.admLinkSmallIcon.noText
{
	height: 1em;
	margin-top: 1em;
	padding-left: 24px;
}

a.admLinkSmallIcon:hover
{
	text-decoration: underline;
}

.noFloat, div#content a.noFloat
{
	float: none !important;
}

div.iconWithText img
{
	margin-right: 10px;
	width: 24px;
}
div.iconWithText > span.guiTextContent
{
	display: block;
	padding-top: 6px;
}

p.gui.warningSmall
{
	background-color: yellow;
	display: inline-block;
	padding: 5px;
}

p.gui.importantMessageSmall
{
	color: rgb(128,0,0);
}

p.gui.errorMessageSmall
{
	color: rgb(255,0,0);
}

p.gui.positiveMessageSmall
{
	color: rgb(0,128,00);
	background-color: rgb(230,255,230);
}


/* Detail icons used in combination with class admLinkSmallIcon */
a.admLinkSmallIcon.showList			{ background-image: url(/images/controlPanel/tools/list.png); }
a.admLinkSmallIcon.hide				{ background-image: url(/images/controlPanel/tools/hide.png); }
a.admLinkSmallIcon.showLive			{ background-image: url(/images/controlPanel/tools/live.png); }
a.admLinkSmallIcon.createNew,a.add	{ background-image: url(/images/controlPanel/tools/add.png); }
a.admLinkSmallIcon.login				{ background-image: url(/images/controlPanel/tools/login.png); }
a.admLinkSmallIcon.home				{ background-image: url(/images/controlPanel/tools/home.png); }
a.admLinkSmallIcon.edit				{ background-image: url(/images/controlPanel/tools/edit.png); }
a.admLinkSmallIcon.delete			{ background-image: url(/images/controlPanel/submit/submitDelete.png); }
a.admLinkSmallIcon.import			{ background-image: url(/images/controlPanel/submit/submitImport.png); }
a.admLinkSmallIcon.accept			{ background-image: url(/images/controlPanel/submit/submitSaveContinue.png); }
a.admLinkSmallIcon.divide			{ background-image: url(/images/controlPanel/submit/divide.png); }


/*Makes border more visible. Used in admMenuLinkEdit*/
div#controlPanel form div.regAttension a.admLinkSmallIcon
{
	color: black;
}

div#controlPanel form div.regAttension a.admLinkSmallIcon:hover
{
	color: black;
}

div#controlPanel div#cpHud a.cpIcon,
/*a.admLinkSmallIcon,*/
div.inputSearchContainer div.searchResults a
{
	display: block;
	float: left;
	text-decoration: none;
	color: rgb(120,120,120);
}

div#controlPanel div#cpHud a.cpIcon
{
	
	text-align: center;
	font-size: 18px;
	
	margin-right: 5px;
	padding: 8px;
	opacity: 0.7;
	-moz-opacity: 0.7;
}

div#controlPanel div#cpHud a.last
{
	margin-right: 0px;
}

div#controlPanel div#cpHud a.cpIcon:hover,
a.admLinkSmallIcon:hover,
div#controlPanel form a.admLinkSmallIcon:hover,
div.inputSearchContainer div.searchResults a:hover,
div.timePlanStatusBox input.submit:hover
{
	border-color: rgb(180,180,180);
	color: black;
	filter: alpha(opacity=100);
	opacity: 1;
	-moz-opacity: 1;
}

div.timePlanStatusBox div.statusHeading
{
		overflow: hidden;
		margin-bottom: 10px;
}

div#controlPanel div#cpHud a.cpIcon img
{
	display: block;
}


div#controlPanel table span.status
{
	background-repeat: no-repeat;
	padding-left: 30px;
}
div#controlPanel table span.st-2	{ background-image: url(/images/controlPanel/status/ct_status_autoHistory.png);  }
div#controlPanel table span.st-1	{ background-image: url(/images/controlPanel/status/ct_status_autoCache.png);  }
div#controlPanel table span.st0		{ background-image: url(/images/controlPanel/status/ct_status_pre.png);  }
div#controlPanel table span.st1		{ background-image: url(/images/controlPanel/status/ct_status_old.png);  }
div#controlPanel table span.st2		{ background-image: url(/images/controlPanel/status/ct_status_wip.png);  }
div#controlPanel table span.st3		{ background-image: url(/images/controlPanel/status/ct_status_waiting.png);  }
div#controlPanel table span.st4		{ background-image: url(/images/controlPanel/status/ct_status_denied.png);  }
div#controlPanel table span.st5		{ background-image: url(/images/controlPanel/status/ct_status_ok.png);  }

/* Admin General Design Elements */
div#content .adminElement
{
	
}

div#content .adminBox
{
	margin: 10px 0px 10px 0px;
	background-color: rgb(240,240,240);
	border: 1px solid rgb(150,150,150);
	padding: 10px;
}

div#content a.adminElement:hover
{
	
}

div#header div.hamburgerToggleContainer
{
	display: inline-block;
	cursor: pointer;
}

div#header div.hamburgerToggleContainer div.bar
{
	width: 35px;
	height: 5px;
	background-color: #333;
	margin: 6px 0;
	transition: 0.4s;
}

div#header div.hamburgerToggleContainer.change div.bar.bar1
{
	-webkit-transform: rotate(-45deg) translate(-9px, 6px);
	transform: rotate(-45deg) translate(-9px, 6px);
}

div#header div.hamburgerToggleContainer.change div.bar.bar2 {opacity: 0;}

div#header div.hamburgerToggleContainer.change div.bar.bar3
{
	-webkit-transform: rotate(45deg) translate(-8px, -8px);
	transform: rotate(45deg) translate(-8px, -8px);
}

div#header ul.adminList
{
	font-weight: bold;
	margin: 0px;
	font-family: verdana;
	background-color: rgb(20,50,80);
	border-bottom: 2px solid rgb(255,255,255);
	color: white;
	overflow: hidden;
	padding: 0px;
	height: auto;
	display: none;
}

div#header ul.adminList li.header
{
	text-align: left;
	padding: 10px 5px 10px 5px;
	color: white;
	display: none;
}

@media screen and (min-width: 800px)
{
	div#header div.hamburgerToggleContainer
	{
		display: none;
	}
	div#header ul.adminList
	{
		display: block;
	}
	div#header ul.adminList li
	{
		display: block;
		float: left;
		text-align: center;
		padding: 0px;
		margin: 0px;
		font-size: 10px;
		margin-right: 3px;
		height: auto;
	}

	div#header ul.adminList li.header
	{
		display: block;
	}
}


span.regHelpIcon
{
    float: left;
    padding: 1px 5px 1px 5px;
    border: 1px solid rgb(128,128,128);
    background-color: rgb(255,255,180);
    margin-right: 5px;
    margin-top: 3px;
    border-radius: 5px;
}





div#header ul.adminList li a,
div#header ul.adminList li span.dead
{
	display: block;
	color: rgb(230,230,230);
	text-decoration: none;
	padding: 10px 5px 10px 5px;

}

div#header ul.adminList li a:hover,
div#header ul.adminList li.selected a
{
	color: white;

	background-color: rgb(20,80,150);
}

@media screen and (min-width: 800px)
{
	div#header ul.adminList li a:hover,
	div#header ul.adminList li.selected a
	{
		background-image: url(/images/engine/icons/menuArrow.png);
		background-position: center top;
		background-repeat: no-repeat;
	}
}

div#header ul.adminList li span.dead
{
	color: rgb(110,110,140);
}


div#header ul.adminList li#last
{
	margin-right: 0px;
	border-right: 0px;
}


/********************* Tables ***********************/
table.controlPanelMain
{
	width: 100%;
	border: 0px solid rgb(210,210,210);
	margin-bottom: 20px;

	/*background-image: url(/images/controlPanel/cpBigBg.png);*/
	background-repeat: no-repeat;
	padding: 4px 0px 0px 5px;
	clear: both;
	border-spacing: 0px;
}

table.controlPanelMain th
{
	text-align: left;
	color: black;
	padding: 8px 0px 8px 3px;
}

table.controlPanelMain th.remove,
table.controlPanelMain td.remove
{
	text-align: right;
}

table.controlPanelMain td.remove input.checkbox
{
	margin-right: 10px;
}

div div table.controlPanelMain th a
{
	text-decoration: none;
	color: rgb(60,60,60);
}
div div table.controlPanelMain th a:hover { color: black; }

table.controlPanelMain td
{
	border-top: 1px solid rgb(240,240,240);
	border-bottom: 1px solid rgb(240,240,240);
	background-color: rgb(240,240,240);
	padding: 5px;
	padding-top: 1em;
	padding-bottom: 1em;
}



table.controlPanelMain tr.equal td
{
	background-color: rgb(255,255,255);
	border-color: rgb(220,220,220);
}

table.controlPanelMain tr.content:hover td
{
	background-color: rgb(200,200,200);
	border-color: rgb(255,255,255);
	background-color: rgb(240,240,255);
}

table.controlPanelMain td a
{
	text-decoration: none;
	color: rgb(70,70,70);
}

table.controlPanelMain td a:hover
{
	color: black;
}

table.controlPanelMain tr.search td
{
}

table.controlPanelMain tr.search td input
{
	
}

div div table.controlPanelMain tr.footer td
{
	border-top: 1px solid rgb(210,210,210);
}



ul.menuStructureDemo
{
	border: 1px solid rgb(200,200,200);
	padding: 5px;
	margin: 0px;
	background-color: rgb(230,230,230);
	list-style-type: none;
}

ul.menuStructureDemo ul
{
	border: none;
	margin-left: 20px;
}

ul.menuStructureDemo li
{
	overflow: hidden;
	margin-bottom: 2px;
	clear: both;
}

ul.menuStructureDemo li:hover
{

}
ul.menuStructureDemo li a.text
{
	float: left;
	display: block;
	margin-right: 20px;
	margin-top: 7px;
}

ul.menuStructureDemo li a img
{
	visibility: hidden;
	float: left;
	margin-right: 2px;
}

ul.menuStructureDemo li span
{
	display: block;
	padding-top: 8px;
	font-size: 10px;
	visibility: hidden;
}

ul.menuStructureDemo li:hover ul li a img
{
	visibility: hidden;
}
ul.menuStructureDemo li:hover a img,
ul.menuStructureDemo li ul li:hover a img
{
	visibility: visible;
}

ul.menuStructureDemo li:hover span
{
	visibility: visible;
}


span.viewedVer
{
	border: 1px solid black;
	padding: 2px;
}

table.controlPanelMain tr.viewedVer td,
span.viewedVer
{
	border-color: green;
}

table.controlPanelMain tr.activeVer td.name,
span.activeVer,
form fieldset.activeVer legend,
form fieldset.otherVer legend /*Change image and color a few lines down */
{
	background-image: url(/images/controlPanel/general/dotGreen.png);
	background-position: 2px 50%;
	padding-left: 20px;
	background-repeat: no-repeat;
}

form fieldset.subArea
{
	border: 1px solid green;
	margin: 10px 0px 10px 0px;
}

form fieldset.subArea span.date
{
	padding-left: 5px;
	font-size: 0.8em;
}

form fieldset.otherVer
{
	border-color: rgb(190,130,0);
}

form fieldset.otherVer legend
{
	background-image: url(/images/controlPanel/general/dotOrange.png);
}

ul.msdLevel0
{
	list-style-type: none;
	margin-bottom: 10px;
}

/* Create content */

form input#_submitCreateContent
{
	display: none;
}

/* INPUT REALTIME SEARCH FUNCTION */

div.inputSearchContainer
{
	float: left;
}

div.inputSearchContainer div.searchResults
{
	margin-top: 22px;
	margin-left: -1px;
	position: absolute;
	width: 200px;
	background-color: white;
	padding: 3px;
	border: 1px solid black;
	border-top: 0px;
	color: black;
	display: none;
}

div.inputSearchContainer div.searchResults h4
{
	margin: 0px 35px 2px 5px;
	padding-bottom: 2px;
	border-bottom: 1px solid rgb(0,60,90);
}

div.inputSearchContainer div.searchResults h5
{
    margin: 0px 35px 2px 5px;
	padding-bottom: 2px;
}

div.inputSearchContainer div.searchResults a
{
	float: none;
	padding: 7px 5px 8px 5px;
}

div.inputSearchContainer div.searchResults a.content
{
	background-image: url(/images/icons/content.png);
	background-repeat: no-repeat;
	background-position: 2px center;
	border-color: white;
	padding-left: 32px;
}

div.inputSearchContainer div.searchResults a.news
{
	padding-left: 3px;
	padding-top: 3px;
	padding-bottom: 10px;
}

div.inputSearchContainer div.searchResults a.news span.newsIconCal
{
}

div.inputSearchContainer div.searchResults a.news span.text
{
	display: block;
	margin-left: 28px;
	margin-top: 3px;
}

div.inputSearchContainer div.searchResults a:hover
{
	border-color: rgb(180,180,180);
}

div.inputSearchContainer div.searchResults img.waitMsg
{
	display: block;
	float: left;
	margin-top: 1px;
	margin-right: 8px;
}

div#mainContainer div#footer div#loggedInBox
{
	background-color: white;
	color: black;
	padding: 10px 10px 10px 40px;
	margin: 10px 0px 10px 0px;
	background-image: url(/images/controlPanel/hud/users_s.png);
	background-position: 2px 2px;
	background-repeat: no-repeat;
}

div#mainContainer div#footer div#loggedInBox a
{
	color: black;
}

div#mainContainer div.tabContainer
{

}

div#mainContainer div.tabContainerBig
{
	overflow: hidden;
	clear: both;
}

div#mainContainer div.tabContent
{
	margin-top: -1px;
	border: 1px solid rgb(100,100,100);
}

div#mainContainer div.tabContainerBig ul.tabOptions li
{
	margin: 0px;
	margin-right: 10px;
}
div#mainContainer div.tabContainerBig ul.tabOptions li a
{
	display: block;
	padding: 10px;
	background-color: rgb(220,220,220);
	font-size: 18px;
	border: 1px solid black;
	text-decoration: none;
}

div#mainContainer div.tabContainerBig ul.tabOptions li.selected a
{
	background-color: white;
	border-bottom: 0px;
}

div#mainContainer div#cpRecentLogs
{
	padding: 10px;
	margin-bottom: 20px;
}

div#mainContainer div#cpComingChanges
{
	padding: 10px;
	margin-bottom: 20px;
}

div#mainContainer div#cpComingChanges h2
{
	color: rgb(150,150,0);
}

div#mainContainer div#cpFinishedChanges
{
	padding: 10px;
}

div#mainContainer div#cpFinishedChanges h2,
div#mainContainer div#cpFinishedChanges h3
{
	color: rgb(0,150,0);
}

ul.todo li.done
{
	text-decoration: line-through;
}


div.adminDataTopLeft
{
	width: 300px;
	border: 1px solid black;
	padding: 3px;
	background-color: rgb(230,230,230);
}

div.adminDataTopRight
{
	width: 300px;
	border: 1px solid black;
	margin-left: 470px;
	padding: 3px;
	position: absolute;
	background-color: rgb(230,230,230);
}

div#content div#controlPanel div.adminData h4
{
	margin-top: 0px;
	font-weight: bold;
	margin-bottom: 5px;
}

table.objectList
{
	/*border-collapse: collapse;*/
	border-spacing: 0;
}

table.objectList td, table.objectList th
{
	padding: 0px;
}

table.logs
{
	border-collapse: collapse; border-spacing: 0;
	width: 100%;
}

table.logs tr.comment td
{
	font-style: italic;
	color: rgb(100,100,100);
	font-size: 0.9em;
}

table.logs tr td.date
{

}

table.logs tr td.date
{
	width: 8em;
	padding: 1em;
}

table.logs tr th:last-child
{
	padding-right: 0.5em;
}

table.logs tr td
{
	padding-left: 0.5em;
}

table.logs tr.create td
{
	background-color: rgb(230,255,230);
}

table.logs tr.edit td
{
	background-color: rgb(255,255,210);
}

table.logs tr.delete td
{
	background-color: rgb(255,230,230);
}

table.logs tr td.icon
{
	background-image: url(../images/controlPanel/submit/submitCreateNewVersion.png);
	width: 24px;
	background-repeat: no-repeat;
	background-position: center center;
}

table.logs tr.delete td.icon
{
	background-image: url(../images/controlPanel/submit/submitDelete.png);
}
table.logs tr.edit td.icon
{
	background-image: url(../images/controlPanel/tools/edit-pen.png);
}


div.ieWarning
{
		background-color: white;
		overflow: hidden;
		padding: 10px;
		border: 1px solid rgb(200,200,200);
		margin-bottom: 10px;
}
a.chromeLink
{
		border: 1px solid white;
		display: block;
		float: left;
}

a.chromeLink:hover
{
		border-color: rgb(200,200,200);
}


div#debugFooter
{
	display: none;
	padding: 10px;
	
	background-color: rgb(20,50,80);
	color: black;
	overflow: hidden;
	padding: 20px;
	clear: left;
	
	
	
	border-top-right-radius: 15px;
	border-bottom-right-radius: 15px;
	border-bottom-left-radius: 15px;
}

div#debugFooter pre
{
	color: white;
}

div#footer a.debugToolsToggle
{
	text-decoration: none;
	color: rgb(220,220,220);
	font-size: 1.2em;
}

div#debugFooter div#debugTools
{
	
}

div#debugFooter div#debugTools a
{
	color: rgb(240,240,240);
}

div#debugFooter div#debugTools a:hover
{
	color: white;
}

div#debugFooter div.debugDataContainer
{
		display: none;
}
div#debugFooter div.debugDataContainer pre
{
		font-size: 12px;
		text-align: left;
}

div.formFooter
{
	margin-top: 1em;
	padding-top: 1em;
	border-top: 1px dotted rgb(150,150,150);
}

fieldset.collapse > div.clickme	{ display: block; cursor: pointer;}
fieldset.open > div.clickme	{ display: none; }

fieldset.collapse > legend { cursor: pointer; }

fieldset.collapse > div.fieldsetContent { display: none; }
fieldset.open > div.fieldsetContent { display: block; }

.topnav {
	background-color: #333;
	overflow: hidden;
  }
  
  /* Style the links inside the navigation bar */
  .topnav a {
	float: left;
	display: block;
	color: #f2f2f2;
	text-align: center;
	padding: 14px 16px;
	text-decoration: none;
	font-size: 17px;
  }
  
  /* Change the color of links on hover */
  .topnav a:hover {
	background-color: #ddd;
	color: black;
  }
  
  /* Add an active class to highlight the current page */
  .topnav a.active {
	background-color: #4CAF50;
	color: white;
  }
  
  /* Hide the link that should open and close the topnav on small screens */
  .topnav .icon {
	display: none;
  }

  @media screen and (max-width: 600px) {
	/* .topnav a:not(:first-child) {display: none;} Never hide login button */ 
	.topnav a.icon {
	  float: right;
	  display: block;
	}
  }
  
  /* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
  @media screen and (max-width: 600px) {
	.topnav.responsive {position: relative;}
	.topnav.responsive a.icon {
	  position: absolute;
	  right: 0;
	  top: 0;
	}
	.topnav.responsive a {
	  float: none;
	  display: block;
	  text-align: left;
	}
  }

  
table.controlPanelMain div.paginationAndSummary
{
	display: flex;
	gap: 5em;
}

table.controlPanelMain div.paginationAndSummary nav.paginationContainer > *
{
	margin-right: 2em;
}

table.controlPanelMain div.paginationAndSummary nav.paginationContainer > span.current
{
	font-weight: bold;
}

table.controlPanelMain div.paginationAndSummary nav.paginationContainer > a
{
	text-decoration: underline;;
}

div.banner-container
{
	display:flex;
	flex-direction: column;
	justify-content: space-around;
    align-items: center;
}

.header-banner
{
	position: relative;
	padding: .75rem 1.25rem;
	width: 100%;
	/* margin-bottom: 1rem; */
	border: 1px solid transparent;
	border-top-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	border-left-color: transparent;
	padding-right: 4rem;
	min-height: 50px;
	box-sizing: border-box;
	/* border-radius: .25rem; */
}
.header-banner p
{
	margin: 0;
}
.header-banner a.close,
dialog.external-form a.close
{
	position: absolute;
	top: 0;
	right: 0;
	padding: .4rem 1.25rem;
	color: inherit;
	background-color: transparent;
	border: 0;
	text-decoration: none;
	cursor: pointer;
	-webkit-appearance: none;

	font-size: 1.5rem;
	font-weight: 700;
	text-shadow: 0 1px 0 #fff;
	opacity: .5;
}

.header-banner a.close:hover,
dialog.external-form a.close:hover
{
	color: #000;
	text-decoration: none;
	opacity: .75;
}

.header-banner-warning
{
	color: #856404;
	background-color: #fff3cd;
	border-color: #ffeeba;
}
.header-banner-error
{
	color: #721c24;
	background-color: #f8d7da;
	border-color: #f5c6cb;
}
.header-banner-info
{
	color: #0c5460;
	background-color: #d1ecf1;
	border-color: #bee5eb;
}

.annotation-warning{
	height:80px;
	width:100%;
	background-color: rgba(229, 11, 11, 0.82);
	text-align: center;
	font-size: 25px;
}
.annotation-news{
	height:80px;
	width:100%;
	background-color: rgba(11, 29, 229, 0.6);
	text-align: center;
	font-size: 25px;
}


/* Ska flyttas till mothership css */
  /* body{ ???? JK 230201
    padding:0px;
    margin:0px;
  } */




/* General Form Style Mothership START */
  div.over
  {
    text-align:center;
	background-color: rgba(247, 247, 247);
    padding-bottom:25px;
  }
  .question-container
  {
	display:flex;
	flex-direction: column;
	align-items: center;
	margin: 0px;
	width: 80%;
  }
  dialog::backdrop
  {
	background-color: rgba(11, 11, 11, 0.7);
  }

  dialog.external-form
  {
	padding:0px;
	background-color: rgba(247, 247, 247);
	position: relative;
  }

  form.mothership-survey
  {
	background: #FFFFFF;
  }

  form.mothership-survey h1
  {
  	padding-top:50px;
  	font-family: 'Lato';
  	font-style: normal;
  	font-weight: 700;
  	font-size: 30px;
  	line-height: 24px;
  
  	color: #212121;
  }

  form.mothership-survey .under
  {
    box-sizing: border-box;
    width:100%;
    background: #FFFFFF;
    display:flex;
    flex-direction: column;
    justify-content:center;
    align-items:center;
  }
  
  form.mothership-survey input[type="text"]{
    margin-top:50px;
    margin-bottom:50px;
    box-sizing: border-box;
    width: 529px;
    height: 47px;
    background: #EFEFEF;
    border: 0.1px solid #000000;
    border-radius: 30px;
  }
  form.mothership-survey input[type="submit"]{
    width: 193px;
    height: 47px;
    background: #212121;
    border-radius: 30px;
    color:white;
    margin-bottom:50px;
  }
  
  
  form.mothership-survey textarea {
   height: 1em;
   padding: 6px 10px;
   transition: all 0.5s ease;
   resize:none;
   margin: 30px 50px;
   box-sizing: border-box;
   background: #EFEFEF;
   border: 0.1px solid #000000;
   border-radius: 15px;
   height:40px;
  }
  
  form.mothership-survey textarea:focus 
  {
      height: 8em;
  }

/* General Form Style Mothership END */
/* Range Questions START */
.range-container
{
	display:flex;
	justify-content:center;
}
.range-container .radio-container
{
	height: 50px;
	width: 50px;
	margin:10px -7px 10px 10px;
	text-align:center;
	color:white;
	line-height:50px;
	font-family:Lato;
}
.range-container .radio-container > label
{
	background-color: #7FB557;
	text-align: center;
	display: block;
	width: 100%;
	height: 100%;
	text-align: center;
}
.range-container .radio-container > input[type='radio']
{
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	display: none;
}
.range-container .radio-container input[type='radio']:checked + label
{
	background-color:orange;
	color: red;
}
.range-container .radio-container:first-child label
{
	border-radius: 100vh 0 0 100vh;
}
.range-container .radio-container:last-child label 
{
  	border-radius: 0 100vh 100vh 0;
}
/* Range Questions END */

/* Thumbs Questions start */
.like-container i.fa-thumbs-up, .like-container i.fa-thumbs-down
{
	font-size:50px;
}
.like-container i.fa-thumbs-up
{
	color: rgb(120, 213, 120);
}
.like-container i.fa-thumbs-down
{
	color: rgb(229, 11, 11, 0.82);
}
.like-container
{
	display: flex;
	justify-content: space-around;
}

.like-container label#thumbsLabel
{
  	border-radius:0px;
}
form.mothership-survey .like-container .radio-container
{
  height: 50px;
  width: 50px;
  margin:10px 10px 10px 10px;
  text-align:center;
  color:white;
  line-height:50px;
  font-family:Lato;
}
form.mothership-survey .like-container .radio-container > label
{
  background-color: white;
  text-align: center;
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
}
form.mothership-survey .like-container .radio-container > input[type='radio']
{
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  display: none;
}
form.mothership-survey .like-container [type='radio']:checked + label
{
	--shadow-thickness: 2px;
	--shadow-color: rgba(0, 0, 0, 0.75);
	  text-shadow: 
		var(--shadow-thickness) 0 var(--shadow-color),
		0 var(--shadow-thickness) var(--shadow-color),
		calc(-1 *var(--shadow-thickness)) 0 var(--shadow-color),
		0 calc(-1 * var(--shadow-thickness)) var(--shadow-color);
}
/* Thumbs Questions END */
.open-survey-button 
{
    height: 20px;
    width: 20px;
	position: absolute;
	cursor: pointer;
    border-radius: 50%;
    background-color: rgb(120, 213, 120);
	border: 1px solid rgb(120, 213, 120);
    animation: pulse 1.5s ease-in-out infinite;
  }
@keyframes pulse {
  0% {
    opacity: 0.5;
    box-shadow: 0 0 0 0px rgba(120, 213, 120, 0.5);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.5;
    box-shadow: 0 0 0 10px rgba(120, 213, 120, 0);
  }
}
.open-survey-button:hover
{
	outline: 1px solid #5f5f5f;
}