@charset "UTF-8";
/* CSS Document */

@font-face{
	font-family: myFirstFont;
	src: url('fonts/secret.TTF');
	}
	
@font-face{
	font-family: myFirst;
	src: url('fonts/big_noodle_titling.ttf');
	}
	
@font-face{
	font-family: typewriter;
	src: url('fonts/AmericanTypewriter.ttf');
	}
	
h1, h3{ color: #111; font-family: myFirst, sans-serif;font-size: 2em;}
h2{ color: #fff; font-family: typewriter, sans-serif;font-size: 2em;}
h3{ color: #666; font-family: myFirstFont, sans-serif; font-size: 2em;}
h4{ color: #111; font-family: myFirst, sans-serif;font-size: 1.8em;}
a{	color: #111;
 	display: inline-block;
	text-decoration: none;
	transition:.3s background;}
a:hover{color: red}

.neon{

color:#000;
/*Use shadows to slowly build up the glow. The first shadow should be the colour of the text. Subsequent shadows are the colour you want the glow to be, all with no x or y offset and with increasing amounts of blur (the number of shadows you use depends on how big you want the glow to be).*/
text-shadow:0 0 10px #fff, 0 0 20px #ffad00, 0 0 30px yellow, 0 0 40px #00d2ff, 0 0 50px #00d2ff, 0 0 60px #00d2ff, 0 0 70px #00d2ff;
}
h5 {color: #666; font-family:myFirstFont, serif; font-size: 3em;}
li {display: inline;}
body { 
	color: #333; 
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	background: url(images/1200_grid_16_col.gif) #000 no-repeat center center fixed; 
	-webkit-background-size: cover;
  background-size: cover;	
}
#navi{position:absolute;left:0;top:3px;margin:10px;padding:5px;width:100%x;

#nav{margin-top:5px;-webkit-transition:all 1s ease-out;-moz-transition:all 1s ease-out;-o-transition:all 1s ease-out;transition:all 1s ease-out}

/*snavi {position:absolute;left:0;top:0;margin:10px;padding:20px;width:400px;background-color:rgba(0,0,0,.4);border-radius:5px}
snav{margin-top:20px;-webkit-transition:all 1s ease-out;-moz-transition:all 1s ease-out;-o-transition:all 1s ease-out;transition:all 1s ease-out}
	background-color: #fff;
	border: 1px solid #dedede;
	border-radius: 4px;
	box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055);
	color: #888;
	display: inline;
	margin: 8px 22px 8px 22px;
	overflow: hidden;
	width: 90%;
	 
}
snavi{display:none}:-webkit-full-screen 
snavi{display:none}:full-screen 
snavi{display:none}
*/


p.emboss2{
background:#b8b8b8;
font-size:1.4em;
color:#2e2e2e;
text-shadow: 0px 1px 0px #ebebeb;
}
.badge {
  height: 100px;
  width: 100px;
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  border-radius: 50%; /* may require vendor prefixes */
  background: rgba(5,0,0,0.5);
}
@media screen and (max-width: 768px) {
	video{ visibility:hidden;}
	#logo{width: 200px; height: 200px; margin: 30px auto;}
	#vCent{width: 200px; height: 200px;}
	#vCent h1{font-size:4em;}
	#vCent h2{font-size:.5em;}
	.strapline{font-size:2em;}
}

.slidewrap{float:right; width:60%;background:rgba(0,23,55,0.1);}
ul li{
margin:0px;
}
#circly {
    background: #f00;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    color:black;
   
}
.innerTEXT{
    position:absolute;
    top:120px;
    left:60px;
}

#options{position:absolute;left:0;top:100px;margin:10px;padding:20px;width:400px;background-color:rgba(0,0,0,.4);border-radius:5px}
#optionsContent{margin-top:20px;-webkit-transition:all 1s ease-out;-moz-transition:all 1s ease-out;-o-transition:all 1s ease-out;transition:all 1s ease-out}

p{margin-bottom:20px;}.actions{margin-bottom:20px}
<!--#textureList li{clear:both;list-style-type:none;position:relative;height:35px;padding-top:10px}
#textureList li span{text-transform:capitalize}
#textureList div{position:absolute;right:0;top:0}
#textureList li a{float:left}a{color:inherit}#textureControls{display:none}
#closeBtn{position:absolute;right:15px;top:10px}.presets{}.presets a{float:left}.nope{text-decoration:line-through}:-moz-full-screen -->
#options{display:none}:-webkit-full-screen 
#options{display:none}:full-screen 
#options{display:none}