﻿/*
@Impact Earth
@Global CSS
------------------------------------------------------------------------*/

/*
@Reset
------------------------------------------------------------------------*/
	html, body, div, span, applet, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	a, abbr, acronym, address, big, cite, code,
	del, dfn, em, font, img, ins, kbd, q, s, samp,
	small, strike, strong, sub, sup, tt, var,
	b, u, i, center,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td {
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-size: 100%;
		vertical-align: baseline;
		background: transparent;
	}	

	html, body {height:100%;}
	:focus     {outline:0;}
	ul         {list-style:none;}

/*
@General
------------------------------------------------------------------------*/
	body {font:normal 12px/1.2em Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif; background:url(../images/bg.jpg) #000 top center no-repeat;}
	
	h1 {color:#fff; font:normal 3.5em/1.7em "Lucida Sans Unicode", "Lucida Grande", sans-serif; text-align:center;}
	h2 {color:#000; font:normal 2.2em/1em "Lucida Sans Unicode", "Lucida Grande", sans-serif; margin-bottom:20px;}
	h3 {color:#444; font-size:1.7em; line-height:1em; font-weight:normal; margin-bottom:10px;}
	h4 {color:#666; font-size:1.2em; line-height:1em; font-weight:bold; margin-bottom:10px;}
	
	p {color:#333; margin-bottom:20px;}
	
	a       {color:#0786d5; text-decoration:none; border:none;}
	a:hover {border-bottom:1px dotted;}
	
	ul {}
	li {margin-bottom:10px; }
	
	.left     {float:left;}
	.right    {float:right;}
	.center   {margin:0 auto; display:block;}
	.clear    {clear:both; height:0px;}
/*	.clear-bg {clear:both; height:50px; background:#fff url(/studio/images/bg-content.jpg) no-repeat 50% 100%; }*/
	.dot-line {border-bottom:1px #ccc dotted; width:95%;margin-bottom:10px;}
	
	.align-right {text-align:right;}
	.margin-none {margin:0;}
	.text-center {text-align:center;}
	
	.caption {color:#999; font-size:0.9em; line-height:1em; font-weight:normal; margin-bottom:10px;}
	.contact-right{float:right; width:200px; display:inline; padding:10px; margin-right:25px; border-left:1px solid #d1ccba;}
	
/*	.youtubeBtn {display:block; width:200px; height:44px; background:url(/studio/images/btn-youtube.jpg) no-repeat left top; padding:14px 0 0 68px; margin-bottom:10px;}*/
	.youtubeBtn:hover {color:#000; border:none;}
	
/*	.wlfiBtn {display:block; width:200px; height:44px; background:url(/studio/images/btn-wlfi.jpg) no-repeat left top; padding:14px 0 0 68px; margin-bottom:10px;}*/
	.wlfiBtn:hover {color:#000; border:none;}
	
	img.right        {padding:0 0 10px 10px;}
	img.left         {padding:0 10px 10px 0;}
	img.over-right   {margin-right:-20px;}
	img.over-left    {margin-left:-20px;}
	img.over-bottom  {margin-bottom:-32px;}
	img.over-top     {margin-top:-180px;}

	#wrapper {width:950px; margin:0 auto;}
	
/*
@Header
------------------------------------------------------------------------*/
	#headerwrapper {width:100%; height:33px; background:url(../images/headerbg.png) top left repeat-x;}
	#header {height:33px; width:940px; margin:0px auto; position:relative;}
	#header a:hover {border:none;}
	#logo   {width:339px; height:83px; position:absolute; z-index:999; top:0px; left:295px;  background:url(../images/logo.png) top left no-repeat; }
	#logo span {margin-left:-9999px;}
	a.skip { position:absolute; z-index:999; left:-200em; border:2px solid #333; background:#fff;padding:.5em 1em;}
    a.skip:focus { left:0.5em;}
    #skip-target {position:absolute;}
	
/*
@Feature
------------------------------------------------------------------------*/

	#feature {background:url(../images/bg-feature.png) no-repeat top center;}
	
/*
@Navigation
------------------------------------------------------------------------*/

	#nav    {padding:9px 0px; margin:0 auto;}
	#nav li {display:inline; margin:0px 6px;}
	#nav a  {color:#fff; text-decoration:none; text-transform:uppercase; padding: 3px 0 0 30px; opacity:0.7;}
	#nav li a:hover     { opacity:1;}	
	#nav #home {background: url(../images/homeicon.png) no-repeat left bottom; margin:0 25px 0 50px;}
	#nav #craters {background: url(../images/meteoricon.png) no-repeat left bottom;}
	#nav #documentation {background: url(../images/docicon.png) no-repeat left bottom; margin:0px 0px 0px 346px;}
	#nav #glossary {background: url(../images/glossaryicon.png) no-repeat left bottom;}
/*
@Content
------------------------------------------------------------------------*/

	#content {margin: 26px 10px;}
	.subpage{background-color:#ffffff;}
	.content-light {background:#fff; border-top:1px solid #ccc; padding:0 20px 20px 0; }
/*	.content-dark  {background:#fff url(/studio/images/bg-content-dark.png) no-repeat top center; padding:10px 20px 20px 0; }*/
	
	.col-1      {width:166px; float:left; padding:20px 0 0 20px;}
	.col-2      {width:352px; float:left; padding:20px 0 0 20px;}
	.col-3      {width:538px; float:left; padding:20px 0 0 20px;}
	.col-4      {width:724px; float:left; padding:20px 0 0 20px;}
	.col-5      {width:910px; float:left; padding:20px 0 0 20px;}
	.col-fourth {width:212px; float:left; padding:20px 0 0 20px;}
	.col-third  {width:290px; float:left; padding:20px 0 0 20px;}
	.col-half   {width:445px; float:left; padding:20px 0 0 20px;}
	.col-full   {width:910px; float:left; padding:20px 0 0 20px;}
	
	.col-paddtop {padding-top:0px;}
	
/*
@Media Resources and Screenshots
------------------------------------------------------------------------*/

/*	#mediaResources {padding-bottom:50px; margin-left:10px; width:528px; background:transparent url(/studio/images/bg-media.jpg) no-repeat scroll 8px 10px;}*/

	#mediaResources ul {margin:20px 10px;}
/*	#mediaResources .doc {padding-left:15px; background:url(/studio/images/butllet-doc.gif) no-repeat 0% 50%;}
	#mediaResources .video {padding-left:15px; background:url(/studio/images/butllet-video.gif) no-repeat 0% 50%;}*/
	
	.screenshots li {display:inline; float:left; display:block; margin:0 15px 5px 0;}
	.screenshots a  { height:108px; width:25%;}
	.screenshots .caption  {text-align:center; display:block;}
	.screenshots a:hover  {border:none; color:#000;}
	.screenshots a:hover .caption  {color:#000;}
	
/*
@Footer
------------------------------------------------------------------------*/

	#footerwrapper {background:url(../images/bg-transparent.png) repeat; margin-top:30px; border-top:1px solid #5c616c; height:300px;}
	#footer{width:840px; margin:10px auto 0; text-align:right;}
	
	#footer .marks		{float:left;}
	#footer .info		{float:right; margin:0 0 20px;}
	#footer .purdue		{float:left;}
	#footer .imperial	{float:left; position:relative; top:8px; margin:0 20px 0 20px;}
	
	#footer ul {}
	#footer li {padding:5px 20px;}
	#footer li.title {font-size:1.2em; text-transform:uppercase; color:#999; border-bottom:1px dotted;}
	#footer a  {}
	#footer p  {color:#999; font-size:0.9em; margin:0 0 10px;}

	embed	{position:relative; z-index:0;}
	.opacity-30		{background:url(../images/bg-transparent.png) repeat transparent; border:1px solid #655967; position:relative; left:4px;}

	.copy	{border:1px solid #23212a; margin:20px; padding:20px; background:url(../images/bg-copy.jpg) repeat-x 0 0 #3c335e;}
	
	.copy h1	{font-size:22px; text-transform:uppercase; margin:0 0 10px !important; text-align:left; border-bottom:1px solid #666;}
	.copy h3	{color:#fff;}
	.copy p		{color:#fff;}
	
	.glossary ol	{margin:0 0 15px;}
	.glossary ul	{margin:0 0 15px;}
	.glossary ol li	{color:#fff; margin:0 0 5px 40px; list-style:decimal;}
	.glossary ul li	{color:#fff; margin:0 0 5px 40px; list-style:circle;}
	
	#app-link { bottom: 7px; left: -200em; position: absolute; z-index: 9999;}
	
	