.TopLogo {
    background: url('./solar_logo_small.png') no-repeat 0 0;
    background-color:Transparent;
}
/*Light-color er brukt på bakgrunnen til knapper og ting som skal trykkes på*/
/*Dark-color er brukt til tekst eller ikoner som ligger oppå light-color*/
/*Light-color og dark-color bytter plass når man hovrer over noe.*/
/*Very-dark-color er brukt til illustrere at noe er valgt. Feks når brukeren velger skin*/
:root {
	--light-color: #e8e8e8;
	--dark-color: #787878;
	--very-dark-color: #545454;
	--navbar-line-color: #bcddc2;
}
.navbar {
    border-bottom: 2px solid;
    padding: 0 0 !important;
}
table.dataTable thead .sorting_asc {
	background-image: url("./sort_asc.png") !important;
}
table.dataTable thead .sorting_desc {
	background-image: url("./sort_desc.png") !important;
}
.navbar, .nav-link {
	color: var(--dark-color) !important;
	border-color: var(--navbar-line-color) !important;
}
.navbar > div > ul > li > a:hover{
	color: var(--light-color) !important;
}
.navbar > div > ul > li > a:hover .icon-background{
	color: var(--dark-color) !important;
}

.nav-link:focus {
	color: var(--light-color) !important;
}

.nav-link:focus  .icon-background{
	color: var(--dark-color) !important;
}
.icon-background {
	transition: 0.3s;
	color: var(--light-color);
}

	.icon-background:hover {
		color: var(--dark-color) !important;
	}

.Heading3 {
	color: #404040;
}

.tableHeaderFixed thead th {
	background-color: white;
	border: 0px !important;
}

.statusInfo {
	color: var(--dark-color) !important;
	background-color: var(--light-color);
}
	.statusInfo:hover {
		background-color: var(--dark-color);
		color: var(--light-color) !important;
	}
	.statusInfo:focus {
		background-color: var(--dark-color);
		color: var(--light-color) !important;
	}

.radio-mypage label {
	border: 0px;
	font-weight: bold;
	color: var(--dark-color);
	background-color: var(--light-color);
}
	.radio-mypage label:hover {
		background-color: var(--dark-color);
		color: var(--light-color);
	}
	.radio-mypage label:focus {
		background-color: var(--dark-color);
		color: var(--light-color);
	}
.radio-mypage input[type="radio"]:checked + label {
	background-color: var(--very-dark-color);
	color: var(--light-color);
}

.CourseListTitle {
	color: var(--dark-color);
}

.smallStartCourse {
	color: var(--dark-color) !important;
	background-color: var(--light-color) !important;
	border-color: transparent !important;
	border-radius: 0px !important;
}

	.smallStartCourse:hover {
		color: var(--light-color) !important;
		background-color: var(--dark-color) !important;
	}
	.smallStartCourse:focus {
		color: var(--light-color) !important;
		background-color: var(--dark-color) !important;
	}

.btn-mypage, .saveNote, .deleteNote {
	font-weight: bold;
	border: 0;
	background-color: var(--light-color);
	color: var(--dark-color);
}

.btn-mypage:hover, .saveNote:hover, .deleteNote:hover {
	color: var(--light-color);
	background-color: var(--dark-color);
}
.btn-mypage:focus, .saveNote:focus, .deleteNote:focus {
	color: var(--light-color);
	background-color: var(--dark-color);
}

.radio-frontpage label {
	font-weight: bold;
	background-color: var(--light-color);
	color: var(--dark-color);
	border: 0;
	border-radius: 0;
	margin: 5px;
}

	.radio-frontpage label:hover {
		background-color: var(--dark-color) !important;
		color: var(--light-color) !important;
	}
	.radio-frontpage label:focus {
		background-color: var(--dark-color) !important;
		color: var(--light-color) !important;
	}

.radio-frontpage input[type="radio"]:checked + label {
	background-color: var(--light-color);
	border-color: transparent;
}

.list-group-item {
	color: var(--dark-color) !important;
}

.dataTables_wrapper {
	overflow-x: unset !important;
}

.TabStatus {
	background-color: var(--light-color);
	padding: 8px;
}

.TabInfo {
	background-color: var(--light-color);
	padding: 8px;
}

.TabMessage {
	background-color: var(--light-color);
	padding: 8px;
}

.TabMail {
	background-color: var(--light-color);
	padding: 8px;
}

.TabLink {
	background-color: var(--light-color);
	padding: 8px;
	transition: 0.3s;
}

	.TabLink:hover {
		color: var(--light-color) !important;
		background-color: var(--dark-color);
	}
	.TabLink:focus {
		color: var(--light-color) !important;
		background-color: var(--dark-color);
	}

.TabActive {
	background-color: var(--dark-color);
	color: var(--light-color) !important;
	padding: 8px;
}

.Home {
	display: none;
}
.Speaker {
	display: none;
}

.ContentTemplateButton {
    font-size: 14px;
    color: black !important;
}

.CourseMenuText {
	color: #4d4f53;
	text-decoration: none;
	cursor: pointer;
	font-size: 14px;
	font-family: Arial Unicode,Arial,Helvetica;
	font-weight: normal;
	white-space: nowrap;
	vertical-align: middle;
	text-align: left;
	display: inline-block;
	height: 16px;
}
.Visible30001_L_2 {
    width: 748px;
    height: 510px;
    left: 25px;
    top: 6px;
}
.Visible35000_2 {
    width: 710px;
    height: 445px;
    left: 38px;
    top: 10px;
}
.Navigate35000_2 {
    display: block;
    position: absolute;
    left: 400px;
    top: 409px;
    width: 390px;
    font-family: arial, sans-serif;
    font-size: 13px;
    color: transparent;
    cursor: pointer;
}
.Visible30000_L_2 {
    width: 357px;
    height: 475px;
    left: 28px;
    top: 10px;
}
.Visible30000_R_2 {
    width: 375px;
    height: 506px;
    left: 390px;
    top: 10px;
}
.Navigate30004_2 {
    display: block;
    position: absolute;
    left: 428px;
    top: 425px;
    width: 386px;
}
SelectButton {
    background: url(./select_button_square.png) no-repeat 0 0;
    cursor: pointer;
    height: 24px;
    width: 24px;
    vertical-align: middle;
}
.RowTopSecond2 {
    display: block;
    position: absolute;
    width: 720px;
    height: 24px;
    top: 45px;
}
.Next {
    background: url('./frem.png') no-repeat 0 0;
    cursor:pointer;
    position : absolute;
    top : -320px;
    left : 728px;
    width : 40px;
    height : 88px;
}
.NextChapter {
    background: url('./frem.png') no-repeat 0 0;
    cursor:pointer;
    position : absolute;
    top : -320px;
    left : 728px;
    width : 40px;
    height : 88px;
}
.Previous {
    z-index: 20;
    background: url('./tilbake.png') no-repeat 0 0;
    cursor:pointer;
    position : absolute;
    top : -320px;
    left : 0px;
    width : 28px;
    height : 88px;
}
.PreviousChapter {
    z-index: 20;
    background: url('./tilbake.png') no-repeat 0 0;
    cursor:pointer;
    position : absolute;
    top : -320px;
    left : 0px;
    width : 28px;
    height : 88px;
}

.ChooseChapter {
    background: url('./innholdsmeny.jpg') no-repeat 0 0;
    position : absolute;
	cursor:pointer;
	width: 90px;
	height : 37px;
	top : 2px;
	left : 0px;
	padding-left : 4px;
	padding-top : 4px;
    	z-index : 1;
    	color : transparent;
}
.StartRandomTest {
    background: url('./Start_Testen_Knapp.jpg') no-repeat 0 0;
    cursor : pointer;
    width : 163px;
    height : 50px;
    visibility : visible;
}
.StartRandomTest {
    background: url('./Start_Testen_Knapp.jpg') no-repeat 0 0;
    cursor : pointer;
    width : 163px;
    height : 50px;
    visibility : visible;
}
.NextTest {background: url('./neste testoppgave.jpg') no-repeat 0 0;}
.PreviousTest {background: url('./emptybutton.jpg') no-repeat 0 0;}

.ContentTemplateButtonStartTest {
    font-family: arial, sans-serif;
    font-size: 18px;
    color: white;
    text-align: center;
    vertical-align: middle;
    width: 160px;
    height: 49px;
}