/**
 * Styles for SISTR
 * 
 */


/* RESET */
	
	* { margin: 0; padding: 0; line-height: 16px; }
	img { border: none; }
	p, pre { margin-bottom: 16px; }
	.l { float: left; }
	.r { float: right; }
	.rt { text-align: right; }
	hr { display: none; }



/* GENERAL */
	
	body { background: #fff url(../img/bg.jpg) repeat-x top left fixed; font-family: "Lucida Grande", Verdana, Arial, sans-serif; font-size: 11px; color: #000; }
	#container { background: url(../img/bg_footer.jpg) no-repeat bottom center; }
	.inner { width: 950px; margin: 0 auto; background: url(../img/bg_footer.jpg) no-repeat bottom center; padding-bottom: 110px; position: relative; }
	
	a { color: #000; text-decoration: underline; }
	a:hover { color: #666; text-decoration: underline; }



/* NAVIGATION */
	
	#navigation { position: absolute; width: 162px; height: 327px; top: 0; left: 0; background: url(../img/bg_nav.jpg) no-repeat top right; overflow: hidden; }
	#navigation .wrapper { width: 120px; height: 277px; margin: 50px 0 0 57px; overflow: hidden; position: relative; }
	#navigation .wrapper_in { background: #343434 url(../img/bg_nav_in.jpg) repeat-y top left; }
	#navigation .wrapper h1 { padding: 16px 0 0 14px; }
	#navigation .wrapper h1 a { display: block; width: 75px; height: 87px; background: url(../img/logo_sistr.jpg) no-repeat top left; overflow: hidden; text-indent: -1000px; }
	
	#navigation ul { list-style: none; padding: 15px 0 15px 10px; }
	#navigation ul li a { background: url(../img/nav.gif) no-repeat top left; display: block; width: 84px; height: 15px; overflow: hidden; text-indent: -1000px; color: #343434; }
	
	#navigation ul li.about a { background-position: -10px 0; }
	#navigation ul li.howto a { background-position: -10px -15px; }
	#navigation ul li.demo a { background-position: -10px -30px; }
	#navigation ul li.download a { background-position: -10px -45px; }
	#navigation ul li.tweets a { background-position: -10px -60px; }
	
	#navigation ul li.about a:hover, #navigation ul li.about a.selected { background-position: -104px 0; }
	#navigation ul li.howto a:hover, #navigation ul li.howto a.selected { background-position: -104px -15px; }
	#navigation ul li.demo a:hover, #navigation ul li.demo a.selected { background-position: -104px -30px; }
	#navigation ul li.download a:hover, #navigation ul li.download a.selected { background-position: -104px -45px; }
	#navigation ul li.tweets a:hover, #navigation ul li.tweets a.selected { background-position: -104px -60px; }
	
	#flap { width: 60px; height: 60px; background: url(../img/flap.png) no-repeat top left; position: absolute; top: -9px; left: -11px; }



/* FOOTER */
	
	#twitter { position: absolute; top: 260px; left: 787px; background: url(../img/bg_twitter.png) no-repeat top left; width: 160px; height: 174px; overflow: hidden; }
	#twitter .wrapper { background: url(../img/twitter.png) no-repeat top right; width: 57px; height: 49px; margin: 65px 0 0 -30px; padding-left: 30px; }
	#twitter p { display: block; position: absolute; width: 100px; height: 55px; background: url(../img/twitter_balloon.png) no-repeat top left; text-align: center; padding-top: 5px; line-height: 14px; top: 24px; left: 45px; }
	#twitter p a { color: #fff; text-decoration: none; font-size: 10px; border-bottom: 1px solid #efefef; }
	#twitter p a:hover { color: #fff; text-decoration: none; border-bottom: none; }
	
	#partners { position: absolute; bottom: 110px; left: 610px; }
	#partners ul { list-style: none; }
	#partners ul li { float: left; margin-left: 10px; }



/* CONTENT */
	
	#content { margin: 0 auto; width: 595px; min-height: 200px; height: auto !important; height: 200px; background: #fff url(../img/bg_main.jpg) no-repeat bottom center; padding: 65px 15px 220px 15px; }
	
	#content h1 { display: block; background: #424242; color: #fff; font-size: 12px; font-weight: normal; padding: 5px; margin-bottom: 11px; }
	#content h3 { font-size: 12px; font-weight: bold; margin: 0 0 11px 5px; }
	
	#content p { padding-left: 5px; padding-right: 5px; }
	
	#content a { color: #000; text-decoration: none; border-bottom: 1px solid #666; }
	#content a:hover { color: #666; text-decoration: none; border-bottom: 1px solid #999; }
	
	#content a.incognito { color: #666; border-bottom: 1px solid #ccc; }
	#content a.incognito:hover { color: #000; border-bottom: 1px solid #666; }
	
	#content a.btn { display: block; border: 1px solid #999; background-color: #ccc; font-weight: bold; text-transform: uppercase; width: 200px; padding: 10px; -moz-border-radius: 6px; -webkit-border-radius: 6px; }
	#content a.btn:hover { border-color: #666; background-color: #999; color: #000; }
	
	.block { margin-bottom: 48px; }
	.col { width: 285px; float: left; }
	.colm { margin-right: 20px; }
	
	.tweetList { margin: 0 5px; }
	.tweetList ol li { list-style: none; border-bottom: 1px solid #ccc; padding-bottom: 5px; margin-bottom: 5px; }
	.tweetList ol li a { border-bottom: none !important; }
	.tweetList ol li a:hover { border-bottom: none !important; }
	.tweetsLoading { height: 30px; background: url(../img/loader.gif) no-repeat top left; }
	.tweetsDate { color: #666; }
	
	pre { display: block; border: 1px solid #ccc; background-color: #efefef; padding: 5px;  }
	
	.documentation ul { margin: 0 0 16px 0; list-style: none; }
	.documentation ul ul { color: #666; margin-left: 10px; }
	
	table { border-collapse: collapse; }
	table th { font-weight: bold; text-align: center; }
	table td { text-align: center; padding: 5px; border-bottom: 1px solid #ccc; }
	table td.col1 { text-align: left; padding: 0; }



/* CLEARFIX */
	
	.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
	.clearfix { display: inline-block; }
	html[xmlns] .clearfix { display: block; }
	* html .clearfix { height: 1%; }