/* - - - - - - - - - - - - - - - - - - - - - - -

Title :    Ryan Swedal
URL :      http://ryanswedal.com

Created :  02.20.2010
Modified : 03.12.2010

- - - - - - - - - - - - - - - - - - - - - - - */
@import url(/css/font-face/fonts.css);

/* -----------------------------------------
Global Reset
v1.0 | 20080212
http://meyerweb.com/eric/tools/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;
}

blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

/* remember to highlight inserts somehow! */
ins { text-decoration: none; background: #ffc; }
del { text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }

/* remember to define focus styles! */
:focus { outline: none; }

/* Font Reset */
body { font-family: Helvetica, Arial, Verdana, sans-serif; font-size: 62.5%; line-height: 1em; }
html>body { font-size: 10px; }


/* ------------------------------------------------------------------------------------- H T M L  */

/* Anchor Links  -------------------------------------------------------------- */

a:link { color: #986502; text-decoration: underline; }
a:visited { color: #986502; text-decoration: underline; }
a:hover {  color: #530000; text-decoration: none; }
a:active {  color: #530000; text-decoration: none; }

a:focus { outline: none; text-decoration: underline; }

/* Headings  -------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 { font-weight: normal; line-height: 1.2em; }

h1 {
	margin: 0 0 40px;
	padding: 0.5em 0;
	font-family: 'SansationLight', Arial, sans-serif;
	font-size: 2.7em;
	line-height: 1.1em;

	border-top: 1px solid #c4c4c4;
	border-bottom: 1px solid #c4c4c4;
}

h2 {
	margin: 0 0 10px;
	padding: 10px;
	border: 1px solid #c4c4c4;
	font-family: 'SansationLight', Arial, sans-serif;
	font-size: 2.4em;
	line-height: 1em;
	text-transform: lowercase;
	color: #600;
	background: #fff;
}

h2 a {
	font-size: 0.5em;
	float: right;
}

h3 {
	margin: 0 0 0.25em;
	padding: 0.25em 0 0;
	font-family: 'SansationLight', Arial, sans-serif;
	font-size: 2.2em;
	text-shadow: 0 1px 1px rgba(66, 66, 66, 0.3);
}

h4 {
	margin: 0;
	padding: 0.75em 0;
	font-family: 'SansationLight', Arial, sans-serif;
	font-size: 1.6em;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
}

h5 { margin: 0 0 0.75em; font-size: 1.3em; font-weight: bold; }
h6 { margin: 0; font-size: 1.3em; font-weight: bold; }

/* Text Elements  -------------------------------------------------------------- */

p, ul, ol, dl, blockquote, pre { margin: 0 0 1.5em; font-size: 1.2em; line-height: 1.6em; }

blockquote {
	margin: 1.5em;
	padding: 0 0 0 1.5em;
	border-left : 1px solid #666;
	font-size: 1.2em;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: italic;
}

small, cite { font-size: .9em; }
strong, b, dt, th, dfn { font-weight: bold; }
address, cite, em, i, caption, dfn, var { font-style: italic; }

ul, ol { margin: 0 1.5em 1.5em; }
ul ul, ol ol, ul ol, ol ul, ul p, ol p { font-size: 1em; margin: 0 0 0 2em; }

ul { list-style-type: disc; }
ul ul { list-style-type: circle; }
ul ul ul { list-style-type: square; }
ul ul ul ul { list-style-type: disc; }

ol { list-style-type: decimal; }
ol ol { list-style-type: upper-roman; }
ol ol ol { list-style-type: lower-roman; }
ol ol ol ol { list-style-type: upper-alpha; }

dl { margin: 0 0 1.5em; padding-top: 1.5em; border-top : 1px solid #ccc; }
dt { font-weight: bold; margin: 0; font-size : 1.2em; line-height : 1.25; }
dd { margin: 0 0 1.5em; padding: 0 0 1.5em; border-bottom : 1px solid #ccc; }

del { text-decoration: line-through; }
abbr, acronym { font-style: normal; }
acronym, abbr { border-bottom: 1px dotted #333; cursor: help; }
acronym { text-transform: uppercase; }
pre, kbd, code, samp, tt, var { font-family: 'andale mono', 'lucida console', monospace; }

pre { white-space: pre; }
code { display: block; }

sub { font-size: 0.9em; line-height: 1em; vertical-align: sub; }
sup { font-size: 0.9em; line-height: 1em; vertical-align: super; }

/* Tables  -------------------------------------------------------------- */

table {	margin: 0 0 1.5em; font-size: 1.2em; }
caption { text-align: left; }
th, td { padding: 0.25em 0.5em; vertical-align: top; }
tbody td, tbody th { border: 1px solid #999; }
tfoot { font-size: .9em; font-style: italic; }

/* Forms  -------------------------------------------------------------- */

label { font-weight: bold; }
fieldset { margin: 0 0 1.5em 0; padding: 1.4em 1.4em 0 1.4em; border: 1px solid #ccc; }
legend { font-size : 1.2em; font-weight: bold; }
textarea { width : 390px; height : 250px; padding : 5px; }

/* Images  -------------------------------------------------------------- */

img { vertical-align: top; }

/* ------------------------------------------------------------------------------------- P R I M A R Y - L A Y O U T  */

/* Global Styles  -------------------------------------------------------------- */

body {
	color: #3F2419;
	background: #efefef url(../images/body_bg.jpg) repeat-x center top;
}

#wrapper {
	margin: 0 auto;
	width: 960px;
	text-align: left;
}

/* -----------------------------------------
Sticky Footer
http://www.cssstickyfooter.com/
-------------------------------------------- */
html, body, #wrapper { height: 100%; }

body > #wrapper { height: auto; min-height: 100%; }

#content { padding: 0 0 120px; }  /* Bottom padding must be same height as the footer */

#footer {
	position: relative;
	clear:both;
	height: 100px;
	margin-top: -100px; /* negative value of footer height */
}

/* Navigation Reset */
.nav, .nav li, .nav ul, .nav ul li { margin: 0; padding: 0; list-style: none; }

#utility-nav { display: none; }

/* Header  -------------------------------------------------------------- */

#header {
	position: relative;
	height: 136px;
	margin: 0 0 30px;
}

#header #branding {
	position: absolute;
	top: 20px;
	left: 8px;
	width: 314px;
	height: 78px;
	padding: 8px;
}

/* Global Navigation */
#slogan {
	position: absolute;
	top: 42px;
	right: 16px;
	padding: 12px 18px;
	border: 1px solid #ABA79E;
	font-size: 1.6em;
	color: #271710;

	font-family: 'SansationLight', Arial, sans-serif;
	text-shadow: 0 2px 2px rgba(239, 239, 239, 0.25);

	/* Border Radius */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px; /* for old Konqueror browsers */
	border-radius: 5px; /* future proofing */

	background: #858075;
}

#slogan a { text-decoration: none; color: #271710; }

#slogan a:hover,
#slogan a:focus {
	text-decoration: underline;
	outline: none;
	color: #530000;

	text-shadow: 0 1px 1px rgba(36, 36, 36, 0.25);
}

/* Primary Content  -------------------------------------------------------------- */

/* Featured Portfolio Gallery */

#featured { margin: 10px 0 30px 0; }

#featured a:active,
#featured a:visited,
#featured a:focus { outline: none; text-decoration: none; }

/* Common Scroller Styles */

#featured ul {
position: relative;

	width:500px;
	height:300px;
	margin:0px auto;
	list-style:none;
}

#featured li {
position: absolute;
top: 0;

	height:300px;
	width:600px;
	cursor:pointer;
	padding:5px;
	border:1px solid #aaaaaa;
	font-size:12px!important;

	-webkit-border-radius:5px;
	-moz-border-radius:5px; background:#D4D2C9;
}

#featured ul img {
	height:100%;
	width:100%;
	background-color:#FFFFFF;
	margin:0;
}

.roundabout-holder span				{display:none; font-size:12px; }
.roundabout-in-focus 				{cursor:auto;}
.roundabout-in-focus:hover			{-webkit-box-shadow:0px 0px 20px #787878; -moz-box-shadow:0px 0px 20px #787878; background:#D4D2C9;}
.roundabout-in-focus:hover span		{display:inline; position:absolute; bottom:5px; right:5px; padding:8px 20px; background:#D4D2C9; color:#333; z-index:999; -webkit-border-top-left-radius: 5px; -moz-border-radius-topLeft: 5px; font-size : 12px;border-left:1px solid #aaaaaa; border-top:1px solid #aaaaaa; }


/* Secondary Content  -------------------------------------------------------------- */

#secondary-content {
	clear: both;
	display: block;
	width: 960px;
	margin: 0 0 0 -10px;
	padding: 50px 0 0;
	background: url(../images/content_divider.jpg) no-repeat center top;
}

#secondary-content .column {
	float: left;
	width: 220px;
	margin: 0 10px;
}

#secondary-content .column p { padding: 0 0 0 10px; }

#secondary-content .column ul { list-style: none; }

#secondary-content .column ul li {
	margin: 0;
	padding: 0 0 0 22px;
	list-style: none;
	line-height: 1.8em;
	background: url(../images/bullet_checkmark.gif) no-repeat 0 2px;
}

/* Social Link Icons */
#secondary-content .column ul#social-links {
	margin: 6px 0 0;
	list-style: none;
}

#secondary-content .column ul#social-links li {

	/* Cross-Browser Inline-Block */
	display: -moz-inline-stack; /* FF2 inline-block */
	display: inline-block;
	vertical-align: top;
	zoom: 1;
	*display: inline; /* IE7 inline-block */

	width: 48px;
	margin: 0 4px 0 0;
	padding: 0;
	list-style: none;
	line-height: 1em;
	background: none;
}

#social-links li a {
	display: block;
	width: 48px;
	height: 48px;
	text-indent: -9999em;
	overflow: hidden;
	background-image: url(../images/social_link_icons.jpg);
	background-repeat: no-repeat;
}

#social-links li#sl-csstips a { background-position: 0 0; }
#social-links li#sl-csstips a:hover { background-position: 0 -48px; }

#social-links li#sl-twitter a { background-position: 0 0; }
#social-links li#sl-twitter a:hover { background-position: 0 -48px; }

#social-links li#sl-linkedin a { background-position: -48px 0; }
#social-links li#sl-linkedin a:hover { background-position: -48px -48px; }

#social-links li#sl-facebook a { background-position: -96px 0; }
#social-links li#sl-facebook a:hover { background-position: -96px -48px; }

#social-links li#sl-lastfm a { background-position: -144px 0; }
#social-links li#sl-lastfm a:hover { background-position: -144px -48px; }

p#sl-add a {
	float: right;
	display: block;
	padding: 11px 50px 0 0;
	height: 30px;
	background-image: url(../images/add_to_contacts.jpg);
	background-repeat: no-repeat;
	background-position: right 0;
	font-size: 1.5em;
	text-transform: lowercase;
	text-decoration: none;
	color: #bbb;
}

p#sl-add a:hover { background-position: right -48px; text-decoration: underline; color: #999; }

p#callout {
	margin: 10px 0;
	font-family: 'SansationLight', Arial, sans-serif;
	font-size: 2em;
}

/* Tertiary Content  -------------------------------------------------------------- */

#tertiary-content {
	clear: both;
	margin: 0 0 20px;
	padding: 50px 0 20px;
	background: url(../images/content_divider.jpg) repeat-x 0 0;
}






/* Twitter Feed */
#twitter-feed {
	position: relative;
	width: 268px;
	height: 125px;
	padding: 10px;
	border: 1px solid #9E9C95;
	overflow: hidden;
	text-align: left;
	background: #D4D2C9;

	/* Cross-Browser Inline-Block */
	display: -moz-inline-stack; /* FF2 inline-block */
	display: inline-block;
	vertical-align: top;
	zoom: 1;
	*display: inline; /* IE7 inline-block */

	/* Border Radius */
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	-khtml-border-radius: 9px; /* for old Konqueror browsers */
	border-radius: 9px; /* future proofing */
}

#twitter-feed h4 {
	display: block;
	width: 162px;
	height: 32px;
	margin: 0 0 0 10px;
	padding: 0;
	text-indent: -999em;
	overflow: hidden;
	background: url(../images/twitter_logo.png) no-repeat 0 0;
}

#twitter-feed .more {
	position: absolute;
	right: 10px;
	bottom: 10px;
	margin: 0;
}

#tweets { margin: 10px 0 20px; padding: 0 10px; }

#tweets ul, #tweets li { margin: 0; padding: 0; list-style: none; }

#tweets ul { font-size: 1.1em; }
#tweets span { display: block; }
#tweets a { color: #666; }

/* Google Map */
#contact-map {
	margin: 0 35px;

	/* Cross-Browser Inline-Block */
	display: -moz-inline-stack; /* FF2 inline-block */
	display: inline-block;
	vertical-align: top;
	zoom: 1;
	*display: inline; /* IE7 inline-block */
}

/* hCard */
#hcard-Ryan-Swedal {
	position: relative;
	width: 278px;
	padding: 5px;
	border: 1px solid #9E9C95;
	overflow: hidden;
	text-align: left;
	background: #D4D2C9;

	/* Cross-Browser Inline-Block */
	display: -moz-inline-stack; /* FF2 inline-block */
	display: inline-block;
	vertical-align: top;
	zoom: 1;
	*display: inline; /* IE7 inline-block */

	/* Border Radius */
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	-khtml-border-radius: 9px; /* for old Konqueror browsers */
	border-radius: 9px; /* future proofing */
}

#hcard-Ryan-Swedal .photo {
	position: absolute;
	top: 6px;
	left: 8px;
}

#hcard-Ryan-Swedal .fn {
	display: block;
	position: relative;
	width: 420px;
	height: 41px;
	padding: 6px 0 0 68px;
	margin: 0 0 6px;

	font-family: 'SansationRegular', Arial, sans-serif;

	font-size: 3.3em;
	text-decoration: none;
	line-height: 1em;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
	color: #2A1811;
}

#hcard-Ryan-Swedal .org,
#hcard-Ryan-Swedal .country-name { display: none; }

#hcard-Ryan-Swedal p {
	position: relative;
	margin: 0 0 .5em;
	padding: 0 0 0 68px;
	line-height: 1.4em;
}

#hcard-Ryan-Swedal strong {
	position: absolute;
	left: 8px;
	display: block;
	width: 65px;
}

#hcard-Ryan-Swedal .street-address { display: block; }

/* Footer  -------------------------------------------------------------- */

#footer {
	min-width: 960px;
	text-align: center;
	background: #e6e4ce url(../images/footer_bg.png) repeat-x center top;
	color: #333;
}

#footer p {
	margin: 0;
	padding: 26px 16px 16px;
}


/* ERROR PAGE  -------------------------------------------------------------- */
body.error h1 { border: 0; margin: 0; }
body.error h2 { margin: 10px 0 30px; }

#goog-fixurl {
	margin: 20px 0 120px;
}

#goog-fixurl ul, #goog-fixurl li { margin:0; padding:0; list-style:none; }


/* CLEARFIX
============================================================== */
/*
	perishablepress.com/press/2009/12/06/new-clearfix-hack/
	j.mp/bestclearfix
*/
.clearfix:before, .clearfix:after,
#content:before, #content:after,
#secondary-content:before, #secondary-content:after {display:block;visibility:hidden;height:0;content:"\0020";}
.clearfix:after,
#content:after,
#secondary-content:after {clear:both;}
.clearfix,
#content,
#secondary-content {zoom:1;}


/* PRINT STYLES
============================================================== */
/*
	Inlined to avoid required HTTP connection:
	www.phpied.com/delay-loading-your-print-css/
*/

@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important;
  -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  a#branding:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
  tr, img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}