/* EXAMPLE STYLES - USE THIS CSS AS A TEMPLATE FOR EACH SITE */
body,td,th,div,span {font-size: 10pt; font-family: arial,sans-serif;}
form,td,th,div,span {margin:0;padding:0;}
/*
form.dynamicform{
position:absolute;
position:fixed;
top:20%;
left:25%;
z-index:900;
background-color:#FFC;
padding:10px;
border:double black 4px;
margin:10px auto;
width:50%;
text-align:center;
}
*/
/* AJAX */
#ajaxLoading{
background:red;
color:white;
font-size:12pt;
font-weight:bold;
position:absolute;
top:1em;
right:1em;
padding:0;
z-index:1000;
}
#ajaxTrailer{
position:absolute;
top:2em;
right:2em;
width:16px;
height:16px;
background-image:url(../images/ajax/loadingtrailer.gif);
}
/* LAYOUT WRAPPERS */
div.tablediv,div.titledbox,div.loop {
margin:10px auto;
}
#main div.tablediv,#main div.titledbox {
width:488px;
}
div.formdiv{
float:left;
width:510px; /* larger than form.form, smaller than titledbox */
margin-left:auto;margin-right:auto;
padding:0;
}
div.tablediv,div.titledbox,div.formdiv,div.deckdiv{
border:1px solid #999;
}
div.titledbox div.tablediv, div.titledbox div.formdiv{
border:0;
}
div.tablediv,div.titledbox div.content,div.box {
padding:.3em;
/*margin:0;*/
}
div.titledbox div.title{
font-weight:bold;
font-size:1.2em; 
font-family: arial; 
padding: .3em 0;
margin:0;
background:#EEE  url(../images/gradients/vsilvwh50.gif) repeat-x;
color: #000;
text-align: center;
}
/*FORM*/
#main form.form {
width:490px;
margin:10px;
padding:0;
float:left;
}
#main form.form fieldset.fieldset {
/* MUST SET FIELDSETS TO BE 26PX LESS THAN FORM WIDTH FOR CROSS BROWSER COMPATIBILITY */
float:left;
width:476px;
padding:0;
/*width:590px;*/
margin:5px;
}
/* TABLE */
table.interactive {border-collapse: collapse; border:solid 1px; border-color:gray #DDDDDD #DDDDDD gray}
table.interactive tr.alternate td{background: #F3F3F3; border-color: #F3F3F3}
table.interactive tr td{background: #FFF; color:#000; border-color: #FFF; border:0}
table.interactive tr.ruled td{background: #D2E9FF}
table.interactive tr.clicked td{background: #FF0000; color:#FFF}
table.interactive th{
background: #EEE url(../images/gradients/vsilvwh50.gif) repeat-x;
}
table.interactive th {background-color:#DDD; color:#333; padding-top:1px; padding-left:3px; border-left:solid 1px #CCC; border-top:solid 1px #CCC; border-right:solid 1px #808080; border-bottom:solid 1px #808080}
table.interactive thead th {text-align: left}
table.interactive thead th.colheaddepressed {border-right:solid 1px #CCC; border-bottom:solid 1px #CCC; border-left:solid 1px #808080; border-top:solid 1px #808080}
/*table.interactive thead th.colheadover {background: #D2E9FF}*/
table.interactive tr.head th.colheadover {background-color:#D2E9FF; background-position: 0 -50px}
table.interactive td {margin:0px; padding:2px}
table.interactive span.sortarrowu, table.interactive span.sortarrowd, table.interactive span.sortarrow {color: black}
table.interactive th select.filter {color:#666;background:#8FC9FF;font-family:verdana,sans-serif;font-size:8pt;margin:1px;padding:1px;font-weight:normal}
option.filterlabel {color:#666;background:#8FC9FF;}
option.filteroption {color:#000; background:#8FC9FF;font-family:verdana,sans-serif;font-size:8pt;margin:1px;padding:1px;font-weight:normal; border:0}
div.tablediv {padding:0}
div.tablediv table.interactive caption {padding:0px}
table.interactive tfoot th {font-weight:normal}

/* TABLE SORTER */
table.interactive span.sortarrow {background: url(../images/transparent.gif) no-repeat top right; height:10px;width:10px;padding:5px;font-size:0;color:#CCC}
table.interactive span.sortarrowu {background: url(../images/tables/upsort.gif) no-repeat top right; height:10px;width:10px;padding:5px;font-size:0;color:#CCC}
table.interactive span.sortarrowd {background: url(../images/tables/downsort.gif) no-repeat top right; height:10px;width:10px;padding:5px;font-size:0;color:#CCC}

/* PAGINATOR*/
ul.paginator {
/*border:0px;*/
}
ul.paginator li a {
text-decoration:none;
}
ul.paginator{text-align:center;}
ul.paginator li{font-size:10pt;font-weight:bold;border:0;}
ul.paginator li.selected{background:#FFF;border:inset #FFF 2px;}
ul.paginator li a{background:#64648B;color:white;border:outset #64648B 2px;}
ul.paginator li a:hover{background:#8b8ba9;}

/* DECK */
div.deckdiv{
/*width:450px; default width. can alter or, if in a container, remove entirely.
height:100px;
border:1px solid #666;*/
}
ul.control li{
/*background:url(../images/gradients/vsilvwh50.gif) repeat-x;*/
background:#8FC9FF url(../images/gradients/vsilvwh50.gif) repeat-x;
}
ul.control li{
background-position:left top;
}
ul.control li.top{
background-position:0 -55px;
}
ul.control li.over{
background-position:0 -70px;
}

.deletebutton {
display:block;
float:left;
clear:none;
width: 14px;
height: 14px;
margin: 1px;
padding: 0;
border: 0;
background: transparent url(../images/forms/x.gif) no-repeat center top;
text-indent: -1000em;
cursor: pointer; 
}
/*to preload the delete x*/
div.formlist{background: url(../images/forms/x.gif) no-repeat -1000px -1000px;}


body{background-color:#CCC;padding:0;margin:0;}
#centerpage{padding:0;width:770px;border:0;margin:0 auto;position:relative;}
#container,#header,#content,#footer{width:770px;margin:0;padding:0;border:0;position:relative;}
#container{background:#CCC url(../images/layout/bgplain.gif) repeat-y top center;height:100%;float:left;}
#content{float:left;}
#left,#right{width:125px;position:relative;margin:0;border:0;padding:0;}
/*
#left{float:left;color:#336;padding-left:5px;}
#right{float:right;color:#336;padding-right:5px;margin-left:-50px;}
*/
#left{float:left;color:#336;padding-left:8px;margin-right:-3px;}
#right{float:right;color:#336;padding-right:8px;margin-left:-50px;}

#main{width:510px;margin:0;float:left;padding:0;position:relative;z-index:1;background:url(../images/layout/bgcenter.gif) top center repeat-y;color:#333;margin-right:-400px;}
#header{float:left;background:url(../images/layout/bgtop.gif) no-repeat top center;}
#footer{background:url(../images/layout/bgbottom.gif) no-repeat bottom center;float:left;padding:10px 0}

div.sidebaritem h2.sbi{text-transform:uppercase;font-size:8pt;font-weight:bold;text-align:center;font-family:verdana;padding:2px 5px;color:#333;}
div.sidebaritem h2.sbi a{color:#333;text-decoration:none;}
div.sidebaritem{width:120px;margin-bottom:15px;}
#left div.sidebaritem{float:left;}
#right div.sidebaritem{float:right;}

#header h1{text-align:center;margin:10px auto 5px;padding:0;font-size:14pt;color:#336;}

#footer ul{margin:0 5px;background:#DADBDE;padding:0;border:0;text-align:center;list-style-type:none;white-space: nowrap;}
#footer ul li{display:inline;margin:10px;}

#content div.mainbox h2.mainhead{line-height:30px;width:510px;display:block;height:26px;margin:0;padding:8px 0 0;text-align:center;background:#DADBDE url(../images/layout/mainhead.gif) no-repeat bottom center;color:#FFF;font-family:verdana;text-transform:uppercase;font-size:11px;}
#content #creationsbox h2.mainhead{padding:0;}
#content div.subhead{background:#DADBDE}
#creationsbox div{margin:0;}
#content div.mainbox{background:url(../images/layout/boxfoot.gif) no-repeat bottom center;padding:0 0 26px;margin:0;}
#creationsbox{height:187px;}
#content #creationsbox{padding-bottom:0;}
/*#blog_div h2{line-height:26px;width:510px;display:block;height:26px;margin:0;padding:8px 0 0;text-indent:-5000px;background:#DADBDE url(../images/layout/bloghead.gif) no-repeat bottom center;}*/

body.twocol #main{width:635px;background:url(../images/layout/bgcenter2col.gif) top center repeat-y;}
body.twocol #main div.mainbox{background:url(../images/layout/boxfoot2col.gif) no-repeat bottom center;}
body.twocol #main div.mainbox h2.mainhead{width:635px;background:#DADBDE url(../images/layout/mainhead2col.gif) no-repeat bottom center;}
body.twocol #header{padding-left:135px;width:635px;}

body #top{width:635px;background:url(../images/layout/bgcenter2col.gif) top center repeat-y;float:left;clear:none;margin-right:-100px;padding:0;}
body #top div.mainbox{background:url(../images/layout/boxfoot2col.gif) no-repeat bottom center;}
body #top div.mainbox h2.mainhead{width:635px;background:#DADBDE url(../images/layout/mainhead2col.gif) no-repeat bottom center;}


#blog{margin:0;padding:7px 15px 7px;}
#blog_search_div{float:left;width:480px;margin:0;padding:7px 15px 7px;}
#blog #blog_search_div{float:left;margin-bottom:8px;padding:0;}

#blog .moreblog{border-top:1px ridge #64648B;}

div.poll h2{font-size:10pt;color:#336;}
#blog_search fieldset{float:left;width:100%;text-align:left;padding-left:0;padding-right:0;padding-bottom:5px;border:0;}
#blog_search fieldset legend{display:none;}
#blog_search div.formelement{display:inline;}

#blog_search.blogsearch {float:left;width:500px;margin-left:-10px;padding-top:0;padding-bottom:5px;margin-right:-50px;}
#blog_search.blogsearch fieldset{border:0;width:495px;margin:2px;margin-top:0;padding-top:0;}
#blog_search.blogsearch div.formelement.text{float:left;width:130px;margin-left:2px;}
#blog_search.blogsearch div.formelement.text input{float:left;width:120px;}
#blog_search.blogsearch div.formelement.date{float:left;width:175px;margin-left:5px;}
#blog_search.blogsearch div.formelement.date label{width:175px;}
#blog_search.blogsearch div.formelement label{float:left;clear:both;font-size:.8em;}
#blog_search.blogsearch div.formelement.text input,
#blog_search.blogsearch div.formelement.date select.date{margin:0;float:left;clear:none;}
#blog_search.blogsearch div.formelement.text input,
#blog_search.blogsearch div.formelement.date select.month{float:left;clear:left;}
#blog_search div.invalid label{
font-style:italic;
color:#FF0000;
}

#blog_search div.invalid input,
#blog_search div.invalid select,
#blog_search div.invalid textarea,
#blog_search div.invalid ul.formlist li,
#blog_search div.missing input,
#blog_search div.missing select,
#blog_search div.missing textarea,
#blog_search div.missing ul.formlist li{
background-color: #FFC;
}
#blog_search input.disabled{
background-color:#EBEBE4;
}
#blog_search div.missing input.disabled{
background-color:#F5F5D8;
}
#blog_search div.invalid input.disabled{
background-color:#F5F5D8;
}
/*#blog_search.blogsearch div.formelement.text input,
#blog_search.blogsearch div.formelement.date select{
background-color:#64648B;font:bold 11px arial;color:white;}
}*/
#blog_search.blogsearch div.buttons{float:left;width:100%;text-align:center;margin:0;}
#blog_search.blogsearch div.buttons div.button{display:inline;}

#navigation{width:120px;margin:0 auto;list-style-type:none;padding:0;border:0;white-space: nowrap;}
#navigation li{
text-align:center;
margin-top:3px;
margin-bottom:3px;
text-transform:uppercase;
font-size:8pt;font-weight:bold;font-family:arial black,tahoma,arial;
}
#navigation li a{display:block;border:2px solid #DADBDE;font-weight:bold;color:#336;padding-top:4px;padding-bottom:4px;text-decoration:none;}
#navigation li.selected a{display:block;border:2px solid #DADBDE;font-weight:bold;color:#336;padding-top:4px;padding-bottom:4px;text-decoration:underline}
#navigation li.active a{text-decoration:underline}
#navigation li.active li a{text-decoration:none}
#navigation li a:hover{border:2px outset #E6E7EB;}
#navigationdiv h2{display:none;}
#navigation ul{width:100px;margin:0 0 0 20px;list-style-type:none;padding:0;border:0;white-space: normal;}
#navigation ul li{
text-align:left;
text-transform:none;
font-size:8pt;
font-weight:normal;
font-family:arial;
white-space: normal;
width:95px;
margin-top:1px;
margin-bottom:1px;
}
#navigation ul li a{
color:#000;
font-weight:normal;
white-space: normal;
padding-left:10px;
background:url(../images/layout/menuarrow.gif) no-repeat 2px 2px;
}
#navigation ul li.selected a{font-weight:bold;text-decoration:underline;}
#navigation  ul li a:hover{text-decoration:underline;border:2px solid #DADBDE;}


#flickrbadge a img{border:1px solid black;}
#flickrbadge table tr td{display:block;margin:3px auto;padding:0;}

#toccissites a img{border:0;}
#toccissites div.site{text-align:center;padding:10px 0;}

#right div.poll {width:120px;}

#ad table td{text-align:center;}
#blog .right{float:right}
#blog .left{float:left}
#blog img{border:0;margin:2px;}
#blog .border{border:1px solid black;}
#blog .thickborder{border:2px solid black;}
#blog blockquote p{margin-bottom:2px;margin-top:2px;}
#blog ul.plain{margin-top:2px;margin-bottom:2px;list-style-type:none;padding-left:0;}
#blog .center{text-align:center}

#blog div.blogentry div.details{font-weight:bold;}
#blog div.blogentry div.details div.permalink{float:right;}
#blog div.blogentry{border-top:1px ridge #64648B;margin-bottom:3px;padding-top:5px;clear:both;}

#blog ul.paginator{margin-bottom:5px;}
#blog ul.paginator.bottom{border-top:1px ridge #64648B;padding-top:8px;}

h3.moreblog{text-align:center;font-size:11pt;width:100%;margin:0;padding-bottom:10px;}
div.mainbox{float:left;}

/*
some rules that will be overridden in inferior browsers...
*/
#main #pollsdiv div.pollwrapper{padding:10px;}

div.zazzlebar ul,
div.creationsbar ul{
display:block;
float:left;
clear:both;
width:100%;
list-style-type: none;
margin:0 2px;
padding:0;
border:0;
}
div.zazzlebar ul li,
div.creationsbar ul li{
display:block;
padding: 0;
margin: 4px 0;
text-align:center;
}
div.zazzlebar ul img,
div.creationsbar ul img{border:1px solid #DADBDE;}
div.zazzlebar ul li a,
div.creationsbar ul li a{
display:block;
clear:both;
color:#336;
}
div.zazzlebar ul li a.title,
div.creationsbar ul li a.title{
margin:0 0 12px;
}
#zazzle{width:126px;position:relative;left:-6px;}
#zazzle a.thumb{width:126px;height:126px;position:relative;overflow:hidden;}
#zazzle a:hover img{position:relative;left:-50%;top:-45%;width:200%;height:200%;}
#zazzle_div ul.paginator li a,#creationsbar_div ul.paginator li a{color:white;line-height:1.3em;}
#zazzle_div ul.paginator li a,#creationsbar_div ul.paginator li a{color:white;}

#main .scoresbox div.deckdiv{margin:15px;width:480px;padding:0;background:#FFF;}
#main .scoresbox div.deckdiv div.tablediv{width:450px;display:block;}
#main .scoresbox div.deckdiv div.tablediv table.table{width:450px;margin:0;}
#main .scoresbox div.deckdiv div.card{height:250px;}