/* global */

    body{ 
		background:#030e16 url(../images/bg_body.gif) repeat-x;
        font:80% Trebuchet MS, Arial, Helvetica, Sans-Serif;
		color:#000;
		line-height:160%;
		margin:0;
		padding:0;
		text-align:center;
        }

    /* headings */
        h1{
			font-size:200%;
			font-weight:normal;
            }		
		h2, h3, h4, h5, h6{
			font-weight:normal;
			margin:.75em 0;
			line-height:120%
			}	
        h2{            
			font-size:35px;
			font-weight:bold;
            }				
        h2.title{        
			padding-bottom:.5em;
			background:url(../images/bg_line.gif) no-repeat 0 100%;
            }							
        h3{          
			font-size:28px;
			font-weight:bold;			
            }
        h4{          
			font-size:16px;
            }				
    /* // headings */

    /* image replacement */
        .graphic{
            margin:0;
            padding:0;
            display:block;
            overflow:hidden;
            text-indent:-8000px;
            }
    /* // image replacement */

    /* clearfix */

		.fixed:after, #content:after, ul:after{
			content:"."; 
			display:block; 
			height:0; 
			clear:both; 
			visibility:hidden;
			}
		.fixed, #content, ul{
			display:block;
			}
		/*  \*/
		.fixed, #content, ul{
			min-height:1%;
			}
		.fixed, * html #content, * html ul{
			height:1%;
			}

    /* // clearfix */
	
	/* HTML Tags */
        a{
			text-decoration:none;
			color:#0d3752;
            }
        a:hover{
			color:#999;
            }			
		table, input, textarea, select, li{
			font:100% Trebuchet MS, Arial, Helvetica, Sans-Serif;
			line-height:160%;
			color:#000;
			}				
		p, blockquote, ul, ol, form{
			margin:1em 0;
			}
		blockquote{
			}
		img{
			border:none;
			}			
		hr{
			display:none;
			}	
		table{
			margin:1em 0;
			width:100%;
			border-collapse:collapse;
			}
		th, td{	
			padding:2px 5px;
			}	
		th{	
			text-align:left;
			}
		li{
			display:list-item;
			}	
	
	/* // HTML Tags */	
	
/* // global */

/* page setup */

	#container{	
		background:url(../images/bg_container.jpg) no-repeat 50% 0;
		}
	#inner{	
		margin:0 auto;
		width:908px;
		text-align:left;
		position:relative;
		}		
	#header{
		height:68px;
		position:relative;
		background:url(../images/bg_transparent.png) repeat;
		}			
	#content{
		margin-top:1em;
		background:url(../images/bg_content.gif) repeat-y;
		}	
	#main{
		float:left;
		display:inline;
		width:506px;
		margin-left:43px;
		padding:1em 0;
		}											
	#side{
		float:left;
		display:inline;		
		width:254px;
		margin-left:74px;	
		padding:1em 0;
		}
	#footer{
		clear:both;
		color:#fff;
		padding:1.5em 0;
		background:#030e16 url(../images/bg_footer.gif) repeat-x;
		}		

/* //page setup */

/* navigation elements */

	/* main nav */
		
		ul#nav,  
		ul#nav li{
			margin:0;
			padding:0;
			list-style:none;
			}
		ul#nav{
			position:absolute;
			right:30px;
			top:20px;
			height:32px;
			}			
		ul#nav li{
			float:left;
			display:inline;
			height:32px;		
			line-height:32px;			
			margin-left:5px;
			}	
		ul#nav li a{
			float:left;
			display:inline;
			height:32px;		
			line-height:32px;			
			font-size:17px;
			color:#fff;
			padding:0 13px;
			text-transform:uppercase;
			}	
		ul#nav li a:hover, ul#nav li.selected a{
			background:url(../images/bg_transparent.png) repeat;
			}																
	
	/* //main nav */
	
/* //navigation elements */

/* header */

	#header h1{
		position:absolute;
		float:left;
		left:0;
		top:0;
		height:68px;
		line-height:68px;		
		font-size:35px;
		font-weight:bold;
		margin:0;
		}
	#header h1 a{
		float:left;
		height:68px;
		line-height:68px;	
		color:#fff;
		padding:0 43px;
		}		

/* // header */

/* content */

	#content a{
		text-decoration:none;
		font-weight:bold;
		}	

	#content .link{
		margin:1.5em 0;
		}
	#content .link a{
		text-decoration:none;
		font-size:17px;
		padding-left:25px;
		font-weight:normal;
		background:url(../images/bg_arrow.gif) no-repeat 0 55%;
		}	
	.left{
		float:left;
		margin:.5em 0;
		margin-right:15px;
		}
	.right{
		float:right;
		margin:.5em 0;
		margin-left:15px;
		}		
	#side img, .left img, .right img{
		border:1px solid #ccc;
		background:#dcdcdc;
		padding:5px;
		}
		
	/* intro */
	
		#intro{
			margin:2em 0;
			height:178px;
			position:relative;
			background:url(../images/bg_transparent.png) repeat;
			}																	
		#intro h2{
			margin:0;
			position:absolute;
			left:43px;
			top:30px;
			font-size:40px;
			line-height:40px;
			color:#fff;			
			padding-bottom:0;
			background:none;			
			}
		#intro p{
			margin:0;
			position:absolute;
			left:44px;
			top:80px;
			color:#fff;
			font-size:15px;
			width:530px;
			line-height:130%;
			}	
		#intro p.link{
			left:636px;
			top:88px;			
			width:231px;
			height:56px;
			background:url(../images/bg_introLink.png) no-repeat 0 0;
			}
		#intro p.link a{
			display:block;
			margin:10px 12px;
			overflow:hidden;
			height:36px;
			line-height:36px;
			text-align:center;
			font-size:22px;
			font-weight:bold;
			text-transform:lowercase;
			}													
	
	/* // intro */		
	
	/* list */
	
		ul.list, ul.list li{
			margin:0;
			padding:0;
			list-style:none;
			}
		ul.list{
			}													
		ul.list li{
			padding-top:.5em;
			background:url(../images/bg_line.gif) no-repeat 0 0;
			}						
		#side ul.list li{
			background:url(../images/bg_line_side.gif) no-repeat 0 0;
			}	
		ul.list li.first, #side ul.list li.first{
			padding-top:0;
			background:none;			
			}																						
		ul.list li h3{		
			margin:.5em 0;
			font-size:15px;
			}
		ul.list li p{		
			margin:.5em 0;
			}																						
	
	/* // list */	
	
	/* item list */
	
		ul.news, ul.news li{
			margin:0;
			padding:0;
			list-style:none;
			}
		ul.news{
			}													
		ul.news li{
			padding:.5em 0;
			background:url(../images/bg_line.gif) no-repeat 0 0;
			position:relative;
			min-height:120px;
			}	
		ul.news li.first{
			background:none;			
			}			
		ul.news li h3{		
			margin:.5em 0;
			font-size:20px;
			}	
		ul.news .body{
			float:left;
			display:inline;
			width:400px;
			margin-left:15px;
			padding-bottom:1em;
			}																			
		ul.news .date{
			float:left;
			display:inline;
			width:60px;
			background:#f1f1f1;
			margin:0;
			text-align:center;
			}	
		ul.news .date span{
			display:block;
			font-size:20px;
			margin:3px;
			padding:.5em 0;
			background:#fff;
			}			
		ul.news .date em{
			display:block;
			font-size:13px;
			font-style:normal;
			padding:0 0 .25em 0;
			}																														
	
	/* // item list */	
			
	
	/* form */
																				
		form{
			margin:1.5em 0;
			padding-top:.5em;
			}
		fieldset{
			margin:0;
			padding:0;
			border:none;
			}			
		legend{
			display:none;
			}				
			
		textarea{
			height:120px;
			overflow:auto;
			}						
		form p{
			clear:both;		
			margin:0;
			padding:8px 0;
			}	
		button{
			border:none;
			padding:5px 15px;
			margin:0;
			float:left;
			background:#0d3752;	
			color:#fff;
			font-weight:bold;
			font-size:15px;
			cursor:pointer;
			margin-left:120px;
			}										

	/* // form */					
						
	/* regex */						
						
code { font-family: "Courier New", monospace; }
#credits { margin: 0 0 25px 0;}
#hifiMention { display: inline; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
#nmcLogo { display: inline; }
#nmcLogo img { vertical-align: top; margin: 10px 20px; display: inline; }
#social { position: absolute; left: 650px; top: 4px; padding: 5px 0 0 0; height: 20px; margin: 0; background: white;  border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;}
#cheatSheet { font-family: Georgia, Palatino, serif; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; background: #FCF1B8; font-size: 14px; border: 3px solid #FCC119; text-align: center; }
#cheatSheet code { font-family: "Courier New", monospace; }
#cheatSheet dl { text-align: left; display: none; margin: 10px 5px 10px 15px; }
#selectedContent dl { display: block; }
#cheatSheet dl dt { text-decoration: underline; display: block; color: #333; font-size: 110%; }
#cheatSheet dl dd { text-align: left; margin: 0 0 5px 10px;}
#cheatSheet dl dd ul { margin: 0 0 0 0; padding: 0;}
#cheatSheet dl dd ul li { list-style: none; margin: 0 0 0 0; padding: 0;}
#cheatSheet h2 { font-weight: normal; font-size: 20px; margin: 0; background: #FCC119; color: #FFF; padding: 5px 0; }
#cheatSheet h3 { cursor: pointer; cursor: hand; font-weight: normal; font-size: 16px; line-height: 40px; background: #FCC119; color: #FFF; display: inline; padding: 5px 10px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
#cheatSheet h3.selected { background: #fff; color: #FCC119; font-weight: bold; border: 2px solid #FCC119;	text-shadow: 0px 1px 1px #ccc; }
#cheatSheet h3:hover { 	text-shadow: 0px 1px 1px #ccc;  }
#cheatSheet code { font-size: 15px; margin: 0 10px 0 0; }
#regexPane { margin:0 -30px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
#regexPane.valid { background: #FFFF8F; border: 3px solid #FFFF33; }
#regexPane.valid #regex{ border: 2px solid #FFFF33; }
#regexPane.match { background: #D2FFC4; border: 3px solid #2DC800; }
#regexPane.match #regex { border: 2px solid #2DC800; }
#regexPane.invalid { background: #FFE6CC; border: 3px solid #FF0000; }
#regexPane.invalid #regex { border: 2px solid #FF0000; }
	#regexPaneText { display: none; font-size: 23px; font-family: "Courier New", monospace; text-align: center; padding: 10px; }
		#editRegex { cursor: pointer; cursor: hand; }
		#editRegex:hover { text-decoration: underline; }
		
#regexPaneInputs { text-align: center; font-size: 20px; font-family: "Courier New", monospace; }
#regex { border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;font-size: 20px; padding: 5px 0 5px 0; margin: 10px 0 0 ; width: 80%; text-align: center; }
#regexPaneCommands, #regexPaneCommands ul, #regexPaneCommands li{ display: inline; margin: 0; padding: 0; font-size: 12px; }
#regexPaneCommands li { margin: 0 10px 0 0; padding: 2px 5px; cursor: pointer; cursor: hand; }
#regexPane.valid #regexPaneCommands li { background: #FFFF33; color: black;}
#regexPane.match #regexPaneCommands li{ background: #2DC800; color: white;}
#regexPane.invalid #regexPaneCommands li{ display: none;}

#regexFlags { font-family: "Courier New", monospace; font-size: 12px; }
#regexFlags ul { margin: 0; display: inline; text-align: center; }
#regexFlags li { margin: 0; list-style: none; display: inline; }

dl { margin: 0; }
dt { display: none; }
dd { margin: 0 0 5px 0; text-align: center; }
#regexFlagsDt { display: inline; }

#haystackPane { font-size: 16px; font-family: Arial,Tahoma; margin: 25px 0; }
#haystackPaneText { cursor: pointer; cursor: hand; width: 100%; white-space: pre-wrap; font-family: Arial,Tahoma;}
#haystackPaneInputs { display: none; }
#haystackPaneInputs textarea { width: 100%; height: 450px; border: 3px solid gray; margin: 0; font-size: 14px; font-family: Arial,Tahoma;}

#haystackPane .match { font-weight: bold; font-size: 140%; background: yellow; }
.group-1 { background: #6FFF44; }
.group-2 { background: #99C7FF; }
.group-3 { background: #FFCC33; }
.group-4 { background: #CC99FF; }
.group-5 { background: #D698FE; }
.group-6 { background: #B4D1B6; }
.group-7 { background: #AAAAFF; }
.group-8 { background: #FFA8D3; }
.group-9 { background: #F2F4B3; }
.group-10 { background: #C4ABFE; }

#matchesPane table { border-collapse: collapse; border-top: 3px solid gray; border-bottom: 3px solid gray; width: 525px; font-family: Georgia, Palatino, serif; font-size: 16px; }
#matchesPane thead tr td { font-weight: bold;  border-bottom: 1px solid gray; }
#matchesPane tr, #matchesPane td, #matchesPaneTable { margin: 0; padding: 5px; }
#matchNumber { width: 25px; }

#code {border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; white-space: pre-wrap; font-family: "Courier New", monospace; background: black; border: 3px solid gray; color: white; padding: 25px; margin: 25px 0 0 0; }
#codePaneCommands, #codePaneCommands ul, #codePaneCommands li{ display: inline; margin: 0; padding: 0; font-size: 12px; }
#codePaneCommands li { margin: 0 0 0 250px; padding: 2px 5px; cursor: pointer; cursor: hand; color: white; background: gray; }
#matchInputOnce { display: none; }
#matchInputGlobal { dispaly: none; }
						
	/* // regex */					
						
/* // content */

/* footer */

	#footer .col1{
		float:left;
		display:inline;
		margin-left:43px;
		margin-right:23px;
		width:330px;
		padding:.5em 0;
		}
	#footer .col2{
		float:left;
		display:inline;
		margin-left:20px;
		width:150px;
		padding:.5em 0;
		}
	#footer h3{
		margin-top:0;
		font-size:15px;
		}				
	#footer a{
		color:#fff;
		text-decoration:underline;
		}
	#footer a:hover{
		color:#ccc;
		text-decoration:underline;
		}		
	#footer ul{
		margin:0;
		padding:0;
		list-style:none;
		}	
				

/* // footer */
