/* Main tabs */
	#k1 { background-image:url('1.webp'); }
	#k2 { background-image:url('2.webp'); }
	#k3 { background-image:url('3.webp'); }
	#k4 { background-image:url('4.webp'); }
	#k5 { background-image:url('5.webp'); }

	/* Lang menu */
	nav div div p {
		width: 90%;
		height: 1.8em;
		color: #ddd;
		font-family:t;
		font-size: 2em;
		line-height: 2em;
		padding-left: 10px;
		font-weight: 100;
		display:none;
		top: 10px;
		position: relative;
	}

	nav div div p:hover {
		color:#fff;
		transition: color 1s;
		cursor:pointer;
	}

	.ovl {
		background-color: rgba(0,0,0,0.5) !important;
		display:none;
		height: 100%;
	}

	p.exams {
		font-size: 1.2em;
		line-height: 1.5em;
	}

	/* Return arrow */
	p.arr {
		font-size: 1.7em;
		height:1.2em;
		line-height:1em;
		padding:0 0 0 13px;
	}

	/* Nightmode skin switch */
	nav#sk {
		position:absolute;
		top:1vh;
		right:7vh;
	}
	
	/* Acount icon */
	nav#ac {
		position:absolute;
		top:1vh;
		right:11vh;
	}
	
	nav#sk, nav#ac {
		color:rgba(0,0,0,0.08);;
		font-size:2.3em;
		cursor:pointer;
		transition: color .5s ease-out;
	}
	
	nav#sk:hover, nav#ac:hover {
		color:rgba(0,0,0,0.8) !important;
		transition: color .5s;
	}



	/* Exam heading, smaller font */
	.ex_h {
		font-size:4em;
	}



	/* Nightmode */
	.n-logo h3 {
		color:#292722;
		transition: color 1s;
	}

	.n-logo span {
		color:#ebe6b6;
		transition: color 1s;
	}

	.font-creamy {
		color:#eee !important;
		/* color:#e8d9b1; */
		transition: color 1s;
	}
	
	.background-creamy {
		background:#e8d9b1;
		transition: color 1s;
	}
	
	.font-brown {
		/* color:#292722; */
		color:#333;
		transition: color 1s;
	}
	
	.font-black {
		color: var(--bgrev);
	}
	
	.font-gray {
		color:#ddd;
	}
	
	.background-brown {
		/* background:#292722; */
		background:#333;
		transition: background 0.5s;
	}
	
	.blend {
		background-color: #5858588c;
		background-blend-mode: overlay;
	} 


	/* Article */
	article {
		width:69%;
		margin:0 auto;
	}
	
	article h4 {
		line-height: 2em;
	}

	/* Topic lists */
	article nav.topics, article nav.booklets  {
		font-family:t;
		font-size:1.3em;
		padding:10px 50px;
	}
	article nav.topics {
		float: left;
	}
	
	/* Enries for booklets and topics on pre-select stage */
	article nav.topics a, article nav.booklets a {
		line-height:2em;
		cursor:pointer;
		padding:2px 10px;
	} 
	article nav.topics a  {
		display:inline-block;
	}	
	article nav.booklets a  {
		display:inline-block;
		width:60px;
		text-align:center;
	}
	
	article a:hover {
		background:rgba(0,0,0,0.05);
	}
	
	/* Amount of questions */
	article nav.topics span {
		color:#ccc;
		display: inline-block;
		width:60px;
		text-align:right;
		padding-right:10px;
	}
	

	/* Header of exam */
	#b-header {
		font-size: 55px;
		margin-left: 10px;
	}
	
	header div h3 nobr {
		text-transform:uppercase;
	}	
	

	/* Account */
	/* All tabs */
	#t1, #t2, #t3,
	#b1, #b2, #b3
	{
		width: 135px;
		height: 2em;
		line-height: 2em;
		padding: 8px 10px;
		display: inline-table;
		text-align: center;
		font-size: 1.2em;
		border: 1px solid transparent;
		user-select:none;
	}
	
	/* Bottom tabs */
	#b1, #b2, #b3 {
		float: right;
		margin-left: 5px;
	}
	
	
	/* Tab current top and bottom */
	.tc_t, .tc_b {
		background: rgb(158 158 158 / 20%);
	}
	
	#area2, #area3, .hide {
		display:none;
	}
	
	input[type="text"], input[type="password"], option, select {
		padding: 17px;
		border: 0;
		font-size: 1em;
		color: #333;
		-webkit-background-clip: text;
		margin-bottom:15px;
		background:var(--inprev);
		min-width: 250px;
		box-shadow: 1px 1px 1px rgb(0 0 0 / 5%);
	}
	
	::placeholder {
		color: rgba(0,0,0,0.3);
	}
	
	option {
		color:#333;
	}
	
	input:focus, select:focus, button:focus {
		outline:none;
	}
	
	.loading {
		background:url('load.svg') no-repeat center center #6abf40f9 !important;
		background-size: 100px 60px;
		transition: none;
	}

	::placeholder {
	  color: rgba(0,0,0,0.3);
	}
	
	button, input[type="button"] {
		/* padding: 17px; */
		font-size: 1em;
		color: var(--bgrev);
		border:none;
		font-family:m;
	}
	
	.cta, .ctr, .loading {
		min-width: 160px;
		min-height: 53px;
	}
	
	.cta, .ctr {
		background-color:#6abf40bd;
		color:#fff !important;
		/* transition: background 0.2s; */
		box-shadow: 1px 1px 1px rgb(0 0 0 / 5%);
	}
	
	.cta:hover {
		background:#6abf40f9;
		/* transition:background 0.2s; */
	}
	
	.ctr {
		background:#444;
		transition: background 0.2s;
	}
	.ctr:hover {
		background:#333;
		transition: background 0.2s;
	}
	
	#tabarea {
		padding: 40px;
		min-height: 350px;
		min-width:800px;
		background: rgb(158 158 158 / 20%);
	}
	
	#tabarea nav {
		width: max-content;
		min-width: unset;
		margin: 0 auto;
	}
	
	#tabarea nav div {
		min-width: 650px;
		margin: 0 auto;
	}
	
	.middle {
		width:300px;
	}
	
	.tab nav div {
		min-height:280px;
	}
	
	#r1 p {
		line-height:1.4em;
	}
	
	#tabarea h2 {
		margin-bottom:25px;
		margin-top: 0px;
	}

	input:-webkit-autofill {
    -webkit-box-shadow:0 0 0 50px white inset; /* Change the color to your own background color */
    -webkit-text-fill-color: #333;
	}
	
	.err_msg {
		background: #ffdc4f94;
		display: none;
		
		font-family: m;
		box-shadow: 1px 1px 1px rgb(0 0 0 / 5%);
		
		
		margin-left: 20px;
		padding: 17px 20px;
	}
	
	/* EO Account */
	@media (max-width: 1200px) {
		#b1,#b2,#b3 {
			display:none;
		}
		
		article {
			width: 100%;
			margin: 0 auto;
		}
		
	}


	@media (max-width: 736px) {
		
		/* Exams in tiles */
		nav div p {
			height: unset;
			font-size:unset;
			top: 5px;
		}
		
		#t1,#t2,#t3 {
			width:25%;
		}
		
		#tabarea nav {
			width: unset;
		}
		
		/* Main header */
		.ex_h {
			font-size: 1.5em;
			margin-top: 100px;
		}
		
		/* Exam info header */
		#b-header {
			font-size: 20px;
			font-family:b;
			margin-left: 3px;
		}
		
		article {
			width: 100%;
		}
		
		nav.topics, nav.booklets {
			width:100%;
		}
		
		/* Exam info list of items.. */
		article nav.topics a {
			font-size: 0.8em;
			line-height: 2em;
			width: 85%;
		}
		
		/* Amount of questions hidden for mobiles preventing long lines */
		article nav.topics span {
			display:none;
		}
		
		article nav.topics, article nav.booklets {
			font-family: t;
			font-size: 1.3em;
			padding: 9px 20px;
		}
		
		#tabarea {
			padding: 40px;
			min-width: unset;
			border-bottom:0;
			border-left:0;
			border-right:0;
		}
	}
	
		.g, .o, .d {
		font-family:'t';
	}