
* html {
	margin: 0;
	padding: 0;
}

/* Page Structure */

body, html {
	background: #000;
	height: 100%;
	text-align: center;
	font-family: 'Trebuchet MS', Helvetica, Arial, sans-serif;
}

#container {
	position: relative;
	width: 900px;
	height: 100%;
	min-height: 819px;
	margin: 40px auto 0 auto;
	text-align: left;
	background: #000;
	clear: both;
}

#left {
	width: 80px;
	float: left;
	height: 100%;
	min-height: 819px;
	background: #000 url(../images/bg-left.jpg) no-repeat;
}

#right {
	width: 80px;
	float: right;
	height: 100%;
	min-height: 819px;
	background: #000 url(../images/bg-right.jpg) no-repeat;
}

.page {
	position: relative;
	width: 740px;
	float: left;
	margin: 0 auto;
	text-align: center;
	background: #ededee;
	padding-bottom: 40px;
	min-height: 96%;
}

.alignleft { float: left; }
.alignright { float: right; }
.small { font-size: 12px; line-height: 18px; }
.left { text-align: left; margin: 0 auto; }
.right { text-align: right; margin: 0 auto; }
.packed { line-height: 75%; color: #777; }
.bold { font-weight: bold; }
.blue { color: #3e71af; }

/* Header */

#header {
	width: 725px;
	height: 96px;
	padding: 10px 0 0 15px;
	background: url(../images/header-bg.gif);
}

h1#title {
	background-image: url(../images/logo.gif);
	height: 68px;
	padding-top: 68px;
	width: 268px;
	overflow: hidden;
	margin: 0 0 0 -15px;
	float: left;
}

h2#pagetitle {
	font-size: 24px;
	font-weight: bold;
	color: #65b30c;
	float: right;
	position: relative;
	margin: 30px 0 0 0;
	right: 33px;
	border-bottom: 1px solid #ccc;
}

#home h2#pagetitle { visibility: hidden; }

img#topleft {
	position: relative;
	float: left;
	display: block;
	top: -10px;
	left: -15px;
}

a img#plantr { 
	position: absolute;
	right: 30px;
	top: 40px;
	}


#menu {
	float: right;
	height: 30px;
	width: 725px;
	margin-top: -79px;
	z-index: 100;
}

#menu ul {
	margin: 0;
}

#menu li {
	background: url(../images/menu-btn.gif) no-repeat;
	width: 100px;
	height: 29px;
	color: #7bd852;
	text-align: center;
	list-style: none;
	margin: 0 0 0 6px;
	float: right;
	font-size: 12px;
}

#menu ul li a:link, #menu ul li a:visited {
	padding: 6px 0 0 0;
	display: block;
	text-decoration: none;
	color: #7bd852;
	width: 100px;
	height: 29px;
	font-weight: bold;
}

#menu ul li a:hover { 
	padding: 6px 0 0 0;
	display: block;
	text-decoration: none;
	width: 100px;
	height: 29px;
	font-weight: bold;
	color: #ccff42;
}

#menu li em { color: #F47d1c; }


/* Feature */

#feature-upper {
	width: 700px;
	height: 206px;
	margin: 0 auto;
	text-align: left;
}

#feature-left {
	background: url(../images/feature-left.jpg);
	width: 446px;
	height: 206px;
	font-size: 13px;
	line-height: 23px;
	overflow: hidden;
	float: left;
}

#feature-left h2, #feature-left p { margin: 10px 30px 0 35px; }

#feature-left h1 {
	margin: 30px 0 0 35px;
	font-weight: bold;
}

#feature-left h2 { font-weight: bold; }

#feature-right {
	height: 206px;
	width: 252px;
	float: left;
	text-align: left;
	line-height: 1px;
}

img.go {
	top: 3px;
	position: relative;
}

#portfolio {
	border-left: 1px solid #333;
}

img#portfolio-below {
	position: relative;
	display: inline;
		}

#feature-lower {
	width: 700px;
	height: 155px;
	margin: 0 auto;
	padding: 0;
		background: url(../images/feature-lower-bg.jpg) -3px 0px;
	text-align: left;
}

#web #feature-lower { background: url(../images/web-lower.jpg) -3px 0px; }
#graphics #feature-lower { background: url(../images/graphics-lower.jpg) -3px 0px; }
#development #feature-lower { background: url(../images/dev-lower.jpg) -3px 0px; }

div#convince {
	display: block;
	width: 295px;
	height: 50px;
	position: absolute;
	right: 20px;
	text-align: left;
	line-height: 16px;
	font-weight: bold;
	font-size: 16px;
	margin: 5px 0 0 0;
}

div#convince em {
	color: #65b30c;
	font-style: normal;
}

div#convince ol li em {
	color: #1564ad;
	font-style: normal;
}

div#convince ol li { padding: 0 0 0 30px; line-height: 23px; }

#web div#convince ol li, #graphics div#convince ol li, #development div#convince ol li { padding: 0 0 0 5px; line-height: 23px; list-style: none; background:  none; }

li.one { background: url(../images/1.gif) no-repeat; }
li.two { background: url(../images/2.gif) no-repeat; }
li.three { background: url(../images/3.gif) no-repeat; }

#web li.one, #web li.two, #web li.three, #graphics li.one, #graphics li.two, #graphics li.three, #development li.one, #development li.two, #development li.three { list-style: none; background: none; }

#feature-lower ol li {
	list-style: none;
	margin: 4px 0 0 -35px;
	font-size: 14px;
}

img#tmm {
	margin: 0;
	position: relative;
	bottom: 13px;
	right: 19px;
	display: block;
	float: right;
	border: 0;
}

/* Main Content */

#content {
	width: 699px;
	margin: 10px auto 0 auto;
	text-align: left;
	background: #ededee;
}

#content-left {
	width: 319px;
	font-size: 13px;
	line-height: 23px;
	float: left;
	margin: 0 16px 0 8px;
	padding: 0 19px 0 0;
	border-right: 1px dotted #ccc;
}

#content-right {
	width: 320px;
	float: right;
	text-align: left;
	font-size: 13px;
	line-height: 23px;
	margin: 0 8px 0 0px;
}

#content p { text-align: justify; }

#content em { 
	color: #1564ad;
	font-weight: bold;
	font-style: normal;
}


/* Text Styles */

h1 {
	font-size: 22px;
	font-weight: normal;
	color: #333;
	line-height: 14px;
}

h2 {
	font-size: 14px;
	font-weight: normal;
	color: #1564ad;
}

h3, h3 a:link, h3 a:hover, h3 a:visited {
	color: #65b30c;
	font-size: 20px;
	margin: 0 0 -6px 0;
	text-decoration: none;
	border-bottom: 1px solid #ccc;
}

h3.noborder { 
	border: 0; 
	margin: 0 0 16px 0; 
}

h4 {
	color: #1564ad;
	font-weight: bold;
	font-size: 16px;
	margin: 14px 0 -6px 0;
}

strong.green { color: #65b30c; }
strong.pink { color: #e23f8d; }


/* Footer */

#footer {
	clear: both;
	background: #ededee url(../images/footer-bg.jpg) center bottom repeat-x;
	width: 740px;
	height: 40px;
	margin: -40px auto 0 auto;
	position: relative;
	color: #ccff42;
	font-size: 10px;
	line-height: 10px;
			}

#footer a:link, #footer a:hover, #footer a:visited {
	color: #ccff42;
	text-decoration: none;
}


#footer p {
	position: relative;
	margin: 18px 20px;
	
}

/* Manifesto */

#manifesto-container {
	width: 490px;
	height: 635px;
	margin: -20px auto -10px auto;
	background: url(../images/manifesto.jpg) no-repeat;
	text-align: left;
	padding: 115px 40px 0 70px;
	font-size: 12px;
	color: #444;
	font-family: "Futura", "Futura Medium", "Trebuchet MS", Helvetica, sans-serif;
}

#manifesto-container p {
	margin: 10px 0 18px 20px;
	line-height: 18px;
}

#manifesto-container h3 {
	color: #444;
	font-size: 16px;
	border: 0;
	font-weight: normal;
}

h3 strong {
	color: #65b30c;
	font-weight: normal;
}

h3.bigger { 
	color: #444;
	font-size: 30px;
	border: 0;
	font-weight: normal;
	margin: 0 0 10px 0;
}

#manifesto strong { color:#65b30c; }

#manifesto { color: #333; 
	margin: 0 0 -30px 0;
}

#manifesto p a:link, #manifesto p a:visited {
	color: #65b30c;
	text-decoration: none;
	border-bottom: 1px dotted #ccc;
}

#manifesto p a:hover { color: #65b30c; }


/* Say Hello */

#hello-container {
	width: 525px;
	color: #333;
	margin: 0 auto;
	text-align: left;
	font-family: "Futura", "Futura Medium", "Trebuchet MS", Helvetica, sans-serif;
}

#hello-container a { text-decoration: none; }
#hello-container a span { color: #333; }


#hello-container .medium {
	width: 250px;
	height: 120px;
	border: 1px solid #ddd;
	margin: 0 0 50px 0;
}
#hello-container h3 {
	color: #444;
	font-size: 16px;
	border: 0;
	font-weight: normal;
}

#hello .medium h3 { 
	border: 0;
	color: #65b30c;
	font-size: 24px;
	text-align: right;
	font-weight: normal;
	text-decoration: underline;
}

#hello strong { color:#65b30c; font-weight: normal; }
#hello .medium span { text-align: right; display: block; font-size: 16px; }

#hello #telegram { float: right; background: url(../images/telegram.png) no-repeat; }
#hello #email { float: left; background: url(../images/email.png) no-repeat; }
#hello #phone { float: right; background: url(../images/telephone.png) no-repeat; }
#hello #skype { float: left; background: url(../images/skype.jpg) no-repeat; }

#hello #email h3 { margin: 10px 38px 0 0; }
#hello #phone h3 { margin: 10px 23px 0 0; }
#hello #skype h3 { margin: 10px 50px 0 0; }
#hello #telegram h3 { margin: 10px 29px 0 0; }

#hello #email span { margin: 45px 18px 0 0; }
#hello #phone span { margin: 15px 18px 0 0; }
#hello #skype span { margin: 40px 55px 0 0; }
#hello #telegram span { margin: 15px 18px 0 0; font-size: 12px;}

#hello p a:link, #hello p a:visited {
	color: #65b30c;
	text-decoration: none;
	border-bottom: 1px dotted #ccc;
}

#hello p a:hover { color: #65b30c; }

#contact form { 
	text-align: left;
	display: block;
	margin: 0 auto;
	width: 465px;
	padding: 10px 30px;
	background: #fbfbfb;
	clear: both; 
	top: 15px;
	position: relative;
	border: 1px solid #ddd;
}

#contact form input.text { 
	text-align: left;
	width: 200px;
	float: right;
}

#contact form label {
	float: left;
	clear: both;
	margin-bottom: 20px; 
	width: 150px;
}

#contact form textarea {
	width: 460px;
	height: 200px;
}


/* Miscellaneous */

a img { border: none; }
.center { margin: 10px auto 30px auto; display: block; }
.border { border-bottom: 1px dotted #ddd !important; }
.iframe { border: 2px solid #333; width: 400px; height: 200px; overflow: hidden; }
.clear { clear: both; }
img.pngfix { behavior: url(/includes/iepngfix.htc); }

/* Magic */

.ir {
	background: no-repeat 0 0;
	display: block;
	height/**/:/**/ 0 !important;
	overflow: hidden;
	color: #fff;
	font-size: 1px;
}

#portfolio
{
	width: 252px;
	height: 194px;
	display: none;
	padding: 0;
	margin: 0;
	line-height: 0px;
}

/* Portfolio Styles */

#kwicks_container_web, #kwicks_container_graphics, #kwicks_container_development { 
	margin: 0 auto;
	padding: 0;
	text-align: left;
	width: 640px;
	height: 400px;
	overflow: hidden;
	vertical-align: top;
}

#kwicks_container_web { background: #181818 url(../images/portfolio/web-portfolio.jpg) no-repeat 200px top; }
#kwicks_container_graphics { background: #181818 url(../images/portfolio/graphics-portfolio.jpg) no-repeat 200px top; }
#kwicks_container_development { background: #181818 url(../images/portfolio/development-portfolio.jpg) no-repeat 200px top; }


#kwicks .kwick {
	float: left;
	display: block;
	width: 40px;
	height: 410px;
	text-align: left;
	overflow: hidden;
	padding: 0;
}

#kwicks .left {
	margin: -16px 0 0 -40px;
	_margin: 0 0 0 -20px;
}

#kwicks .center {
	margin: -16px 0 0 0; 
	_margin: 0;
}

*:first-child+html #kwicks .left { margin: 0 0 0 -40px; }
*:first-child+html #kwicks .center, *:first-child+html #kwicks .right, { margin: 0; }

#kwicks .right {
	margin: -16px -40px 0 0;
	_margin: 0;
}

.kwick span {
	width: 440px;
	height: 400px;
	display: block;
	margin: 0 0 0 40px;
}

.kwick span img a { border: 0; }


/* Portfolio - Web */

#belmont { background:url(../images/portfolio/belmont-slice.jpg) no-repeat left top; }
#belmont span { background: #181818 url(../images/portfolio/belmont-image.jpg) no-repeat center center; }

#sunagocd { background: url(../images/portfolio/sunagocd-slice.jpg) no-repeat; }
#sunagocd span { background: #181818 url(../images/portfolio/sunagocd-image.jpg) no-repeat center center; }

#adventconspiracy { background: url(../images/portfolio/ac-slice.jpg) no-repeat; }
#adventconspiracy span { background: #181818 url(../images/portfolio/ac-image.jpg) no-repeat center center; }

#bandtogether { background: url(../images/portfolio/bt-slice.jpg) no-repeat; }
#bandtogether span { background: #181818 url(../images/portfolio/bt-image.jpg) no-repeat center center; }

#connexion { background: url(../images/portfolio/cxn-slice.jpg) no-repeat; }
#connexion span { background: #181818 url(../images/portfolio/cxn-image.jpg) no-repeat center center; }


/* Portfolio - Web Development */

#belmontdev { background:url(../images/portfolio/belmontdev-slice.jpg) no-repeat left top; }
#belmontdev span { background: #181818 url(../images/portfolio/belmont-image.jpg) no-repeat center center; }

#wknike { background: url(../images/portfolio/wknike-slice.jpg) no-repeat left top; }
#wknike span { background: #181818 url(../images/portfolio/wknike-image.jpg) no-repeat center center; }

#sunagodev { background: url(../images/portfolio/sunago-slice-flat.jpg) no-repeat; }
#sunagodev span { background: #181818 url(../images/portfolio/sunagocd-image.jpg) no-repeat center center; }

#nickandjosh { background:url(../images/portfolio/nickandjosh-slice.jpg) no-repeat left top; }
#nickandjosh span { background: #181818 url(../images/portfolio/nickandjosh.jpg) no-repeat center center; }

#twittershare-portfolio { background:url(../images/portfolio/twittershare-slice.jpg) no-repeat left top; }
#twittershare-portfolio span { background: #181818 url(../images/portfolio/twittershare-image.jpg) no-repeat center center; }


/* Portfolio - Graphic Design */

#imago { background:url(../images/portfolio/ss-slice.jpg) no-repeat left top; }
#imago span { background: #181818 url(../images/portfolio/ss-image.jpg) no-repeat center center; }

#jambonanzaranny { background:url(../images/portfolio/jambonanzaranny-slice.jpg) no-repeat left top; }
#jambonanzaranny span { background: #181818 url(../images/portfolio/jambonanzaranny-image.jpg) no-repeat center center; }

#connexion-design { background:url(../images/portfolio/cxn-design-slice.jpg) no-repeat left top; }
#connexion-design span { background: #181818 url(../images/portfolio/connexion-design-image.jpg) no-repeat center center; }

#renovo { background:url(../images/portfolio/renovo-slice.jpg) no-repeat left top; }
#renovo span { background: #181818 url(../images/portfolio/renovo-image.jpg) no-repeat center center; }

#ylife { background:url(../images/portfolio/ylife-slice.jpg) no-repeat left top; }
#ylife span { background: #181818 url(../images/portfolio/ylife-image.jpg) no-repeat center center; }


/* Plantr */

#plantr-container {
	width: 525px;
	color: #333;
	margin: 0 auto;
	text-align: left;
	font-family: "Futura", "Futura Medium", "Trebuchet MS", Helvetica, sans-serif;
}

#plantr-container a { text-decoration: none; }
#plantr-container a span { color: #333; }


#plantr-container .medium {
	width: 250px;
	height: 120px;
	border: 1px solid #ddd;
	margin: 0 0 50px 0;
}

#plantr-container h3 {
	color: #444;
	font-size: 16px;
	border: 0;
	font-weight: normal;
}

#plantr p { line-height: 26px;}

#plantr strong { color:#65b30c; font-weight: normal; }
#plantr .medium span { text-align: right; display: block; font-size: 16px; }

#plantr p a:link, #hello p a:visited {
	color: #65b30c;
	text-decoration: none;
	border-bottom: 1px dotted #ccc;
}

#plantr p a:hover { color: #65b30c; }

#plantr .code { 
	width: 320px;
	overflow: auto;
	font-size: 10px;
	line-height: 12px;
	text-align: left;
}

#sunago a:link, #sunago a:hover, #sunago a:visited { color: #65b30c; }