/********** LAYOUT **********/

/* PAGES */


html, body {
	margin: 0;
	padding: 0;
	height: 100%; /* needed for pageContainer min-height */
	text-align: center;
	
}


div#pageContainer {
	width: 960px;
	margin: 0 auto; /* center, not in IE5 */
	padding: 0;
	background: #fff;
	text-align: center;
	height:auto !important; /* real browsers */
	height:100%; /* IE6: treaded as min-height*/
	min-height:100%; /* real browsers */
}

div#page {
	background: #fff;
	width: 960px;
	margin: 0 auto;
	padding: 0;
	text-align: center;	
}


/* HEADER */

div#header {
	margin: 0;
	text-align: left;
	height: 124px;
}

div#logo {
      width: 160px;
      height: 124px;
      line-height: normal;
}

div#logo a {
         display: block;
         width: 160px;
         height: 124px;
         background: transparent url("images/ui/logo.png") no-repeat;
}



/* CONTENT */


.push { /* needed for sticky footer */
	height: 3em;
}



/* FOOTER */

div#footer {
	color: #fff;
      width: 100%;
      clear: left;
	text-align: left;
	font-size: 12px;
	border-top: 6px solid #000;
      background: transparent url("images/ui/bakk.jpg") repeat-x top left;
      height: 150px;	
}


div#footer a, a:link a:active a:visited {
   color: #fff;
   text-decoration: none;
}

div#footer a:hover {
   color: #ccc;
   text-decoration: underline;
}



div#footer .footInfo {
	width: 960px;
	margin: 0 auto;
	padding-top: 14px;
	overflow: hidden;
	padding-bottom: 80px;
}

div#footer .rss {
	width: 200px;
	float: left;
      line-height: 24px;
      padding: 0px 0px 0px 28px;
      background: transparent url("images/ui/rss.png") no-repeat;
}

div#footer .thumbLogos {
	width: 200px;
	float: left;
      text-align: left;
      line-height: 24px;
      padding: 0px 0px 0px 0px;
}

div#footer .legal {
	width: 600px;
	float: right;
      text-align: right;
      line-height: 1.5em;
}


/* COLUMNS */


div#columnWrapper {
      width: 960px;
	display: block;
	height: auto;
}

div#colOne {
      margin: 0;
      float: left;
      width: 350px;
      text-align: left; 
}

div#colTwo {
      margin: 0px 0px 0px 10px;
      float: left;
      width: 405px;
      text-align: left; 
}

div#colThree {
      margin: 0px 0px 0px 10px;
      float: left;
      width: 185px;
      text-align: left; 
}

div#colFour {
      margin: 0px 0px 0px 10px;
      float: left;
      width: 600px;
      text-align: left; 
}

div#colOne, div#colTwo, div#colThree, div#colFour {
     padding: 0px 0px 40px 0px;
}



div#colOne li {
     width: 250px;
     list-style: none;
     background: transparent url("images/ui/cyan.gif") no-repeat; 
     margin: 18px 0px 0px 10px;
     padding: 0px 0px 0px 18px;
     line-height: 2.2em;
     vertical-align: center;
}

div#colTwo li {
     width: 200px;
     list-style: none;
     background: transparent url("images/ui/magenta.gif") no-repeat; 
     margin: 18px 0px 0px 0px;
     padding: 0px 0px 0px 18px;
     line-height: 2.2em;
     vertical-align: center;
}

div#colThree li {
     width: 150px;
     list-style: none;
     background: transparent url("images/ui/yellow.gif") no-repeat; 
     margin: 18px 0px 0px 0px;
     padding: 0px 0px 0px 18px;
     line-height: 2.2em;
     vertical-align: center;
}

div#colFour li {
     list-style: none;
     background: transparent url("images/ui/magenta.gif") no-repeat; 
     margin: 18px 0px 0px 0px;
     padding: 0px 0px 0px 18px;
     line-height: 2.2em;
     vertical-align: center;
}



.line {
    width: 100%;
    height: 2px;
    background: transparent url("images/ui/dotty.gif") repeat-x top left; 
    margin: 14px 0px 0px 0px;  
}

.lineIndex {
    width: 100%;
    height: 2px;
    background: transparent url("images/ui/dotty.gif") repeat-x top left; 
    margin: 4px 0px 0px 0px;  
}


.lineBlock {
    width: 100%;
    height: 12px;
    background: transparent url("images/ui/dotty.gif") repeat-x top left; 
    margin: 10px 0px 10px 0px;  
    padding: 0px 0px 0px 0px;
    border-bottom: 6px solid #333;
}


.pic {
    border: 1px solid #333;
    width: 397px;
    height: 233px;
    padding: 3px !important;
    margin: 12px 0px 16px 0px;
}

.pic2 {
    border: 1px solid #333;
    width: 397px;
    height: 156px;
    padding: 3px !important;
    margin: 12px 0px 16px 0px;
}

.picBig {
    border: 1px solid #333;
    width: 590px;
    height: px;
    padding: 4px !important;
    margin: 12px 0px 16px 0px;
}

.readMore {
      font-size: 11px;
      color: #333;
      height: 11px;
      width: 80px;
      margin: 16px 0px 16px 0px;
      padding: 4px 0px 5px 10px;
      background-color: #00ffff;
}

.readMoreYellow {
      font-size: 11px;
      color: #333;
      height: 11px;
      width: 140px;
      margin: 10px 0px 10px 0px;
      padding: 3px 0px 5px 10px;
      background-color: #ffff00;
}

.readMoreMagenta {
      font-size: 11px;
      color: #fff;
      height: 11px;
      width: 250px;
      margin: 12px 0px 10px 0px;
      padding: 3px 0px 5px 10px;
      background-color: #ff00ff;
}


.lineThin {
    width: 100%;
    height: 2px;
    margin: 11px 0px 0px 0px;  
    border-bottom: 6px solid #333;
}

.lineThinIndex {
    width: 100%;
    height: 2px;
    margin: 10px 0px 2px 0px;  
    border-bottom: 6px solid #333;
}

.crew {
     height: 122px;
     background: transparent url("images/ui/dotty.gif") repeat-x bottom left; 
}

.crewPic {
        float: left;
}

.crewRight {
     float: left;
     width: 105px;
     text-align: left;
     margin: 30px 4px 0px 10px;
}

.lineCrew {
    width: 100%;
    height: 2px;
    background: transparent url("images/ui/dotty.gif") repeat-x top left; 
    margin: 54px 0px 0px 0px;  
}

.readMoreMagazine {
      font-size: 11px;
      color: #333;
      height: 11px;
      width: 170px;
      margin: 16px 0px 16px 0px;
      padding: 4px 0px 5px 10px;
      background-color: #00ffff;
}


div#free {
   width: 225px;
   height: 38px;
   padding: 0px 0px 0px 0px;
   margin: 0;
}

div#free img {
      float: right;
      margin: -45px 0px 0px 0px;
}

.lineFree {
    width: 100%;
    height: 2px;
    background: transparent url("images/ui/dotty.gif") repeat-x top left; 
    margin: 0px 0px 0px 0px;  
}


div#colThree .downloadsYellow ul { 
      margin: 10px 0px 5px 0px;
      padding: 5px 0px 5px 0px;
      font-size: 11px;
      color: #333;
      height: auto;
      overflow: hidden;
}


div#colThree .downloadsYellow li {
         float: left;
         width: 185px;
         margin: 0px 0px 12px 0px;
         padding: 0;
         line-height: 1.7em;
         display: inline;
	   list-style: none;
         background: transparent;
}

 .acrobat {
        width: 100%;
        padding: 5px 0px 0px 0px;
        background: transparent url("images/ui/dotty.gif") repeat-x top left !important; 
}

 .acrobat2 {
        width: 100%;
        padding: 5px 0px 0px 0px;
}


div#colOne .downloadsCyan ul { 
      margin: 10px 0px 5px 0px;
      padding: 5px 0px 5px 0px;
      font-size: 11px;
      color: #333;
      height: auto;
      overflow: hidden;
}


div#colOne .downloadsCyan li {
         float: left;
         width: 300px;
         margin: 0px 0px 12px 0px;
         padding: 0;
         line-height: 1.7em;
         display: inline;
	   list-style: none;
         background: transparent;
}

.sweetLink {
     margin: 15px 0px 16px 0px;
     padding: 0px 0px 0px 0px;
     line-height: 1.5em;
}

div#colFour .previousYellow ul { 
      margin: 8px 0px 5px 0px;
      padding: 5px 0px 5px 0px;
      font-size: 11px;
      color: #333;
      height: auto;
      overflow: hidden;
}


div#colFour .previousYellow li {
         float: left;
         width: 580px;
         margin: 0px 0px 12px 0px;
         padding: 0;
         line-height: 1.7em;
         display: inline;
	   list-style: none;
         background: transparent;
}

.date {
      font-size: 11px;
      color: #fff;
      height: 11px;
      width: 120px;
      margin: 10px 0px 10px 0px;
      padding: 3px 0px 5px 10px;
      background-color: #ff00ff;
}

.start {
      font-size: 11px;
      color: #fff;
      height: 11px;
      width: 160px;
      margin: 10px 0px 10px 0px;
      padding: 3px 0px 5px 10px;
      background-color: #ff00ff;
}

.price{
      font-size: 11px;
      color: #fff;
      height: 11px;
      width: 220px;
      margin: 10px 0px 16px 0px;
      padding: 3px 0px 5px 10px;
      background-color: #ff00ff;
}

div#sponsors {
            margin: 8px 0px 10px 0px;
            width: 350px;
            background: #404040 url("images/ui/bottom.gif") no-repeat bottom left;
            padding: 0 0 30px;
}

div#sponsors p {
            background: #fff url("images/ui/top.gif") no-repeat;
            padding: 20px 12px 0px 12px;
            background-color: #404040;
            margin: 0;
            color: #fff;
            line-height: 1.6em; 
}
            
.blak {
     width: 288px;
     font-size: 10px;
     font-weight: bold;
     line-height: 1.4em;
     background: #000;
     color: #fff;
     margin: 14px 0px 0px 12px;
     padding: 18px 18px 20px 18px;
}

.lineWhite {
    width: 100%;
    height: 2px;
    background: transparent url("images/ui/dotty.gif") repeat-x top left; 
    margin: 10px 0px 8px 0px;  
}

.ad {
    width: 288px;
    margin: 4px 0px 0px 0px;
}


.ad img {
   width: 94px;
   margin: 0px 0px 1px 0px;
}

.pink p {
    color: #ff00ff;
    height: 16px;
}

.pink {
     vertical-align: center;
}


div#features {
            margin: 8px 0px 10px 0px;
            width: 350px;
            background: #404040 url("images/ui/bottom.gif") no-repeat bottom left;
            padding: 0 0 30px;
}

div#features p {
            background: #fff url("images/ui/top.gif") no-repeat;
            padding: 16px 12px 0px 12px;
            background-color: #404040;
            margin: 0;
            color: #fff;
            line-height: 1.6em; 
}

.featurePic {
    margin: -18px 0px 10px 12px;

}

.featureText {
       margin: 0px 10px 0px 12px;
       color: #fff;
       line-height: 14px;
}

.moreInfo {
   background: #404040 url("images/ui/more2.gif") no-repeat;
   width: 100px;
   height: 20px;
   margin: 14px 10px -6px 12px;
   color: #fff;
   padding: 4px 0px 0px 26px;
}


/* PRESS */


div#pressOne {
      margin: 0;
      float: left;
      width: 312px;
      text-align: left; 
}


div#pressOne li {
     width: 250px;
     list-style: none;
     background: transparent url("images/ui/cyan.gif") no-repeat; 
     margin: 18px 0px 0px 12px;
     padding: 0px 0px 0px 18px;
     line-height: 2.2em;
     vertical-align: center;
}

div#pressTwo {
      margin: 0px 0px 0px 12px;
      float: left;
      width: 313px;
      text-align: left; 
}

div#pressTwo li {
     width: 200px;
     list-style: none;
     background: transparent url("images/ui/magenta.gif") no-repeat; 
     margin: 18px 0px 0px 0px;
     padding: 0px 0px 0px 18px;
     line-height: 2.2em;
     vertical-align: center;
}

div#pressThree {
      margin: 0px 0px 0px 12px;
      float: left;
      width: 311px;
      text-align: left; 
}

div#pressThree li {
     width: 290px;
     list-style: none;
     background: transparent url("images/ui/yellow.gif") no-repeat; 
     margin: 18px 0px 0px 0px;
     padding: 0px 0px 0px 18px;
     line-height: 2.2em;
     vertical-align: center;
}

div#pressOne, div#pressTwo, div#pressThree {
     padding: 0px 0px 40px 0px;
}

div#pressOne .pressCyan ul { 
      margin: 15px 0px 5px 0px;
      padding: 5px 0px 5px 0px;
      font-size: 11px;
      color: #333;
      height: 150px;
      overflow: hidden;
}


div#pressOne .pressCyan li {
         float: left;
         width: 250px;
         margin: 0px 0px 12px 0px;
         padding: 0;
         line-height: 1.7em;
         display: inline;
	   list-style: none;
         background: transparent;
}

div#pressTwo .pressMagenta ul { 
      margin: 15px 0px 5px 0px;
      padding: 5px 0px 5px 0px;
      font-size: 11px;
      color: #333;
      height: 150px;
      overflow: hidden;
}


div#pressTwo .pressMagenta li {
         float: left;
         width: 250px;
         margin: 0px 0px 12px 0px;
         padding: 0;
         line-height: 1.7em;
         display: inline;
	   list-style: none;
         background: transparent;
}



div#pressThree .pressYellow ul { 
      margin: 15px 0px 5px 0px;
      padding: 5px 0px 5px 0px;
      font-size: 11px;
      color: #333;
      height: 150px;
      overflow: hidden;
}


div#pressThree .pressYellow li {
         float: left;
         width: 250px;
         margin: 0px 0px 12px 0px;
         padding: 0;
         line-height: 1.7em;
         display: inline;
	   list-style: none;
         background: transparent;
}



div#myAccount {
            margin: 14px 0px 10px 0px;
            width: 185px;
            background: #404040 url("images/ui/account-bottom.gif") no-repeat bottom left;
            padding: 0 0 20px;
}


div#myAccount p {
            background: #fff url("images/ui/account-top.gif") no-repeat;
            padding: 10px 12px 0px 12px;
            background-color: #404040;
            margin: 0;
            color: #fff;
            line-height: 1.6em; 
}

.reg {
   color: #fff;
   font-size: 10px;
   margin: 20px 0px -16px 12px;
}


.thumbs {
    width: 350px;
    margin: 14px 0px 0px 0px;
}


.thumbs img {
   width: 36px;
   height: 36px;
   margin: 0px 3px 0px 0px;
   border: 1px solid #999;
   padding: 3px;
}

div#colOne .archive ul { 
      margin: 10px 0px 5px 0px;
      padding: 5px 0px 5px 0px;
      font-size: 11px;
      color: #333;
      height: auto;
      overflow: hidden;
}


div#colOne .archive li {
         float: left;
         width: 185px;
         margin: 0px 0px 12px 0px;
         padding: 0;
         line-height: 1.7em;
         display: inline;
	   list-style: none;
         background: transparent;
}

.thumbs2 {
    width: 350px;
    margin: 14px 0px 0px 0px;
}

.thumbs2 img {
   width: 36px;
   height: 36px;
   margin: 0px 3px 6px 0px;
   border: 1px solid #999;
   padding: 3px;
}

.newsLargePic {
    border: 1px solid #333;
    width: 340px;
    height: 257px;
    padding: 3px !important;
    margin: 12px 0px 16px 0px;
}

/* COMMENT BOX */

div#commentBox {
            background-color: #ccc;
            margin: 12px 0px 10px 0px;
            width: 100%
}

div#commentBox p {
            padding: 8px 12px 22px 12px;
            margin: 0;
            color: #333;
}

div#commentBox h4 {
            color: #ff00ff;
            padding: 15px 0px 0px 0px;
            margin: 0px 12px 0px 12px;
}

.lineComment {
    width: 95%;
    height: 2px;
    background: transparent url("images/ui/dotty.gif") repeat-x top left; 
    margin: 0px 0px 0px 12px;  
}

/********** SSP **********/

div#flashBak {
    border: 1px solid #333;
    width: 590px;
    height: 360px;
    padding: 4px !important;
    margin: 12px 0px 16px 0px;
}

/********** ADD ONS **********/

.readMoreGrey {
      font-size: 11px;
      color: #fff;
      height: 11px;
      width: 140px;
      margin: 8px 0px 10px 0px;
      padding: 3px 0px 5px 10px;
      background-color: #333;
}

.readMoreGrey a, a:link a:active a:visited   {
       color: #fff;
       text-decoration: none; 
       background-color: transparent;
}


.readMoreGrey a:hover {
            color: #fff;
            text-decoration: underline;    
}

/********** FEATURE SSP **********/

div#flashhold {
	width: 327px;
	height: 508px;
	margin: -18px 0px 10px 12px;
}

/********** NEWS ARCHIVE **********/

div#colFive {
      margin: 0;
      float: left;
      width: 405px;
      text-align: left; 
}

div#colSix {
      margin: 0px 0px 0px 10px;
      float: left;
      width: 268px;
      text-align: left; 
}

div#colSeven {
      margin: 0px 0px 0px 10px;
      float: left;
      width: 267px;
      text-align: left; 
}


div#colFive li {
     width: 250px;
     list-style: none;
     background: transparent url("../images/ui/cyan.gif") no-repeat; 
     margin: 18px 0px 0px 10px;
     padding: 0px 0px 0px 18px;
     line-height: 2.2em;
     vertical-align: center;
}

div#colSix li {
     width: 200px;
     list-style: none;
     background: transparent url("../images/ui/magenta.gif") no-repeat; 
     margin: 18px 0px 0px 0px;
     padding: 0px 0px 0px 18px;
     line-height: 2.2em;
     vertical-align: center;
}

div#colSeven li {
     width: 150px;
     list-style: none;
     background: transparent url("../images/ui/yellow.gif") no-repeat; 
     margin: 18px 0px 0px 0px;
     padding: 0px 0px 0px 18px;
     line-height: 2.2em;
     vertical-align: center;
}

div#colFive .other {
      height: 21px;
      font-size: 11px;
      font-weight: bold;
      text-align: right;
      color: #fff;
      background: #333;
	  margin: 12px 0px 10px 0px;
	  padding: 11px 10px 0px 0px;
      font-family: Arial, Helvetica, sans-serif;
}

div#colSeven .downloadsYellow a, a:link a:active a:visited   {
       color: #333;
       background-color: #ffff00;
       text-decoration: none;  
       padding: 4px 4px 4px 5px;
}

div#colSeven .downloadsYellow a:hover {
            color: #333;
            text-decoration: underline; 
        }

div#colSeven .downloadsYellow ul { 
      margin: 10px 0px 5px 0px;
      padding: 5px 0px 5px 0px;
      font-size: 11px;
      color: #333;
      height: auto;
      overflow: hidden;
}

div#colSeven .downloadsYellow li {
         float: left;
         width: 185px;
         margin: 0px 0px 12px 0px;
         padding: 0;
         line-height: 1.7em;
         display: inline;
         list-style: none;
         background: transparent;
}


div#colSix .downloadsMagenta ul { 
      margin: 10px 0px 5px 0px;
      padding: 5px 0px 5px 0px;
      font-size: 11px;
      color: #333;
      height: auto;
      overflow: hidden;
}


div#colSix .downloadsMagenta li {
         float: left;
         width: 185px;
         margin: 0px 0px 12px 0px;
         padding: 0;
         line-height: 1.7em;
         display: inline;
         list-style: none;
         background: transparent;
}


div#colSix .downloadsMagenta a, a:link a:active a:visited   {
       color: #fff;
       background-color: #ff00ff;
       text-decoration: none;  
       padding: 4px 4px 4px 5px;
}

div#colSix .downloadsMagenta a:hover {
            color: #fff;
            text-decoration: underline; 
}



div#colSix .Magenta ul { 
      margin: 8px 0px -6px 0px;
      padding: 5px 0px 5px 0px;
      font-size: 11px;
      color: #333;
      height: auto;
      overflow: hidden;
}

div#colSix .Magenta li {
         float: left;
         width: 185px;
         margin: 0px 0px 0px 0px !important;
         padding: 0;
         line-height: 1.7em;
         display: inline;
         list-style: none;
         background: transparent;
}

div#colSix .Magenta a, a:link a:active a:visited   {
       color: #fff;
       background-color: #ff00ff;
       text-decoration: none;  
       padding: 4px 4px 4px 5px;
}


div#colSix .Magenta a:hover {
            color: #fff;
            text-decoration: underline; 
}

/********** NEWS MORE **********/


div#colFive, div#colSix, div#colSeven, div#colEight {
     padding: 0px 0px 40px 0px;
}

div#colEight {
      margin: 0;
      float: left;
      width: 680px;
      text-align: left; 
}

div#colEight li {
     width: 250px;
     list-style: none;
     background: transparent url("../images/ui/cyan.gif") no-repeat; 
     margin: 18px 0px 0px 10px;
     padding: 0px 0px 0px 18px;
     line-height: 2.2em;
     vertical-align: center;
}



div#colEight .other {
      height: 21px;
      font-size: 11px;
      font-weight: bold;
      text-align: right;
      color: #fff;
      background: #333;
	  margin: 12px 0px 10px 0px;
	  padding: 11px 10px 0px 0px;
      font-family: Arial, Helvetica, sans-serif;
}

.pic3 {
    border: 1px solid #333;
    width: 672px;
    height: 265px;
    padding: 3px !important;
    margin: 12px 0px 16px 0px;
}

div#colSeven .yellow ul { 
      margin: 8px 0px -6px 0px;
      padding: 5px 0px 5px 0px;
      font-size: 11px;
      color: #333;
      height: auto;
      overflow: hidden;
}

div#colSeven .yellow li {
         float: left;
         width: 185px;
         margin: 0px 0px 0px 0px !important;
         padding: 0;
         line-height: 1.7em;
         display: inline;
         list-style: none;
         background: transparent;
}

div#colSeven .yellow a, a:link a:active a:visited   {
       color: #333;
       background-color: #ffff00;
       text-decoration: none;  
       padding: 4px 4px 4px 5px;
}

div#colSeven .yellow a:hover {
            color: #333;
            text-decoration: underline; 
}

.newsBack {
      font-size: 11px;
      color: #333;
      height: 11px;
      width: 90px;
      margin: 16px 0px 16px 0px;
      padding: 4px 0px 5px 10px;
      background-color: #00ffff;
}

.newsBack a, a:link a:active a:visited   {
       color: #333;
       text-decoration: none; 
       background-color: transparent;
}


.newsBack a:hover {
            color: #333;
            text-decoration: underline;    
}

.society6 {
      width:183px;
     border: 1px dotted #ccc;
}

.society6Inner {
     background-color: #eeeeee;
     padding: 15px 0 5px 16px;
}

/********** END LAYOUT **********/








