/* --------------------------------------------------------------------------------
 * Base & typo
 * -------------------------------------------------------------------------------- */

* {margin: 0; padding: 0;}

         * {font: 14px/18px 'Lucida Sans', 'Lucida Grande', 'Trebuchet MS', Arial, sans-serif;}
html.mac * {font-size: 12px; line-height: 16px;}

a {color: #000;}
a img {border: none;}


/* --------------------------------------------------------------------------------
 * Page
 * -------------------------------------------------------------------------------- */

/* main page elements */
body, html {}
body {background-color: #000; text-align: center; min-width: 930px;}
#page {width: 900px; margin: 0 auto; text-align: left; height: 100%; overflow: hidden;}

/* xindesk logotype */
#header {margin: 20px 0 16px; font-size:36px;}

	/* menu to blog, about and contact */
	#menu {list-style: none; display: block; float: right;}
		#menu a {display: block; width: 140px; height: 13px; background: no-repeat top right; margin-bottom: 9px;}
			#menu span {display: none;}


/* wrapper for the main contents (to give the white bg) */
#content {background-color: #fff; padding: 1px;}

/* headers on contact and about */
#about, #contact {background: top left no-repeat; position: relative; top: 29px; left: 30px; margin-bottom: 10px; height: 24px;}
	#about span, #contact span {display: none;}

/* wrapper for the main column */
#main {width: 602px; float: left; margin: 40px 0 0 30px; display: inline;}

	#main p {margin-bottom: 1em;}
	#main p.intro {font-weight: bold;}
	#main h3 {font-weight: bold;}
	
	#main #screenshots {margin-bottom: 20px;}
		#main #screenshots img.odd {float: left;}
		#main #screenshots img.even {float: right;}

/* wrapper for the sidebar/right column */
#sidebar {float: right; margin: 40px 30px 0 0; width: 204px; display: inline;}

	/* shared styles for the boxes */
	#sidebar .box {width: 204px; background: no-repeat bottom right; margin-bottom: 1.7em;}
		#sidebar .box h2 {width: 204px; height: 22px; font-weight: 400; background: #000 url(images/titlebar.png) no-repeat bottom right;}
		#sidebar .box h2 span {display: block; margin: 3px 0 0 10px; float: left; color: #fff;}
		
		/* content wrapper */
		#sidebar .box .contents {margin: 0 10px 0; color: #60656B;}
			#sidebar .box p.info {line-height: 23px; margin-top: 3px;}
			#sidebar .box div.back p.info {padding: 10px 0 15px;}
			#sidebar .box a {color: #60656B;}
			
			/* styles for input forms */
			#sidebar .box form {}
				#sidebar .box form p {margin: 0}
				            #sidebar .box input {color: #64707a; width: 178px;}
				html.safari #sidebar .box input {width: 183px;}
				            #sidebar .box input.signup {width: auto !important; margin: 21px 0 4px;}
				html.gecko  #sidebar .box input.signup {margin-bottom: 6px;}
		
		/* specific boxes -- blog */
		#sidebar #blog-box {background-image: url(images/box-blog.gif); padding-bottom: 12px;}
			#sidebar #blog-box .contents, 
			#sidebar #blog-box .contents a {color: #5C7359;}
			#sidebar #blog-box p {line-height: 23px;}
			#sidebar #blog-box p.title {font-weight: bold;}
			#sidebar #blog-box a, #sidebar #blog-box p.date {text-transform: uppercase; font-size: 83%;}
			         #sidebar #blog-box #press {margin-top: 23px;}
			html.ie6 #sidebar #blog-box #press {margin-bottom: 4px;}
		
		/* specific boxes -- sign up */	
		#sidebar #signup-box {background-image: url(images/box-signup.gif);}
			               #sidebar #signup-box p.info {margin-bottom: 22px;}
			html.gecko.win #sidebar #signup-box p.info {margin-bottom: 19px;}
			               #sidebar #signup-box form p {margin-bottom:  2px;}
			html.gecko     #sidebar #signup-box form p {margin-bottom:  4px;}
			html.gecko.win #sidebar #signup-box form p {margin-bottom:  2px;}
			html.ie6       #sidebar #signup-box form p {margin-bottom:  0;}
		 	               #sidebar #signup-box form input.signup {margin-top: 20px;}
			html.gecko.win #sidebar #signup-box form input.signup {margin-top: 16px;}
			html.ie6       #sidebar #signup-box form input.signup {margin: 21px 0 8px;}

		/* specific boxes -- developers */
		#sidebar #developers-box {background-image: url(images/box-dev.gif);}
			               #sidebar #developers-box p.info {margin-bottom: 24px;}
			html.gecko.win #sidebar #developers-box p.info {margin-bottom: 22px;}
			               #sidebar #developers-box form p {margin: 0}
			html.gecko     #sidebar #developers-box form input.signup {margin-top: 21px;}
			html.gecko.win #sidebar #developers-box form input.signup {margin-top: 18px;}
			html.ie6       #sidebar #developers-box form input.signup {margin-bottom: 10px;}
		
		/* styles for invalid data in field */
		#sidebar .box form p.invalid input {color: #B20802;}


/* --------------------------------------------------------------------------------
 * Common
 * -------------------------------------------------------------------------------- */

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */