/*
Original design: andreas02 (v3.0 - Apr 24, 2008) - A free xhtml/css website template by Andreas Viklund.
For more information, see http://andreasviklund.com/templates/andreas02/
*/

/* General layout */
body {background:#e0e0e0; color:#303030; font:76% tahoma, verdana, sans-serif; margin:0; padding:15px 0 0;}
#container {background:#fff; margin:0 auto 20px; padding:5px 20px 20px; width:730px;}

/* Site title */
#logo {
	margin:5px 0 0;
	width: 620px;
	float: left;
}
#logo h1 a {border:none; color:#505050;}
#logo h1 a:hover {
	border:none;
	color:#303030;
	text-decoration:none;
}
#logo p {font-size:1.3em;  color:#505050; margin:0 0 20px 0;}

/* Tags */
/*a {border-bottom:1px dotted #505050; color:#303030; text-decoration:none;}*/
a {color:#303030;text-decoration:underline;}
a.pic {border-bottom:0px}
/*a:hover {border-bottom:1px solid #505050;color:#303030;text-decoration:underline;}*/
a:hover {
	color:#CCCCCC;
	text-decoration:underline;
}
a img {
	border: 0px;
	}

h1 {font-size:2.2em; font-weight:400; margin:0 0 5px; padding:0;}
h2 {font-size:1.8em; font-weight:400; margin:0 0 12px;}
h3 {font-size:1.4em; font-weight:400; margin:0 0 10px;}
p {line-height:1.5em; margin:0 0 15px; text-align:left;}
p.red {color: #bd501d;} 
ul,ol {margin:0 0 15px 15px; padding:0;}
li {margin:0 0 3px 0;}

span {color: #bd501d;} 

/* Toptabs menu */
#toptabs {font-size:.8em; margin:10px auto -13px; width:760px;}
#toptabs p {
	color:#bd501d;
	text-align:right;
}
.toptab {
	background:#bd501d url(images/corner2.gif) top right no-repeat;
	border-bottom:1px solid #bd501d;
	color:#000000;
	margin:0 0 0 4px;
	padding:4px 5px 3px;
	text-decoration:none;
}
.toptab:hover {background:#fafafa url(images/corner2.gif) top right no-repeat; border-bottom:1px solid #eaeaea; color:#505050; text-decoration:none;}
.activetoptab {background:#fff url(images/corner2.gif) top right no-repeat; border-bottom:1px solid #fff; color:#505050; margin:0 0 0 4px; padding:4px 5px 3px; text-decoration:none;}
.activetoptab:hover {border-bottom:1px solid #fff; text-decoration:none;}

/* Navitabs menu */
#navitabs {
	clear:both;
	border-top:5px
	
}
.navitab {
	background:#f09b1b url(images/corner.gif) top right no-repeat;
	border-bottom:1px solid #fff;
	border-left:1px solid #fff;
	font-size:1.1em;
	margin:0 0 4px;
	padding:4px 8px;
	text-decoration:none;
	font-weight: bold;
}
.navitab:hover {
	background:#d0d0d0 url(images/corner.gif) top right no-repeat;
	border-bottom:1px solid #fff;
	text-decoration:none;
	font-weight: bold;
	color: #000000;
}
.activenavitab {background:#505050 url(images/corner.gif) top right no-repeat; color:#fff; font-size:1.1em; margin:0 0 5px; padding:4px 8px 5px; text-decoration:none;font-weight: bold;}
.activenavitab:hover {color:#fff; text-decoration:none;font-weight: bold;}


.selector {
	background:#bd501d url(images/cornerb.gif) top right no-repeat;
	font-size:1.1em;
	margin:0 0 4px;
	padding:4px 8px;
	text-decoration:none;
	font-weight: bold;
}
.selector:hover {background:#666666 url(images/cornerb.gif) top right no-repeat; text-decoration:none;font-weight: bold;}


/* Header description area */
#desc {
	background:#505050 url(images/topnew8.jpg) bottom left repeat-y;
	clear:both;
	color:#FFFFFF; /* height:200px; */
	margin:5px 0 15px;
	padding:0 0 5px 0;
	height:195px;
}
#desc p {font-size:1em; line-height:1.3em; padding:0 0 0 15px; width:290px;}
#desc h2 {color:#fff; padding:15px 15px 0;}
#desc a {border-color:#fff; color:#fff; text-decoration:none;}
#SOS #desc {background:#505050 url(images/top-sos.jpg) bottom left repeat-y;}
#SOScost #desc {background:#505050 url(images/top-sos-price3.jpg) bottom left repeat-y;margin:6px 0px 15px 0px}
#systems #desc {background:#505050 url(images/itpeople.jpg) bottom left repeat-y;margin:6px 0px 0px 0px}
#software #desc {background:#505050 url(images/main-image.gif) bottom left repeat-y;margin:6px 0px 15px 0px}
#technology #desc {background:#505050 url(images/tech2.jpg) bottom left repeat-y;margin:6px 0px 15px 0px}
#sutus #desc {background:#505050 url(images/sutusban2.jpg) bottom left repeat-y;margin:6px 0px 15px 0px}
#babytel #desc {background:#505050 url(images/babytelbanner.jpg) bottom left repeat-y;margin:6px 0px 15px 0px}
#talkswitch #desc {background:#505050 url(images/talkswitch.jpg) bottom left repeat-y;margin:6px 0px 15px 0px}
#openbravo #desc {background:#505050 url(images/openbravo-banner.jpg) bottom left repeat-y;margin:6px 0px 15px 0px}
#services #desc {background:#505050 url(images/services.jpg) bottom left repeat-y;margin:6px 0px 0px 0px}


/* Main content */
#main {
	border-right:1px solid #d8d8d8;
	float:left;
	margin:0;
	padding:0px 15px 15px 5px;
	width:520px;
}
#main.sm {width:68%;}
#main.lrg {
	width:42%;
	padding: 8px 8px 8px 8px;	
}
#main.lrgblk {
	width:42%;
	background-color: #333333;
	padding: 8px 8px 8px 8px;
}
#matrix {float:left; margin:0; padding:0 15px 0 0; width:730px;}

/*Left sidebar */
#leftside {clear:left; float:left; margin:0 0 5px; padding:0; width:140px;}
#rightside {float:right; line-height:1.4em; margin:0 0 5px; padding:0; width:140px;}
#leftside p,#leftside ul, #rightside p,#rightside ul {margin:0 0 16px; padding:0;}
#leftside p, #rightside p {font-size:0.9em; line-height:1.4em;}
#leftside li, #rightside li {line-height:1.2em; list-style:none; margin:0 0 6px; padding:0;}
#leftside ul ul, #rightside ul ul {margin:6px 0 0 10px; padding:0;}
#leftside ul ul li, #rightside ul ul li {margin:0 0 4px;}
#leftside ul ul li a, #rightside ul ul li a {font-weight:400;}
#leftside h2,#leftside h3, #rightside h2,#rightside h3 {color:#505050; font-size:1.2em; margin:0 0 8px; padding:0;}




/* Right Sidebar */
#sidebar {float:right; width:150px; padding:5px 5px 5px 5px;}
/*#sidebar h1{font:Verdana,sans-serif;}
#sidebar h2{font:Verdana,sans-serif;}
#sidebar h3{font:Verdana,sans-serif;}
#sidebar h4{font:Verdana,sans-serif;}*/

/*#sidebar p {font-size:0.9em; line-height:1.3em; margin:0 0 15px;}*/
#sidebar ul {margin:0 0 15px 0; padding:0;}
#sidebar li {list-style:none;}
ul.sidelink li {list-style:none; margin:0 0 3px; padding:0;}
ul.sidelink li a{
	color: #0000FF;
	background:#f0f0f0 url(images/corner.gif) top right no-repeat;
	border:none;
	display:block;
	margin:5px 10px 5px 0;
	padding:3px 4px 3px 8px;
	text-align:left;
	width:140px;
	
}
ul.sidelink li a:hover {background:#e0e0e0 url(images/corner.gif) top right no-repeat; border:none; text-decoration:none;}

/*ul.sidelinkc li {list-style:none; margin:0 0 3px; padding:0;}*/
ul.sidelinkc li a{
	color: #FFFF00;
	background:#273857 url(images/corner.gif) top right no-repeat;
	border:none;
	display:block;
	margin:5px 10px 5px 0;
	padding:3px 4px 3px 8px;
	text-align:left;
	width:140px;
	font-weight: bold;
}
ul.sidelinkc li a:hover {background:#b1c3d9 url(images/corner.gif) top right no-repeat; border:none; text-decoration:none;}

ul#split,ul#split li{margin:0;padding:0;list-style:none;width:150px;}
ul#split li{margin:0 10px 10px 0;}
ul#split h3{font: normal 120%/1.3 Verdana,sans-serif;
    text-transform:uppercase;margin:0px;padding: 5px 0 3px;text-align:center;color: #000}
ul#split p{margin:0;padding:5px 8px 15px}
ul#split a{text-decoration: underline;}
ul#split a:hover {
	color:#0000FF
}
ul#split div{
	background:#C5E6F6;
	padding: 5px 5px 5px 5px;
}
ul#split div.button{
	padding: 5px 5px 5px;
	border: solid #bd501c 10px;
	vertical-align:middle;
	text-align:center;
}

li#one h3{background: #bd501c;}
li#two h3{background: #f09b1b}
li#three h3{background: #E3A1C4}


#sidebar.sm {width:25%;	background-color: #CCCCCC;}
#sidebar.sm a {
	color: #000099;
}
#sidebar.sm a:hover {
	color: #000000;
}


#sidebar.grey {background-color: #CCCCCC;}
#sidebar.grey a {color: #303030;}
#sidebar.grey a:hover {color: #FFFFFF;}


#sidebar.lrg {width:51%;padding: 8px 8px 8px 8px;}

/* Footer */
#footer {background:#fff; border-top:1px solid #d8d8d8; clear:both; margin:0; padding:0;}
#footer a {color:gray;}
#footer a:hover {color:#303030;}
#footer p {color:gray; font-size:1.1em; line-height:1.3em; margin:15px 0 0; padding:0;}


/* Newstle classes */
ul.clr
{
	line-height: 2em;
	list-style: none;
	margin: 0;
	padding: 0;
	border-bottom:none;
}
ul.clr li
{
	background: url(images/1_z1g.gif) center left no-repeat;
	background-position: 0 5px;
	list-style-type: none;
	margin: 0px;
	padding-left: 24px;
	border-bottom:none;
}
ul.clr li a
{
	color: #bd501d;
	font-weight: bold;
	text-decoration: none;
	border-bottom:none;
}
ul.clr li a.g
{
	color: #6e8e00;
	font-weight: bold;
	text-decoration: none;
}
ul.clr li a.g:hover
{
	color: #bd501d;
	text-decoration: none;
	cursor: default;
	border-bottom:none;
}
ul.clr li a:hover
{
	color: #6e8e00;
	text-decoration: none;
	border-bottom:none;
}
ul.clr li a:visited
{
	color: #999999;
}



/* Table classes */
td.td0 {
	background-color: #CC9999; color: black;
}
td.td1 {
	background-color: #9999CC; color: black;
}

.alt { background-color:#efefef; }



/* Additional classes */
.photo {
	background-color:#f0f0f0;
	border:1px solid #d8d8d8;
	margin:0 0 15px;
	padding:2px 4px;
}
.timestamp {font-size:1.2em; color:#606060; margin:-12px 0 12px 0;}
.left {
	float:left;
	margin:0px 10px 2px 0;
}
.right {margin:-8px 0 8px 0; text-align:right;}
.right2 {float:right; margin:2px 0 2px 10px;}
.centre {
	margin-left: auto;
	margin-right: auto;
	width:95px;
	margin-top: 12px;
}
.read {float:right;clear: both;background-repeat:no-repeat;position: relative;top: -20px;}
.readt {float:right;clear: both;background-repeat:no-repeat;position: relative;bottom: -20px;}
.rightlogo {
	float:right;
	margin:27px 0px 0px 0px;
}

.block {background:#f0f0f0; padding:10px;}
.colourBlock {background:#bd501d; padding:10px;}
.hide {display:none;}
.Table1 {border-style:dotted;}
.roll {
	display:block;
	height:20px; /* use the images' dimensions */
	width:95px;
	background-image:url(images/LEARNMOREb.png);
	background-repeat:no-repeat;
	color:#999999;
	line-height:20px;
	font-size:9px;
	font-weight:bold;
	text-align:left;
	vertical-align:middle;
	padding-left:4px;
	text-decoration: none;	
	
	
}
.roll:hover {
	background-image:url(images/LEARNMORE.png);
	color:#FFFFFF
	
}
.back {
	display:block;
	height:20px; /* use the images' dimensions */
	width:95px;
	background-image:url(images/backb.png);
	background-repeat:no-repeat;
	color:#999999;
	line-height:20px;
	font-size:9px;
	font-weight:bold;
	text-align:center;
	vertical-align:middle;
	padding-right:0px;
	border-bottom:none;
	
	
}
.back:hover {
	background-image:url(images/back.png);
	border-bottom:none;
	color:#FFFFFF
}



.indent {
	background-color:#000000;
	padding: 8px 8px 8px 8px;
	margin-bottom: 10px;
}
.indent p {color:#FFFFFF}
.indent a {
	color:#99FF00
}
.indent a:hover {color:#FFFF00}
.indent a:visited {color:#FF0000}

.indent h1 {color:#999999}
.indent h2 {color:#666666}
.indent h3 {
	color:#999999}


.indentgrey {
	background-color:#999999;
	padding: 15px 8px 15px 8px;
	margin-bottom: 10px;}
.indentgrey p {color:#FFFFFF}
.indentgrey h1 {color:#666666}
.indentgrey h2 {color:#666666}
.indentgrey h3 {color:#666666}


.white {background-color:#FFFFFF}
.hidstyle {width: 730px; background: #C5E6F6; display:none;}