/*

	Copyright 2009 Ri2 Design Studio
	
	Colours:
	Background:				f2f2ea
	default text:			5e5e5e
	dark grey:				3e3e3d
	
	

*/

/* -------------------------------------- General Structure */
body {
	margin: 0;
	padding: 0;
	font-family: Helvetica, Arial, Verdana, "MS Trebuchet", sans-serif;
	line-height: 150%;
	font-size: 82%;
	background: #f2f2ea;
}

a img {border:0;}

/* -------------------------------------- Header */
#header {
	position: relative;
	margin: 0;
	padding: 0;
	margin-bottom: 30px;
}
#slogans-buttons {
	position: absolute;
	right: 0;
	top: 0;
	cursor: pointer;
}

/* -------------------------------------- Global Nav */	
#global-nav { margin: 0; padding: 0; position: absolute; left: 250px; top: 25px;}
#global-nav li { display: inline; list-style-type: none; }
#global-nav a:link, #global-nav a:visited {
	font-size: 1.2em;
	text-decoration: none;
	color: #a0a0a0;
	font-weight: normal;
	padding-right: 20px;
}
#global-nav a:hover { color: #5e5e5e; }
#global-nav a.current { color: #3e3e3d; }

/* -------------------------------------- Slogans */
#slogans-container {
	background: #3e3e3d url('../images/slogans-bg-shadow.gif') bottom left repeat-x;
	color: #fff;
	font-size: 2.0em;
	position: relative;
	z-index: 1;
	margin: 0;
	padding: 10px 0 20px 0;
}
#slogans {
	width: 975px;
	margin: 0 auto 0 auto;
	list-style-type: none;
	font-size: 1.8em;
	line-height: 130%;
}

/* -------------------------------------- Home Page Slogan */
#home-page-slogan {
	font-size: 3.5em;
	font-weight: normal;
	line-height: 100%;
	margin-top: 40px;
	margin-bottom: 50px;	
}
#home-page-slogan strong { font-weight: bold; }
/* -------------------------------------- Content Structure */

#content-container {
	background: #f2f2ea;
	position: absolute;
	top: 0;
	z-index: 100;
	width: 100%;
	margin: 0;
	padding: 0;
	color: #5e5e5e;
}
#content-wrapper {
	width: 975px;
	margin: 0 auto;
}

/* -------------------------------------- Column Structure */
.columns { clear: both; }
.columns .left { float: left; }
.columns .right { float: right; }
.columns .column { margin-right: 25px; margin-bottom: 25px; }
.columns .last { margin-right: 0; }
.columns .one { width: 225px; }
.columns .two { width: 475px; }
.columns .three { width: 725px; }
.columns .four { width: 975px; }
.columns .column .section { margin-bottom: 20px; }


/* -------------------------------------- Frames */
.with-frame, .sidebar_section {
	background: #fff;
	padding: 20px 20px 37px 20px;
}

.one.column .with-frame, .one.column .sidebar_section { 
	background: #fff url('../images/one-column-bg.gif') bottom center no-repeat;
}
.three.column .with-frame, .three.column .sidebar_section { 
	background: #fff url('../images/three-column-bg.gif') bottom center no-repeat;
}

img.with-frame {
	display: block;
	padding: 10px 10px 32px 10px;
	background: #fff url('../images/one-column-bg.gif') bottom center no-repeat;
}


/* -------------------------------------- Typography */
h1 {
	margin: 0;
	padding: 0;
}
h1 a{
	display: block;
	width: 200px;
	height: 80px;
		background: url('../images/reufegus_logo.gif') 0 0 no-repeat;
}
h1 a span { display:none; }

h2,h3,h4,h5,h6 { color: #3e3e3d; }
h2 {
	font-size: 2.0em;
	margin-top: 5px;
}
h2 span { color: #dedede; }
h2 a:link, h2 a:visited { color: #b0b0b0; text-decoration: none; }
h2 a:hover { text-decoration: underline; }

p,h3,h4,h5,h6,ul,ol,dl,pre,code,table,blockquote { margin-top: 0; margin-bottom: 20px; }

h3 { font-size: 1.4em; margin-bottom: 5px;}

/* -------------------------------------- Sidebar Typography */
#sidebar {
	font-size: 87%;
	line-height: 140%;
}
#sidebar p,
#sidebar h3,
#sidebar h4,
#sidebar h5,
#sidebar h6,
#sidebar ul,
#sidebar ol,
#sidebar dl,
#sidebar pre,
#sidebar code,
#sidebar table,
#sidebar blockquote { margin-top: 0; margin-bottom: 10px; }


/* -------------------------------------- Links */
a, a:link, a:visited { 
	color: #3e3e3d;
	font-weight: bold;
}
a:hover { text-decoration: none; }

/* -------------------------------------- Buttons */
.submit input, 
.button,
.button:link,
.button:visited, 
.button-primary, 
.button-secondary, 
input[type=button], 
input[type=submit] {
	text-decoration: none;
	padding: 3px 10px !important;
	cursor: pointer;
	border: 1px solid #dcdcdc;
	-moz-border-radius: 10px;
	-khtml-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	-khtml-box-sizing: content-box;
	box-sizing: content-box;
	color: #3e3e3d;
	text-shadow: rgba(255,255,255,1) 0 1px 0;
	line-height: 200%;
}
.button img { vertical-align: -20%; }
.button a, .button-secondary a {
	font-weight: normal !important;
}
 
.submit input:hover, .button:hover, .button-secondary:hover, input[type=button]:hover, input[type=submit]:hover {
	color: #000;
	border-color: #bbb;
	text-decoration: none;
}
 
.submit input, .button, .button-secondary, input[type=button], input[type=submit] {
	background: #e5e5e5 url('../images/button_gradient.gif') repeat-x scroll left top;
}
 
.submit input:active, .button:active, .button-secondary:active, input[type=button]:active, input[type=submit]:active {
	background: #eee url('../images/button_gradient.gif') repeat-x scroll left bottom;
}
 
.button-primary {
	border-color: #298cba !important;
	font-weight: bold;
	color: #FFF !important;
	background: #21759B url('/images/button-grad.png') repeat-x scroll left top !important;
	text-shadow: rgba(0,0,0,0.3) 0 -1px 0 !important;
}
 
.button-primary:hover {
	border-color: #13455b !important;
	color: #EAF2FA !important;
}
 
.button-primary:active {
	background: #21759b url('/images/button-grad.png') repeat-x scroll left bottom !important;
}

/* -------------------------------------- Work Small */
.work-small h3 {
	font-size: 1.1em;
	margin-bottom: 0px;
}
.work-small p {
	font-size: 0.85em;
	line-height: 135%;
}

/* -------------------------------------- Blog */
.post h3.post_title {
	font-size: 2.0em;
	margin-top: 5px;
}
.post h3.post_title a:link, .post h3.post_title a:visited { text-decoration: none; }
.post h3.post_title a:hover { text-decoration: underline; }


/* -------------------------------------- Twitter */
#twitter { }
#twitter h3 { margin-bottom: 10px; }
#twitter h3 img {
	vertical-align: -30%;
	padding-right: 2px;
}
#twitter #loading img { vertical-align: -20%; }
div.tweet { margin-bottom: 10px !important; }
.tweet p {
	margin-bottom: 5px;
	font-size: 0.87em;
	line-height: 135%;
}
.tweet .tweet-body { 
	margin-bottom: 5px; 
	font-style: italic;
}
.tweet .tweet-meta { 
	color: #3e3e3d;
	font-weight: bold;
}

/* -------------------------------------- ScrnShots */
.scrnshot { float: left; padding-right: 5px; }

/* -------------------------------------- Lists */
ul.checks { padding-left: 0; }
ul.checks li { 
	list-style: none outside;
	background: url('../images/accept.png') 0 0 no-repeat;
	padding: 0 0 10px 22px;	
	line-height: 120%;
	margin: 0;
}
#sidebar ul.checks li { 
	line-height: 120%; 
	padding: 2px 0 6px 22px;		
}

/* -------------------------------------- Footer */
#footer {
	clear: both;
	padding-top: 50px;
	font-size: 90%;
}

/* -------------------------------------- Home Page */
#blog-posts .intro-text {
	font-size: 1.1em;
}