
body {
	background:#8aa2a5;
	color:#222a30;
	font-size:12px;
	line-height:20px;
	margin:0px;
	font-family:Arial, Helvetica, sans-serif;
}
#box {
	width:653px;
	background:#fff;
	padding:0 9px;
	margin:0px auto;
	position:relative;
	z-index:2;
	min-height:0;
}
#contactform input {
font-size:11px;
	line-height:15px;
	font-family:Arial, Helvetica, sans-serif;
}
#contactform {
margin-left:15px; 
margin-top:25px;
font-family: "Futura Medium", Arial, Helvetica, sans-serif;
font-size:14px;
}
#contactforminner {
font-size:11px;
	line-height:15px;
	font-family:Arial, Helvetica, sans-serif;
}

#header, #footer {
	width:882px;
	background:#fff;
	padding:0px 9px;
	margin:7px auto;
	z-index:2;
}
#fullpage {
	width:882px;
	background:#fff;
	padding:0px 9px;
	margin:0px auto;
	z-index:2;
}
br {
	line-height:5px;
}
#send {
	width:400px;
	background:#fff;
	padding:0 9px;
	margin:7px auto;
	z-index:2;
}
#sidebar-top {
height:7px;
background-image:url(/images/sidebar-top.gif);
background-repeat:no-repeat;
background-position:left;
}
#content-top {
height:7px;
background-image:url(/images/content-top.gif);
background-repeat:no-repeat;
}
#sidebar-bottom{
height:7px;
background-image:url(/images/sidebar-bottom.gif);
background-repeat:no-repeat;
background-position:left;
}
#content-bottom {
height:7px;
background-image:url(/images/content-bottom.gif);
background-repeat:no-repeat;

}
#sidebarcontent {
	width:204px;
	background:#fff;
	padding:0 9px;
	margin:0px auto;
	z-index:2;
	float:left;
}
#sideback {
	background-image:url(/images/sidebarbottom.gif);
	background-repeat:no-repeat;
	background-position:bottom left;
}
#top, #base {
	margin:-7px -9px 0px -9px;
	background-image:url(/images/corners-white-topleft.png);
	background-repeat:no-repeat;
	background-position:left;
	height:7px;
	position:relative;
	font-size:7px;
	z-index:3;
}
#base {
	padding-top:7px;
	background-image:url(/images/corners-white-bottomleft.png);
	background-repeat:no-repeat;
	background-position:left bottom;
}
#top span {
	background-image:url(/images/corners-white-topright.png);
	background-repeat:no-repeat;
	background-position:right;
	display:block;
	height:7px;
}
#base span {
	padding-top:7px;
	background-image:url(/images/corners-white-bottomright.png);
	background-repeat:no-repeat;
	background-position:right;
	display:block;
}
#sectioncontent {
	width:632px;
	background:#8aa2a5;
	padding:0 9px;
	margin:0px auto;
 =margin:0px auto 8px auto;
	z-index:2;
	float:left;
}
#sectioncontentportfolio {
	width:864px;
	background:#8aa2a5;
	padding:0 9px;
	margin:0px auto;
 =margin:0px auto 8px auto;
	z-index:2;
	float:left;
}
#sendfriend {
	width:372px;
	background:#8aa2a5;
	padding:0 9px;
	margin:0px auto;
 =margin:0px auto 8px auto;
	z-index:2;
	float:left;
}
#sendfriend h1 {
	color:#FFFFFF;
	margin:0px;
}
#impact {
	margin:8px 0px;
}
#topblue, #baseblue {
	margin:-7px -9px 0px -9px;
	background-image:url(/images/corners-blue-topleft.png);
	background-repeat:no-repeat;
	background-position:left;
	height:7px;
	position:relative;
	font-size:7px;
	z-index:3;
}
#baseblue {
	background-image:url(/images/corners-blue-bottomleft.png);
	background-repeat:no-repeat;
	background-position:left;
}
#topblue span {
	background-image:url(/images/corners-blue-topright.png);
	background-repeat:no-repeat;
	background-position:right;
	display:block;
	height:7px;
}
#baseblue span {
	background-image:url(/images/corners-blue-bottomright.png);
	background-repeat:no-repeat;
	background-position:right;
	display:block;
	height:7px;
}
#contentblue {
	margin:0px;
	padding:7px 0;
	width:100%;
	background:#8aa2a5;
}
#content {
	margin:0px;
	padding:7px 0 0 0;
	width:100%;
	background:#fff;
}
#container {
	width:900px;
	margin: 0px auto;
}
#sidebar {
	width:222px;
	background-image:url(/images/sidebar-bottom-element.gif);
	background-repeat:no-repeat;
	background-position:bottom left;
	padding-bottom:120px;
	background-color:#FFFFFF;
}
.middivider {
width:7px;
}
#maincontent {
	width:650px;
	background-color:#FFFFFF;
	padding:0px 10px;
}
p {
	padding:5px;
	margin:0px 0px 10px 0px;
}
a {
	color:#fe7302;
	text-decoration:none;
}
#sidebar a:hover, #maincontent a:hover, #footer a:hover, #homecontent a:hover {
	/*text-decoration:underline;*/
color:#329ba8;
}
h1 {
	color:#329ba8;
	font-size:16px;
	margin:25px 0px 0px 0px;
	padding:0px 5px;
	text-transform:capitalize;
	font-family: "Futura Medium", Arial, Helvetica, sans-serif;
}
h2 {
	color:#455560;
	font-size:14px;
	font-weight:bold;
	margin:0px;
	padding:5px 5px 5px 5px;
	text-transform:capitalize;
	font-family: "Futura Medium", Arial, Helvetica, sans-serif;
}
h2 a {
padding-top:0px;
}

h3 {
	color:#455560;
	font-size:14px;
	font-weight:bold;
	margin:0px;
	padding:25px 5px 5px 5px;
	text-transform:capitalize;
	font-family: "Futura Medium", Arial, Helvetica, sans-serif;
}
#imageright {
	margin:10px 0px 10px 10px;
	float:right;
}
#footer a {
	display:block;
	font-size:10px;
	line-height:16px;
}
#footer p {
	color:#455560;
	font-size:10px;
	margin:0px;
	padding:0px;
	line-height:16px;
}
#footer h1 {
	font-size:11px;
	padding:0px;
	margin:0px;
}
#footer td {
	padding-left:25px;
	text-align:left;
}
#footer table {
	margin-bottom:5px;
}
#sidebar h3 {
	font-size:14px;
	padding:0px;
	margin:20px 0px 0px 10px;
	color:#329ba8;
}
#blogsidebar h2 {
	font-size:14px;
	padding:0px;
	margin:20px 0px 0px 10px;
	color:#329ba8;
}
#blogsidebar li {
list-style-type:none;
}
#blogsidebar li li {
	list-style-type:disc;
}
.hidden {
font-size:14px;
	padding:0px;
	margin:20px 0px 0px 10px;
	color:#329ba8;
	font-weight:bold;
}
#blogsidebar li li {
	list-style-type:disc;
}
#sidebar h4 {
	font-size:10px;
	padding:0px;
	margin:0px 0px 10px 10px;
	line-height:11px;
	color:#329ba8;
}
#sidebar li {
	font-size:12px;
	padding:0px;
	color:#455560;
}
#sidebar ul {
	margin:0px 0px 0px 18px;
	padding:0px 0px 0px 18px;
}
.leftborder {
	border-left:1px solid #8aa2a5;
}
#titleimage {
	margin-right:12px;
}
#widgets {
	padding:0px;
	margin:0px;
}
#widgets a {
	padding:0px 10px;
}
#client {
	margin:10px;
	color:#656a6f;
}
#client p {
	display:block;
	border-bottom:1px solid #8aa2a5;
	margin:0px;
	padding:2px 0px 2px 0px;
}
#client td {
	border-bottom:1px solid #8aa2a5;
	margin:0px;
	padding:2px 5px 2px 2px;
}
#client strong {
	color:#329ba8;
}
#technologies {
	margin:0px 10px;
	color:#329ba8;
}
#technologies td {
	margin:0px;
	padding:2px 5px 2px 2px;
	color:#329ba8;
	font-weight:bold;
}
#homecontent {
width:100%;
}
#homecontent ul {
list-style-image:url(/images/icon_blog.gif);
margin-left:10px;
padding-left:10px;
}
#bloghome {
margin-top:10px;
}
#bloghome a {
background-image:url(/images/icon_blog.gif);
background-repeat:no-repeat;
background-position: 0px 13px;
display:block;
padding:10px 0px 10px 20px;
line-height:120%;
margin:0px;
}
#relatedposts {
margin-left:5px;
padding-left:5px;
margin-top:0px;
padding-top:0px;
}
#postmetadata {
text-transform:capitalize;
}
h1#pagetitle  {
margin-bottom:25px;
}
/* SpryTabbedPanels.css - version 0.4 - Spry Pre-Release 1.6.1 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* Horizontal Tabbed Panels
 *
 * The default style for a TabbedPanels widget places all tab buttons
 * (left aligned) above the content panel.
 */

/* This is the selector for the main TabbedPanels container. For our
 * default style, this container does not contribute anything visually,
 * but it is floated left to make sure that any floating or clearing done
 * with any of its child elements are contained completely within the
 * TabbedPanels container, to minimize any impact or undesireable
 * interaction with other floated elements on the page that may be used
 * for layout.
 *
 * If you want to constrain the width of the TabbedPanels widget, set a
 * width on the TabbedPanels container. By default, the TabbedPanels widget
 * expands horizontally to fill up available space.
 *
 * The name of the class ("TabbedPanels") used in this selector is not
 * necessary to make the widget function. You can use any class name you
 * want to style the TabbedPanels container.
 */
.TabbedPanels {
	margin: 0px;
	padding: 0px;
	float: left;
	clear: none;
	/*background-color:#8aa2a5;*/
	background-image:url(/images/menu-background.png);
	background-position:top right;
	background-repeat:no-repeat;
	width: 100%; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
}
/* This is the selector for the TabGroup. The TabGroup container houses
 * all of the tab buttons for each tabbed panel in the widget. This container
 * does not contribute anything visually to the look of the widget for our
 * default style.
 *
 * The name of the class ("TabbedPanelsTabGroup") used in this selector is not
 * necessary to make the widget function. You can use any class name you
 * want to style the TabGroup container.
 */
.TabbedPanelsTabGroup {
	margin: 0px;
	padding: 0px;
	height:25px;
}
/* This is the selector for the TabbedPanelsTab. This container houses
 * the title for the panel. This is also the tab "button" that the user clicks
 * on to activate the corresponding content panel so that it appears on top
 * of the other tabbed panels contained in the widget.
 *
 * For our default style, each tab is positioned relatively 1 pixel down from
 * where it wold normally render. This allows each tab to overlap the content
 * panel that renders below it. Each tab is rendered with a 1 pixel bottom
 * border that has a color that matches the top border of the current content
 * panel. This gives the appearance that the tab is being drawn behind the
 * content panel.
 *
 * The name of the class ("TabbedPanelsTab") used in this selector is not
 * necessary to make the widget function. You can use any class name you want
 * to style this tab container.
 */
.TabbedPanelsTab {
	position: relative;
	top: 0px;
	float: left;
	/*	padding: 3px 10px;
	margin: 0px 1px 0px 0px;
	font: bold 0.7em sans-serif;*/
	list-style: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	cursor: pointer;
	height:25px;
	background-repeat:no-repeat;
	background-position:top;
}
/* This selector is an example of how to change the appearnce of a tab button
 * container as the mouse enters it. The class "TabbedPanelsTabHover" is
 * programatically added and removed from the tab element as the mouse enters
 * and exits the container.
 */
.TabbedPanelsTabHover {
	background-color: #CCC;
	background-position:bottom;
}
/* This selector is an example of how to change the appearance of a tab button
 * container after the user has clicked on it to activate a content panel.
 * The class "TabbedPanelsTabSelected" is programatically added and removed
 * from the tab element as the user clicks on the tab button containers in
 * the widget.
 *
 * As mentioned above, for our default style, tab buttons are positioned
 * 1 pixel down from where it would normally render. When the tab button is
 * selected, we change its bottom border to match the background color of the
 * content panel so that it looks like the tab is part of the content panel.
 */
.TabbedPanelsTabSelected {
	background-color: #455560;
	background-position:bottom;
}
/* This selector is an example of how to make a link inside of a tab button
 * look like normal text. Users may want to use links inside of a tab button
 * so that when it gets focus, the text *inside* the tab button gets a focus
 * ring around it, instead of the focus ring around the entire tab.
 */
.TabbedPanelsTab a {
	color: black;
	text-decoration: none;
}
/* This is the selector for the ContentGroup. The ContentGroup container houses
 * all of the content panels for each tabbed panel in the widget. For our
 * default style, this container provides the background color and borders that
 * surround the content.
 *
 * The name of the class ("TabbedPanelsContentGroup") used in this selector is
 * not necessary to make the widget function. You can use any class name you
 * want to style the ContentGroup container.
 */
.TabbedPanelsContentGroup {
	clear: both;
	background-image:url(/images/menu-background2.png);
	background-repeat:no-repeat;
	text-align:left;
}
/* This is the selector for the Content panel. The Content panel holds the
 * content for a single tabbed panel. For our default style, this container
 * provides some padding, so that the content is not pushed up against the
 * widget borders.
 *
 * The name of the class ("TabbedPanelsContent") used in this selector is
 * not necessary to make the widget function. You can use any class name you
 * want to style the Content container.
 */
.TabbedPanelsContent {
	padding: 3px;
	color:#aedee4;
}
.TabbedPanelsContent a {
	padding:0px 15px;
	color:#aedee4;
}
.TabbedPanelsContent a:hover {
	color:#ffffff;
}
/* This selector is an example of how to change the appearnce of the currently
 * active container panel. The class "TabbedPanelsContentVisible" is
 * programatically added and removed from the content element as the panel
 * is activated/deactivated.
 */
.TabbedPanelsContentVisible {
}
/* Vertical Tabbed Panels
 *
 * The following rules override some of the default rules above so that the
 * TabbedPanels widget renders with its tab buttons along the left side of
 * the currently active content panel.
 *
 * With the rules defined below, the only change that will have to be made
 * to switch a horizontal tabbed panels widget to a vertical tabbed panels
 * widget, is to use the "VTabbedPanels" class on the top-level widget
 * container element, instead of "TabbedPanels".
 */

/* This selector floats the TabGroup so that the tab buttons it contains
 * render to the left of the active content panel. A border is drawn around
 * the group container to make it look like a list container.
 */
.VTabbedPanels .TabbedPanelsTabGroup {
	float: left;
	width: 10em;
	height: 20em;
	background-color: #455560;
	position: relative;
}
/* This selector disables the float property that is placed on each tab button
 * by the default TabbedPanelsTab selector rule above. It also draws a bottom
 * border for the tab. The tab button will get its left and right border from
 * the TabGroup, and its top border from the TabGroup or tab button above it.
 */
.VTabbedPanels .TabbedPanelsTab {
	float: none;
	margin: 0px;
	border-top: none;
	border-left: none;
	border-right: none;
}
/* This selector disables the float property that is placed on each tab button
 * by the default TabbedPanelsTab selector rule above. It also draws a bottom
 * border for the tab. The tab button will get its left and right border from
 * the TabGroup, and its top border from the TabGroup or tab button above it.
 */
.VTabbedPanels .TabbedPanelsTabSelected {
}
/* This selector floats the content panels for the widget so that they
 * render to the right of the tabbed buttons.
 */
.VTabbedPanels .TabbedPanelsContentGroup {
	clear: none;
	float: left;
	padding: 0px;
	width: 30em;
	height: 20em;
}
.TabbedPanels {
	width: 882px;
}
.TabbedPanelsTab {
	font-size: 12px;
	font-weight: bold;
}
.TabbedPanels1 {
	width: 882px;
}
.TabbedPanelsTab1 {
	font-family: sans-serif;
	font-size: 12px;
	font-weight: bold;
}
#menu-websites {
	background-image:url(/images/menu-websites.png);
	width:100px;
}
#menu-programming {
	background-image:url(/images/menu-applications.png);
	width:123px;
}
#menu-marketing {
	background-image:url(/images/menu-marketing.png);
	width:110px;
}
#menu-company {
	background-image:url(/images/menu-company.png);
	width:101px;
}
#menu-blog {
	background-image:url(/images/menu-blog.png);
	width:79px;
}
#menu-contact {
	background-image:url(/images/menu-contact.png);
	width:96px;
}
/* Blogs */
small {
	font-size: 80%;
	line-height: 1.5em;
	padding:0px 5px;
}
.entry {
	padding:0px 10px;
}
.narrowcolumn {
	padding:0px 10px;
	margin:10px 0px;
}
.narrowcolumn .entry, .widecolumn .entry {
	line-height: 1.4em;
}
.widecolumn {
	line-height: 1.6em;
}
.narrowcolumn .postmetadata {
	text-align: center;
	clear:both;
}
.post h2, .post h3 {
	font-size:16px;
	margin-top:0px;
	padding-top:10px;
	margin-bottom:0px;
	padding-bottom:0px;
}
#comment {
	width:90%;
}
.navigation {
	display: block;
	text-align: center;
	margin-top: 0px;
	margin-bottom: 5px;
}
hr {
	height:2px;
	border: none;
	color:#319ba8;
	background-color:#319ba8;
	margin:20px 0px;
	clear:both;
}
#bloghome hr {
margin-left:15px;
height:1px;
color:#88a39e;
background-color:#88a39e;
margin:10px 0px 10px 20px;
padding:0px;
clear:both;
}
img.alignright {
	margin: 0 0 2px 7px;
	display: inline;
}
.post {
	clear:both;
}
#postmetadata {
	text-align:left;
	margin:0px;
	padding:0px 5px;
	display:block;
}
#postmetadata strong {
color:#329ba8;
}
img.alignleft {
	margin: 0 7px 2px 0;
	display: inline;
}
img a {
	border:none;
}
.alignright {
	float: right;
}
.alignleft {
	float: left
}
