html, body
{
	margin: 0px;
	padding: 0px;
	height: 100%;
	width: 100%;
	background-color: #131313;
	background-image: url(images/page_repeat.gif);
}

a:link, a:visited, a:focus
{
	outline: none;
	color: #0fbed9;
	text-decoration: none;
}

a:hover, .tooltip:hover
{
	color: #CDF7FC;
}

a:active
{
	color: #ffffff;
}

#active
{
	color: #9D9D9D;
	cursor: default;
}

h2
{
	font-size: 16px;
	font-family: Arial;
	line-height: 16px;
	color: #0fbed9;
	font-weight: 100;
}

p
{
	display: inline;
	line-height: 1.7;
}

img
{
	margin: 0px;
	padding: 0px;
	display: block;
	position: relative;
}

/* Header menu styles */

.header
{
	position: fixed;
	z-index: 100;
	width: 100%;
	height: 38px;
	top: 0px;
	left: 0px;
}

.banner_container
{
	overflow: auto;
	position: relative;
	width: 914px;
	margin: 0 auto;
	background-image: url(images/banner_repeat.gif);
	background-repeat: repeat-x;
}

.banner
{
	position: relative;
	width: 849px;
	height: 36px;
	margin: 0 auto;
	overflow: hidden;
	background-image: url(images/banner.gif);
	background-repeat: no-repeat;
}

.banner img
{
	position: absolute;
	left: 0px;	
}

/* Sub-menu styles */

.submenu_container
{
	position: fixed;
	z-index: 98;
	width: 100%;
	height: 31px;
	top: 34px;
	left: 0px;
}

.submenu_inner_container
{
	position: relative;
	width: 914px;
	margin: 0 auto;
	border-bottom: 1px solid #2C2C2C;
	background-color: #000000;
	background-image: url(images/submenu_repeat.png);
	background-position: left bottom;
	background-repeat: repeat-x;
	overflow: auto;
}

.submenu
{
	position: relative;
	height: 31px;
	margin: 0 auto;
	text-align: center;
	top: 0px;
}

/* tom-edit, was 479px but without animation & other its now centered */
.sub_portfolio
{
	width: 269px;
}

.sub_services
{
	width: 290px;
}

/* Menu navigation links */
/* tom-edit, was 604px width with order link */
.navi
{
	position: relative;
	float: right;
	width: 558px;
	height: 38px;
	text-align: center;
}

.navi .links, .submenu .links
{
	position: relative;
	float: left;
}

.navi .links ul, .submenu .links ul
{
	list-style: none;
	padding: 0px;
	margin: 0px;
}

.navi .links ul li
{
	display: inline-block;
	position: relative;
	float: left;
	/*padding: 0px 14px 0px 10px;*/
}

/* Sub-menu navigation links */

.submenu .links ul li
{
	display: inline-block;
	position: relative;
	float: left;
	/*padding: 0px 24px 0px 20px;*/
}

.navi .links ul li a, .navi .links ul li span
{
	display: list-item;
	/*display: inline;*/
	font-size: 13px;
	font-family: Arial;
	line-height: 38px;
	text-decoration: none;
	position: relative;
	top: -2px;
	/*padding: 0px 24px 0px 24px;*/
	color: #ffffff;
}

.submenu .links ul li a, .submenu .links ul li span
{
	display: list-item;
	/*display: inline;*/
	font-size: 12px;
	font-family: Arial;
	line-height: 30px;
	text-decoration: none;
	position: relative;
	top: 1px;
	padding: 0px 25px 0px 25px;
}

.navi .links ul li img
{
	position: relative;
	margin: 0px;
	padding: 0px 5px 0px 5px;
	bottom: 0px;
	border: none;
}

.navi .right
{
	position: relative;
	float: right;
}

.navi .right ul li
{
	color: #6e6e6e;
	/*padding: 0px 2px 0px 2px;*/
	padding: 0px;
}

.navi .right ul li img
{
	padding: 0px;
}

.navi .right ul li a, .navi .right ul li span
{
	padding: 0px;
}

/* Buttons */

/* Home */
.link_home, .link_home_active { width: 67px; height: 38px; }
.link_home { background: url(images/buttons.gif) 0px 0px; }
.link_home:hover, .link_home.hover { background: url(images/buttons.gif) 0px -38px; }
.link_home_active {	background: url(images/buttons.gif) 0px -38px; }

/* Services */
.link_services, .link_services_active {	width: 81px; height: 38px; }
.link_services { background: url(images/buttons.gif) -80px 0px; }
.link_services:hover, .link_services.hover { background: url(images/buttons.gif) -80px -38px; }
.link_services_active {	background: url(images/buttons.gif) -80px -38px; }

/* Portfolio */
.link_portfolio, .link_portfolio_active { width: 81px; height: 38px; }
.link_portfolio { background: url(images/buttons.gif) -177px 0px; }
.link_portfolio:hover, .link_portfolio.hover { background: url(images/buttons.gif) -177px -38px; }
.link_portfolio_active { background: url(images/buttons.gif) -177px -38px; }

/* Order */
.link_order, .link_order_active { width: 67px; height: 38px; }
.link_order { background: url(images/buttons.gif) -270px 0px; }
.link_order:hover, .link_order.hover { background: url(images/buttons.gif) -270px -38px; }
.link_order_active { background: url(images/buttons.gif) -270px -38px; }

/* Contact */
.link_contact, .link_contact_active { width: 69px; height: 38px; }
.link_contact { background: url(images/buttons.gif) -412px 0px; }
.link_contact:hover, .link_contact.hover { background: url(images/buttons.gif) -412px -38px; }
.link_contact_active { background: url(images/buttons.gif) -412px -38px; }

/* Bookmark */
.link_bookmark, .link_bookmark_active { width: 71px; height: 38px; }
.link_bookmark { background: url(images/buttons.gif) -486px 0px; }
.link_bookmark:hover, .link_bookmark.hover { background: url(images/buttons.gif) -486px -38px; }
.link_bookmark_active { background: url(images/buttons.gif) -486px -38px; }

/* Main document background */

#wallpaper
{
	position: absolute;
	width: 100%;
	height: 450px;		
	background-repeat: no-repeat;
	background-position: top center;
}

.main
{
	width: 100%;
	margin: 0 auto;
	min-height: 100%;
	min-width: 916px;
	text-align: left;
	position: relative;
	overflow: hidden;
	background-image: url(images/background_shadow.png);
	background-repeat: repeat-y;
	background-position: top center;
}
/* Tom's edit! Uh Oh */
.main_contact
{
	width: 100%;
	margin: 0 auto;
	min-height: 100%;
	min-width: 916px;
	text-align: left;
	position: relative;
	overflow: hidden;
	background-image: url(images/background_shadow_contact.png);
	background-repeat: repeat-y;
	background-position: top center;
}

/* Main document content */

.main_inner
{
	width: 914px;
	margin: 0 auto;
	position: relative;
}

.content
{
	position: relative;
	margin: 0 auto;
	padding: 0px;
	width: 914px;
	height: 100%;
	font-size: 13px;
	font-family: Arial;
	color: #d2d2d2;
}

/* Flash banner container */

.flash_container
{
	position: absolute;
	z-index: 1;
	top: 37px;
	height: 267px;
	width: 100%;
	background-color: #0d0d0d;
	background-image: url(images/flash_bg_repeat.gif);
	background-repeat: repeat-x;
	background-position: bottom left;
}

.flash_div
{
	width: 914px;
	height: 263px;
	margin: 0 auto;
	position: relative;
	/*background-image: url(images/flash_temp_bg.jpg);
	background-repeat: repeat-x;
	background-position: bottom left;*/
	text-align: center;
	overflow: hidden;
	font-size: 24px;
	font-family: Arial;
	line-height: 263px;
	color: #4c4c4c;
}

/* Index page styles */

.index_txt
{
	padding: 331px 72px 10px 54px;
	position: relative;
}

.index_txt p
{
	font-size: 12px;
	left: 13px;
	margin: 0px;
	padding: 5px 0px 29px 0px;
	position: relative;
	display: block;
	clear: both;
}

.index_txt #img_welcome
{
	float: left;
}

.index_txt #img_recent, .graphics_txt #img_graphics, .webdev_txt #img_webdev
{
	float: right;
}

/* News articles */

.news
{
	margin: 0px;
	padding: 13px 0px 80px 3px;
	position: relative;
	clear: both;
}

.news .news_item
{
	width: 773px;
	height: 166px;
	position: relative;
	margin: 0 auto;
	font-size: 12px;
	padding-bottom: 14px;
	color: #cccccc;
}

.news .news_item p
{
	line-height: 1.6;
	display:block;
	margin:0 10px;
}

.news .news_item h2
{
	color: #ffffff;
	padding: 0px;
	margin: 0px 0px 14px 0px;
	position: relative;
}

.news .news_item img
{
	width: 179px;
	height: 166px;
	position: relative;
	float: left;
}

.news .news_item .news_content
{
	width: 567px;
	height: 132px;
	position: relative;
	float: left;
	padding: 16px 0px 20px 26px;
	background: url(images/articlebg.png) 100% 0 no-repeat;
}

.news .news_item .date
{
	position: absolute;
	top: 1px;
	right: 2px;
	width: 85px;
	height: 25px;
	color: #9d9d9d;
	z-index: 3;
	text-align: center;
	line-height: 25px;
	margin: 0px;
	padding: 0px;
}
/*
.news .news_item .dark
{
	border-top: 1px solid #353535;
	border-right: 1px solid #3d3d3d;
	border-bottom: 1px solid #3d3d3d;
	border-left: 1px solid #3d3d3d;
}

.news .news_item .light
{
	border-top: 1px solid #353535;
	border-right: 1px solid #565656;
	border-bottom: 1px solid #565656;
	border-left: 1px solid #565656;
}

.news .news_item .rowdark
{
	border-top: 1px solid #3d3d3d;
	border-right: 1px solid #3d3d3d;
	border-bottom: 1px solid #3d3d3d;
	background-color: #353535;
}

.news .news_item .rowlight
{
	border-top: 1px solid #565656;
	border-right: 1px solid #565656;
	border-bottom: 1px solid #565656;
	background-color: #4f4f4f;
}*/
#next_articles{
	text-align:right;
	padding:0 70px;
}
#next_articles input{
	width:95px;
	height:28px;
	background:url(images/more_articles.png) 0 0 no-repeat;
	color:#0FBED9;
	border:0;
}
/* Services page styles */

.graphics_txt
{
	padding: 95px 60px 662px 66px;	
	position: relative;
}

.webdev_txt
{
	/*padding: 95px 60px 375px 66px;*/	
	padding: 95px 60px 0px 66px;	
	position: relative;
}

.graphics_txt p, .webdev_txt p
{
	font-size: 12px;
	margin: 0px;
	padding: 13px 0px 27px 0px;
	position: relative;
	display: block;
	clear: both;
}

.webdev_txt p.indent
{
	line-height: 1.5;
	margin: 0px;
	padding: 5px 0px 25px 32px;
	display: block;
	clear: both;
}

.graphics_txt #img_graphics, .webdev_txt #img_webdev
{
	right: 11px;
}

.technology_list
{
	width: 788px;
	height: 111px;
	margin: 0 auto;
	position: relative;
	padding: 6px 60px 30px 66px;
}

.technology_list div
{
	height: 111px;
	float: left;
}

.technology_list p
{
	font-family: Arial;
	font-size: 12px;
	color: #d2d2d2;
	padding: 0px;
}

.technology_list ul
{
	margin: 0px;
	color: #e4e4e4;
	font-family: Arial;	
	display: inline-block;
	padding: 0px 0px 0px 15px;
	position: relative;	
	list-style-type: square;
	line-height: 1.65;
	top: -1px;
}

.technology_list ul li
{
	font-size: 10px;
	position: relative;
	display: list-item;
	padding: 0px;
	margin: 0px;
	left: -5px;
}

.technology_list ul li span
{
	position: relative;
	font-size: 12px;
	color: #0ebed8;
	padding: 0px;
	margin: 0px;
	top: 1px;
	left: -3px;
}

.services_list
{
	position: relative;
	font-size: 12px;
	line-height: 1.85;
	padding: 6px 0px 0px 0px;
	margin-right: -30px;
	width: 815px;	
}

.services_list #titles
{
	position: absolute;
	list-style: none;
	padding: 0px;
	margin: 0px;
	width: 63px;
	left: 0px;
}

.services_list #titles li
{
	text-align: right;
}

.services_list #items
{
	position: absolute;
	list-style: disc;
	padding: 0px 0px 0px 20px;
	margin: 0px;
	right: 0px;
	width: 730px;
}

.services_list #items .pipe
{
	color: #595959;
}

/* Portfolio page styles */

.portfolio_txt
{
	padding: 0px 0px 686px 0px;
	position: relative;
}

.slideshow
{
	position: relative;
	width: 100%;	
	padding: 0px;
	margin: 0px;
}

.slideshow .ss_controls
{
	position: relative;
	width: 192px;
	height: 39px;
	text-align: center;
	margin: 0 auto;
	padding: 0px 0px 0px 0px;
}

.slideshow .ss_controls ul
{
	list-style: none;
	padding: 0px;
	margin: 0px;
}

.slideshow .ss_controls ul li
{
	display: inline-block;
	position: relative;		
	padding: 0px;
}

.slideshow .ss_controls #prev
{
	background: url(images/gallery_buttons.png) 0px 0px;
	background-repeat: no-repeat;
	position: relative;
	float: left;
}

.slideshow .ss_controls #prev a:hover
{
	background: url(images/gallery_buttons.png) 0px 0px;
}

.slideshow .ss_controls #next
{
	background: url(images/gallery_buttons.png) -96px 0px;
	background-repeat: no-repeat;
	position: relative;
	float: right;
}

.slideshow .ss_controls #next a:hover
{
	background: url(images/gallery_buttons.png) -96px 0px;
}

.slideshow .ss_controls ul li a
{
	display: list-item;
	width: 96px;
	height: 39px;
	line-height: 28px;
	font-size: 12px;
}

.slideshow .ss_images, .slideshow .ss_index
{
	position: absolute;
	width: 100%;
	left: 0px;
}

.slideshow .ss_images div
{
	position: relative;
	margin: 0 auto;
	display: none;
	width: 100%;
}

.slideshow .ss_index div span
{
	position: relative;
	display: inline;
	line-height: 1.55;
}

.slideshow .ss_images div img
{
	position: relative;
	margin: 0 auto;
	display: block;	
	padding: 0px;
	/*height: 600px;*/
}

.flash_div .slideshow .ss_index div img
{
	position: relative;
	top: 0px;
	left: 0px;
	width: 914px;
	height: 263px;
}

.flash_div .slideshow .ss_index div .details
{
	position: absolute;
	bottom: 0px;
	left: 0px;
	margin: 0px;
	font-size: 13px;
	color: #d7d7d7;
	text-align: left;
	padding: 8px 0px 10px 67px;
	z-index: 100;
	width: 847px;
	background-color: transparent;
	background-image: url(images/slideshow_bottom_shadow.png);
	background-repeat: repeat-x;
}

.flash_div .slideshow .ss_index div .details .space
{
	color: #3f3f3f;
	padding: 0px 20px 0px 20px;
}

.flash_div .slideshow .ss_index div .details .title
{
	color: #979797;
}

.flash_div .slideshow #nav
{
	height: 26px;
	position: absolute;
	margin: 0px;
	padding: 0px;
	top: 230px;
	right: 72px;
	z-index: 100;
	border: 1px solid #2b2b2b;
	/*border-top: 1px solid #454545;
	border-bottom: 1px solid #454545;
	border-left: 1px solid #454545;*/
}

.flash_div .slideshow #nav a
{
	position: relative;
	top: 9px;
	margin: 0px;
	font-size: 12px;
	line-height: 9px;
	padding: 6px 11px 5px 11px;
	/*border-right: 1px solid #454545;*/
	background: #141414;
	background-image: url(images/gallery_nav.gif);
}

.flash_div .slideshow #nav a.activeSlide
{
	color: #9D9D9D;
	background: #000000;
	background-image: url(images/gallery_nav_active.gif);
}

.portfolio_details
{
	height: 158px;
	position: relative;
	width: 914px;
	margin: 0 auto;
	padding: 66px 0px 0px 0px;
	border-bottom: 1px solid #3b3b3b;
	background-color: #000000;
	background-image: url(images/portfolio_details_bg.gif);
	background-position: left bottom;
	background-repeat: repeat-x;
}

.portfolio_details .slideshow .ss_images div
{
/* Old padding: 17px 52px 19px 163px; */
	color: #b1b1b1;
	font-size: 12px;
	font-family: Arial;
	display: none;
	width: 914px;
}

.portfolio_details .slideshow .ss_images div .caption
{
	position: relative;
	margin: 20px 20px 20px 20px;
	padding: 0px;
	width: 874px;
	height: 80px;
	display: block;
	overflow: auto;
	line-height: 1.6;
}

.portfolio_details .slideshow .ss_images div .details
{
	position: relative;
	margin: 0px 11px 0px 11px;
	padding: 0px 9px 0px 9px;
	width: 874px;
	display: block;
	height: 45px;
	line-height: 45px;
	border-bottom: 1px solid #2a2a2a;
}

.portfolio_details .slideshow .ss_images div span
{
	padding-right: 20px;
}

.portfolio_details .slideshow .ss_images #fail
{
	margin: 0 auto;
	color: #ff4444;
	font-size: 16px;
	font-family: Arial;	
	text-align: center;
	position: relative;
	display: block;
	line-height: 158px;
}

/* Contact page styles */

.contact_txt
{
	padding: 63px 0px 0px 25px;
	position: relative;
}

.contact_txt p
{
	line-height: 2;
}

.contact_txt form
{
	width: 550px;
	margin: 0px auto;
	float: left;
	left: 0px;
	position: relative;
	padding-top: 18px;
}

.contact_txt table
{
	width: 100%;
}

.contact_txt table td
{
	padding-bottom: 8px;
	line-height: 16px;	
}

.contact_txt textarea
{
	width: 245px;
	height: 158px;
	color: #e9e9e9;
	font-size: 12px;
	font-family: Arial;
	position: relative;
	top: -3px;
	border: 1px solid #343434;
	background-color: #000000;
}

.contact_txt .textbox
{
	width: 245px;
	height: 25px;
	padding: 0px;
	color: #e9e9e9;
	font-size: 12px;
	font-family: Arial;
	position: relative;
	top: -2px;
	border: 1px solid #343434;
	background-color: #000000;
}

.contact_txt .button
{
	float: right;
	width: 95px;
	height: 28px;
	color: #0cbed8;
	font-size: 12px;
	font-family: Arial;
	position: relative;
	top: -4px;
	border: none;
	background: transparent;
	background-image: url(images/contact_send.gif);
	background-repeat: no-repeat;
	/*border: 1px solid #343434;
	background-color: #131313;*/
	cursor: pointer;
}

.contact_txt .inner_div
{
	clear: both;
	float: left;
	width: 550px;
	padding: 22px 0px 0px 7px;
	position: relative;
}

.contact_txt .messages
{
	position: absolute;
	top: 55px;
	left: 350px;
	width: 225px;
	line-height: 2.7;
}

#contact-form_container
{
	position: fixed;
	z-index: 99;
	width: 100%;
	height: 0px;
	top: 0px;
	left: 0px;
}

#contact-form_inner
{	
	width: 914px;
	margin: 0 auto;
	position: relative;
}

#contact-form
{
	width: 614px;
	height: 442px;
	position: absolute;
	top: -442px;
	right: 0px;
	padding: 0px;
	border: 2px solid #CC7B02;
	overflow: hidden;
	-moz-border-radius-bottomleft: 5px; 
	-moz-border-radius-bottomright: 5px;
}

#portfolio-frame-menu
{
	top: 224px;
	height: 39px;
	width: 100%;
	position: absolute;
	border-top: 1px solid #3b3b3b;
	border-bottom: 1px solid #121212;
	background-image: url(images/background_repeat.gif);
}

#portfolio-frame
{
	clear: both;
	z-index: 98;
	position: absolute;
	top: 265px;
	left: 0px;
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	border: none;
	overflow: auto;
}

/* Content overlay style */

.content_overlay
{
	position: absolute;
	z-index: 1;
	width: 100%;
	border-top: 1px solid #181818;
	border-bottom: 1px solid #181818;
}

.content_overlay .inner_overlay
{
	position: absolute;
	width: 100%;
	border-top: 1px solid #2d2d2d;
	border-bottom: 1px solid #2d2d2d;
}

.srv_gfx_overlay
{
	top: 362px;
	height: 503px;
	background-image: url(images/design_bg_repeat.gif);
}

.srv_gfx_inner
{
	height: 501px;
	background-image: url(images/vector_shadow.png);
	background-repeat: no-repeat;
}

.srv_web_overlay
{
	position: relative;
	margin-top: -18px;
	height: 244px;
}

.srv_web_inner
{
	height: 242px;
	background-image: none;
}

.content_overlay .inner_overlay .inner_div
{
	position: relative;
	margin: 0 auto;
	padding: 0px;
	font-size: 12px;
	font-family: Arial;
	color: #d2d2d2;
	line-height: 1.65;
	padding: 114px 38px 0px 66px;
}

.content_overlay .inner_overlay .inner_div p
{
	position: relative;
	padding: 2px 0px 0px 32px;
	display: inline-block;
	margin: 0px;
}

.content_overlay .inner_overlay .inner_div #services_graphic
{
	width: 771px;
	height: 242px;
	background-image: url(images/services_graphic.png);
	background-repeat: no-repeat;
	margin: 14px 0px -5px 0px;
}

.content_overlay .inner_overlay #services_webdev
{
	width: 914px;
	height: 242px;
	position: absolute;
	top: 0px;
	left: 0px;
	background-image: url(images/services_webdev.png);
	background-repeat: no-repeat;
	margin: 0px 0px 0px 0px;
}

/* Main page top background */

.gradient_background
{
	left: 0px;
	top: 66px;
	width: 100%;
	height: 24px;	
	position: absolute;
	background-image: url(images/gradient_bg.png);
	background-repeat: repeat-x;
	background-position: 0px 0px;
}

/* Main page bottom background */

.main_bg
{
	width: 614px;
	position: absolute;
	bottom: 0px;
	left: 0px;
}

.xti_background 
{
	width: 253px;
	height: 258px;
	float: right;
	position: relative;
	background-image: url(images/at.png);
	background-repeat: no-repeat;
	background-position: right bottom;	
}

/* Main site footer */ 

.footer
{
	position: absolute;
	z-index: 2;
	bottom: 0px;
	width: 100%;
	height: 30px;	
}

.inner_footer
{
	width: 914px;
	margin: 0 auto;	
	font-size: 11px;
	font-family: Arial;
	color: #727272;
	line-height: 29px;	
	text-align: center;
	background-color: #131313;
	border-top: 1px solid #313131;
}

.footer .inner_footer #tel, .footer .inner_footer #email
{
	color: #FFFFFF;
}

/* Highlight style */

.highlight
{
	color: #ffffff;
}

.midlight
{
	color: #e4e4e4;
}

/* Tooltip style */

.help
{
	cursor: help;
}

.tooltip
{
	color: #0dbed8;
}

#tooltip 
{
	position: absolute;
	z-index: 3000;
	background-color: #0f0f0f;
	border: 1px solid #0fbed9;
	color: #ffffff;
	line-height: 18px;
	padding: 10px;
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	/*opacity: .85;*/
	max-width: 20em;
}

#tooltip h3 
{
	margin: 0px;
	padding: 0px;
	font-size: 12px;
	font-family: Arial;
	font-weight: 100;
	text-align: left !important;
}

/* Text highlight selection style */

::selection
{
	background: #0FBED9;
	color: #000000;
}

::-moz-selection
{
	background: #0FBED9;
	color: #000000;
}

/* 
	Author: Clive Elliott
	Email: clive108 at hotmail dot com
	Main stylesheet for layout of XTi Design website.
*/