/* HTML */
html{overflow-y:scroll;}
* {margin:0;padding:0;}
html, body {height:100%;}

/*FONT IMPORT*/
@font-face {font-family:CustomJokerman;src: url("jokerman.eot")} /* EOT file for IE */
@font-face {font-family:CustomJokerman;src: url("jokerman.ttf")} /* TTF file for CSS3 browsers */

/* BODY */
body{position:relative;padding:0;margin:0;font-family:'Trebuchet MS';font-size:12px;color:#333;background:#020842 url('../images/backgrounds/bg_w1024_c20.jpg') no-repeat top center fixed;}

/* VARIOUS */
img{border:0;}

a{color:#39BCED;text-decoration:none;transition:color 0.3s;}
a:hover{color:#ED39BC;transition:color 0.3s;}

form *{font-family:'Trebuchet MS',Verdana,arial;font-size:12px;}
/*input,textarea{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}*/

/* bg (voor de belletjes) */
#bg{position:fixed;height:100%;width:100%;}

#container{padding: 5px 5px 0px 5px;}
	#content{position:relative;}

/*HEADING (LOGO/TEXT)*/
#heading{padding:5px;margin-bottom:5px;background:#EEE url('../images/backgrounds/heading.jpg') repeat-x;border:5px solid #FFF;border-top:none;border-radius:5px;}
#heading p{margin: 1em 0px;text-shadow:1px 1px 0px #FFF;text-align:center;}
#heading h1{margin:10px 0px 0px 0px;text-align:center;}
#heading h1 a{font-family:CustomJokerman,'Century Gothic','Trebuchet MS';font-weight:normal;}
@media screen and (max-height:550px){#heading p.headingtext{display:none;}#heading h1{margin-top:0px;}}



/*outputs*/
#cPink,#cBlue,#cOrange,#cGreen{margin-bottom:5px;padding:10px;border-radius:5px;}
#cPink{padding:10px;margin-bottom:5px;background:#E30B69 url('../images/backgrounds/mob_pink.jpg') repeat-x;}
	#textin{}
		#i{width:100%;border:3px solid #BE085A;border-radius:5px;text-align:center;font-size:15px;font-weight:bold;color:#BE085A;text-shadow:1px 1px 0px #FFF;outline:none;}

		#textinOption{height:16px;width:105px;margin:5px auto 5px auto;}
			#go{width:50px;height:16px;margin-left:5px;border:none;background:#EEE url(../images/icons/icons.png) 17px 0px no-repeat;transition: 0.3s;}
				#go:hover{background-position:17px -16px;transition: 0.3s;}
			#del{width:50px;height:16px;border:none;background:#EEE url(../images/icons/icons.png) 17px -32px no-repeat;transition: 0.3s;color:}
				#del:hover{background-position:17px -48px;transition: 0.3s;}
#cBlue{background:#099ED6 url('../images/backgrounds/mob_blue.jpg') repeat-x;}
#cOrange{background:#DD8013 url('../images/backgrounds/mob_orange.jpg') repeat-x;}
#cGreen{background:#8EDB09 url('../images/backgrounds/mob_green.jpg') repeat-x;}
	#cPink h2,#cBlue h2,#cOrange h2,#cGreen h2{color:#FFF;text-align:center;margin:0;font-family:CustomJokerman,'Century Gothic','Trebuchet MS';font-weight:normal;}
		#cPink h2{text-shadow:1px 1px 0px #AF0752;}
		#cBlue h2{text-shadow:1px 1px 0px #0D7FA9;}
		#cOrange h2{text-shadow:1px 1px 0px #AD6209;}
		#cGreen h2{text-shadow:1px 1px 0px #639707;}

	#o1,#o2,#o3{text-align:center;font-weight:bold;text-shadow:1px 1px 1px #FFF;font-size:20px;}


/*footer, as tiny as it is*/
address{position:relative;color:#559FC8;text-shadow:1px 1px 0px #000;font-style:normal;text-align:center;}
address a{color:#559FC8;transition:color 0.3s}
address a:hover{color:#ED39BC;transition:color 0.3s}
