@font-face {
	font-family: 'univers-web';
	src: url('UniversNextPro-Light.eot');
	/* IE9 Compat Modes */
	src: url('UniversNextPro-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('UniversNextPro-Light.woff') format('woff'), /* Modern Browsers */
	url('UniversNextPro-Light.ttf') format('truetype'), /* Safari, Android, iOS */
	url('UniversNextPro-Light.svg#60168d388d72f31b2b732f8e5dc0540d') format('svg');
	/* Legacy iOS */
	font-style: normal;
}

@media only screen and (max-width: 800px) {
	html,
	body {
		background: #383052;
		font: normal 14px univers-web;
	}
	div.titlebar {
		display: none;
	}
	ul {
		list-style: none;
		padding-left: 5px;
		padding-right: 5px;
		overflow: scroll;
	}
	c {
		white-space: pre;
		color: #4CC37E;
		display: inline-block;
		width: 90px;
	}
	b {
		padding-left: 5px;
		font: normal 16px univers-web;
		color: #d8d8d8;
	}
}

@media only screen and (min-width: 800px) and (max-width: 1100px) {
	html,
	body {
		background: #383052;
		font: normal 14px univers-web;
	}
	div.titlebar {
		display: none;
	}
	ul {
		list-style: none;
		padding-left: 10%;
		padding-right: 5%;
		overflow: scroll;
	}
	c {
		white-space: pre;
		color: #4CC37E;
		display: inline-block;
		width: 90px;
	}
	b {
		padding-left: 10px;
		color: #d8d8d8;
	}
	e {
		padding-left: 10px;
		color: #d8d8d8;
		padding-bottom: 10px;
	}
}

@media only screen and (min-width: 1100px) and (max-width: 1500px) {
	html,
	body {
		background: #E0DACF;
		overflow: hidden;
		font: normal 14px univers-web;
	}
	div.borderpart {
		width: 80%;
		height: 80%;
		border-radius: 8px;
		background: #383052;
		margin: 50px auto;
		box-shadow: 0px 0px 40px 10px rgba(128, 128, 128, 0.5);
		min-height: 600px;
		padding-bottom: 43px;
	}
	ul {
		list-style: none;
		padding-left: 10%;
		padding-right: 5%;
	}
	c {
		white-space: pre;
		color: #4CC37E;
		display: inline-block;
		width: 140px;
	}
	b {
		padding-left: 10px;
		color: #d8d8d8;
	}
	div.bodypart {
		height: 100%;
		width: 100%;
		overflow: scroll;
		line-height: 180%;
		color: #4CC37E;
	}

	@keyframes myfirst {
		from {
			width: 0;
			height: 0;
		}
		to {
			width: 80%;
			height: 80%;
		}
	}

	@-moz-keyframes myfirst/* Firefox */
	{
		from {
			width: 0;
			height: 0;
		}
		to {
			width: 80%;
			height: 80%;
		}
	}

	@-webkit-keyframes myfirst/* Safari 和 Chrome */
	{
		from {
			width: 0;
			height: 0;
		}
		to {
			width: 80%;
			height: 80%;
		}
	}

	@-o-keyframes myfirst/* Opera */
	{
		from {
			width: 0;
			height: 0;
		}
		to {
			width: 80%;
			height: 80%;
		}
	}
}

@media only screen and (min-width: 1501px) {
	html,
	body {
		background: #E0DACF;
		overflow: hidden;
		font: normal 14px univers-web;
	}
	div.borderpart {
		width: 60%;
		height: 80%;
		border-radius: 8px;
		background: #383052;
		margin: 50px auto;
		box-shadow: 0px 0px 40px 10px rgba(128, 128, 128, 0.5);
		min-height: 600px;
		padding-bottom: 43px;
	}
	ul {
		list-style: none;
		padding-left: 10%;
		padding-right: 10%;
	}
	c {
		white-space: pre;
		font: normal 16px univers-web;
		color: #4CC37E;
		display: inline-block;
		width: 140px;
	}
	b {
		padding-left: 10px;
		font: normal 16px univers-web;
		color: #d8d8d8;
	}
	div.bodypart {
		height: 100%;
		width: 100%;
		overflow: scroll;
		font: normal 16px univers-web;
		line-height: 180%;
		color: #4CC37E;
	}
	@keyframes myfirst {
		from {
			width: 0;
			height: 0;
		}
		to {
			width: 60%;
			height: 80%;
		}
	}

	@-moz-keyframes myfirst/* Firefox */
	{
		from {
			width: 0;
			height: 0;
		}
		to {
			width: 60%;
			height: 80%;
		}
	}

	@-webkit-keyframes myfirst/* Safari 和 Chrome */
	{
		from {
			width: 0;
			height: 0;
		}
		to {
			width: 60%;
			height: 80%;
		}
	}

	@-o-keyframes myfirst/* Opera */
	{
		from {
			width: 0;
			height: 0;
		}
		to {
			width: 60%;
			height: 80%;
		}
	}
}

body {
	width: 100%;
	height: 100%;
	position: absolute;
}

div.lang {
	text-align:right;
	margin-right: 20px;
}

l {
	font: bold 14px univers-web;
	color: #D4194C;
	text-decoration: none; 
	margin-right: 5px;
}

l:hover {
	color: #063457;
	-moz-animation: blink .75s linear infinite;
	-ms-animation: blink .75s linear infinite;
	-o-animation: blink .75s linear infinite;
	animation: blink .75s linear infinite;
}

div.borderpart {
	animation: myfirst 0.5s;
	-moz-animation: myfirst 0.5s;
	/* Firefox */
	-webkit-animation: myfirst 0.5s;
	/* Safari 和 Chrome */
	-o-animation: myfirst 0.5s;
}
/* framepart */

ul {
	position: relative;
	z-index: 999;
}

div.titlebar {
	height: 23px;
	background-color: #d8d8d8;
	border-radius: 8px 8px 0 0;
	margin-bottom: 10px;
}

div.trafficlightred {
	width: 12px;
	height: 12px;
	background-color: #fb4647;
	border-radius: 6px;
	position: absolute;
	margin: 6px 0 6px 10px;
}

div.trafficlightyellow {
	width: 12px;
	height: 12px;
	background-color: #FEC041;
	border-radius: 6px;
	position: absolute;
	margin: 6px 0 6px 32px;
}

div.trafficlightgreen {
	width: 12px;
	height: 12px;
	background-color: #28c332;
	border-radius: 6px;
	position: absolute;
	margin: 6px 0 6px 54px;
}


d {
	white-space: pre;
	color: #FEC041;
}


a:link {
	color: #6ea3ee;
	text-decoration: none;
}

a:visited {
	color: #6ea3ee;
	text-decoration: none;
}

a:hover {
	color: #6ea3ee;
	-moz-animation: blink .75s linear infinite;
	-ms-animation: blink .75s linear infinite;
	-o-animation: blink .75s linear infinite;
	animation: blink .75s linear infinite;
}

.typed-cursor {
	color: #FEC041;
	-webkit-animation: 0.75s blink step-end infinite;
	-moz-animation: 0.75s blink step-end infinite;
	-ms-animation: 0.75s blink step-end infinite;
	-o-animation: 0.75s blink step-end infinite;
	animation: 0.75s blink step-end infinite;
}

@keyframes "blink" {
	from,
	to {
		color: transparent;
	}
	50% {
		color: #FEC041;
	}
}

@-moz-keyframes blink {
	from,
	to {
		color: transparent;
	}
	50% {
		color: #FEC041;
	}
}

@-webkit-keyframes "blink" {
	from,
	to {
		color: transparent;
	}
	50% {
		color: #FEC041;
	}
}

@-ms-keyframes "blink" {
	from,
	to {
		color: transparent;
	}
	50% {
		color: #FEC041;
	}
}

@-o-keyframes "blink" {
	from,
	to {
		color: transparent;
	}
	50% {
		color: #FEC041;
	}
}

#container {
	background: none;
	position: absolute;
	z-index: 100;
}