body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td { margin:0; padding:0; }
html { background: url(../images/myDream.png) no-repeat #f6f6f6; }
/*{ background: url(../images/bg_layout.png) #f6f6f6; }*/
li { list-style:none; }
h1,h2,h3,h4,h5,h6 { font-size:100%; }
/* render html5 elements as block */
header, footer, section, aside, nav, article { display: block; }
img, fieldset { border:none }
input,textarea,select { font:inherit inherit inherit; }
input,textarea,select { *font-size:100%; }  
body { font:13px/1.231 'pt sans', arial,helvetica,clean,sans-serif; *font-size:small; *font:x-small; }
select,input,button,textarea { font:99% arial,helvetica,clean,sans-serif; }
input { border: 1px solid #8F9494; height: 18px; padding: 3px; }
table { font-size:inherit; font:100%; width:100% }
pre,code,kbd,samp,tt { *font:108%/100% monospace; }
h1, h2, h3, h4, h5, h6 { font-family: 'Open Sans', 'pt sans', arial,helvetica,clean, sans-serif; font-weight:700 }
h1 { font-size:170%; font-weight:bold; }
h2 { font-size:160%; font-weight: normal; color: #cd1543; margin-bottom: 10px; }
h2 { font-size:120%; }
h3 { font-weight:bold; margin:10px 0; color:#666 }
h4 { font-weight:bold; }
h4 { font-weight:bold; }
h5 { font-size: 100%; font-weight: bold; margin-left: 20px; margin-top:10px }
a,input { color:#525252; text-decoration:none; outline:none }  
a:hover  { text-decoration:underline;}
a:hover, a:active { outline: none; color:#963509; }
a { color:#c54b14; text-decoration:none; -webkit-transition-duration: 400ms;
	-webkit-transition-property: color; -webkit-transition-timing-function: ease;
	-moz-transition-duration: 400ms; -moz-transition-property: color; -moz-transition-timing-function: ease;
	-o-transition-duration: 400ms; -o-transition-property: color; -o-transition-timing-function: ease; }
em { font-style:italic; }

h4 { margin-bottom:5px;  font-size:120.5%;
  text-shadow:-1px -1px 0 rgba(0,0,0,0.1); }


h5 {
font-size: 1em;
font-weight: bold;
margin: 0px;
}

p
{ padding-bottom:1em; max-width:900px }


::-moz-selection{ background: #eda200; color:#fff; text-shadow: none; }
::selection { background:#eda200; color:#fff; text-shadow: none; }
a:link { -webkit-tap-highlight-color: #eda200; }
/* Clear Fix
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; display:block;overflow:hidden;visibility:hidden;width:0;height:0;}*/
.clearboth, .clearfix {clear: both;}
.clearfix:before, .clearfix:after { content: ""; display: table; }

strong
{ font-weight:bold; }


table 
	{ 
	padding:2px; 
	margin:0; max-width:900px
	}
th 	
	{ 
	background:#ece9e9; 
	height:22px;  
	border:1px solid #ccc; 
	text-align:left; 
	padding:2px
	}
td	
	{ 
	border:1px solid #ccc; 
	border-top:none; 
	padding:2px
	}
.required { color:red}


	/* Text alignment */
	.txtlft { text-align:left; }
	.txtcen { text-align:center; }
	.txtrgt { text-align:right; }
	
	/* Floats */
	.fltlft { float:left; }
	.fltrgt { float:right; }
	.cl { clear:both; height:0px; font-size:0px; display:block; overflow:hidden; visibility:hidden;  }



	/* Margins ***/
	.margin-top {margin-top:-70px}
	
/*** layout ***/
#wrapper { width:960px; margin:0 auto}



/* Header */
header { height:60px; position:relative; left:0 top:0; width:100%; z-index:999}
header .logo_jojest {float:left; width:131px; padding:10px 10px 5px 20px; }
header .main_nav { float:left; margin:20px 50px; font-size:15px; font-weight:bold}
	   .main_nav ul {margin:0}
	   .main_nav ul li {display:inline; padding:0 2px}
	   .main_nav ul li a:hover {text-decoration:none}
	   
.top_address { width:130px; position:absolute; top:20px; right:0px; }
.top_address p { padding:0}


/* Page Nav
------------------------------------------------------- */

/* Example One */
#navigation { 
	margin-top:20px;
	list-style: none; 
	position: relative; 
}
#navigation li { 
	display: inline-block;
	
}
#navigation a { 
	color: #C54B14; 
	font-size: 16px; 
	float: left;
	padding: 5px; 
	text-decoration: none;
	
}

#magic-line { 
	position: absolute;
	bottom: 0px; 
	left: 0; 
	width: 100px; 
	height: 2px; 
	background: #C54B14;
	
}
/*.current_page_item a { 
	color: #000 !important; 
}*/
.ie6 #navigation li, .ie7 #navigation li { 
	display: inline; 
}
.ie6 #magic-line {
	bottom: -3px;
}






/* Slider */

/* BANNER */

#banner { 
	width:960px; 
	float:left; 
	/*background:url(../images/bg_banner.png) no-repeat bottom left; */
	padding-bottom:30px; 
	margin:-110px -94px 15px 0px;
	position:relative; 
	z-index:1;
	height:425px;
}
#banner #slider { 
	width:960px; /*1454*/
	float:left;
	margin: 0;
	position:relative;
	overflow:hidden;
}
#banner #slider #slides {
	/*margin:0 -100px 0 -123px;*/
}
#banner #slider .previous { 
	float:left; 
	position:absolute; 
	left:17px; 
	top:258px
}
#banner #slider .next { 
	float:right; 
	position:absolute; 
	right:17px; 
	top:258px
}
#banner #slider .slide1 { 
	width:960px;
	height:428px; 
	float:left; 
	background: url(../images/bg_slider1.png) no-repeat 0px 50px
}
#banner #slider .slide1 h2 { 
	line-height:.7em; 
	padding:175px 0 0 125px; 
}
#banner #slider .slide1 figure { 
	float:left; 
	position:absolute; 
	top:0; 
	left:0px
}
#banner #slider .slide1 h3 { 
	font-family:"PT Sans", Arial, Helvetica, sans-serif; 
	font-size:26px; 
	color:#000; 
	text-shadow:#909b9b 1px 1px 1px; 
	text-align:left; padding-left:160px;
	position:relative; 
	z-index:10; padding-top:10px
}
#banner #slider .slide1 h3 a:link,#banner #slider .slide1 h3 a:visited{ 
	color:#c60751; 
	text-decoration:none;
}
#banner #slider .slide2 { 
	width:960px;
	height:328px; 
	float:left; 
	background: url(../images/bg_slider2.png) no-repeat -50px 30px
}
#banner #slider .slide2 figure { 
	float:right; 
	padding-right:25px; 
	padding-top:15px; 
	
}
#banner #slider .slide2 aside { 
	width:390px; 
	float:left; 
	padding:348px 0 0 101px;
	height:100px
}
#banner #slider .slide2 aside h2 {
	
	font-size:40px;
	color:#000;
	text-transform:uppercase;
	text-shadow:#444 2px 0px 2px;
	line-height:.8em;
	padding:10px; 
	padding-bottom:12px;
	-moz-border-top-left-radius: 10px;
  	-webkit-border-top-left-radius: 10px;
  	border-top-left-radius: 10px;
	-moz-box-shadow: 2px 3px 0 #d88399;
  	-webkit-box-shadow: 2px 3px 0 #d88399;
  	box-shadow:  2px 3px 0 #d88399; 
	margin-bottom:0
}
#banner #slider .slide2 aside h2 a:link,#banner #slider .slide2 aside h2 a:visited{
	color:#000; 
	text-decoration:none;
}
#banner #slider .slide2 aside h2 span { 
	color:#343738;
	text-shadow:#FFF 2px 0px 2px;	
}
#banner #slider .slide2 aside h2 span a:link,#banner #slider .slide2 aside h2 span a:visited{
	color:#343738;
	text-decoration:none;
}
#banner #slider .slide2 aside h3 {
	font-family:"PT Sans", Georgia, Arial, Helvetica, sans-serif; 
	font-size:12px; 
	font-weight:bold; 
	color:#000;
	line-height:1.3em; 
	/*background-color:#6378a9; */
	padding:8px; 
	padding-right:0px; 
	-moz-border-bottom-left-radius: 10px;
  	-webkit-border-bottom-left-radius: 10px;
  	border-bottom-left-radius: 10px; 
	margin-top:0
}
#banner #slider aside.slide2 h3 span {
	font-family:"PT Sans", Georgia, Arial, Helvetica, sans-serif; 
	font-size:15px; 
}
#banner #slider .slide3 { 
	width:960px;
	height:328px; 
	float:left; 
	background: url(../images/nfc_hub.gif) no-repeat no-repeat 10px 120px
}
#banner #slider .slide3 aside { 
	width:330px; 
	float:left; 
	padding:160px 0 0 60px
}
#banner #slider .slide3 aside h2 {
	font-family:"PT Sans", Arial, Helvetica, sans-serif;
	font-size:30px;
	color:#000;
	text-transform:uppercase;
	text-shadow:#444 2px 0px 2px;
	line-height:.98em;
	padding-bottom:12px
}
#banner #slider .slide3 aside h2 span { 
	color:#00aeef; display:block
}
#banner #slider .slide3 aside h2 a:link,#banner #slider .slide3 aside h2 a:visited{ 
	color:#000;
	text-shadow:#000 2px 0px 2px;
	text-decoration:none;
}
#banner #slider .slide3 aside h2 span a:link,#banner #slider .slide3 aside h2 span a:visited{
	color:#60bcc5;
	text-decoration:none;
}
#banner #slider .slide3 figure { 
	float:left; 
	margin:98px 28px 0 130px
}
#banner #slider .slide3 h3 {
	width:130px;
	float:left;
	font-family:"PT Sans", Georgia, Arial, Helvetica, sans-serif;
	font-size:14px; 
	color:#FFFFFF;
	line-height:1.2em;
	padding-top:180px 
}
#banner .dots {
	float:right;
	position:relative;
	margin-top:15px;
	margin-bottom:-120px;
	padding-right:451px;
}
#banner .dots ul li {
	float:left;
	padding:0 2px;
	/*padding-left:9px*/
}
#banner .dots ul li a {
	width:12px;
	height:12px;
	float:left;
	background:url(../images/bg_dots2.png) no-repeat 0 0;
	text-indent:-9999px;	
}
#banner .dots ul li a:hover {
	background:url(../images/bg_dots2.png) no-repeat bottom left;
}
#banner .dots ul li a.cur {
	background:url(../images/bg_dots2.png) no-repeat bottom left;
}
#banner .dots .start-stop {display: none}


#banner #boy { 
	float:left; 
	position:absolute; 
	top:0; 
	left:146px;
}


/* BANNER - BOX WITH NEWS */

#banner #whitebar { 
	width:1231px; 
	height:97px; 
	float:left; 
	background:url(../images/bg_whitebar.png) no-repeat;	
}
#banner .news {
	float:left;
	padding-left:82px; position:relative
}
#banner .new {
	float: left;
}
#banner .news h3 { 
	width:60px; 
	height:47px; 
	float:left; 
	background:url(../images/bg_heading_news.gif) no-repeat;
	font-family:"SuomiHandScript", Arial, Helvetica, sans-serif; 
	font-size:30px; 
	color:#b1b2a4; 
	text-align: center; 
	padding-top:6px; 
	margin-top:22px;
	margin-left:6px;
}
#banner .news figure {
	float:left;
	margin-top:-20px;
	padding-left:0px;
	position:relative;
	width:131px;
}
#banner .news aside {
	width:465px;
	float:left;
	padding:20px 0 0 15px;
}

#banner .news aside h4, #banner .news aside h4 a {
	font-family:"FranklinGothicURWExtComD-Dem", Arial, Helvetica, sans-serif;
	font-size:27px;
	color:#403933;
	text-transform:uppercase;
	text-decoration: none;
	line-height:1.1em;
	filter: progid:DXImageTransform.Microsoft.
AlphaImageLoader(src=hIEfix.png,sizingMethod=crop);
    zoom: 1;
}
#banner .news aside h4 span, #banner .news aside h4 span a {
	color:#318a95;
	text-decoration: none;
}
#banner .buttons {
	float:left;
	padding:22px 0 0 0px; position:relative
}
#banner .buttons ul li {
	float:left
}
/* BANNER - CONTACT */

#banner .contact {
	width:160px;
	float:left;
	padding:22px 0 0 20px;
}
#banner .contact p {
	font-family:"FranklinGothicURWExtComD-Dem", Arial, Helvetica, sans-serif;
	font-size:34px;
	color:#78C0C7;
	text-transform:uppercase;
	text-align:center;
	line-height:.7em
}
#banner .contact p span { 
	font-size:20px
}
#banner .contact p a {
	font-size:28px;
	color:#403933;
	text-decoration:none
}
#banner .contact p a:hover {
	color:#403933;
	text-decoration:underline
}

/* main content */
#main-content { float:left; overflow:visible}

#main-content .prime_links_home {
  -webkit-box-shadow:0 3px 3px rgba(0,0,0,0.05);
  border:6px solid #ccc;
  background-color:#F2F2F3;
  color:#525252;
  overflow:hidden; 
  
  -moz-border-radius: 12px;
  -webkit-border-radius: 12px;
   border-radius: 12px; padding-bottom:20px }
 
.prime_links_home ul li {width:18%; display:inline; float:left; margin-left:10px; min-height:120px}
.prime_links_home ul li.column_process, .prime_links_home ul li.column_skills, .prime_links_home ul li.column_works { padding-left:120px; }
.prime_links_home ul li.column_process {background:url(../images/bg_process_home.png) no-repeat 0 10px}
.prime_links_home ul li.column_skills {background:url(../images/bg_skills_home.png) no-repeat 0 10px}
.prime_links_home ul li.column_works {background:url(../images/bg_works_home.png) no-repeat 0 10px}
.prime_links_home h3 {color:#EF4137; font-size:18px; margin-bottom:3px}

#main-content .social_links_home {
  overflow:hidden; 
  width:100%; padding-bottom:10px
}
.social_links_home ul li {float:left; width:30%; margin:0 10px 0 20px}
.social_links_home ul li h3 {color:#006838; font-size:16px}

.social_links_home .column_twitter { background:url(../images/twitter_logo.gif) right top no-repeat}
.social_links_home .column_flickr img {width:60px; height:60px; border:2px solid #ccc; margin-right:4px; -webkit-box-shadow:0 3px 3px rgba(3,0,0,0.05);}

#main-content .brands_worked {
  -webkit-box-shadow:0 5px 9px rgba(0,0,0,0.05);
  border:1px solid #ccc;
  background-color:#fff;
  color:#525252;
  overflow:hidden; 
  width:100%;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
   border-radius: 0px; margin: 20px 0; }      
 
.brands_worked h3 {padding-left:18px; font-size:16px; color:#1D75BC }  
.brands_worked ul {margin:10px 20px 10px 20px } 
.brands_worked ul li {float:left; padding-bottom:20px; margin-right:16px; overflow:hidden}
#main-content .prime_links_home, #main-content .social_links_home, #main-content .brands_worked { margin-bottom:2px; margin-top:5px}

/* Twitter tweets */
.twtr-hd, .twtr-ft, .twtr-user {display:none}
.twtr-tweet-wrap {padding-left:0 !important; padding-top:0 !important}
.twtr-timeline {height:60px !important; }

/* Flickr photo stream */

#flickr_badge_source_txt {padding:0; color:#666666;}
#flickr_badge_icon {display:block !important; margin:0 !important; border: 1px solid rgb(0, 0, 0) !important;}
#flickr_icon_td {padding:0 5px 0 0 !important;}
.flickr_badge_image {text-align:center !important;}
.flickr_badge_image img {border: 1px solid black !important;}
#flickr_www {display:block; padding:0 10px 0 10px !important; font-size: 11px !important; color:#3993ff !important;}
#flickr_badge_uber_wrapper a:hover,
#flickr_badge_uber_wrapper a:link,
#flickr_badge_uber_wrapper a:active,
#flickr_badge_uber_wrapper a:visited {text-decoration:none !important; background:inherit !important;color:#3993ff;}
#flickr_badge_wrapper {background-color:#ffffff;border: solid 1px #FFFFFF}
#flickr_badge_source {padding:0 !important; font-size: 11px !important; color:#666666 !important;}

/*-------------- BUTTONS ------------ */
.button {
	font-weight:bold;
	position: relative; 
	cursor: pointer; 
	text-decoration: none;
  	color:#8e8e8e;
  	font-size:11px; font-weight:bold;	background: #f8f8f8 url(../images/button-gradient.png) top left repeat-x;
  	display: inline-block;
  	padding: 8px 12px;
  	line-height: 1;
  	-moz-border-radius: 3px;
  	-webkit-border-radius: 3px;
  	border-radius: 3px;
  	-moz-box-shadow: 0 1px 0 #d2d2d2;
  	-webkit-box-shadow: 0 1px 0 #d2d2d2;
  	box-shadow:  0 1px 0 #d2d2d2;
  	border-top:1px solid #dcdcdc;
  	border-left:1px solid #d4d4d4;
  	border-right:1px solid #d6d6d6;
  	border-bottom:1px solid #bababa;
	}
.button:hover {
	background-position:bottom left; 
	text-decoration:none; 
	color:#777; 
	}
/* Navigation */

/* Footer */
footer { float:left; overflow:hidden; border:1px solid #ccc; margin-top:14px; margin-bottom:10px; padding:20px; padding-bottom:5px; display:block; clear:both; min-width:920px}

footer div.inner {
position: relative; width:100%;
min-height: 35px;
margin: 0 auto;
background: url(../images/dots.gif) 0 25px repeat-x;
}

footer div.inner .one, footer div.inner .two { width:45%; float:left}
footer div.inner .two, footer div.inner .two a {padding-top:30px; color:#006838;}
footer ul li {width:200px; float:left; margin-bottom:10px}
footer ul li strong { display: block; }
/* Home */


/* Inner Pages */
#content-container { width:960px; margin:0 auto; margin-top:60px; overflow:visible}
#content-container .content_grfx {position:relative; float:right; right:0px; z-index:999; margin-top:-60px; margin-bottom:18px }
#content-container h2 { font-size:40px; font-weight:bold; font-family: 'Open Sans', sans-serif; color:#6D6F71; font-weight: 700; margin:10px 20px 0px 20px; letter-spacing:-3px}
#content-container .content {overflow:visible; }
#content-container .content_left { width:600px; float:left; overflow:hidden;}
#content-container .content_left h3 { margin-left:20px;}

#content-container .content_left h5 {margin-left:20px; font-size:16px}
#content-container .content_left h6 {margin-left:20px; font-weight:normal}
#content-container .content_left p { padding-left:20px; padding-top:10px}
#content-container .content_left .prime_data { font-size:26px; color:#F7941E; font-weight:bold; background:url(../images/bg_inner_prime.png) top left no-repeat; padding:10px 20px;  line-height:24px}

#content-container .content_right { width:320px; float:right; overflow:visible;  border-left:none; border-right:none;margin-top:-78px}
#content-container .content_right .data {background: url(../images/curve_inside.png) no-repeat -3px 10px #fff; position:relative; left:-1px; overflow:visible; padding:10px; border-right:2px solid #D1D3D4 }
#content-container .content_right .data h3 { font-size:130%; padding-left:30px; background:url(../images/bg_subtitle.png) top left no-repeat; line-height:30px; margin-top:0}
#content-container .content_right .data li {line-height:16px; list-style:circle; margin-left:20px}
#content-container .content_right .data p{ margin-top:10px; margin-bottom:-5px; font-weight:800}
.shadow-main {
background: url(../images/shadow_bottom.png) no-repeat top left; 
height: 20px;
width: 640px; 
}


/* ---- WORKS --- */
#content-container h2 {font-size:30px; font-weight:bold; font-family: 'Open Sans', sans-serif; font-weight: 700; margin:10px 20px 0px 20px; letter-spacing:-3px; }

#content-container h2.works { font-weight:bold; font-family: 'Open Sans', sans-serif; font-weight: 700; margin:10px 20px 0px 20px; letter-spacing:-3px; }
#content-container h2.small { font-size:30px; font-weight:bold; font-family: 'Open Sans', sans-serif; color:#BF1E2D; font-weight: 700; margin:10px 20px 0px 20px; letter-spacing:-3px; }
#content-container h2.purple { color:#7F4098; }
#content-container h2.green { color:#006838; }
#content-container h2.blue { color:#2A3990; }
#content-container h2.red { color:#BF1E2D; }
#content-container h2.lightgreen { color:#8DC63F; }

.line-bottom { border-bottom:1px dashed #999; padding-bottom:0; margin-top:-7px; margin-left:20px; width:70%}

#content-container .content_right_works { width:600px; float:left; overflow:visible; padding-left:10px}
#content-container .content_right_works p { padding-left:10px; padding-top:10px; }
#content-container .content_right_works .prime_data { font-size:26px; font-weight:bold; background:url(../images/bg_inner_prime.png) top left no-repeat; padding:10px 20px;  line-height:24px; margin-top:-35px; }
#content-container .content_right_works .prime_data h3 { color:#000; font-size:30px; margin:0}
#content-container .content_right_works .prime_data h4 { color:#000; font-size:16px; }
#content-container .content_right_works .lightbox { border:4px solid #ccc; margin-left:10px; background:#FFFFFF; margin-top:-10px; margin-bottom:20px}
#content-container .content_right_works span.subtitle{ font-size:22px; font-weight:bold; letter-spacing:-1px; background:url(../images/arrow_subtitles.png) top right no-repeat; padding-right:60px; color:#F7941E}

#content-container .content_right_works div.project_details { margin-left:10px}
#content-container .content_right_works h4 {}

/* Left Navigation - Case Studies*/
#content-container .content_left_works {float:left; width:240px; overflow:visible; margin:40px 0px 0 10px}
#content-container .content_left_works .left-nav {position:relative; left:-1px; overflow:visible; padding:10px; }
#content-container .content_left_works .left-nav ul li { border-bottom:1px dashed #939598; font-size:20px; font-weight:bold; padding: 5px; letter-spacing:-1px; width:100%}
#content-container .content_left_works .left-nav ul li a:hover { text-decoration:none}
#content-container .content_left_works .left-nav ul li.current {  border-bottom:none; background: url(../images/left_nav_arrow.png) no-repeat right center; color:#fff; margin-top:-1px}
#content-container .content_left_works .left-nav ul li.current a {color:#fff; }
#content-container .content_left_works .left-nav ul li.current a:hover {text-decoration:none}
.no-border {border:none !important}
#content-container .content_left_works .left-nav h3 { font-size:130%; padding-left:30px; background:url(../images/bg_subtitle.png) top left no-repeat ; line-height:30px; margin-top:0}
#content-container .content_left_works .left-nav p{ margin-top:10px; margin-bottom:-5px; font-weight:800}

/* Contact Adress */
.recentArticlesInnerStyle, .contactAddress {
margin-bottom: 10px;
padding: 10px;
padding-bottom: 20px;
}
.contactAddress h5 { margin-left:0 !important; margin-bottom:10px}

.contactAddressPhone {  padding-top:5px; width:120px; float:left; margin-left:10px }
.contactAddressHome {  padding-top:5px; width:160px; float:left; margin-left:20px}
.contactSocial {  padding-top:5px; width:200px; float:left; margin-left:20px}
.contactSocial ul { margin-top:10px}
.contactSocial li { float:left; width:40px}



/* Contact 
####################################################*/
.contactAddress { margin-top:10px ; }

.contactAddress p {
margin: 0px;
margin-bottom: 2px;
margin-top: 0px;
line-height: 0px !important;
padding-left: 0px !important;
padding-top: 0px !important;
}

.border-contact { border-top:2px dashed #BF1E2D}
.border-right { border-right:2px dashed #BF1E2D}

.resume_panel { margin-top:40px}

.getInTouchWithMe {width:100%; margin:0px; margin-left:0px; padding-bottom:15px;}
.getInTouchWithMe .label { width:100px !important; float:left; margin-left:20px; height:30px }
.getInTouchWithMe .input { height:30px}
.getInTouchWithMe .input input { width:295px}