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

APN Corporate CSS

Version: 0.1
Author: Jack Taranto
Email: jacktaranto@gmail.com
Website: http://www.jacktaranto.com

Design by Precious Media, www.preciousmedia.com

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



/* TYPOGRAPHY
----------------------------------------------------*/

p {font-size:90%; line-height:140%; margin-bottom:1em;}

h1, h3 {
	font-size:95%;
	line-height:95%;
	margin-bottom:1em; 
	text-transform:uppercase; 
	padding-left:15px;
	background:url(images/glyph_h1.jpg) no-repeat left 2px;
	margin-bottom:1.5em;
}

h3 {margin-top:1em; margin-bottom:0.5em;background-image:none; padding:0; text-transform:none; color:#444;}

h2 {
	font-size:94%;
	line-height:110%;
	margin-bottom:0.2em;
	color:#0e4e71;
}

h2 a {text-decoration:underline; color:#0e4e71;}

p.readmore {
	text-align:right;
}

p.readnews {
	font-size:80%;
	margin-top:-0.6em;
	margin-bottom:1.2em;
}

p.readnews a {color:#008cbd; padding-left:10px; font-weight:bold; background:url(images/glyph_readmore.jpg) no-repeat left 4px;}
p.readnews a:hover {color:#0e4e71;}

.readmore a {
	padding-left:10px;
	background:url(images/glyph_readmore.jpg) no-repeat left 5px;
	font-weight:bold;	
}

ul.infolist, ol.infolist {font-size:90%; line-height:140%; padding-left:35px; margin-bottom:1em;}

ol.infolist {padding-left:20px;}

ol.infolist li {padding-bottom:1em;}

.contactus h2 {padding-top:1em;}

p.quote {text-indent:23px; background:url(images/glyph_quotein.gif) no-repeat left top;}

p.bold {font-weight:bold;}


/* COLOUR
----------------------------------------------------*/

p, li, {color:#666;}

#footernav a, #footer a {color:#666;}

#footernav, #footer {color:#333;}

h1 {color:#444;}

a {color:#425f6f; text-decoration:underline;}
a:hover {color:#2a4756;}

#footernav a:hover, #footer a:hover {color:#333;}





/* LIST STYLES
----------------------------------------------------*/

ul.itemlist {margin-left:40px; margin-bottom: 1em;}

ul.itemlist li {padding-bottom:4px;}


/* NAVIGATION
----------------------------------------------------*/


/* Begin Primary Navigation */

#primarynav {position:absolute; top:41px; background:url(images/bg_navul2.jpg) repeat-x top; list-style:none; padding-top:5px; z-index:4;}

#primarynav li {float:left; position:relative; border-right:1px solid #0a787b; margin:1px 0 0 0;}

#primarynav li a {
	display:block;
	font-size:90%;
	text-transform:uppercase;
	line-height:33px;
	height:33px;
	font-family:Helvetica, Arial, sans-serif; 
	color:#FFF;
	text-decoration:none;
	background:url(images/bg_nav2.png) left top;
	text-align:center;
}

#primarynav li a:hover {background:url(images/bg_nav2.png) 199px top;}

#home {width:86px;}

#about {width:111px;}

#plans {width:96px;}

#services {width:118px;}

#tech {width:131px;}

#support {width:106px;}

#contact {width:120px;}

#primarynav li ul {
	position:absolute; 
	list-style:none; 
	display:none; 
	margin:0; 
	top:33px; 
	left:0; 
	width:170px; 
	border-width:0 1px;
	border-style:solid;
	border-color:#ccc; 
	z-index:4;
}

#primarynav li:hover ul, #primarynav li.over ul {display: block; }

#primarynav li ul li {float:none; border:0;  margin:0; padding:0;}

#primarynav li ul li a, #primarynav li ul li.heading {
	height:24px;
	line-height:24px;
	display:block; 
	float:none;
	background:#e1e5e6;
	font-size:90%;
	text-transform:none;
	text-align:left;
	padding-left:1em;
	margin:0;
	color:#444;
	border-bottom:1px solid #ccc;
	border-top:1px solid #fff;
}

#primarynav li ul li a:hover {background:#ddd;}

#primarynav li ul li.heading {font-weight:bold;}

/* End Primary Navigation */


/* Begin Secondary Nav */

ul#secondarynav {list-style:square; list-style-image:url(images/glyph-arrow.jpg); margin:20px 10px 20px 35px; font-size:95%;}

ul#secondarynav li a {text-decoration:none;}

ul#secondarynav li {margin-top:9px; line-height:90%;}

ul#secondarynav li ul {padding-left:20px;}

ul#secondarynav li.heading {font-size:110%; list-style-image:url(images/glyph_h1.jpg);  font-weight:bold;}

ul#secondarynav li.heading a {color:#444;}

/* End Secondary Nav */


/* Begin Footer Navigation */

ul#footernav {list-style:none; padding:1em 0 0.5em 0; margin:0; font-size:90%;}

ul#footernav li {display:inline;}

ul#footernav li a {padding:0 6px 0 0; margin-right:5px; border-right:1px solid #666;}

ul#footernav li a.noborder {border:0;}

/* End Footer Navigation */


/* Begin Top Links */

#toplinks {text-align:right; padding-top:1.5em; margin-bottom:0.5em;}

#toplinks a {color:#666;}
#toplinks a:hover {color:#333;}

a#searchlink {padding:0 10px 0 15px; background:url(images/glyph_search.jpg) no-repeat left 2px;}

a#sitemap {padding:0 0 0 15px; background:url(images/glyph_sitemap.jpg) no-repeat left 2px;}

/* End Top Links */




/* IMAGES
----------------------------------------------------*/

img {margin:0;}

.right {float:right;}
.left {float:left;}
img.border {border:1px solid #444; margin-left:20px; margin-bottom:20px;}
.portrait {float:left; margin-left:-120px; margin-right:20px; margin-bottom:10px; border:1px solid #333;}



/* FORMS
----------------------------------------------------*/


/* Begin My Account Login */

#myaccount {background:#686868 url(images/bg_myacc.jpg) repeat-x top;; text-align:right; padding:8px; border:0;}

#myaccount h2 {font-size:95%; color:#fff; margin-bottom:10px;}

#myaccount label {float:left; text-align:right; padding:2px 0 0 10px; color:#fff; font-size:90%;}

#myaccount input {background:#fff; width:100px; border:1px solid #ccc; margin-bottom:8px; color:#333;}

#myaccount input.submit {width:auto; background:url(images/bg_formbtn.jpg) repeat-x top; color:#333;}

#myaccount p {margin-bottom:3px;}

#myaccount p a {color:#333;}

/* End My Account Login */




/* TABLES
----------------------------------------------------*/

.infotable {margin-bottom:5px; width:100%; font-size:90%; border:solid #ccc; border-width:1px 0 0 1px; color:#333; background:#fff;}

.infotable th {text-align:center; background:#81c3b5 url(images/bg_thead.jpg) repeat-x top; padding:5px; border:solid #ccc; border-width:0 0 1px 0;}

.infotable th.nobac {background-image:none; background:#fff;}

.infotable .end {border-right:1px solid #ccc;}

.infotable .odd {background:#e9f8f8;}

.infotable td {padding:5px; border:solid #ccc; border-width:0 1px 1px 0;}

table.inside {margin:1em 0 1.2em 0;}

table.center {text-align:center;}

td.leftalign {text-align:left;}

/* LAYOUT
----------------------------------------------------*/


/* Begin Page Elements */

.contentpiece {margin-bottom:1.5em; border-bottom:1px solid #ccc;}

.box {border:1px solid #bbb; height:100%; margin-bottom:5px; padding:20px;}

.boxnopad {border:1px solid #bbb; margin-bottom:5px; padding:0;}

.boxnobord {margin-bottom:5px; padding:0; border:0;}

.content {background:#efefef;}

.leftcolum {float:left; width:45%; padding-right:4%; border-right:1px solid #ccc;}

.rightcolum {float:right; width:45%;}

.floatbox {clear:both; padding-top:10px; padding-left:120px;}

.overflow {overflow:auto;}


#info {padding-bottom:10px; }
#info h2, #info p {margin-left:55px;}
#info img {margin-left:-5px;}

#secnavbox {border:1px solid #ccc; padding:0;}


/* End Page Elements */


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

body {
	font-size:small;
	text-align: center;
	background:#c2c0c0 url(images/bg1.jpg) repeat-y center;
	font-family:Tahoma, Verdana, Arial, sans-serif;
}


/* Begin Page Areas */

#wrapper {width:776px; text-align: left; margin:0 auto;}

#head {height:80px;}

#pagecontent {position:relative; margin-top:5px; z-index:1; clear:both;}

#left_column {float:left; padding-left:65px; width:505px; background:url(images/bg_page2.gif) no-repeat left top; z-index:2;}

#right_column {float:right; width:201px; z-index:3;}

#footer {clear:both; margin-left:65px; margin-bottom:30px;}

/* End Page Areas */





