/* @override http://www.slord.com.ph/textpattern/css.php?n=main */

/* @override http://www.slord.com.ph/textpattern/css.php?n=main */

/* - - - - - - - - - - - - - - - - - - - - -

Title : SLORD Development Corporation Master Stylesheet
Author : Juan Magdaraog
URL : www.sparkplug-studios.com

Description : 

Created : April 20, 2006
Modified : 

- - - - - - - - - - - - - - - - - - - - - */

/* ----- CSS ----- */

body, html {
	margin: 0;
	padding: 0;
	background: #ffffff url('/images/background.gif') repeat-x top left;
	xbackground: #ffffff url('/images/bg-main4.jpg') repeat-x top left;
	xbackground: #000; 
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #3a3a3a;
}



a:link {
	color: #3d42a4;
	text-decoration: none;
	border-bottom: 1px dotted #3d42a4;
}

a:visited {
	color: #3d42a4;
	text-decoration: none;
	border-bottom: 1px dotted #3d42a4;
}

a:hover {
	background: #da8500;
	color: #ffffff;
	border-bottom: 1px dotted #ffffff;
}

a:active {
	
}

.date {
	font-weight: bold;
}

.clearboth {
    clear: both;
}

div.hr {
height: 1px;
display: block;
clear: both;
background: #fff url('/images/hr-line.gif') no-repeat scroll center;
padding: 0 0 0 0;
margin: 0;
}

div.hr hr {
display: none;
}




/* ----- IDS ----- */

#container {
	width: 780px;
	margin: 0 auto;
    padding: 0 0 0 0;
	background: #ffffff url('/images/bg-main.gif') repeat-y top right;
	border: 1px solid #CCC;
	text-align: left;
}

#header {
	margin: 0;
	height: 115px;
	padding: 0;
	background: #3035a0 url('/images/watermark.jpg') no-repeat top right;
	border-bottom: 5px solid #ffffff;
	color: #ffffff;
}

#header p {
	margin: 68px 0 0 325px;
	position: absolute;
	padding: 0;
	font-size: .7em;
}

#header #logo {
    position: absolute;
	margin: 20px 0 0 320px;
	padding: 0;
	width: 428px;
	height: 66px;
}

#header #logo img{
    border: 0;
}

#header #logo img a{
    border: 0;
	color: none;
}

#header #logo a:hover{
    background-color: transparent;
	border-bottom: none;
}

/*----- navigation -----*/
#navigation {
	background: #013160;
	height: 29px;
	margin: 0 0 0 0 ;
	padding: 0;
}

#navigation ul {
	list-style-type: none;
	margin: 0;
	margin-left: 96px;
	padding: 0;
	width: 684px;
	height: 28px;
}

#navigation ul li {
	float: left;
	margin: 0;
	padding: 0;
	height: 28px;
}

#navigation ul li#home a {
	display: block;
	width: 172px;
	height: 28px;
	background:  blue url('/images/in-nav-new.gif') no-repeat 0 0;
	text-indent: -10000px;
}

#navigation ul li#home a:hover {
	display: block;
	width: 172px;
	height: 28px;
	background:  blue url('/images/in-nav-new.gif') no-repeat 0 -28px;
}

#navigation ul li#toll a {
	display: block;
	width: 172px;
	height: 28px;
	background: red url('/images/in-nav-new.gif') no-repeat -172px 0;
	text-indent: -10000px;
}

#navigation ul li#toll a:hover {
	display: block;
	width: 172px;
	height: 28px;
	background: red url('/images/in-nav-new.gif') no-repeat -172px -28px;
}

#navigation ul li#consumer a {
	display: block;
	width: 170px;
	height: 28px;
	background: orange url('/images/in-nav-new.gif') no-repeat -344px 0;
	text-indent: -10000px;
}

#navigation ul li#consumer a:hover {
	display: block;
	width: 170px;
	height: 28px;
	background: orange url('/images/in-nav-new.gif') no-repeat -344px -28px;
	text-indent: -10000px;
}

#navigation ul li#about a {
	display: block;
	width: 170px;
	height: 28px;
	background: green url('/images/in-nav-new.gif') no-repeat -514px 0;
	text-indent: -10000px;
}

#navigation ul li#about a:hover {
	display: block;
	width: 170px;
	height: 28px;
	background: green url('/images/in-nav-new.gif') no-repeat -514px -28px;
	text-indent: -10000px;
}

/*----- main image -----*/

#mainimage {
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #e4e4e4;
	background: #577ee6;
	height: 337px;
}

/*----- primary content -----*/

#primaryContent {
	margin: 0 270px 0 0;
	background: #ffffff;
}

#primaryContent .left {
	float: left;
    xbackground-color: #00CC99;
    width: 150px;
    height: 100px;
    xmargin: 0 0 0 20px;
    padding: 0 0 0 20px;
    text-align: center;
}

#primaryContent .left p {
	margin: 0 0 0 0;
    padding: 0 0 0 0;
    font-size: .7em;
}

#primaryContent .right {
	float: left;
    xbackground-color: #FFCC00;
    width: 320px;
    xheight: 100px;
    margin: 0 0 0 20px;
}

#primaryContent .right table {
	border: 1px solid #000;
    font-size: .8em;
}

#primaryContent .right table p {
margin: 0 5px 0 5px;
	
}

#primaryContent .right p {
	font-size: .8em;
	line-height: 1.6em;
	margin: 0 0 10px 0;
	padding: 0;
}

#primaryContent .right ul {
	list-style-type: none;
    margin: 0 0 0 30px;
    padding: 0 0 0 0;
    clear: both;
}

#primaryContent .right ul li {
	float: left;
    display: block;
    width: 80px;
    margin: 0px 10px 0 0;
    text-align: center;
    font-size: .8em;
    line-height: 1.6em;
}

#primaryContent h2 {
	font-size: 1em;
	color: #2f349d;
	margin: 20px 10px 20px 20px;
}

#primaryContent h2.services {
	font-size: 1em;
	color: #A00000;
	margin: 20px 10px 20px 20px;
}

#primaryContent h2.brands  {
	font-size: 1em;
	color: #F37A01;
	margin: 20px 10px 20px 20px;
}

#primaryContent h2.about {
	font-size: 1em;
	color: #009900;
	margin: 20px 10px 20px 20px;
}

#primaryContent h2.news {
	font-size: 1em;
	color: #009900;
	margin: 20px 10px 20px 20px;
}

#primaryContent h3 {
	font-size: 0.9em;
	color: #A20202;
	margin: 0 0 10px 20px;
}

#primaryContent h4 {
	font-size: 0.9em;
	color: #000;
	margin: 5px 0 0 5px;
}

#primaryContent p {
	font-size: .8em;
	line-height: 1.6em;
	margin: 10px 10px 10px 20px;
	padding: 0;
}

#primaryContent ul {
	font-size: .8em;
	line-height: 1.6em;
	margin-left: 50px;
}

#primaryContent ul li {
	padding: 0 0 5px 0;
	margin: 0 0 0 0;
}

#primaryContent img.excerptpic {
	margin: 0 30px 10px 20px;
	padding: 0;
	xborder: 1px solid #e4e4e4;
	float: left;
}

#primaryContent img.brandpic {
	margin: 0 10px 10px 5px;
	padding: 0;
	border: 1px solid #e4e4e4;
	float: left;
}

#primaryContent img.brandpic2 {
	margin: 0 10px 10px 5px;
	padding: 0;
	border: 1px solid #e4e4e4;
	float: right;
}

div.floatctrl {
	overflow:auto; 
	width:100%;
}

#primaryContent .productlist {
   float: left;
   
   width: 150px;
   height: 260px;
   padding-left: 20px;
   text-align: center;
   font-size: .8em;
}


/*----- secondaryContent -----*/

#secondaryContent {
	float: right;
    width: 247px;
	\width: 247px;
	w\idth: 247px;
	margin: 0;
	padding: 0;
}

#secondaryContent img {
	padding: 0;
	margin: 0 0 10px 10px;
	border: 1px solid #CCC;
	
}

#secondaryContent span a:link  {
	background: none;
	border: 0; 
}

#secondaryContent span a:hover  {
	background: none;
	border: 0;
}

#secondaryContent #content {
	display: block;
}

body.home #secondaryContent {
	xbackground: url('/images/bg-logo.gif') no-repeat 104px 315px;
	background: url('/images/bg-logo.gif') no-repeat 90% 90%;
}

#secondaryContent h2 {
	font-size: 1em;
	color: #2f349d;
	margin: 20px 10px;
}

#secondaryContent p {
	font-size: .7em;
	line-height: 1.6em;
	margin: 10px 10px 10px 10px;
	padding: 0 0 20px 0;
}

#secondaryContent ul {
	font-size: .7em;
	list-style-image: url('/images/bullet.gif');
	margin-bottom: 50px;
	margin-left: 30px;
}

#contact {
    background-color: transparent;
}

#contact xul {
    font-size: .7em;
    list-style-image: url('/images/bullet.gif');
	margin-bottom: 50px;
	background: #CCC;

}

#contact ul li {
    padding: 0 0 5px 0;
}

/*----- footer -----*/

#footer {
	display: block;
	clear: both;
	text-align: center;
	margin: 0;
	padding: 10px;
	background: #9c9c9c;
	border-top: 1px solid #cecece;
}

#footer p {
	margin: 0;
	padding: 0;
	color: #ffffff;
	font-size: .8em;
	line-height: 1.6em;
}

#container #footer a:link {
	color: #ffffff;
	text-transform: uppercase;
	text-decoration: none;
	border: 0;
}

#container #footer a:visited {
	color: #ffffff;
	text-transform: uppercase;
	text-decoration: none;
	border: 0;
}

#container #footer a:hover {
	color: #ffffff;
	background: none;
	text-transform: uppercase;
	text-decoration: none;
	border: 0;
}

#container #footer a:active {
	color: #ffffff;
	text-transform: uppercase;
	text-decoration: none;
	border: 0;
}

div#secondaryContent p a img {
	margin: 0;
}