html,body {padding:0;margin:0;color:#333;font-size:76%;letter-spacing:1px;font-family:sans-serif;line-height:1.5em;background:#eed}
body {margin:0 5%}
a {color:#900;text-decoration:none}
a:hover {color:#f00}
div,ul,li,h1,h2,h3,p,form,input,select,label {margin:0;padding:0}
ul {list-style:none}
select {border:1px solid #333}
img {border:0}
input,textarea {border:1px solid #333;padding:1px;color:#000}
acronym {cursor:help;text-decoration:none}
#v {width:100%;float:left;background:url(http://www.xs4all.nl/~hautis/fonzie/bg.png) top left repeat-y;padding-left:15px;margin-left:-15px}
#w {width:100%;min-width:400px;float:left;background:url(http://www.xs4all.nl/~hautis/fonzie/bg.png) top right repeat-y;padding-right:15px}
#h {float:left;background:#1e2e3e url(http://www.xs4all.nl/~hautis/fonzie/fonzie.png) 0 0 no-repeat;width:100%;border-bottom:1px solid #dc9;text-align:right}

#h p {padding-top:5px;height:80px;text-align:right;padding-right:10px;background: url(http://www.xs4all.nl/~hautis/fonzie/fonzie.png) 100% 0 no-repeat;width:345px;float:right} /* 145 */
#h input {font-size:1.2em;background:#dc9;color:#000}
#h input#s {padding:0}
/* nav */
#h {padding-bottom:15px}
#h ul {float:left;width:60%;margin-left:38%;padding-top:65px;clear:none}
#h li {width:20%;float:left}
#h a {width:80%;font-size:1.2em;display:block;text-align:center;padding:1px 0 3px 0;line-height:1em;border:solid #a97;border-width:1px 1px 1px 10px;color:#000;margin:2px 0 4px 10%;background:#dda;-moz-border-radius:5px}
#h a#a {background:#210;color:#fff;padding-left:9px;border:1px solid #eed}
#h a:hover {border-color:#eed;background:#cb9}
#h a.k {display:none}
#f {float:left;width:100%;padding:5px 0;border-bottom:2px solid #000;background:#dc9;border-top:1px solid #333;font-size:1.2em}
#f ul {float:right;margin-right:20%}
#f li {float:left}
#f a {clear:left;float:left;color:#ffc;margin-left:20px;letter-spacing:0.4em;color:#333}
#f a:hover {color:#333;text-decoration:underline}
#c {width:100%;float:left;font-size:1.4em;line-height:1.5em;background:#fff;border-bottom:10px solid #000}
#c h1 {font-size:1.5em;letter-spacing:4px;color:#fff;background:#333;padding:6px 0 2px 10%;line-height:1.6em;margin-bottom:-1px}
#m, #mb {border:0px solid #333;float:left;width:100%;padding:10px 0 10px 0}
#mb {padding:0}

/* 2 column content */
#hl {float:left;width:70%}
#hr {float:right;width:30%;margin-left:-2px}
#hr .i {float:right;padding:10px 0;border:solid #333;border-width:0 0 1px 1px;width:100%}
#hr .i ul {list-style:square;float:left;clear:left;margin:6px 0 0 30px}
#hr .i h3 {text-align:center;font-size:1em;float:left;width:100%}
#hr .i li {padding-top:2px}
#hr .i form {text-align:center}
#hr .i input {margin-top:6px;width:80%}
#hr .i ul.c {list-style:none}
#hr .i ul.c input {width:auto}
#hr p {float:left;width:80%;margin-left:10%;background-repeat:no-repeat}

/* generic text div */
div.t,div.tt {padding:15px 40px 20px 30px}
div.t h2,div.tt h2 {width:60%;padding:0 0 2px 20px;margin-bottom:20px;border-bottom:1px solid #7a5731}
div.tt {margin-top:30px}
div.t select {margin-top:30px}
div.t form p {margin-top:5px}
div.t span {width:120px;display:block;float:left}

/* page split in half */
.sa, .sb {float:left;width:50%;padding:10px 0}
.sa ul, .sb ul{width:90%;margin-left:8%;list-style:square}
.sa li,.sb li{padding:2px 0}
.sa {border-right:1px solid #333;margin-left:-2px;padding-bottom:30px}
.sc {padding:10px 20px 0 30px}
.sc h3 {margin-bottom:10px}
.sc img{float:right;border:1px solid #333}

/* news comments */
#np div {width:50%;margin:0 0 0 60px;float:left;clear:both}
#np div div {clear:left;margin:30px 0 0 0;padding:0 0 0 60px;float:left;width:100%;background:transparent}
#np div.q {width:auto;padding:5px}
#np div div.p {width:100%;margin:0;padding:40px 30px 10px 30px;border-bottom:1px solid #dca;color:#000;background:#f4f4e4;border:1px solid #dca;border-right:1px solid #dca;border-top:1px solid #7a5731;overflow:hidden}
#np div div p {margin:0;padding:0 0 4px 5%;margin-bottom:0;border:0;width:45%;float:left;background:#fff;color:#333}
#np div div.p p {margin:0;padding:0;width:auto;float:left;clear:both;background:transparent}
#np div div.p strong {margin-top:20px;float:left;clear:both}
#np div div.p div {float:left;clear:both;width:95%;margin:0 0 0 5%;margin:0 0 0 5%;background:#dca}
#np div div.p div.i {width:100%;text-align:center;float:left;clear:both;background:transparent;margin:10px 0px 10px 0px;padding:0}
/*#np div div div img {margin:0;padding:0;border:1px solid #333;max-width:100%}*/
#np div.i img {margin:0;padding:0;border:1px solid #333;max-width:100%}
#pg {width:50%;clear:both;padding-top:40px;margin-left:60px;text-align:center}
#pg p {padding:10px 0}

#np div.none {width:auto;margin:0}
#np div.none div {clear:both;float:left;margin:0;padding:0;width:auto}
#np div.none p {margin:0;padding:0;width:auto}
#np div.none img {margin:0;padding:0;border:0;float:none}

/* comments reply form */
#cf, #cf2 {float:left;clear:both;margin:40px 0 0 60px !important}
#cf label, #cf2 label {clear:left;float:left;display:block}
#cf textarea, #cf2 textarea {float:left;margin:0;height:200px;font-size:1.4em;border:0;background:transparent;display:block}
#cf input, #cf2 input {-moz-border-radius:4px;background:#fff}
#cf select, #cf2 select {margin:2px 0;float:left;clear:left}
#cf input.tp, #cf2 input.tp {clear:left;float:left;margin:2px 0}
#cf .ib, #cf2 .ib {clear:both !important;float:left;background:#eed;border:solid #000;border-width:1px 1px 0 1px;padding:5px 10px 5px 20px !important;-moz-border-radius:20px 20px 0 0;}
#cf .ib input, #cf2 .ib input {clear:none;float:left;display:block;margin:2px 4px 2px 0;padding:0 4px}
#cf .sm, #cf2 .sm {float:left;clear:none !important;border:solid #000;border-width:1px 1px 1px 0;-moz-border-radius:0 15px 15px 0;height:200px;background:#eed;width:68px !important;padding-left:10px !important}
#cf .sm p, #cf2 .sm p {font-weight:bold;font-size:0.8em;background:transparent}
#cf .ps, #cf2 .ps {float:left;clear:left;background:#ffe;border:1px solid #000;height:200px}
#cf input.sb, #cf2 input.sb {clear:left;width:auto;margin:10px 0 0 0;padding:2px 5px}
#smb, #smb2 {float:left;clear:both;padding:20px}
#smb img, #smb2 img {border-bottom:1px dashed #333;border-left:1px dashed #333 !important;margin-top:10px}
#smb a, #smb2 a {margin:0 10px}
#cn input, #cn2 input {margin-right:12px}

/* home */
#hw {padding:15px 40px 20px 30px;border-bottom:1px solid #333}
#hw p {font-size:1em;line-height:1.5em;letter-spacing:1px;font-weight:bold;margin-bottom:24px}
#hn {float:left;margin:0 0 30px 0;width:100%}
#hn h2 {float:left;width:100%;margin:0;padding:5px 0 5px 0px;border-bottom:1px solid #333;background:#eed;text-align:center}
#hn #np {width:90%}
#hn #np div {width:85%}

/* forum */
#hf {padding:15px 10px 0 30px}
#hf h3 {padding:20px 0 20px 30%;float:left;clear:left}
#hf .fs {float:left;width:100%;margin-bottom:8px}
#hf .fs a {width:25%;display:block;float:left;clear:left}
#hf .fs span {width:70%;display:block;float:left;margin-left:5%}

/* blogs */
p#p {margin:10px 0 0 20px}
ul#b {margin:10px 0 20px 20px}
ul#b li {clear:left;padding-top:10px}
ul#b a {clear:left;float:left;width:40%;display:block}

/* links */
#l ul,#lr ul {margin-left:15%;width:80%}
#l h3,#lr h3 {margin:30px 0 10px 60px}
#lr .sa {border:0;padding-bottom:0}
#lr .sb {border-left:1px solid #333;padding-bottom:30px}

/* news items */
div.n {float:left;width:90%;margin:0 5% 50px 5%;background:#eed;border:1px solid #dca}
div.n h3 {padding:5px 0 2px 20px;border-bottom:1px solid #7a5731;background:#eed}
div.n img {float:right;margin:15px 0 15px 15px;border:1px solid #333}
div.n div {border:1px solid #dca;border-width:0 1px;width:90%;margin:0px 1%;padding:20px 4%;font-size:1.1em;line-height:1.5em;background:#fff}
div.n div.t {width:auto;margin:0;padding:4px 10px;border-top:1px solid #7a5731;font-size:1em;background:#eed;border-bottom:1px solid #dca;float:left}
div.n div.t a {float:right}

/* people */
div.q {width:93%;clear:left;float:left;margin-left:4%;margin-bottom:20px}
div.q div.i {width:34%;float:left;background-repeat:no-repeat;text-align:center;padding-top:138px;font-style:italic}
div.q div.c {float:left;width:65%;margin:0 0 0 1%;clear:none;background:transparent;text-align:left;padding:0}
div.q h3 {float:left;padding:0;line-height:1em;margin:5px 0 5px 1%;width:100%;border-bottom:1px solid #333}
div.q ul {clear:left;width:100%}

/* ie bugfixes */
* html #h ul {margin-left:19%}
* html #hr .i ul {width:80%;margin:6px 0 0 5%}
* html div.q {margin-left:2%;width:90%}
* html div.q div.c {width:52%}
* html #h li {width:19%}
* html #h,* html #f,* html #c,* html #h {margin-right:-1px;margin-left:-1px}
* html #hf {width:90%}
* html #cf .sm {display:none}

/* shadow */

.shadow {float:left;width:auto;background: url(i/fuzzy_shadow.png) no-repeat bottom right}
.shadow div {background: url(i/fuzzy_shadow1.png) no-repeat right top;}
.shadow div div {background: url(i/fuzzy_shadow2.png) no-repeat left bottom;padding: 0 6px 6px 0;}
.shadow img {background-color:#fff;color:#000;border:1px solid #999;padding:4px;vertical-align:bottom;}

/*** shadows for text ***/
div.holder, div.holderb{margin:10px auto 0 10px;float:left;padding:0px 20px 25px 0px;background:url(i/dropshadow.gif) no-repeat bottom right;width:80%;display:block;position:relative;text-align:left}
div.holderb {clear:left}
div.frame{border:1px solid #333;padding:5px}
div.tr{float:right;background: url(i/dropshadow.gif) no-repeat top right;width:20px;height:20px;margin:0px -20px 0px 0px}
div.bl{margin: 0px 0px -25px 0px;background:url(dropshadow.gif) no-repeat bottom left;width:20px;height:20px}
div.holder p, div.holderb p {color:#FFF;background:#999;font-weight:bold;font-size:10px;letter-spacing:1px;text-align:center;border:solid #333;border-width:0px 1px;width:100%}
div.frame ul {list-style:none}

/* special pages */
#p_h div.i {background:url(http://www.xs4all.nl/~hautis/fonzie/i/h_lanbar.png) 100% 100% no-repeat;padding-bottom:80px;border-bottom:0;float:right}
#p_h h2 {clear:both}
#p_h div.t img, #p_h div.tt img {float:right;margin:0 0 20px 20px}
#p_h div.t img.l, #p_h div.tt img.l {float:left;margin:0 20px 20px 0}

#ap_b #hl {background:url(http://files.team-fonzie.net/blog.png) top right no-repeat}


#p_u div.t p, #p_u div.tt p {float:left;width:200px;clear:left;font-weight:bold}
#p_u div.t p.v, #p_u div.tt p.v {width:auto;clear:none;font-weight:normal}
#p_u h2 {float:left;clear:both}
#p_u div.t, #p_u div.tt {padding-bottom:0px;clear:both;float:left}
