/* RESET ISH */
html
	margin: 0 0 1px 0
	padding: 0
	overflow: auto


body
	margin: 0
	text-align: center
	padding: 0
	font: normal 12px/1.5em "Helvetica Neue", Helvetica, "Lucida Grande", "Helvetica Neue", Arial, sans-serif
	background: #ebebeb
	color: #333
	min-width: 900px

*
	outline: none
.clearfix
	display: inline-block
	display: block

	&:after
		content: "."
		display: block
		height: 0
		clear: both
		visibility: hidden
.clear
	clear: both
		
form, input, dt, dl, dd, ol, div, p, blockquote, h1, h2, h3, h4, h5, h6, a
	margin: 0
	padding: 0


a
	outline: none

	&:link, &:visited
		color: #07b
		text-decoration: none

	&:hover
		color: #d30


form, input, dt, dl, dd, ol, div, p, blockquote, h1, h2, h3, h4, h5, h6, a
	margin: 0
	padding: 0
	
/* HEADERS */
h1, h2, h3, h4, h5, h6
	font-size: 100%
h1.header
	font-size: 120%
	margin-bottom: 10px
	border-bottom: 1px solid #ccc
	padding: 3px
	img
		margin-bottom: 5px
h2
	position: relative
	padding: 5px
	font-size: 110%
	margin-bottom: 10px
	border-bottom: 1px solid #ccc
	strong.highlight
		background: black
div.repo h2
	border-bottom: none
	display: inline
/* ERRORS */
div
	&.errorExplanation, &#error
		padding: 10px 10px 10px 50px
		margin: 20px 0
		background: #fee url(/images/app/icons/no.png) 5px 5px no-repeat
		border: 1px solid #faa
		color: #333

	&.errorExplanation
		ul
			list-style: none
			margin: 5px 0

		h2
			background: transparent
			border: 0
			padding: 0

	&#error h2
		background: transparent
		border: 0
		padding: 0
/* INFORMATION */
.info
	background: #E3F1FF url(/images/icons/info.png) 5px 50% no-repeat
	padding: 20px 10px 20px 60px
	border: 1px solid #5D94CB
	font-weight: bold
	color: #346
	margin: 10px 0


.notice, .flash-notice
	padding: 20px 10px 20px 60px
	border: 1px solid #5D94CB
	font-weight: bold
	color: #346
	margin: 10px 0
	background: #DCF0C9 url(/images/icons/check.png) 5px 50% no-repeat
	border: 1px solid #6A3
	color: #460
	&.mini
		background: #DCF0C9 url(/images/icons/check-small.png) 5px 50% no-repeat
		padding: 5px 10px 5px 30px
		width: 60%
		span.close
			float: right
			&:hover
				color: #F00
				cursor: pointer
		&.full
			width: auto
			margin: 5px 20px 10px
.flash-error
	padding: 15px 10px 15px 60px
	margin: 20px 0
	background: #fee url(/images/icons/no.png) 5px 5px no-repeat
	border: 1px solid #faa
	color: #F00
	font-weight: bold
	margin: 10 0
	&.mini
		background: #fee url(/images/icons/delete.png) 5px 50% no-repeat
		padding: 5px 10px 5px 30px
		width: 60%
		&.full
			width: auto
			margin: 5px 20px 10px
/* MAJOR */
#header
	background: #232C30
	margin: 0
	text-align: left
	padding: 18px
	position: relative
	h1 a
		color: #fff
		text-decoration: none
		font-size: 120%

#content
	width: 90%
	margin: 0 auto
	text-align: left
	padding-bottom: 40px
	#main
		padding: 20px
	#sbar
		width: 220px
		padding: 20px
		display: table-cell
		&.wide
			width: 250px
			padding: 10px
		
/* HEADERS */
#hdr-cnt
	position: relative
	width: 85%
	margin: 0 auto
	padding: 0 20px
	#nav
		position: absolute
		top: 11px
		left: 162px
		list-style: none
		margin: 0
		padding: 0

		li
			display: inline
			margin: 0
			padding: 0

			a
				border-top: 1px solid #5C738A
				background-color: #456 !important
				color: #DEE9EE
				font-size: 92%
				font-weight: bold
				margin-right: 5px
				padding: 3px 20px
				padding-left: 25px
				display: block
				float: left

				&:hover
					border-top-color: #7593B0
					background-color: #576C82 !important
					color: #fff

			&.selected a
				border-top: 1px solid #fff
				background-color: #eee !important
				color: #333


	li
		&#code a
			background: url(/images/icons/code.png) 5px 50% no-repeat

		&#activity a
			background: url(/images/icons/activity.png) 5px 50% no-repeat

		&#all-history a 
			background: url(/images/icons/clock.png) 5px 50% no-repeat
			
		&#admin a
			background: url(/images/icons/admin.png) 5px 50% no-repeat
			
		&#repos a
			background: url(/images/icons/box-small.png) 5px 50% no-repeat

	#utils
		position: absolute
		right: 20px
		top: 0
		list-style: none

		li
			display: inline
			margin-right: 5px
			font-size: 92%

			a
				color: #cde
				border-bottom: 1px dotted #345

				&:hover
					color: #fff
/* MULTI */
div.sourcecode
	width: 100%
	border: 1px solid #ccc
	border-top: none
	div.controls
		padding: 5px
		border-top: 1px solid #f7f7f7
		background: #eee url(/images/app/controls-bg.png) bottom left repeat-x
		vertical-align: middle
	div.sub-controls
		color: #333
		font-family: Courier, Monaco, monospace !important
		text-align: left
		background: #f7f7f7
		padding: 5px 10px
		border-bottom: 1px solid #ccc
	div.browse
		display: table
		div#tree
			background: #f1f1f1
			width: 200px
			display: table-cell
			overflow: auto
		div#source
			display: table-cell
			pre.viewsource
				overflow: auto
				margin-bottom: 0
				word-wrap: normal
				color: #d0d0d0
/* SOURCE */
pre.viewsource
	margin-top: 0 !important
	width: 100%
	background-color: #111
	white-space: pre-wrap
	white-space: -moz-pre-wrap !important
	white-space: -pre-wrap
	white-space: -o-pre-wrap
	word-wrap: break-word
	color: #d0d0d0
	code
		padding: 20px
		display: block
/* CRUMBS */
div#crumbs
	margin-bottom: 10px
	height: 20px
	ul
		list-style: none
		padding: 0
		margin: 0
		line-height: 100%
		background: url(/images/app/crumbs-start.gif) no-repeat
		padding-left: 13px
		li
			display: block
			margin: 0
			padding: 0
			background: url(/images/app/crumb-bg.png) repeat-x
			float: left

			a
				text-shadow: 1px 1px #fff
				background: url(/images/app/crumb-divide.gif) top right no-repeat
				display: block
				color: #555
				font-size: 92%
				padding: 4px 15px 7px 5px
				font-weight: bold

				&:hover
					color: #000
			&.crumb-divide-last a
				background: url(/images/app/crumb-divide-last.gif) top right no-repeat !important
			&#current
				color: #fff
				font-size: 92%
				float: left
				text-shadow: 1px 1px #777
				background: url(/images/app/crumb-current.gif) repeat-x
				padding: 4px 10px 7px 10px
				border-right: 1px solid #999
				font-weight: bold
/* BROWSER */
#browser, .diff
	width: 100%
	border-collapse: collapse
	border: 1px solid #ccc
	border-top: none
	th
		border-left: 1px solid #ddd
		text-align: left
		background: #f7f7f7
		padding: 5px 10px
		border-bottom: 1px solid #ccc
#browser
	td, th
		padding: 5px 10px
	td
		background: #eee
		border-bottom: 1px solid #ccc
		border-left: 1px solid #ddd
		a
			font-weight: bold
a
	&.folder
		background: url(/images/app/icons/folder-small.png) 0 50% no-repeat

	&.image
		background: url(/images/app/icons/image.png) 0 50% no-repeat

	&.script
		background: url(/images/app/icons/script-small.png) 0 50% no-repeat

	&.txt, &.file
		background: url(/images/app/icons/text-small.png) 0 50% no-repeat
td.item a
	display: block
	padding: 8px 5px 8px 25px
tr#controls td, tr.controls td
	padding: 0
	height: 20px
	border-top: 1px solid #f7f7f7
	background: #eee url(/images/app/controls-bg.png) bottom left repeat-x
div.control-head
	margin: 0
	padding: 0 0 0 40px
	position: relative
	min-height: 25px
	p.controlblock
		position: absolute
		top: 0
		left: 5px
		height: 16px
		width: 50px
	ul.formats
		float: right
		margin: 2px 0 0 0
		padding: 0
		line-height: 100%
		list-style: none
		font-size: 82%
		background: #eee url(/images/app/cap-left.png) no-repeat

		li
			display: block
			margin-right: 5px
			float: left

			a
				display: block
				padding: 3px 5px 4px 5px
				color: #777
				text-shadow: 1px 1px #fff
				font-weight: bold
				&:hover, &.sel
					color: #333
				&.sel
					text-decoration: underline
			&.end
				margin-right: 0

				a
					background: url(/images/app/cap-right.png) top right no-repeat
#control-center
	margin-bottom: 20px
	position: relative
	padding: 10px
	background: #fff
	font-weight: bold
.rev 
	line-height: 100%
	float: right
	background: #f7f7f7
	padding: 3px
	border: 1px solid #fff
	color: #666
	font-size: 92%
	-moz-border-radius: 4px
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
	font-weight: bold
td span.log, #repos span.log, #permissions span.log, .listbox span.log, p.desc
	font-size: 92%
	display: block
	color: #888
	
/* CHANGESETS */
.cs-meta
	float: left
	width: 60px
	padding: 5px
	text-align: center
	background-color: #e2e2e2
	border-right: 1px solid #ddd
	line-height: 100%
.cs-log
	padding: 5px
	padding-right: 50px
	margin-left: 71px
	font-size: 92% !important
	background-color: #f7f7f7
.change-number a
	font-size: 120%
	font-weight: bold
	color: green
	display: block
	float: left
	padding-right: 10px
	margin-bottom: 5px
#changesets 
	list-style: none
	-webkit-padding-start: 0
	li.changeset
		background: none
		border: none
		border-bottom: 1px solid #ccc
		padding: 0
		.cs-log
			background: none
		.cs-meta
			background: none
			border-right: none	
			.change-number
				font-size: 100%
				display: block
				text-align: center
				a
					color: #481
					text-shadow: 1px 1px #f7f7f7
					float: none
					padding-right: 0
					margin-top: 3px
	.timenauthor
		color: #888
		font-weight: normal
		display: block
div.changeset
	padding: 0
	background-image: none
	border: none
	border-bottom: 1px solid #ccc
	.cs-meta
		background: none
		border-right: none	
		.change-number
			font-size: 100%
			display: block
			text-align: center
			a
				color: #481
				text-shadow: 1px 1px #f7f7f7
				float: none
				padding-right: 0
				margin-top: 3px
	.timenauthor
		color: #888
		font-weight: normal
		display: block
#last-log
	position: relative
.changed
	background-color: #7b0
	color: #fff
/* LIST */
.changeset, .repo, .form, .permission, .listbox li.listitem
	padding: 10px
	padding-left: 50px
	background: #e2e2e2 url(/images/app/icons/terminal.png) 5px 3px no-repeat
	margin-bottom: 10px
	border: 1px solid #ddd
	border-bottom-color: #ccc
	border-right-color: #ccc
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
	font-size: 110%
	font-weight: bold
.repo
	background: #e2e2e2 url(/images/icons/box.png) 5px 3px no-repeat
/* AVATAR */
.avatar
	padding: 2px
	background: #fff
	border: 1px solid #aaa
	border-bottom: 1px solid #ccc
	border-bottom: 1px solid #ccc
	width: 32px
	height: 32px
	&.large
		width: 40px
		height: 40px
	&.xlarge
		width: 80px
		height: 80px
/* PAGINATION */
.pagination
	padding: 3px
	margin: 10px auto
	a
		padding: 2px 5px 2px 5px
		margin: 2px
		border: 1px solid #ccc
		background: #f7f7f7
		color: #555
		&:hover, &:active
			border: 1px solid #aaa
			color: #111
	span.current
		padding: 2px 5px 2px 5px
		margin: 2px
		border: 1px solid #FFAB92
		font-weight: bold
		background-color: #FFE1D8
		color: #d30
	span.disabled
		padding: 2px 5px 2px 5px
		margin: 2px
		border: 1px solid #eee
		color: #aaa
/* DIFF */
ul.changeset-nav
	list-style: none
	position: absolute
	top: 3px
	width: 32px
	right: 8px
	height: 16px
	li
		&.next a, &.prev a
			position: absolute
			display: block
			text-indent: -9999px
			width: 16px
			height: 16px
			left: 20px
			top: 0
			background: url(/images/app/icons/forward.png) no-repeat
		&.prev a
			left: 0
			top: 0
			background: url(/images/app/icons/back.png) no-repeat
a
	&.forward, &.back 
		position: absolute
		display: block
		width: 16px
		height: 16px
		text-indent: -9999px
		background: url(/images/app/icons/forward.png) no-repeat
		&.back 
			left: 0
			top: 0
			background: url(/images/app/icons/back.png) no-repeat
		&.forward 
			left: 16px
			top: 0
div.diff-table
	margin-bottom: 20px
	clear: right
	overflow: auto
	padding: 1px


.diff
	font-family: Courier, Monaco, monospace !important
	overflow: auto
	width: 100%

	td
		background: #eee

		pre
			padding: 0
			margin: 0

	th.csnum
		white-space: no-wrap
		width: 1px
		text-align: center


.ln
	white-space: no-wrap
	width: 1px
	text-align: center
	background: #e2e2e2 !important
	font-size: 92%
	border-right: 1px solid #ccc
	font-family: "Helvetica", Arial, sans-serif
	border-bottom: 1px dotted #ccc


.diff
	tr.controls td
		padding: 5px
		font-family: "Lucida Grande", Helvetica, Arial, sans-serif
		span.view-file
			float: right
			span.sha
				font-family: Courier, Monaco, monospace !important
			

	tbody td
		background: #f1f1f1

	td
		&.insert
			background: #dfd
			color: #030
			border-right: 1px solid #4C4
			border-left: 1px solid #4C4 !important
			.darker
				background: #AFA
		&.delete
			background: #fdd
			color: #900
			border-right: 1px solid #d99
			.darker
				background: #FF9F9A
#change-list
	list-style: none
	margin-bottom: 20px
	padding: 0

	li
		padding: 5px
		border-bottom: 1px solid #ddd
		position: relative
		span.a, span.m, span.d, span.mv, span.cp
			background: #7b0
			color: #fff
			font-size: 82%
			border: 1px solid #fff
			line-height: 100%
			padding: 2px
			font-weight: bold
			font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
			a
				:text-decoration none
				color: #fff
		span
			&.m
				background-color: #06b
			&.mv
				color: #540
				background: #ca0
			&.d
				background: #c00
			&.cp
				background: #ccc
				color: #333

.viewdiff
	display: block
	position: absolute
	right: 0
	top: 5px
	text-indent: -9999px
	width: 14px
	height: 14px
	background: url(/images/app/icons/view-tiny.png) 0 50% no-repeat


#change-list .shade
	background: #eee
		
.linenos
	:vertical-align sub
	padding-right: 10px
/* BLAME */
.blame-div, .source-div
	width: 100%
	#source
		overflow: auto
		font-family: Courier, Monaco, monospace !important
		pre.viewsource
			margin-bottom: 0
			table
				color: #fff
				background-color: #111
				border-collapse: collapse
				tr.start-line
					border-top: 1px solid #555
				td
					margin: 0
					padding: 0 5px
					&.linenos, &.lineno
						vertical-align: sub
						color: #333
						text-align: right
						border-left: 1px solid #555
						border-right: 1px solid #555
					pre
						margin: 0
						padding: 0
/* SIDEBAR */
#subscribe
	margin: 10px 0
	#subscribe-btn
		width: 220px
		padding: 6px 10px
		-webkit-border-radius: 14px
		border-radius: 14px
		-moz-border-radius: 14px
		border: solid 2px rgb(153, 153, 153)
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 255, 255)), to(rgb(221, 221, 221)))
		color: #333
		text-decoration: none
		cursor: pointer
		display: inline-block
		text-align: center
		text-shadow: 0px 1px 1px rgba(255,255,255,1)
		line-height: 1
		font-weight: bold
		font-size: 13px
		img
			vertical-align: top
			margin-right: 5px
		&:hover
			background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(248, 248, 248)), to(rgb(221, 221, 221)))
		&:active, &.selected
			background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(204, 204, 204)), to(rgb(221, 221, 221)))
		&.disabled
			color: #ccc
			&:hover, &:active, &.selected
				background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 255, 255)), to(rgb(221, 221, 221)))
#members
	list-style: none

	li
		min-height: 38px
		padding: 5px 0
		border-bottom: 1px solid #ccc

	.avatar
		float: left
		margin-right: 5px

	.author
		font-weight: bold
		display: block
		font-size: 110%

	.activity
		color: #777
		font-size: 92%
.sideblock
	margin: 20px 0

	p
		padding: 5px

	h3
		background: #fff
		padding: 5px
		border: 1px solid #ddd
		border-bottom: 1px solid #ccc
		border-right: 1px solid #ccc

	ul
		list-style: none
		padding: 5px
		font-size: 92%
#repo-search, #repo-search-results
	#repo-search-form
		input.search
			width: 100%
#repo-search-results
	padding-bottom: 10px
#browser-search
	margin: 5px
	padding: 5px
	#repo-search-form
		input.search
			width: 30%
/* NAV */
.subnav-bar.single
	padding: 0px
	border: 1px solid #ccc
	border-top: 1px solid #f7f7f7
	background: #eee url(/images/app/controls-bg.png) bottom left repeat-x
	vertical-align: middle
	height: 35px
	> ul
		padding-left: 20px
		margin: 4px 0 0 -6px
		> li
			position: relative
			list-style-type: none
			float: left
			margin-right: 10px
			> a, > span.text
				font-size: 11px
				position: relative
				display: block
				height: 15px
				padding: 3px 5px 5px 5px
				color: #666
				border: 1px solid transparent
				&.dropdown
					padding-right: 15px
					background-image: url(/images/arrow_down.png)
					background-position: 100% -20px
					background-repeat: no-repeat
			&.empty
				> a
					background: none
					color: #888
				&:hover
					> a
						background: none
						color: #888
						cursor: default
			&:hover
				> a
					//background: rgb(235, 235, 235)
					background-color: #222
					color: white
					border-bottom: none
					-webkit-border-top-left-radius: 5px
					-webkit-border-top-right-radius: 5px
					-moz-border-radius-topleft: 5px
					-moz-border-radius-topright: 5px
					border-top-left-radius: 5px
					border-top-right-radius: 5px
					&.dropdown
						background-position: 100% 0px
				> ul
					display: block
					margin: 0
					> li
						border-bottom: none
						display: block
						min-width: 180px
			> ul
				display: none
				position: absolute
				top: 22px
				background: #222
				//background: rgb(221, 221, 221)
				//background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(221, 221, 221)), to(rgb(180, 180, 180)))
				z-index: 4
				-webkit-padding-start: 0
				margin: 0
				-webkit-border-radius: 5px
				-webkit-border-top-left-radius: 0
				-moz-border-radius: 5px
				-moz-border-radius-topleft: 0
				border-radius: 5px
				border-top-left-radius: 0
				-webkit-box-shadow: 3px 3px 3px #555
				-moz-box-shadow: 2px 2px 4px #000
				box-shadow: 2px 2px 4px #000
				> li
					list-style-type: none
					margin: 0
					font-size: 11px
					position: static
					float: none
					display: block
					&:first-child a
						-webkit-border-top-right-radius: 5px
						-moz-border-radius-topright: 5px
						border-top-right-radius: 5px
					&:last-child a
						-webkit-border-bottom-right-radius: 5px
						-webkit-border-bottom-left-radius: 5px
						-moz-border-radius-bottomright: 5px
						-moz-border-radius-bottomleft: 5px
						border-bottom-right-radius: 5px
						border-bottom-left-radius: 5px
					> a, > strong
						display: block
						padding: 4px 5px
						font-weight: bold
						color: white
					> a:hover
						background: #444
span.code-text
	font-family: monospace
	margin-left: 5px
.va-reset
	img
		:vertical-align middle
#admin-nav-bar
	padding: 0px
	border: 1px solid #ccc
	border-top: 1px solid #f7f7f7
	background: #eee url(/images/app/controls-bg.png) bottom left repeat-x
	vertical-align: middle
	height: 35px
	ul
		position: relative
		margin: 0 0 0 0
		padding-left: 20px
		li
			position: relative
			list-style-type: none
			float: left
			margin-right: 10px
			//width: 79px
			text-align: center
			height: 35px
			border-left: 0
			a, span.text
				position: relative
				display: block
				padding: 9px 14px 0
				font-size: 11px
				text-decoration: none
				color: #333
				font-weight: bold
				z-index: 5
				text-shadow: 1px 1px #eee
				height: 26px
				img
					vertical-align: sub
					margin-right: 2px
				a
					display: block
			&:hover
				background: url(/images/app/nav-hover-right.png) bottom right no-repeat
				a
					background: url(/images/app/nav-hover-left.png) bottom left no-repeat
			&.selected, &:active
				background: url(/images/app/nav-selected-right.png) bottom right no-repeat
				a
					background: url(/images/app/nav-selected-left.png) bottom left no-repeat
/* REPO ADD */
.repo-add
	padding: 5px
	background: #e2e2e2
	margin-bottom: 10px
	border: 1px solid #ddd
	border-bottom-color: #ccc
	border-right-color: #ccc
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
	font-size: 110%
	font-weight: bold
	&:hover
		background: rgb(247,247,247)
#service-hooks-header
	height: 25px
	color: #000
	font-size: 25px
	padding: 12px 5px 5px 5px
	border-bottom: 1px solid rgb(105, 105, 105)
	-webkit-border-top-left-radius: 5px
	-moz-border-radius-topleft: 5px
	border-top-left-radius: 5px
	-webkit-border-top-right-radius: 5px
	-moz-border-radius-topright: 5px
	border-top-right-radius: 5px
	webkit-user-select: none
	-webkit-user-drag: none
	text-shadow: 1px 1px 0px #bad3ed
	margin-bottom: 10px
#service-hooks
	display: table
	width: 100%
	div.service-list-div, div.service-hook-div
		display: table-cell
	div.service-list-div
		width: 22%
	div.service-hook-div
		width: 75%
		padding: 5px
		div.hook
			div.head
				font-size: 18px
				padding-bottom: 3px
				border-bottom: 1px solid #bbb
				margin-bottom: 5px
			form.formtastic fieldset > ol > li label
				width: 15%
			form.formtastic fieldset.buttons
				padding-left: 15%
				li.commit input, a.g-button
					padding: 6px 10px
					-webkit-border-radius: 2px
					border-radius: 2px
					-moz-border-radius: 2px
					border: solid 1px rgb(153, 153, 153)
					background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 255, 255)), to(rgb(221, 221, 221)))
					color: #333
					text-decoration: none
					cursor: pointer
					display: inline-block
					text-align: center
					text-shadow: 0px 1px 1px rgba(255,255,255,1)
					line-height: 1
					&:hover
						background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(248, 248, 248)), to(rgb(221, 221, 221)))
					&:active, &.selected
						background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(204, 204, 204)), to(rgb(221, 221, 221)))
					&.disabled
						color: #ccc
						&:hover, &:active, &.selected
							background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 255, 255)), to(rgb(221, 221, 221)))
	div.service-list-div
		ul
			list-style-type: none
			-webkit-padding-start: 0
			margin: 0
			li
				padding: 4px
				border-right: 1px solid rgb(105, 105, 105)
				&:hover
					background: #DFDFDF
					cursor: pointer
				&.current, &:active
					background: #ccc
					-webkit-user-drag: none
				&.current
					border-right: none
				&.service_active a
					color: #3a3
					font-weight: bold
				&.service_inactive a
					color: #a33
	div.service-arrows
		width: 15px
		display: table-cell
		.right-arrow
			border: 12px solid #ebebeb
			border-width: 12px 0 12px 12px
			border-color: #ebebeb #ccc
			font-size: 0 /* needed for IE browsers, if this isn't set to 0 you will end up with a trapezoid */
			line-height: 0
			position: relative
			top: -4px
			width: 0px
			margin-bottom: 1px
			&.hidden
				border-color: #ebebeb #ebebeb
/* REPO SIDEBAR */
.sidebar-repo
	border: 1px #ccc solid
	:border-radius 5px
	:-moz-border-radius 5px
	:-webkit-border-radius 5px
	.sidebar-repo-head
		background: #eee url(/images/app/controls-bg.png) bottom left repeat-x
		padding: 5px
		border-bottom: 1px #ccc solid
		h2
			font-size: 110%
			display: inline
		span.new
			float: right
			font-size: 105%
			:font-variant small-caps
			a
				color: #07b
				&:hover
					:text-decoration underline
	.sidebar-repo-list
		ul
			-webkit-padding-start: 0
			list-style: none
			margin: 0
			li
				padding-left: 25px
				background: url(/images/icons/box-small.png) no-repeat 5px center
				border-bottom: 1px #ccc solid
				font-weight: bold
				&.last
					border-bottom: 0
				&:hover
					background-color: #ccc
				a	
					padding: 3px 5px 3px 0
					display: block
					color: #07b
					margin-right: 2px
					&:hover
						background: url(/images/icons/forward.png) no-repeat 4px right
/* ACTIVITY FEED  */				
#dashbaord
	ul
		-webkit-padding-start: 0
		list-style: none
		li.commit, li.push
			background: url(/images/icons/head.png) 0 5px no-repeat
			div.commit-div, div.push-div
				margin-left: 22px
				border-bottom: 1px solid #bbb
				padding: 4px
		li.commit
			div.meta
				:font-weight bold
			div.info-under
				display: table
				div.av
					display: table-cell
				div.comm-info
					display: table-cell
					:vertical-align top
					padding: 3px
					.code
						:font-family monospace
		li.push
			div.meta
				:font-weight bold
			div.info-under
				display: table
				div.av, div.commits-info
					display: table-cell
				div.commits-info
					:vertical-align top
					padding: 3px
					.inline-commit
						margin-bottom: 3px
					.avatar
						width: 16px
						height: 16px
						vertical-align: middle
					.code
						:font-family monospace
/* MAKE THE FORM BUTTONS NICE */
form.formtastic li.commit input, a.g-button
	padding: 6px 10px
	-webkit-border-radius: 2px
	border-radius: 2px
	-moz-border-radius: 2px
	border: solid 1px rgb(153, 153, 153)
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 255, 255)), to(rgb(221, 221, 221)))
	color: #333
	text-decoration: none
	cursor: pointer
	display: inline-block
	text-align: center
	text-shadow: 0px 1px 1px rgba(255,255,255,1)
	line-height: 1
	&:hover
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(248, 248, 248)), to(rgb(221, 221, 221)))
	&:active, &.selected
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(204, 204, 204)), to(rgb(221, 221, 221)))
	&.disabled
		color: #ccc
/* LOGIN/LOGOUT */
form.formtastic.user_session, form.formtastic.user, form.formtastic.forgot
	fieldset > ol > li label
		width: 15%
	fieldset.buttons
		padding-left: 15%
	fieldset > ol > li p.inline-errors
		margin-left: 15%
form.formtastic.user
	fieldset > ol > li label
		width: 20%
	fieldset.buttons
		padding-left: 20%
	fieldset > ol > li.string input, fieldset > ol > li.password input
		width: 70%
	fieldset > ol > li p.inline-errors
		margin-left: 20%
body.mini
	background: #ccc
	#container
		width: 500px
		margin: 10% auto 20px auto
		-webkit-border-radius: 10px
		-moz-border-radius: 10px
		border-radius: 10px
		-webkit-box-shadow: rgba(0, 0, 0, 0.496094) 1px 2px 6px
		background: #E9EAEE
		img
			vertical-align: middle
		#login-header
			background: #232C30
			background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#465862), to(#232C30))
			padding: 15px
			margin-bottom: 10px
			-webkit-border-top-left-radius: 10px
			-webkit-border-top-right-radius: 10px
			-moz-border-radius-topleft: 10px
			-moz-border-radius-topright: 10px
			border-top-left-radius: 10px
			border-top-right-radius: 10px
			border-bottom: 1px solid #999
			h1 a
				color: #fff
				text-decoration: none
				font-size: 150%
		#login-content
			form.formtastic
				fieldset > ol > li label
					text-align: right
				fieldset > ol > li.boolean label
					padding-left: 16%
				fieldset > ol > li p.inline-errors
					text-align: left
					margin-left: 20%
				fieldset.buttons
					padding: 0 20px
					margin: 0 auto
					li input
						padding: 12px 0
						font-size: 21px
						font-weight: bold
						width: 460px
			form.formtastic.user_session, form.formtastic.user
				fieldset.buttons
					li input
						background: url(/images/icons/lock.png) 36% 50% no-repeat, -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 255, 255)), to(rgb(221, 221, 221)))
						&:hover
							background: url(/images/icons/lock.png) 36% 50% no-repeat,-webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(248, 248, 248)), to(rgb(221, 221, 221)))
						&:active, &.selected
							background: url(/images/icons/lock.png) 36% 50% no-repeat,-webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(204, 204, 204)), to(rgb(221, 221, 221)))
			#login-links
				margin-bottom: 5px
			form.formtastic.user
				fieldset > ol > li p.inline-errors
					text-align: left
					margin-left: 24%
	#login-footer
		width: 500px
		margin: 0 auto
		font-size: smaller
		text-align: center
		img
			vertical-align: middle
/* USER SHOW */
#user-profile
	div#user-info
		margin: 5px auto 10px auto
		img
			vertical-align: middle
		h1
			font-size: 25px
			display: inline-block
		span.profile-links
			float: right
		div#user-activity
			display: table
			width: 100%
			div#recent-user-commits
				display: table-cell
				width: 65%
				margin-left: 10px
				h2
					font-size: 18px
			div#recent-repo-activity
				display: table-cell
				width: 33%
				padding: 5px
				strong
					width: 15%
					display: inline-block
				span.recent-repo
					display: block
					padding: 5px
					padding-left: 28px
					background: #e2e2e2 url(/images/icons/box-small.png) 5px 6px no-repeat
					margin-bottom: 10px
					border: 1px solid #ddd
					border-bottom-color: #ccc
					border-right-color: #ccc
					font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
					font-size: 110%
					font-weight: bold
	/* EDIT */
	#admin-nav-bar
		ul li
			border-bottom: 1px solid #c3c3c3
	div#user-edit
		display: table
		width: 100%
		#edit-sidebar
			width: 23%
			display: table-cell
			padding: 10px
		#edit-divs
			background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#c3c3c3), to(#ebebeb))
			width: 75%
			padding: 10px
			display: table-cell
			border-left: 1px solid #ccc
			border-right: 1px solid #ccc
			div.edit-div
				p
					margin-bottom: 8px
				&#settings
					form.formtastic.user
						fieldset > ol > li
							display: inline
							label
								width: 0px
							span.seperator
								width: 10px
						fieldset > ol > li.string input, fieldset > ol > li.password input
							width: 35%
					#nuke_it
						border: #900 1px solid
						-webkit-border-radius: 5px
						-moz-border-radius: 5px
						border-radius: 5px
						margin: 10px 0
						padding: 0 0 5px 5px
						h2
							color: #900
							border-bottom: none
							margin-bottom: 5px
						span.delete
							float: right
							margin: 10px 10px 0 0
							input
								color: #900
								padding: 6px 10px
								-webkit-border-radius: 2px
								border-radius: 2px
								-moz-border-radius: 2px
								border: solid 1px rgb(153, 153, 153)
								background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 255, 255)), to(rgb(221, 221, 221)))
								color: #333
								text-decoration: none
								cursor: pointer
								display: inline-block
								text-align: center
								text-shadow: 0px 1px 1px rgba(255,255,255,1)
								line-height: 1
								&:hover
									color: white
									text-shadow: none
									background-image: -webkit-gradient(linear, 0% 0, 0% 100%, from(#FF0000), to(#960101))
								&:active
									color: white
									text-shadow: none
									background-image: -webkit-gradient(linear, 0% 0, 0% 100%, from(#960101), to(#FF0000))