html {
	width: 100%;
	min-width: 100% !important;
}

main {
	text-align: left !important;
	padding-bottom: 40px !important;
}

#topblack {
	display: none;
	width: 100%;
	height: 100px;
	background-color: #111;
	position: absolute;
	top: -32px;
}

#updatesLink {
	color: #5688df;
}

body {
	width: 100%;
	min-width: 100% !important;
	margin: 0px;
	padding: 0px;
	margin-bottom: 0px;
}

#titlebar {
	text-align: center !important;
}

section a {
	color: #df6356;
}

.foil {
	background-color: #ddd;
	margin-bottom: -20px;
}

nav {
	width: 90% !important;
	max-width: 1000px !important;
}

.selected {
	background-color: #ddd;
	color: #111;
}

.selected:hover {
	background-color: #ddd;
	color: #111;
}

#search {
	padding: 5px 5px 5px 6px;
	margin: 0px;
	position: fixed;
	right: 0px;
	top: 16px;
	background-color: #181818;
	opacity: 1;
	font-size: 18px;
	font-family: verdana;
	color: #999;
	z-index: 100;
}

#search input {
	font-size: 16px;
	font-family: verdana;
	color: #DDD;
	background-color: #666;
	border: thin solid #444;
	padding: 6px;
	margin: 4px;
	width: 120px;
}

#search button {
	font-size: 16px;
	height: auto !important;
	font-family: verdana;
	border: thin solid #444;
	background-color: #ebcb35;
	padding: 4px;
	margin: 4px 0px;
	cursor: pointer;
}

#search button:nth-child(2) {
	background-color: violet;
}

#search button:nth-child(5) {
	margin-right: 4px;
}

#search button:nth-child(6) {
	display: none;
	background-color: violet;
}

#search button:hover {
	background-color: #acd241;
}

#search span {
	font-size: 12px;
}

#contrast {
	width: 27px;
	position: relative;
	cursor: pointer;
	top: 7px;
	margin-right: 6px;
}

#list {
	margin-top: 30px;
	padding: 20px;
	border-radius: 10px;
	border: thin dashed #666;
	white-space: pre-wrap;
	display: none;
	background-color: rgb(25, 52, 80);
}

#slinfo {
	background-color: #ccc;
	color: #333;
}

#slinfo:hover {
	background-color: #eee;
	color: #333;
}

/* bits link */
.b {
	position: absolute;
	top: 2px;
}

.d {
	position: absolute;
	top: 2px;
}

.v {
	position: absolute;
	top: 2.5px;
	opacity: .6;
}

.view.bits {
	position: relative;
	padding-right: 17px;
}

.view.demo {
	position: relative;
	padding-right: 4px;
}

.view.demo span {
	display: inline-block;
	position: relative;
	top: .5px;
	margin-left: 3px;
	opacity: .9
}

.view.vids {
	position: relative;
	padding-right: 27px;
}

pre {
	font-size: 20px;
	text-align: left;
	margin-left: 0px !important;
	margin-bottom: -32px !important;
	padding-left: 20px !important;
	padding-bottom: 20px !important;
	margin-top: 0px !important;
}

.info {
	display: none;
}

#logo,
#logoB {
	margin-left: 26px;
	margin-top: 24px;
	margin-bottom: -8px;
}

#logoB {
	margin-bottom: 30px;
}

.t {
	color: #DDD;
	font-size: 12px;
}

a {
	outline: none;
}

.frameTitle {
	background-color: #e472c4;
}

.displayTitle,
.buildTitle {
	background-color: #50c4b7;
}

.methodsTitle,
.createTitle {
	background-color: #acd241;
}

.controlsTitle,
.pagesTitle {
	background-color: #caae2c;
}

.codeTitle {
	background-color: #f58e25;
}

.wrapTitle {
	background-color: #d1a170;
}

.metaTitle {
	background-color: #555555;
}

.gameTitle,
.threeTitle,
.socketTitle,
.pizzazzTitle,
.camTitle,
.chartTitle {
	background-color: #993399;
}

.distillTitle {
	background-color: #caae2c;
}

.sub {
	color: #ccc;
	font-size: 14px;
	padding: 2px 4px;
}

.frameSubtitle {
	font-size: 15px;
	color: #e472c4;
	padding: 0px 5px;
}

.displaySubtitle {
	font-size: 15px;
	color: #50c4b7;
	padding: 0px 5px;
}

.methodsSubtitle {
	font-size: 15px;
	color: #acd241;
	padding: 0px 5px;
}

.controlsSubtitle {
	font-size: 15px;
	color: #caae2c;
	padding: 0px 5px;
}

.codeSubtitle {
	font-size: 15px;
	color: #f58e25;
	padding: 0px 5px;
}

.wrapSubtitle {
	font-size: 15px;
	color: #d1a170;
	padding: 0px 5px;
}

.metaSubtitle {
	font-size: 15px;
	color: #555555;
	padding: 0px 5px;
}

.gameSubtitle,
.threeSubtitle,
.socketSubtitle,
.pizzazzSubtitle,
.camSubtitle,
.chartSubtitle {
	font-size: 15px;
	color: #993399;
	padding: 0px 5px;
}

.info div {
	color: white;
	padding: 10px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	opacity: 0.9;
	filter: alpha(opacity=90);
}

.info {
	padding: 20px;
	background-color: #222;
	margin: 10px 0px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.titleT div {
	padding: 2px;
}

.titleT {
	white-space: nowrap;
}

.titleA {
	margin-right: 10px;
	margin-left: -8px;
	margin-bottom: 5px;
	vertical-align: top;
	display: inline-block;
}

.titleD {
	display: inline-block;
	width: 95%;
	white-space: pre-wrap;
}

/* thanks Hye Won Han! */

#ln {
	font-size: 16px;
	float: right;
	margin-right: 10px;
	padding: 5px;
	background-color: #444;
}

.extends {
	/*font-size:16px;
    color:#777;
    margin-bottom:-20px;
    margin-left:0px;*/
	display: inline-block;
	margin-bottom: -20px;
	margin-left: 0px;
}

.functionTitle {
	text-transform: uppercase;
	display: inline-block;
	margin-bottom: -20px;
	margin-left: 0px;
}

.heading {
	display: inline-block;
	margin-bottom: -20px;
	margin-left: 0px;
}

.subheading {
	/*text-transform:uppercase;*/
	display: inline-block;
	font-style: oblique;
	font-size: 14px;
	text-decoration: underline;
	margin-bottom: -20px;
	margin-left: 0px;
}

a.close,
a.close2 {
	color: #FFF;
	background-color: #999;
	padding: 3px 6px;
	margin: 0px 8px;
}

a.close2 {
	margin-left: 18px;
}

a.view {
	margin-left: 18px;
	color: #ccc;
	background-color: #555;
	padding: 3px 7px;
	margin: 0px 8px;
	border: solid #777 thin;
}


/*a.view {margin-left:18px; color:#FFF; background-color:#cda2cd; padding:3px 7px; margin:0px 8px;}*/
pre a {
	color: #FFF;
	background-color: #FCF;
	font-size: 14px;
	text-decoration: none;
	padding: 2px 4px;
}

a.frame {
	background-color: #e472c4;
}

a.display,
a.build {
	background-color: #50c4b7;
}

a.methods,
a.create {
	background-color: #acd241;
}

a.controls,
a.pages {
	background-color: #caae2c;
}

a.code {
	background-color: #f58e25;
}

a.wrap {
	background-color: #d1a170;
}

a.meta {
	background-color: #555555;
}

a.game,
.three,
.socket,
.pizzazz,
.cam,
.chart {
	background-color: #993399;
}

a.distill {
	background-color: #caae2c;
}


pre a:hover {
	background-color: yellow;
	color: #555555;
}

/* .plain {background-color:transparent; font-size:18px;} */
.image {
	background-color: transparent;
	color: #eee;
	font-size: 18px;
	text-decoration: underline;
}

.image:hover {
	background-color: transparent;
}

#contrast,
#contrast:hover {
	background-color: transparent !important;
}


#note {
	padding: 0px 4px;
}

@media all and (max-width: 640px) {

	/* these styles show if screen width is less than or equal to 640 */
	body {
		padding-top: 60px !important;
	}

	#topblack {
		display: block;
	}

	nav {
		width: 98% !important;
	}

	nav a {
		font-size: 2vw !important;
	}

	#search {
		/* position:absolute;
		right:0px; */
	}

	#select select {
		font-size: 12px !important;
	}
}

@media all and (min-width: 640px) and (max-width: 800px) {

	/* these styles show if screen width is between 640 and 800 */
	body {
		padding-top: 60px !important;
	}

	#topblack {
		display: block;
	}

	nav {
		width: 98% !important;
	}

	nav a {
		font-size: 2vw !important;
	}

	#select select {
		font-size: 14px !important;
	}
}

@media all and (min-width: 640px) and (max-width: 1100px) {

	/* these styles show if screen width is between 640 and 1100 */
	nav {
		width: 98% !important;
	}
}

#select {
	display: inline-block;
	position: relative;
	float: right;
	top: -4px;
}

#select select {
	font-size: 20px;
	background-color: #ccc;
}