/* 
   Design215.com CSS/110 stylesheet, v01.20.06 
   for Linkatopia.com site, v04.30.08 
   
   Container layout of each page:

   body
     #container
       #pagehead
         .navbar
         .navlinks
         .navlinks2
       #pagebody
         #titlebar
         #contentbg
           #contentbox
             #contenthead
             .L_xxlarge (or other column classes)
             .minheight
             .R_xxsmall (or other column classes)
             .xclearline
           #endcap
         #footer
      


   
   Fonts
   ----------------------------------------------------------------------------- 
   Define all fonts for the entire site in this section. 
*/

body,.counter,div.dropx a {
  font-family:verdana,helvetica,sans-serif; font-size:10px; color:#555555;
}
p,dl,ul,ol,table td,pre.p2,.xword,.xtitle,#footer a,blockquote,.clearBtn {
  font-family:verdana,helvetica,sans-serif; font-size:11px; color:#555555;
}
h2,h3,div.obox h1,#footer a.w3 {
  font-family:verdana,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#000000;
}
h1 {
  font-family:arial,helvetica,sans-serif; font-size:18px; font-weight:bold; color:#000099;
}
.boxBlur,.boxFocus,.ckBox {
  font-family:courier new,courier,monospace; font-size:12px; color:#000000;
}
pre,code,.formula {
  font-family:courier new,courier,monospace; font-size:12px; color:#006000;
}
#footer p,#footer p.xnav,p.xsmall {
  font-family:arial,helvetica,sans-serif; font-size:10px; color:#666666;
}
.xsmall {
  font-family:arial,helvetica,sans-serif; font-size:11px; color:#555555;
}
.fbutton {
  font-family:arial,helvetica,sans-serif; font-size:11px; font-weight:bold;
}
a.k,a.k1,a.k2,a.btn {
  font-family:arial,helvetica,sans-serif; font-size:12px;
}
.xgo2 {font-family:verdana,helvetica,sans-serif; font-size:12px;}

div#rcounter {
  font-family:arial,helvetica,sans-serif; font-size:60px; font-weight:bold;
}

/* Font sizes for Tag Cloud */
.sz1 {}
.sz2 {}
.sz3 {font-size:14px;}
.sz4 {font-size:15px;}
.sz5 {font-size:15px;}
.sz6 {font-size:16px;}
.sz7 {font-size:16px;}
.sz8 {font-size:18px;}
.sz9 {font-size:18px;}



/* 
   Type Selectors
   ----------------------------------------------------------------------------- 
   Define the defaults for HTML elements in this section. 
*/

body {
  text-align:center; margin:0; padding:0;
  color:#000000; background:#cccccc;
}

a:link,
a:visited {text-decoration:none; font-weight:bold; color:#0047EA;}
a:hover {text-decoration:underline; font-weight:bold; color:#000000;}

acronym {
  font-weight:bold; color:#888888;
  border-bottom:dashed 1px #000000; cursor:help; 
}
blockquote {
  line-height:120%;
  margin:4px 12px 0 24px; padding:0;
}  
form {
  margin:0; padding:2px 0 0 12px;
}
h1 {
  margin:4px 4px 0 12px; padding:0; letter-spacing:1px;
}
h2 {
  margin:2px 2px 2px 12px; padding:0; letter-spacing:1px;
}
h3 {
  position:relative; text-align:right;
  margin:-12px 4px 0 0; padding:0;
}
img {
  margin:0; padding:0; border:0;
}
p {
  line-height:120%;
  margin:2px 6px 2px 0; padding:0;  /* default is no left margin */
}
pre {
  margin:0; padding:0;
}
table {
  margin:2px 6px 2px 12px; padding:0;
}
table td {
  line-height:130%;
}

/* this tag is used to hide text that should be visible when no stylesheet is available */
tt {display:none;} 

ul {
  list-style:none;
}

form table { /* no left margin for tables inside forms */
  margin:2px 6px 2px 0; padding:0;
}


/* 
   Class and ID Selectors
   ----------------------------------------------------------------------------- 
   Define styles for all elements except the layout containers 
*/

/* text menu links */
a.a1 {
  font-size:11px; margin:0; padding:0;
}
a.a1:link,
a.a1:visited {text-decoration:none; font-weight:bold; color:#0047EA;}  
a.a1:hover {text-decoration:underline; font-weight:bold; color:#000000;}

/* Style for browser toolbar "buttons" */
a.btn {
  height:20px;
  line-height:20px; font-weight:normal; color:#000000;
  margin:0 1px 0 0; padding:4px 8px 4px 8px; background:#D4D0C8;
  border-top:1px solid #ffffff;
  border-left:1px solid #ffffff;
  border-bottom:1px solid #808080;
  border-right:1px solid #808080;
}
a.btn:link,
a.btn:visited {text-decoration:none; font-weight:normal; color:#000000;}
a.btn:hover   {
  text-decoration:none; font-weight:normal; color:#000000; background:#b4b4b4;
}

/* cancel text-decoration for misc image buttons */
a.btn2:link,
a.btn2:visited {text-decoration:none;}  
a.btn2:hover {text-decoration:none;}


/* user links */
a.k:link {text-decoration:underline; font-weight:normal; color:#0000aa;}
a.k:visited {text-decoration:underline; font-weight:normal; color:#6600aa;}  
a.k:hover {text-decoration:underline; font-weight:normal; color:#000000;}


/* tag links, public */
a.tg0 {
  margin:0; padding:2px 0 2px 0px;
  background:transparent;
}
a.sg0 { /* selected */
  margin:0; padding:2px 0 2px 0px; color:#000000;
  background:transparent;
}
/* tag links, shared */
a.tg1 {
  margin:0; padding:2px 0 2px 16px;
  background:transparent url(images/lock01a.gif) no-repeat;
}
a.sg1 { /* selected */
  margin:0; padding:2px 0 2px 16px; color:#000000;
  background:transparent url(images/lock01a.gif) no-repeat;
}
/* tag links, private */
a.tg2 {
  margin:0; padding:2px 0 2px 16px;
  background:transparent url(images/lock02a.gif) no-repeat;
}
a.sg2 { /* selected */
  margin:0; padding:2px 0 2px 16px; color:#000000;
  background:transparent url(images/lock02a.gif) no-repeat;
}

/* tag links under each user link */
a.a2:link,
a.a2:visited {text-decoration:none; font-weight:bold; color:#008000;}  
a.a2:hover {text-decoration:underline; font-weight:bold; color:#008000;}

/* links with a folder icon */
a.f1 {
  margin:0; padding:2px 0 6px 18px; line-height:18px;
  background:transparent url(images/folder.gif) no-repeat;
}
a.f1:link,
a.f1:visited {text-decoration:none; font-weight:bold; color:#0047EA;}  
a.f1:hover {
  text-decoration:underline; font-weight:bold; color:#000000;
  background:transparent url(images/folder2.gif) no-repeat;
}

/* default stylesheet link icons */
a.style_normal,a.style_mobile,a.style_print,a.style_none {
  margin:0; padding:2px 0 2px 18px; line-height:16px;
  background:transparent url(images/style_normal.gif) no-repeat;
}
a.style_mobile {
  background:transparent url(images/style_mobile.gif) no-repeat;
}
a.style_print {
  background:transparent url(images/style_print.gif) no-repeat;
}
.navlinks2 a.style_print:hover {text-decoration:none;}

a.style_none {
  background:transparent url(images/style_none.gif) no-repeat;
}

/* footer links */
#footer a:link,
#footer a:visited {text-decoration:none; color:#2f6e00;}
#footer a:hover {text-decoration:underline; color:#000000;}
  
/* W3C validation links */
#footer a.w3:link,
#footer a.w3:visited {text-decoration:none; color:#aaaaaa;}
#footer a.w3:hover {text-decoration:none; color:#000000;}

br.clr {
  clear:both;
}
  
code.bx {  /* outlined code like an input box */
  border:1px solid #999999; background:#eeeeee;
  padding:1px;
}
code.t2 {  /* indented block of example code */
  display:block;
  margin:4px 0 2px 8px; padding:0;
}     

/* Separators to clear column floats */
div.xclear {
  clear:right; height:1px; line-height:1px; 
  margin:0; padding:0;
}
div.xclearline { /* content under columns */
  position:relative; clear:both; width:620px; 
  margin:0; padding:0;
}


/* Sets the minimum height of the page content, or can be a column divider */
div.minheight {
  position:relative; float:right; text-align:right;
  width:5px; height:500px;
}

div.xline { /* accent line */
  height:1px; line-height:1px;
  margin:3px; padding:0 0 3px 0;
  border-top:solid 1px #aaaaaa;
}
div.xbox1 { /* forms boxes */
  width:90%; 
  padding:4px 8px 4px 8px; 
  border:solid 1px #aaaaaa; background:#ffffff;
}
div.xbox2 { /* tags box */
  position:relative;
  margin:0 6px 0 12px; padding:2px 2px 4px 2px; 
  border:solid 1px #000099; background:#E2E7FF;
}
  div.xbox2 table,div.xbox3 table {
    margin:2px 2px 2px 0; padding:0;
  }
  div.xbox2 table td,div.xbox2 p.xblock {
    color:#9999bb;
  }

div.xbox3 { /* friends box */
  position:relative;
  margin:0 6px 0 12px; padding:2px 2px 4px 2px; 
  border:solid 1px #006600; background:#BCEA9B;
}
  div.xbox3 p {
    margin:4px 2px 4px 2px;
  }    

div.xbox4 { /* popular/suggested tags box */
  position:relative;
  margin:0 6px 0 12px; padding:2px 2px 4px 2px; 
  border:solid 1px #000099; background:#ffffcc;
}
  div.xbox4 p.xblock {
    color:#999988;
  }

div.gadvert { /* Google ads */
  margin:0 0 0 12px;
}
div.gsearch { /* Google search box */
  position:absolute; width:500px; left:250px; top:20px;
}
  
dl.alist {
  margin:0; padding:4px 10px 0 0;
}
dl.alist dt {
  line-height:150%;
  margin:0; padding:0 0 0 30px;
}
/* user links, shared */
dl.alist dt.k1 {
  margin:0; padding:0 0 0 30px;
  background:transparent url(images/lock01.gif) 12px 2px no-repeat;
}
/* user links, private */
dl.alist dt.k2 {
  margin:0; padding:0 0 0 30px;
  background:transparent url(images/lock02.gif) 12px 2px no-repeat;
}
dl.alist dd {
  line-height:120%;
  margin:0; padding:0 0 0 36px;
}
dl.alist dd.mm {
  color:#008000; line-height:120%;
  margin:0; padding:2px 0 8px 36px;
}
dl.t2 {  /* lists used inside table td's */
  margin:0; padding:0;
}
dl.t2 dt {margin:0; padding:0;}
dl.t2 dd {margin:0; padding:4px 0 2px 8px;}
  
dl.links {
  margin:0; padding:4px 0 0 0;
}
dl.links dt {
  line-height:150%;
  margin:0; padding:0 4px 0 20px;
}
dl.links dd {
  line-height:120%;
  margin:0; padding:0 10px 4px 28px;
}
  
h1.m1 {
  margin:2px 2px 0 12px;
}
h2.f1 { /* h2 inside forms */
  margin:2px 2px 2px 0;
}

img.xpic {
  margin:1px 3px 3px 1px; padding:0;
  border:solid 1px #888888;
}
img.xleft {  /* left aligned image */
  float:left; margin:2px 10px 2px 0;
}
img.tleft,img.avatar { /* website thumbnails, avatars */
  float:left; margin:2px 10px 2px 0;
  border:solid 1px #888888;
}
img.xright {  /* right aligned image */
  float:right; margin:2px 0 2px 10px;
}
img.dleft {  /* left aligned image for use with ul.dlist */
  float:left; margin:2px 10px 2px 12px;
  border:1px solid #666666;
}
img.banner {
  margin:1px 4px 4px 1px; padding:0;
}
img.favico {
  margin:0 0 -2px 0; padding:0;
}

img.noshow,iframe.noshow {visibility:hidden;}

label.noshow,
span.noshow {display:none;}

p.c1 {
  position:relative; text-align:center; 
}

p.p1 { /* normal line height for narrow columns */
  margin:2px 6px 2px 12px; padding:0;
}
p.p2 { 
  line-height:130%;
  margin:4px 6px 0 12px; padding:0;
}
p.p3 { /* normal right margin */
  line-height:150%;
  margin:4px 10px 0 12px; padding:0;
}
p.n1 { /* justified column like a newspaper */
  font-size:10px;
  margin:4px 2px 0 12px; padding:0; text-align:justify;
}
p.n2 { /* right column with vertical dashed line */
  font-size:10px;
  margin:0; padding:4px 2px 0 12px; border-left:1px dashed #aaaaaa;
}
/* 
   Sorting options for links under a specific tag.
   the negative margin moves it up to the same line as the <h1>.
   height is necessary in IE or else the links can't be clicked.
*/
p.r1 { 
  text-align:right;
  line-height:16px; height:16px;
  margin:-16px 4px 4px 0; padding:0;
}

p.r2 {
  text-align:right;
  line-height:150%;
  margin:4px 4px 4px 12px; padding:0;
}
p.xblock {
  line-height:normal; /* so different sized fonts each find their own line height */
  margin:0; padding:2px 4px 2px 4px;
}
#pagehead p {
  text-align:left; padding:8px 0 0 10px; /* padding for folder icon */
}
#footer p {
  position:relative; width:720px;
  text-align:center; margin:0 auto 0 auto; padding:0;
}
#footer p.xnav {
  position:relative; width:720px;
  text-align:center; margin:0 auto 0 auto; padding:12px 0 0 0;
  color:#666666;
}
  
pre.p2 {
  line-height:150%;
  margin:4px 4px 0 12px; padding:0;
}

/* displaying lock icons within a paragraph for help, features, etc */
span.lock1 {
  margin:0; padding:0 0 2px 18px; 
  background:transparent url(images/lock01.gif) 0 -1px no-repeat;
}  
span.lock2 {
  margin:0; padding:0 0 2px 18px; 
  background:transparent url(images/lock02.gif) 0 -1px no-repeat;
}

/* lock icons next to tags under each link */
span.tlock1 {
  margin:0; padding:0 0 2px 10px; 
  background:transparent url(images/lock01a.gif) 0 -1px no-repeat;
}  
span.tlock2 {
  margin:0; padding:0 0 2px 10px; 
  background:transparent url(images/lock02a.gif) 0 -1px no-repeat;
}

/* stars for rating links */
span.st1 {
  margin:0; padding:0 0 2px 13px; 
  background:transparent url(images/stars01.gif) 0 -1px no-repeat;
}  
span.st2 {
  margin:0; padding:0 0 2px 26px; 
  background:transparent url(images/stars02.gif) 0 -1px no-repeat;
}  
span.st3 {
  margin:0; padding:0 0 2px 39px; 
  background:transparent url(images/stars03.gif) 0 -1px no-repeat;
}  
span.st4 {
  margin:0; padding:0 0 2px 52px; 
  background:transparent url(images/stars04.gif) 0 -1px no-repeat;
}  
span.st5 {
  margin:0; padding:0 0 2px 65px; 
  background:transparent url(images/stars05.gif) 0 -1px no-repeat;
}

/* Linkatopia folder icon */
span.fldr1 {
  margin:0; padding:0 0 2px 15px; 
  background:transparent url(images/linkatopia_folder.gif) no-repeat;
}

span.xl {font-weight:bold; color:#0047EA;}  

table.t1 { /* no left margin */
  margin:2px 6px 2px 0; padding:0;
}
table.t2 {
  width:94%;
}
table.tt {
  margin:0 4px 0 0; padding:0; border:0;
  width:98%;
}
  table.tt h2 {
    margin:0 0 0 12px; padding:0;
  }
table.gsearch { /* Google Search box */
  width:480px;
  border:0; margin:0; padding:0;
}
table.gsearch table {
  margin:0; padding:0;
}
table.xtags {
  width:98%;
}
table.xtags td {
  padding:0 10px 2px 4px;
}
  table.xtags td.rt {
    padding:0 0 2px 4px;
  }

ul.alist,ul.clist {
  margin:4px 0 0 12px; padding:0;
}
ul.alist li {
  margin:2px 0 6px 0; padding:1px 0 0 18px; width:90%;
  background:transparent url(images/stars01.gif) no-repeat;
}
  
ul.blist {
  margin:4px 0 0 0; padding:0;
}
ul.blist li,ul.clist li {
  margin:2px 0 2px 0; padding:2px 0 2px 20px; width:90%;
  background:transparent url(images/check.gif) no-repeat;
}

ul.alist li.blank,ul.blist li.blank {
  background:transparent;
}
  
/* left aligned image with bullet list on the right */
ul.dlist {
  margin:4px 0 0 0; padding:0;
}
ul.dlist li {
  margin:2px 0 2px 0; padding:1px 0 0 12px; width:250px;
  background:transparent url(images/bullet04.gif) 0 2px no-repeat;
}
#pagehead ul {
  display:none;
}

/* Form fields */
.ckBox { /* checkboxes */
  margin:1px; padding:0; height:14px;
}
.boxBlur {
  border:1px solid #aaaaaa; color:#000000; background:#eeeeee;
  margin:0 0 2px 0; padding:1px;
}
.boxFocus {
  border:1px solid #aaaaaa; color:#000000; background:#ffffcc;
  margin:0 0 2px 0; padding:1px;
}
.fbutton {
  border:1px solid #666666; color:#0047EA; background:#eeeeee;
  margin:0; padding:0;
}
.clearBtn {
  border:0; background:transparent;
  margin:0 0 4px 0; padding:0;
  font-weight:bold; color:#0047EA;
}
button {
  cursor:pointer;
} 
  
/* Misc Classes */

.border1 {  /* used for images instead of border="1" */
  border:1px solid #666666;
}

.counter {color:#aaaaaa;}

.dash2 {
  position:relative; display:block; color:#000099;
  margin:0 10px 4px 12px; padding:0 0 2px 0;
  border-bottom:1px dashed #888888;
}
.hdate { /* dates under H2 headings (articles, etc) */
  position:relative; display:block; color:#000099;
  margin:0 10px 4px 12px; padding:0 0 2px 0;
}

.norm {color:#555555; font-weight:normal;}

.sm {position:relative; top:-4px; font-size:9px; font-weight:normal;} /* service mark (sm) */
.super {position:relative; top:-4px; font-size:10px;} /* superscript */

.xbig {  
  font-size:14px; color:#000099;
}
.xdash {border:1px dashed #000000;} 

.xline {
  position:relative; display:block; line-height:4px;
  margin:0 2px 8px 12px; padding:0;
  border-bottom:1px solid #888888;
}
.xred {color:#ff0000;} /* form errors */
.xword {font-weight:bold; color:#dddddd;}

.xgo {color:#008000;} /* confirmation messages */
.xgo2 {  /* accent text */
  color:#429a00; font-weight:bold;
}

.nbox {  /* remaining characters field, add.php */ 
  text-align:right; width:250px;
  border:0; color:#000000; background:transparent;
}
.nbox2 {  /* remaining characters field, add_popup.php */ 
  text-align:right; width:50px;
  border:0; color:#000000; background:transparent;
}

/* 
   Containers for this layout
   -----------------------------------------------------------------------------
   For this site, #container needs a fixed width so all of the backgrounds and other
   divs inside it line up. Otherwise there are some 1px rounding issues depending on the 
   size of the browser window.
*/

#container {
  position:relative; width:796px;
  text-align:center; margin:0 auto 0 auto; padding:6px 0 0 0;
}
  /* Page Header, full width of container */
  #pagehead {
    position:relative; height:115px;
    text-align:left; margin:0; padding:0;
    background:transparent url(images/topbg.gif) top center no-repeat;
  }
    #pagehead div.navbar {  /* width and height necessary for image replacement */
      position:absolute; top:7px; left:95px; width:245px; height:75px;
      text-align:left; margin:0; padding:0;
    }
  /* DIVs for navigation links */
  div.navlinks {
    position:absolute; top:92px; left:16px; width:400px; height:28px;
    text-align:left; margin:0; padding:0;
  }
  div.navlinks2 {
    position:absolute; top:86px; right:16px; width:300px; height:28px;
    text-align:right; margin:0; padding:0;
    background:transparent;
  }
    div.navlinks2 div {
      margin:0; padding:6px 10px 0 0;
    }

  /* Page body, full width of container */
  #pagebody {
    position:relative;
    text-align:left; margin:0; padding:0;
    background:transparent url(images/bodybg01.gif) center repeat-y;
  }
    /* Titlebar, content above content box */
    #titlebar {
      position:relative;
      text-align:left; margin:0 13px 0 5px; line-height:1px; /* removes 2px space under leaf.jpg */
      background:#cccccc;
    }
    
    /* Outer content box, defines outer width of content (use width:??px ), NO MARGINS */
    #contentbg {
      position:relative; width:783px;
      text-align:left; margin:0; padding:0;
    }
      /* Inner content box for MARGINS and a second background (do NOT define a width) */
      #contentbox {
        position:relative;
        color:#555555; line-height:normal;
        text-align:left; margin:0 0 0 5px; padding:0;
      }
        /* Content above columns */
        #contenthead {
          position:relative; margin:0; padding:0;
        }
          /* Columns, Total width must be <= 760px */
          
          /* LEFT columns */
          div.L_xxsmall,
          div.L_xsmall,
          div.L_small,
          div.L_large,
          div.L_xlarge,
          div.L_xxlarge,
          div.L_full {
            position:relative; float:left; margin:0; padding:0;
          }
          
          /* RIGHT columns */
          div.R_xxsmall,
          div.R_xsmall,
          div.R_small,
          div.R_large,
          div.R_xlarge,
          div.R_xxlarge {
            position:relative; float:right; margin:0; padding:0;
            overflow:hidden;
          }
          
          /* Column width combinations:  xxs+xxl, xs+xl, xs+xs+xs, s+l, full */
          div.L_xxsmall,div.R_xxsmall {width:170px;}
          div.L_xsmall {width:230px;}
          div.R_xsmall {width:250px;}
          div.L_small,div.R_small {width:300px;}
          div.L_large,div.R_large {width:450px;}
          div.L_xlarge {width:500px;}
          div.R_xlarge {width:530px;}
          div.L_xxlarge,div.R_xxlarge {width:580px;}
          div.L_full {width:750px;}
          
          /* exceptions */
          #pag_sitemap div.L_xxsmall {width:200px;}
          
          
      /* Bottom of content box, no bottom margin */
      #endcap {
        position:relative; width:720px; height:20px;
        clear:both; margin:0 0 0 12px;
      }

    /* Footer, extends to bottom edge of window */
    #footer {
      position:relative;
      margin:0; padding:0; text-align:center; 
      background:#cccccc url(images/footerbg.gif) top center no-repeat;
    }

    
/* 
   Page specific styles
   -----------------------------------------------------------------------------
   Define styles and style groups that are only used on certain pages
*/

/* user homepage, javascript links */
div#zlinks {
  position:relative;
}
div#xurls {  /* html links */
  position:relative;
  display:none;
}

/* profile / preferences */
div.linkgroup {
  display:none;
}

/* add_popup.php, v06.08.07 */
#pag_addpopup {
  width:390px;
  text-align:left;
  background:#ffffff;
}
#xmainpop {
  position:relative; width:560px;
  text-align:left; margin:0; padding:0;
  background:#ffffff;
}
#xmainpop table,#xmainpop table.t2 {
  width:98%; margin:0; padding:0;
}
#xmainpop table.pop {
  width:100%;
}
#xmainpop div.xbox2,#xmainpop div.xbox4 {
  margin:0; padding:0; width:300px;
}

/* Design215 Drop Menu, v02.04.06 */
#xtooltip {text-align:left;}
#xtooltip table {margin:0; padding:0;}
td.tt1,
td.tt2 {color:#000000; background:#ffffcc; text-align:left;}
td.tt3 {font-weight:bold; color:#666666; cursor:pointer;}
.ttbg1 {background:#000000;}
.ttbg2 {background:#ffbf11;}
.ttbg3 {background:#000000;}


/* replace or resize images */

.rp50 { /* small footer logo */
  position:absolute;
  width:50px; height:25px;
  background:transparent url(images/design215_50d2.gif) no-repeat;
}
.rp50 b {display:none;}