/* --------------------basic stylesheet--------------- */

/*css browser reset*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {	margin: 0; 	padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; 	background: transparent;}
body {line-height: 1.4;}
ol, ul {	list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {	content: '';content: none;}
/* remember to define focus styles! */
:focus {	outline: 0;}
/* remember to highlight inserts somehow! */
ins {	text-decoration: none;}
del {	text-decoration: line-through;}
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: collapse; border-spacing: 0;}
/*end browser css reset*/

html {height: 101%;}
body { font:16px "Georgia",arial,verdana,sans-serif; line-height: 1.4; min-width:785px; width:100%; background-color:#fafafa;}
img {border:none;}

#home .home, #features .features, #faq .faq, #news .news, #contact .contact, #subscribe .subscribe {color:#ccc;}

#wrapper { position:absolute; width:900px; min-width:785px; left:50%; margin-left:-450px; margin-top:40px; }

.accessaid {position:absolute; height:0; overflow:hidden;}	
	
/*begin header*/
#header {height:90px; width:100%; margin-left:13px; padding:0; background-image: url(../img/pubblegumlogoMedium.png); background-repeat:no-repeat; background-position: top left;}
/*#logo {float:left;  top:25px;  left:10px; z-index:5;}*/

/* navigaton top header */
#topLinks { float:right; top:0; margin-right:18px; text-align:right; font-family: Verdana; color:#666;  font-size: 70%; }
#topLinks ul {list-style-type:none; width:100%; padding-top:0; margin:0; height:40px; z-index:100;}
#topLinks li {display:inline; margin:0; padding:0; z-index:100;}
#topLinks  a{color:#666; padding: 0 6px; text-decoration:underline;z-index:100;}
#topLinks  a:hover{color:#666; text-decoration:;z-index:100;}

/*end navigation top header*/
/*navigation  header bottom*/
#siteNav {float:left; margin-top:29px; margin-left:210px;   z-index:100;  text-align:left;   background:transparent; font-family: Verdana; font-size:125%;}
#siteNav ul{list-style-type:none; width:100%; padding:0; margin:0; }
#siteNav li {display:inline; margin:0; padding:0; }
#siteNav a{color:#666;  padding: 0 6px; text-decoration:none;}
#siteNav a:hover{color:#ff66cc;text-decoration:none;}
/*end navigation header bottom*/
/*end header*/



.subnav ul {list-style-type: none; color:#333; }
.subnav  li{font-size:16px; font-weight:normal; line-height: 1.3; padding-left:15px; }
.col2 {margin-left: 268px;}
.col3 {margin-left: 536px;}
.top {margin-top: -9.1em;}
	
#wrapContent {margin-top:0;}

#mainContent {float: left; }

#mainContent {width: 900px; font-size:12px; color:#333; background-color:#fafafa;}
#mainContent h1 {color:#999;  font-size:230%; float:left;  margin:0 12px 30px 13px; font-family: Verdana; font-weight:normal;}
#mainContent h2   {font-family: Verdana;  font-size: 24px;  font-variant: small-caps; font-weight: normal; color:#ff66cc;}  
#mainContent h3  {font-size:18px; font-weight:bold; color:#333; }
#mainContent h4  {font-size:16px; font-weight:normal; line-height: 1.3;  color:#999; }

#mainContent h5  {font-size:12px; font-weight:normal; color:#333; padding:0 0 5px 0;}
#mainContent p {font-size:12px; padding: 5px 0 5px 0;}
.subtitle {color:#999; font-size:10px; margin-top:5px;}
#highlight h4{color:#333; font-weight:bold; line-height: 1.7; }
.hr {width:880px; margin-left:13px; margin-top:10px; border-top:2px solid #ccc;}
.hrsub{width:880px; margin-top:10px; border-top:2px solid #ccc;}
.hrbottom  {width:880px; margin-left:15px; margin-top:10px; border-top:2px solid #ccc;}

.columnContainer {padding-top: 10px; }
.column {float: left;  margin: 0 5px 10px 10px; }
.column {width: 268px; padding:10px; margin: 0 5px 0 5px;}
#mainContent.spanTwo {width: 575px;}
#mainContent .spanThree {width: 890px; font-size:12px; color:#fafafa; background-color:#333;}
#fullContent { width: 865px;  padding:0 15px 0 15px; }
#fullContent2  { width: 865px;  padding:0 15px 0 15px; }
#duoContentspanTwo  {width: 890px;}	
.duoContentColumn  {float: left; width: 422px; padding:10px 10px 10px 13px;}
#quartContent .spanTwo {width:429px;}
#quartContent .spanThree {width:655px;}
#quartContent .spanFour  {width:890px;}
.quartContentColumn {width:202px;}
#quintContent .spanTwo {width: 334px; margin: 0 5px 10px 5px;}
#quintContent .spanThree {width: 500px; background-color:#fafafa;}
#quintContent .spanFour {width: 700px;}
#quintContent .spanFive {width: 890px;}
.quintContentColumn {width: 157px;}





.clearFix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}

#pubblegum {width:865px; text-align: center; border-collapse: collapse; font-family:Verdana;}
#pubblegum span {color:#ff2800;}
#pubblegum th {width: 173px; padding:8px 6px;}
#pubblegum td {width:173px; padding:8px 6px;}
#pubblegum .yellow {background-color:#fdfb02;}
#pubblegum .odd {background-color:#bfe2e4;}
#pubblegum tr:hover td {background-color:#98cad1;}
#pubblegum td.left{text-align:left;}

/*#footer {width:900px; background-color:#bfe2e4; margin-top:10px; height:195px; padding-top:2px; }
#footer  h2{padding-bottom:5px;}
#footer .smallHeader  {font-variant: normal; font-weight: bold; font-family: Verdana;  color: #303030; font-size: 12px; text-transform: capitalize; color:#666; padding-left:5px; }
#footer .small {font-size:11px; font-family: Georgia,Verdana,Arial,sans-serif; padding-left:5px;}
#footer .column {width:190px;}
#footer a {font-size:11px;}
#footer a:hover{color:#ffaa00; text-decoration:none;}
#footer form{padding-left:10px;}*/

#bottomNav {position:absolute; width:880px; float:left;  margin-left:16px;  z-index:100; color:#111; text-align:left; font-size:90%;  }
#bottomNav ul{list-style-type:none; width:100%; padding:0; margin:0; }
#bottomNav li {display:inline; margin:0; padding:0;}
#bottomNav a{color:#111; text-decoration:none; padding: 0 6px;}
#bottomNav a:hover{color:#ff6677; text-decoration:none;}

/*debugging stuff 

#grid {
		background: url(grid.png) 50% 0 repeat-y;
		z-index: 1000;
		}
		
 Debugging colours

#mainContent {
		background: orange;
		}

#sidebar {
       background: #00a651;
		}

.column {
		background: red;
		}

	*/