/*
	Saforian.com styles

	zoom:1 used for hasLayout and self-clear floats in IE5-7
	* html hack targets IE5-6 only
*/

/* --- Formatting --- */

body
{ color:#676767; font:normal .75em/1.5em verdana,arial,helvetica,sans-serif }

p, address, ul, ol, li, dt, dd, td, th
{ line-height:1.5 }
th, b, strong
{ font-weight:bold }
i, cite
{ font-style:italic }
sup, sub
{ font-size:75% }
table, tr, td, th /* IE5 font fix */
{ font-size:100% }
.hidden
{ display: none; }
em.large
{ background:#fff; color:#363646; font:24px/1.5 Georgia,"Times New Roman",serif; font-style:italic; font-weight:bold; padding:0; }

/* Links */
a
{ text-decoration:none; color:#363646 }
a:visited
{ color:#09f }
a:hover, a:active
{ text-decoration:underline }

a.bullet /* Plus bullet */
{ padding:0 0 0 17px; background:url("../images/bullet_plus.gif") no-repeat 0 .3em }
a.showmore /* More link */
{ margin-left:.7em; padding:1px }


/* Paragraphs */
p
{ margin:0 0 1.4em }
address
{ font-style:normal; margin:0 0 1.4em }
blockquote
{ margin:0 10px 1.2em; padding:0 }

.small, small
{ font-size:92% }
.aligncenter
{ text-align:center }
.alignright
{ text-align:right }
.highlight
{ color:#000 }


.error
{ color:#ba1d00; font-weight:bold }

.intro
{ margin-bottom:1em; font:normal 24px/1.3 Georgia,"Times New Roman",serif; line-height: 1.5 }
	.intro em
	{ color:#363646; padding:0; font-weight: bold; font-style: italic; background:#fff }



/* Images */
a img
{ border-style:none }
.floatleft /* Floating images */
{ float:left; margin:0 8px 8px 0 }
.floatright
{ float:right; margin:0 0 8px 8px }

img.icon /* Document icons */
{ display:inline; margin-right:3px; padding-left:6px; vertical-align:middle }


/* Separators */
hr
{ color:#fff; background-color:#fff; height:1px; margin:1.2em 0; padding:0; border-width:0; border-top:1px dotted #d0d0d1; overflow:hidden }
	* html hr /* IE6 fix */
	{ margin:0 0 1em }
	*:first-child+html hr /* IE7 fix */
	{ margin:0 0 1em }

hr.highlight
{ border-top-color:#aa0e07 }


/* Headings */
h1, h2, h3, h4, h5, h6
{ color:#363646; margin:0 0 .9em; padding:0; font:normal 140%/1.2 Georgia,"Times New Roman",serif }
h1
{ font-size:208%; margin-bottom:.7em }  /* 25px */
h2
{ font-size:230% }  /* 18px */
h3
{ font-size:134% }  /* 16px */
h4
{ font-size:117% }  /* 14px */
h5
{ font-size:109% }  /* 13px */
h6
{ font-size:109%; margin-bottom:.2em }

h1.highlight, h2.highlight, h3.highlight, h4.highlight, h5.highlight, h6.highlight
{ color:#b81c14 }

h2.main, .portfolio-page h1
{ font-style:italic; font-weight:bold; font-family: "Times New Roman", Times, serif }

/* Subpage Styling */
#sub h1, h2, h3, h4, h5, h6
{ color:#363646; margin:0 0 .9em; padding:0; font:normal 140%/1.2 Verdana, Arial, Helvetica, sans-serif }
#sub h2 
{ font-size: 230% }
#sub
{ font-size: 100% }


/* Lists */
ul
{ margin:0 0 1.4em; padding:0; list-style-type:none }
	ul li, ol li ul li
	{ margin:0 0 .7em; padding:0 0 0 17px; background:url("../images/bullet_plus.gif") no-repeat 0 .3em }
	ul ul
	{ margin:5px 0 2px 2px }

ol
{ margin:0 0 1.4em 33px; padding-left:0 }
	ol li, ul li ol li
	{ margin-bottom:.6em }

dl
{ margin:0 0 1.4em;}
	dt
	{ display:block; margin:1em 0 0; padding:0; font-weight:bold }
	dd
	{ margin:1px 0 0; padding:0 }


/* Forms */
form
{ margin:0; padding:0 }
input, select, textarea
{ font-family:verdana,arial,helvetica,sans-serif; color:#444; font-size:100%; vertical-align:middle }
textarea
{ width:99% }
label
{ vertical-align:middle }


/* Layout tables */
table
{ margin:0 0 1.1em; padding:0; border-width:0; border-collapse:collapse; border-spacing:0; empty-cells:show; table-layout:auto }
td
{ padding:0 6px 6px 0; vertical-align:top }


/* Data tables */
table.data
{ width:100%; margin-bottom:1.6em }

table.data caption
{ padding:0 0 5px; text-align:left; font-weight:bold; font-size:100% }
table.data th
{ padding:5px 7px; border:1px solid #fff; vertical-align:top; background-color:#999; color:#fff; text-align:left }
table.data td
{ padding:6px 7px; border:1px solid #fff; vertical-align:top }

/* Row gap */
table.data tr.break td
{ border-top:2em solid #fff }

/* Alternating row colors */
.even, .even td
{ background-color:#e5e5e5 }

/* Columns */

.four .cols, .four .first-child /* Four columns */
{ float:left; width:23.4%; margin:0 1% 0 0; padding-right:1%; border-right:1px dotted #d0d0d1 }
	.four .first-child
	{ margin-left:0 }
	.four .last-child
	{ margin-right:0; padding-right:0; border-right:none }

	* html .four .cols /* IE6 double-margin fix */
	{ display:inline }

/* --- Layout --- */

.hide, .hide *
{ position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden }
.clear
{ clear:both }

/* Footer */
#footer
{ color: #fff; padding: 0 25px; font-size: 13px }
#footer .floatleft 
{ background:url("/images/copyright.png") no-repeat scroll left -1px; height:27px; padding-left:64px; line-height:21px; }

/* Body wrappers */
body
{ margin:0; padding:0; background:#a31200 url(../images/back_body.jpg) repeat-x 50% 0 }

#wrappertop
{ width:1036px; margin:40px auto; padding-top:15px; background:url("../images/back_wrapper_top.png") no-repeat 50% 0 }
#wrapperbottom
{ padding-bottom:25px; background:url("../images/back_wrapper_bottom.png") no-repeat 50% 100% }
#wrapper
{ zoom:1; position:relative; padding:13px; background-color:#f5f5f5 }
	#wrapper:after /* Clear after floats */
	{ content:"."; display:block; height:0; clear:both; visibility:hidden }

	* html #wrappertop, * html #wrapperbottom /* IE6 PNG fix */
	{ background-image:none }


/* Inner frame backgrounds (to eventually be replaced with CSS3 border-image) */
#frame
{ background:url("../images/back_frame_middle.png") repeat-y; border:1px solid #fff }
#frametop
{ zoom:1; background:url("../images/back_frame_top.png") no-repeat }
#framebottom
{ background:url("../images/back_frame_bottom.png") no-repeat 0 100% }

.portfolio #framebottom
{ background:url("../images/back_frame_tallbottom.png") no-repeat 0 100% }



/* - Header - */
#header
{ zoom:1; position:relative; z-index:80; }
	#header:after /* Clear after floats */
	{ content:"."; display:block; height:0; clear:both; visibility:hidden }

#logo
{ position:absolute; z-index:90; left:45px; top:-14px }
#logo img
{ display:block }


/* Navigation */
#navigation
{ zoom:1; float:right; margin:0 8px 0 0; padding:0; list-style-type:none }
	#navigation:after /* Clear after floats */
	{ content:"."; display:block; height:0; clear:both; visibility:hidden }

#navigation li
{ float:left; margin:0 0 0 -1px; padding:0; background:url("../images/nav_sep.gif") no-repeat left 54% }
	#navigation li:first-child
	{ background: none }
	
#navigation li a /* Using sprites */
{ display: block; height:57px; margin:0 1px; padding:0 22px;  text-decoration:none; color:#363646; font-size: 16px; line-height:57px  }

	#navigation li.active, #navigation li#nav-contact.active, 
	#navigation li:hover, #navigation li#nav-contact:hover,
	#navigation li.hover, #navigation li#nav-contact.hover
	{ background:url("../images/nav_back.gif") repeat-x }

	#navigation li.active a, #navigation li a:hover,
	#navigation li.hover a
	{ margin:0; border:1px solid #ececec; border-width:0 1px; background-position:50% -57px }


/* - Content area - */

#contentwrapper
{ zoom:1; position:relative; z-index:1; min-height:588px; padding:30px 0 34px; border-top:1px solid #fff; 
  background:url("../images/back_content_top.png") no-repeat }
	#contentwrapper:after /* Clear after floats */
	{ content:"."; display:block; height:0; clear:both; visibility:hidden }
#contentwrapper.client { min-height: 0; padding:30px 15px 34px; }

#content
{ zoom:1; position:relative; z-index:90; margin:0 37px }
	#content:after /* Clear after floats */
	{ content:"."; display:block; height:0; clear:both; visibility:hidden }

/* Columns */
#home .columns
{ zoom:1; margin:0 0 1.2em }
	#home .columns:after /* Clear after floats */
	{ content:"."; display:block; height:0; clear:both; visibility:hidden }

#home .columns .col
{ float:left; width:47%; margin-right:3% }
	#home .columns .first-child
	{ margin-right:0; border-right:1px dotted #d0d0d1; padding-right:2.9% }
	#home .columns .last-child
	{ float:right; width:47%; margin-right:0 }

/* --- Social Icons --- */
#social .twitter, #social .facebook, #social .linkedin, #social .myspace
{background:url(../images/social-icons.jpg) no-repeat; height:33px; display: block; float: left; padding-left: 45px; line-height: 33px; margin: 0 30px }
	#social .facebook
	{ background-position: 0 -65px}
		#social .facebook:hover
		{ background-position: 0 -195px }
	#social .linkedin
	{ background-position: 0 -32px }
		#social .linkedin:hover
		{ background-position: 0 -162px }
	#social .twitter:hover
		{ background-position: 0 -130px }
	#social .myspace
	{ background-position: 0 -98px }
		#social .myspace:hover
		{ background-position: 0 -228px }

/* --- Homepage --- */

/* News list */
#newslist h2, #home #project .project-top
{ border-bottom:2px dotted #F0EFE6; padding-bottom:10px; margin:0 }
#newslist ul
{ padding: 0; margin-bottom: 20px; color: #0099ff }
#newslist li 
{ background: none; border-top:1px dashed #DFDFDF; padding:10px 0 0; }
#newslist li:first-child
{ border-top: none }
.morelink
{ background: #eee; display:block; font-family:times New Roman; font-size:20px; font-style:italic; font-weight:bold; padding:10px 0 10px 15px; width:285px; position:absolute; bottom: 0; color: #0099FF}
.morelink:hover
{text-decoration: none; background: #ddd }

#home hr, .who hr
{ background: url(../images/hr-home.gif) no-repeat; height:13px; position:relative; width:1007px; margin: 70px 0 30px -37px; border: none}

#home h2#creativity-fuels
{ background:url(../images/bg_creativity_fuels.png) no-repeat; text-indent: -9999px; height: 73px; width: 452px;}

#home .columns
{ margin-bottom:0 }
#home .columns .col
{ background-color:#fff; padding:4px }

#home .columns #newslist
{ border-right:none; width: 300px; height:347px }
/*{ border-top:1px dotted #aa0e07; padding-top:1.1em; border-right:none; font-size:92% }*/

.descrip
{ margin:25px 6px 0 6px; }
.descrip h3
{ color: #4c6c04; font-size:24px; font-style: italic; letter-spacing:-1px;}

#home #project
{ width: 605px; height:347px; margin-right:-20px;}
#home #project .project-top
{ position: relative; height: 31px;}
#home #project h2
{ width: 250px }
#home #project .morelink
{ width: 575px; float: left; margin-top: -33px; position: relative; background: #f1f1f1 }
#home #project img
{ float: right; margin:0 -10px 0 20px; z-index: 2;  position: relative;}

#home #project .nav
{ position: absolute; top: 0; right: 0; list-style: none}
#home #project #controller 
{ margin-right: 60px }
#home #project .nav li, .thumbNav a 
{ float: left; background: url(../images/slider-nav.gif) no-repeat; height: 15px; text-indent: -9999px; display: block; width:16px; margin-top: 12px; }
	#home #project .nav li:hover ,#home #project .nav li.jFlowSelected, .thumbNav a:hover, .thumbNav a.cur
	{ background-position: 0 -14px; cursor:pointer}
	
#home #project .nav .jFlowNext
{ background:url(../images/arrow-blue.gif) no-repeat; width: 38px; height: 36px; margin-top: 0;}
	#home #project .nav .jFlowNext:hover
	{ background-position: 0 -36px;}

/* --- What We Do --- */
.what #tab-wrapper
{ background: url(../images/bg-tab-wrapper.gif) no-repeat bottom; margin:30px 0 0 -25px; width:933px; }
.what .tabNavigation
{ margin-left: 15px }
.what .tabNavigation li
{ float: left;  padding: 0; margin: 0 .03em; height: 54px;}
.what .tabNavigation span
{ display: block; height: 50px;  }
	.what .tabNavigation .strategy
	{ background: #c62324 }
	.what .tabNavigation .creative
	{ background: #01baf2}
	.what .tabNavigation .content-support
	{ background: #8cc540}
	.what .tabNavigation .social
	{ background: #f0881e }
	.what .tabNavigation .dev
	{ background: #af006e }
	.what .tabNavigation .seo
	{ background: #c62324 }
	.what .tabNavigation span.selected
	{ background: #fff; height: 50px; border: 1px solid #333; border-bottom: 0; }
.what .tabNavigation li a
{ display: block; height: 54px; line-height: 50px; padding:0 15px; font-family: "Times New Roman", Times, serif; font-size: 24px; color: #fff; outline: none}
.what .tabNavigation li a.selected
{ background:url(../images/arrow-tab.png) no-repeat bottom; color: #000 }
.what .tabs
{ clear: both; margin-top: 20px; }
.what em.large
{ font-weight: normal }

.what .paper-list
{ float: right; height: 438px; width: 358px; background:url(../images/bg-paper-list.png) no-repeat; margin:-95px -40px 0 15px; padding:35px 0 0 50px; }
.what .paper-list-long
{ background:url(../images/bg-paper-list-long.png) no-repeat; height: 700px; margin:-95px 30px 0 15px; padding:35px 0 0 75px; width:285px; float: right}
#sub .paper-list h3, .what .paper-list-long h3
{ font-size: 170%; font-family: "Times New Roman", Times, serif; margin-bottom: 15px }
.what .paper-list ul, .what .paper-list-long ul
{ margin: 0; padding: 0; }
.what .paper-list li, .what .paper-list-long li, .green li
{ background: url(../images/bg-paper-list-li.gif) no-repeat; color: #67a318; font-style: italic; font-weight: bold; font-family: "Times New Roman", Times, serif; font-size: 120%; padding-left: 20px; margin: 5px 0 }
.green li
{ padding-left: 25px }

#strategy h2
{ background: url(../images/h2-strategy.jpg) no-repeat; height: 43px; text-indent: -9999px; width: 274px; margin: 30px 0 20px -23px; }
#creative h2
{ background: url(../images/h2-creative.jpg) no-repeat; height: 43px; text-indent: -9999px; width: 274px; margin: 30px 0 20px -23px; }
#content-support h2
{ background: url(../images/h2-content-support.jpg) no-repeat; height: 43px; text-indent: -9999px; width: 292px; margin: 30px 0 20px -23px; }
#social h2
{ background: url(../images/h2-social.jpg) no-repeat; height: 43px; text-indent: -9999px; width: 323px; margin: 30px 0 20px -23px; }
#development h2
{ background: url(../images/h2-development.jpg) no-repeat; height: 43px; text-indent: -9999px; width: 272px; margin: 30px 0 20px -23px; }
#seo h2
{ background: url(../images/h2-seo.jpg) no-repeat; height: 43px; text-indent: -9999px; width: 596px; margin: 30px 0 20px -23px; }
h2#client
{ background: url(../images/h2-login.jpg) no-repeat; height: 77px; text-indent: -9999px; width: 441px; }

.what #bottom p
{  margin-left: 285px; line-height: 1.3;  }
.what #bottom p.first
{ padding:20px 0 25px; font-size: 120%; background:url(../images/bottom-dash.gif) repeat-x bottom}
.what #bottom a
{ color:#0099ff}
.what #bottom img.iphone-android
{ float: left; margin-left:-15px; }
.what #bottom a.boxy
{ background: #f2f2f2; display:block; font-style:italic; height:70px; line-height:70px; text-align:center; width:500px; font-size: 32px;}
.what #bottom a.boxy:hover
{ text-decoration: none; background:#e3e3e3 }
.what #bottom img.i-a-logo
{ float: right; margin-top:7px; margin-right:30px; }

/* --- Contact --- */
.contact .plane 
{ float: right;margin-right:-30px; }

.contact .big a,.contact #social a
{ color:#0099ff }

.contact .big
{ font-family: "Times New Roman", Times, serif; font-size: 340%; margin: 0; color: #363646 }
	.contact .big em
	{ font-style: italic; font-weight: bold; }
.contact em.phone
{ background:url(../images/bg-phone.jpg) no-repeat; display:block; float:right; font-size:120%; line-height:67px; margin-right:165px; margin-top:6px; text-align:center; width:443px; }

.contact #social
{ margin-top: 25px }
.contact #social h2
{ font-family: "Times New Roman", Times, serif; font-size: 250% }



/* --- How We Do It --- */
.how h2.main
{ background:url(../images/h2-how.png) no-repeat; text-indent: -9999px; width: 403px; height: 43px; }
.how p.intro
{font-size: 110%; font-family: Verdana, Geneva, sans-serif; width: 90% }
.how #our-services
{ background: url(../images/bg-how-colors.png) no-repeat; height: 206px; width: 1006px; margin: -10px 0 -20px -36px }
.how #our-services a
{background: url(../images/how-services-btn.png) no-repeat; height: 84px; width: 333px; display: block; text-indent: -9999px; margin:35px 0 0 25px; float: left }
.how #our-services a:hover
{background-position: 0 -85px;  }

.how .cols
{ width: 22.8%; border: none; text-align: center; margin:0 5px;}
#sub.how .cols h2 
{ font-family: "Times New Roman", Times, serif; font-size: 180%; background:url(../images/bg-howcols-h2.png) no-repeat bottom; padding: 0 0 25px 10px; margin: 10px 0 5px; text-align: left }
.how .cols p
{ padding-left: 10px; text-align: left; font-size: 90% }

.how #bottom .location h2
{ font-style: italic; color: #4c6c04; font-weight: bold }
.how #bottom #p-manage a
{ color: #0099ff }

.how #social
{ float: right }
.how #social a
{ margin:0 3px; padding:0; text-indent:-9999px; width:32px; }

.how .tabnav
{ float: right }
.how .tabnav li
{ background: none; float: left; margin: 0 3px; padding: 0}
.how .tabnav a
{ background:url(../images/how-tabs.gif) no-repeat; display: block; height: 9px; width: 8px; text-indent: -9999px }
.how .tabnav a.selected, .how .tabnav a:hover
{ background-position: -8px 0 }
	
/* --- Who We Are --- */
.who hr
{ height: 5px; margin: 25px 0 }
.who #content
{ margin: 0 }
.who #management 
{ border-bottom: 1px dashed #d2cfb4; padding-bottom:25px; }
.who h2.main
{ background:url(../images/h2_management.png) no-repeat; height: 45px; width: 399px; text-indent: -9999px; display: block; margin:10px 0 10px 9px; }
.who p.intro
{ margin: 0 40px; margin-bottom: 0; font-family: Verdana, Geneva, sans-serif; font-size: 100% }
.who img.intro
{ margin: 35px 2px 0 0; float: right }

.who #management .col
{ width: 252px; float: left; margin: 0; background: url(../images/staff_hr.png) no-repeat center top }
.who #management .tag 
{ background:url(../images/staff_bracket.png) no-repeat center top; font-family: "Times New Roman", Times, serif; font-size: 200%; color: #363646; padding: 55px 0 25px 0; margin-top: 10px }
	.who #management .tag p
	{ line-height: 1; margin: 0 auto; width:212px;}
	.who #management .tag p.first
	{width:182px;}
.who #management .desc 
{ background:url(../images/staff_hr.png) no-repeat top center; margin: 0 20px; padding-top: 25px }
	.who #management .desc  h3
	{ font-family: "Times New Roman", Times, serif; color: #4c6c04; font-style: italic; font-size: 180%; margin-bottom: 5px }
	.who #management .desc p
	{ font-size: 90%; }
	
.who #support
{ margin: 15px 0 0 0 }
.who #support h2
{ font-family: "Times New Roman", Times, serif; font-style: italic; margin-left: 35px; font-size: 210% }
.who .organized
{ width: 930px; margin: 0 auto }
.who .organized h2
{ font-family: "Times New Roman", Times, serif; margin-bottom: 15px }

.who .img-project
{ margin: 0 auto 15px; width: 959px; height: 136px; display: block; background:url(../images/who_organized.jpg) no-repeat }
.who #project-manage .col
{ float: left; margin: 0 10px; width:232px;}
	.who #project-manage .col.last
	{ width: 482px; }
	.who #project-manage .col.last div
	{ background: #f2f2f2; height: 176px }
	.who #project-manage .col h3
	{ font-family: "Times New Roman", Times, serif; font-weight: bold; font-style: italic; font-size: 180%; margin: 0 0 25px 20px }
.who #project-manage .col ul
{ background: #f2f2f2; padding: 30px 15px 20px }
	.who #project-manage .col.last ul
	{ background: none; float: left }
	.who #project-manage .col ul li
	{ color: #67a318; font-size: 120%; font-style: italic; font-weight: bold; font-family: "Times New Roman", Times, serif; background:url(../images/bg-paper-list-li.gif) no-repeat; padding-left: 22px }

.who #bottom
{ margin: 0 20px }
.who #bottom #p-manage a
{ color: #0099ff }

/* --- News --- */
.news h2.main
{ background: url(../images/h2-news.jpg) no-repeat; display: block; text-indent: -9999px; height: 68px; width: 447px; margin-left: -20px; }
.news .hr 
{ width: 590px; margin-bottom: 35px }
.news #content
{ margin-left: 400px }
.news #news-art
{ background:url(../images/news_left.jpg) no-repeat; height: 701px; width: 354px; float: left;}
.news dd
{ height:50px; margin:0; padding:12px 0; width:600px; background:url(../images/news_list_border.gif) no-repeat bottom right}
.news dt
{ background: #bc2305; color: #fff; display:block; float:left; font-size:80%; height:47px; line-height:19px; margin-right:10px; padding-top:3px; text-align:center; width:35px; }
.news dt .day
{ font-size: 140%}
.news .morelink
{ width: 515px; text-align: right; padding-right: 65px; background: #eee url(../images/social-twitter.png) no-repeat 555px; position: relative; height: 35px; line-height: 35px  }
.news .morelink:hover
{ background: #ddd url(../images/social-twitter.png) no-repeat 555px }

/* --- Portfolio --- */
.portfolio-page .ipad-cap
{ clear:right;float:right;font-size:13px;position:relative; margin-top: 8px}
*:first-child+html .portfolio-page .ipad-cap
{width: 250px}
.portfolio-page .morelink 
{ width: 176px; position: relative }
.portfolio-page.ipad .morelink 
{ font-size:28px;margin-top:30px;padding:20px 0;position:relative;text-align:center;width:342px }
.portfolio-page #content
{ margin-left:21px; margin-right:27px }

.portfolio-page a.back
{float:right; font-size:80%; margin:-20px -5px 20px 0; color:#0099FF }
/* Description */
.portfolio-page #description
{ float:left; width:382px; margin-bottom:2em }
	* html .portfolio-page #description /* IE6 margin fix */
	{ margin-bottom:0 }
.portfolio-page #description h1
{ font-size: 208%; font-family: "Times New Roman", Times, serif }
.portfolio-page #description h4
{ font-size: 100%; color:#676767; }

#share
{float:left;margin-bottom:20px;margin-top:-20px; width: }
#share div
{background:#f2f2f2;padding:15px;}
#share .wrap 
{ height: 95px; width: 935px }
#share .btn-share
{ float:left; }
#share .fbook 
{ margin-top: 18px }

/* Links list */
.portfolio-page #links
{ margin-bottom:1.4em; border:2px solid #ededed; padding:2px 6px; font-size:11px; line-height:1.4 }
.portfolio-page #links a
{ zoom:1; position:relative; margin-right:1px; padding:2px 1px 2px 16px; background:url("../images/bullet_plus.gif") no-repeat 1px 50%; white-space:nowrap }

.portfolio-page #links a.pdf
{ padding-left:18px; background-image:url("../images/bullet_pdf.gif") }
.portfolio-page #links a.enlarge
{ padding-left:25px; background-image:url("../images/bullet_enlarge.gif") }


/* Services list */
.portfolio-page #services
{ font-size:70% }
.portfolio-page #services h2
{ display:none }

.portfolio-page #services li
{ zoom:1; display:inline; margin-right:9px; padding:2px 0 2px 17px; background:url("../images/bullet_check.gif") no-repeat 0 .2em; 
  line-height:1.1; white-space:nowrap; color:#b81c14 }

/*
lATEST pORTFOLIO
*/

#featuredprojects .portline
{ clear:both; border-style:none; width:914px; height:26px; background:url(../images/hr-portfolio.gif) no-repeat; margin:0 auto; padding:0; }

#featuredprojects .project
{ width:192px; float:left; margin:12px 24px; }

#featuredprojects .project img
{ margin:10px auto; display:block; }

#featuredprojects .project p
{ text-align:right; margin:0; padding:0; }
#featuredprojects .project p a
{ padding-left:17px; background:transparent url(../images/bullet_plus.gif) no-repeat scroll 0 0.3em; }

.projectwrap
{ display:block; width:192px; background:url(../images/bg_portlearnmore.gif) no-repeat; }

.projectwrapbtm
{ display:block; width:174px; padding:5px 18px 5px 0; background:url(../images/bg_portlearnmorebtm.gif) no-repeat bottom; }


/* - Image gallery - */
#sub.portfolio-page h2
{ color: #4c6c04; font-size:20px; font-style: italic; letter-spacing:-1px;}
#sub.portfolio-page h2.main
{ text-indent: -9999px; height: 45px; width: 409px; display: block; background:url(../images/h2-portfolio.png) no-repeat }
#sub.portfolio-page h1
{ font-size: 230%; color: #363646; font-style: italic; font-weight: bold }
.portfolio-page #gallery /* Non-JS */
{ float:right; width:517px; height:392px; overflow:hidden; margin:8px 0 2em; border:4px solid #ccc }

.portfolio-page #gallery-wrapper
{ position:relative; float:right; width:525px; margin:8px 0 2em; padding-bottom:59px; background:url(../images/back_gallery_shadow.jpg) no-repeat 50% 100% }
.portfolio-page #gallery-innerwrapper /* Scrolling area mask */
{ position:relative; z-index:10; height:392px; border:4px solid #ccc; overflow:hidden }

.portfolio-page #gallery-wrapper ul#gallery /* This is the scrolling area; Overwrite non-JS values */
{ position:absolute; top:0; left:0; width:9999px; overflow:visible; margin:0; padding:0; list-style-type:none;
  float:none; height:auto; border-width:0 }

.portfolio-page #gallery li
{ float:left; margin:0; padding:0; background-image:none }
.portfolio-page #gallery li img
{ display:block; width:517px; height:392px }


#gallery-caption
{ display:none; position:absolute; z-index:20; bottom:73px; left:14px; width:467px; margin:0; padding:10px; 
  background:url(../images/back_caption.png) repeat; color:#fff; line-height:1.2;
  -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px }

.portfolio-page #gallery-next
{ position:absolute; z-index:15; top:41%; right:-20px; padding:0 6px 6px 0; background:url(../images/arrow_shadow.png) no-repeat }
.portfolio-page #gallery-previous
{ position:absolute; z-index:15; top:41%; left:-14px; padding:0 6px 6px 0; background:url(../images/arrow_shadow.png) no-repeat }

	.portfolio-page #gallery-next img, .portfolio-page #gallery-previous img
	{ display:block; padding:3px 0 1px 2px; background-color:#b81c14; width:32px; height:30px }
	.portfolio-page #gallery-next img
	{ padding:3px 1px 1px }

	.portfolio-page #gallery-next:hover img, .portfolio-page #gallery-previous:hover img
	{ background-color:#09f }

#gallery.enlarge img /* Enlarge */
{ /* cursor:-moz-zoom-in */ }


/* - Other projects - */
#otherprojects
{ clear:both; background:url(../images/line_portfolio.gif) no-repeat 100% .1em; font-size: 0.75em/1.5em }
#otherprojects a
{ color: #0099FF }

#otherprojects h2
{ margin-bottom:.5em }
#otherprojects .cols
{width:22.8%; }
#otherprojects dt
{ font-weight:normal; line-height:1.3; padding:4px 8px 0 20px; background:url(../images/bullet_gray.gif) no-repeat 8px .75em }
#otherprojects dd
{ margin-top:0; font-size:92%; line-height:1.3; padding:0 8px 8px 20px }

#otherprojects dt.active, #otherprojects dd.active
{ background-color:#eee }



/* - Client list - */
#clientlist
{ position:relative; clear:both; background:url(../images/line_portfolio.gif) no-repeat 100% .1em }

#sub #clientlist h2
{ margin-bottom:.5em; font-size: 150% }

#clientlist h3
{ margin:.3em 0 .8em; color:#333; font-size:112%; font-family:"Times New Roman", Times, serif }

#clientlist ul
{ margin-bottom:.8em }
#clientlist ul+h3
{ margin-top:1.4em }

#clientlist li
{ margin-bottom:.4em; padding-left:12px; background:url(../images/bullet_gray.gif) no-repeat 0 .4em; 
  font-size:80%; line-height:1.2 }

/* Filter */
#clientlist #additional
{ position:absolute; top:4px; right:10px }
#clientlist #additional li
{ float:left; margin:0 4px 0 0; padding:0; background:none }
#clientlist #additional a
{ display:block; padding:3px 5px; background:url(../images/back_caption.png); color:#fff }

#clientlist #filter
{ margin:1.5em 0; padding:8px; background-color:#f2f2f2 }
	#clientlist #filter:after /* Clear after floats */
	{ content:"."; display:block; height:0; clear:both; visibility:hidden }


#clientlist #filter .col
{ border-right-width:0 }
#clientlist #filter ul
{ float:left; width:16.1%; margin:0 .5% 0 0; padding:0 }
#clientlist #filter li
{ background:none; margin:0 0 .3em; padding:0 }
#clientlist #filter a
{ padding-left:17px; background:url(../images/bullet_nocheck.gif) no-repeat 0 .2em; color:#a80905 }

#clientlist #filter a.on
{ background-image:url(../images/bullet_check.gif);}


/* --- Bottom area for subpages --- */
#bottom
{ background:url(../images/hr.jpg) no-repeat top; clear: both; font-size: 170%; font-family: "Times New Roman", Times, serif; margin: 10px 0 0 0; padding-top: 70px; font-size: 130%}
.what #bottom {padding-top: 50px }
#bottom #p-manage
{ margin: 0 320px 0 0; border-right: 1px dashed #dbd7c0; padding-right: 50px; height: 170px; font-size: 140%; line-height: 1.4 }
#bottom #p-manage a
{ color: #67a318 }
#bottom .location
{  float: right; background: #f2f2f2; padding: 10px; width: 275px }
	#bottom .location h2
	{ font-size: 120%; font-family: "Times New Roman", Times, serif }
	#bottom .location p
	{ font-size: 70%;width: 100%;font-family: Verdana, Geneva, sans-serif;  }

#home #project .mobilemego{margin: 40px 30px 45px 20px}



/* --- IPAD PORTFOLIO GALLERY --- */
.portfolio-page.ipad #gallery-innerwrapper 
{ height: 822px !important}
.portfolio-page.ipad #gallery-wrapper 
{ width:570px !important }
.portfolio-page.ipad #gallery li img 
{height: 822px !important; width: 570px !important} 
.portfolio-page.ipad #gallery-wrapper 
{ background: none !important }
.portfolio-page.ipad #description
{ width: 342px !important}

/*
    anythingSlider v1.2
    
    By Chris Coyier: http://css-tricks.com
    with major improvements by Doug Neiner: http://pixelgraphics.us/
    based on work by Remy Sharp: http://jqueryfordesigners.com/
*/
.anythingSlider                         { width: 570px; height: 822px; position: relative; margin: 0 auto 15px; float:right;}
.anythingSlider .wrapper                { width: 570px; overflow: auto; height: 822px; position: absolute; top: 20px; left: 0; }

                                        /* Width below is max for Opera */
.anythingSlider .wrapper ul             { width: 32700px; list-style: none; position: absolute; top: 0; left: 0; margin: 0; }
.anythingSlider .wrapper ul li          { display: block; float: left; padding: 0; height: 317px; width: 680px; margin: 0; }
.anythingSlider .arrow                  { display: none }

.thumbNav                               { position: relative; top: -20px; text-align: center; }
.thumbNav li                            { display: inline; background:none; margin: 0 5px; padding: 0 }
.thumbNav a                             { display: inline-block; float: none; overflow: hidden }

.start-stop {
	display: none
}

/*
  Prevents
*/
.anythingSlider .wrapper ul ul          { position: static; margin: 0; background: none; overflow: visible; width: auto; border: 0; }
.anythingSlider .wrapper ul ul li       { float: none; height: auto; width: auto; background: none; }