/*
   ######################################################
   ##
   ##  css für www.hobby-basteln.info
   ##
   ##  (C) 2007, by Mike Küster, www.xantiva.de
   ##
   ##  10/2007
   ##
   ######################################################
*/


/* Basis Style - Sheet
   -------------------
   Hier werden alle Angaben zunächst "zurueckgesetzt" um dann im eigenen
   CSS explizit gesetzt zu werden!
   Quelle: http://www.grochtdreis.de/adventskalender/advent.php  19 + 20
*/

body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100.01%;
    background-color: #fff;
    color: #000;
}

body, h1, h2, h3, h4, h5, h6, div, p, table, td, ul, ol, li, dd, dt, dl, blockquote, address, hr, pre {
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
}


/* Allgemeine Angaben */

body {
    font-weight: normal;
    font-size: 0.9em;
    background: #fff3f3;
    color: #606;
}

a {
    text-decoration:none;
    color: #b0b;
}

a:hover {
    color: #f0f;
}

a:visited {
    color: #b0b;
}

a:active {
    color: #909;
}

img {
    border: none;
}


hr {
    width:80%;
    margin: 1em auto 1em auto;
    color: #a0a;
    background-color: #a0a;
    height:2px;
    border:1px outset #a0a;
}

.clearer{
    height: 1px;
    overflow: hidden;
    margin-top: -1px;
    clear: both;
}


/* CSS für den Contentbereich */

#content {
    margin-top: 230px;
    padding: 0px 220px 20px 220px;
}


#content p {
    font-family: Georgia, Arial, Helvetica, sans-serif;
    margin-bottom: 0.25em;
}

#content h1 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.6em;
    margin-bottom: 0.25em;
}

#content h2 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.3em;
    margin-bottom: 0.25em;
}

#content h3 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.2em;
    margin-bottom: 0.25em;
}

#content ul {
    margin-left: 17px;
}

#content li {
    font-family: Georgia, Arial, Helvetica, sans-serif;
    margin-bottom: 0.1em;
}

/* Darstellung der Kategorien */

#categories td {
    vertical-align: top;
}

#categories h2 {
    margin-top: 6px;
    padding-top: 0px;
    margin-bottom: 0px;
}

#categories h2 a {
    font: bold 18px Arial, Helvetica, sans-serif;
}

#categories h2 img {
    margin-right: 6px;
}

#categories .subcats {
    margin-left: 32px;
    padding-top: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    line-height: 1.0em;
}

#categories .subcats, #categories .subcats a {
    font: normal 13px Arial, Helvetica, sans-serif;
}

#categories .count {
    color: #808080;
    font: normal 12px Arial, Helvetica, sans-serif;
}


#categMenu {
    font: normal 10px Arial, Helvetica, sans-serif;
}
#categMenu h3 {
    text-align: center;
    margin: 0px;
    padding: 0px;
}

#categMenu ul {
    list-style-type: none;
    text-align: center;
    margin: 10px ;
}

#categMenu li {
    display: inline;
/*    border-left: 2px solid #06c;
    border-right: 2px solid #06c; */
    padding: 0 4px 0 4px;
}



/*  für die Links */

.link {
    margin-bottom: 10px;
}

.linkimage {
    float: left;
    padding-left: 6px;
    padding-top: 6px;
    margin-right: 0px;
    margin-bottom: 0px;
    background-image:url(../images/background-thumbshot-small.png);
    width: 138px;
    height: 95px;
}

.link a.about {
    font: normal 0.8em Arial, Helvetica, sans-serif;
}



/* für die Detail - Seiten */

#details td {
    font: normal 0.8em Verdana, Arial, Helvetica, sans-serif;
    margin-bottom: 0.25em;
}


#details .label, #details .smallDesc {
    vertical-align: top;
    padding-top: 0.5em;
}

#details .label {
    padding-right: 1em;
}

#details .smallDesc {
    font-family: Georgia, Arial, Helvetica, sans-serif;
}

#details h1 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.2em;
}

#details .url, #details .url a {
    padding: 0px;
    margin: 0px;
    color: #909090;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 0.85em;
    text-decoration: none;
}

.preview {
    padding-left: 6px;
    padding-top: 5px;
    margin-right: 0px;
    margin-bottom: 0px;
    background-image:url(../images/background-thumbshot.png);
    width: 332px;
    height:232px;
}


/* für die submit - Seite */

table.formPage {
    border: 1px solid #a0a;
    padding-left: 5px;
    padding-right: 5px;
}

td.err {
    padding: 3px;
    color: #f00;
    background: #fff;
    border: 1px solid #a0a;
    text-align: left;
}
td.msg {
    padding: 3px;
    color: #390;
    background: #fff;
    border: 1px solid #a0a;
    text-align: left;
}
.buttons {
    border-top: 1px solid #a0a;
    text-align: center;
}

div.errForm, span.errForm {
    margin: 0px 0 0px 5px;
    padding: 2px 3px 2px 3px;
    color: #FF0000;
    background: #FFFFF3;
    border: 1px solid #cccccc;
    text-align: left;
    clear: right;
}
.small {
    padding: 0px;
    margin: 0px;
    color: #909090;
    text-decoration: none;
    font: normal 0.8em Verdana, Arial, Helvetica, sans-serif;
}



.limit_field {
    border: 0 solid transparent;
    border-width:0;
    background: #FFF3F3;
}

span.req {
    margin-left: 3px;
    color: #f00;
    font-weight: bold;
}




/*   Menüspalten  */

#colleft {
    float: left;
    width: 200px;
    position: absolute;
    top: 200px;
    left: 0;
    padding: 0;
}

#colright {
    float: right;
    width: 200px;
    position: absolute;
    top: 200px;
    right: 0;
}

.statistik {
    font: normal 0.8em Verdana, Arial, Helvetica, sans-serif;
}



/* http://www.modxcms.com/simple-rounded-corner-css-boxes.html */
/* set the image to use and establish the lower-right position */
.cssbox, .cssbox_body, .cssbox_head, .cssbox_head h3 {
    background: transparent url(../images/menuebox-background.png) no-repeat bottom right;
}

.cssbox {
    width: 185px !important; /* intended total box width - padding-right(next) */
    width: 170px; /* IE Win = width - padding */
    padding-right: 15px; /* the gap on the right edge of the image (not content padding) */
    margin: 20px auto; /* use to position the box */
}
/* set the top-right image */
.cssbox_head {
    background-position: top right;
    margin-right: -15px; /* pull the right image over on top of border */
    padding-right: 25px; /* right-image-gap + right-inside padding */
}

/* set the top-left image */
.cssbox_head h3 {
    background-position: top left;
    margin: 0; /* reset main site styles*/
    border: 0; /* ditto */
    padding: 25px 0 5px 25px; /* padding-left = image gap + interior padding ... no padding-right */
    height: auto !important;
    height: 1%; /* IE Holly Hack */
}

/* set the lower-left corner image */
.cssbox_body {
    background-position: bottom left;
    margin-right: 25px; /* interior-padding right */
    padding: 15px 0 28px 25px; /* mirror .cssbox_head right/left */
    font: normal 0.8em Verdana, Arial, Helvetica, sans-serif;
}

.cssbox_body ul {
    margin-left:12px;
    color: #a0a;
    font: normal 0.8em Verdana, Arial, Helvetica, sans-serif;
}

.cssbox_body li {
    margin-bottom: 2px;
}



/*   Topbar Bereich, unter Headline  */

#top_bar {
    position: absolute;
    top: 167px;
    width: 100%;
    height: 43px;
    background-image:url(../images/topbar-kante.png);
    background-repeat:repeat-x;
    background-position:0px 27px;
    font: normal 0.8em Verdana, Arial, Helvetica, sans-serif;
    padding-top: 5px;
    color: #7a007a;
}
#top_bar a {
    text-decoration:underline;
}

.breadcrumb {
    float: left;
    vertical-align: middle;
    padding-left: 5px;
    padding-top: 2px;
}

.submit {
    float: right;
    text-align: right;
    display: inline;
    vertical-align: middle;
    padding-top: 2px;
}
.search {
    float: right;
    text-align: right;
    padding-right: 5px;
}

#top_bar input {
    font: normal 1em Verdana, Arial, Helvetica, sans-serif;
}


/*   Kopfbereich "Headline"  */

#headline {
    position: absolute;
    top: 0;
    width: 100%;
    height: 150px;
    background-image:url(../images/headline-background.png);
    background-repeat:repeat;
}

#headline_kante {
    position: absolute;
    top: 150px;
    width: 100%;
    height: 16px;
    background-image:url(../images/headline-kante.png);
    background-repeat:repeat;
}



.ratingblock {
width:                                50%;
display:                        block;
border-bottom:                1px solid #999;
padding-bottom:                8px;
margin-bottom:                8px;
}
.loading {
height:                                30px;
background:                        url('https://www.hobby-basteln.info/images/ajaxrate_working.gif') 50% 50% no-repeat;
}
.unit-rating {
list-style:                        none;
margin:                                0px;
padding:                        0px;
height:                                30px;
position:                        relative;
background:                        url('https://www.hobby-basteln.info/images/ajaxrate_star.gif') top left repeat-x;
}
.unit-rating li {
text-indent:                -90000px;
padding:                        0px;
margin:                                0px;
float:                                left;
}
.unit-rating li a {
outline:                        none;
display:                        block;
width:                                30px;
height:                                30px;
text-decoration:        none;
text-indent:                -9000px;
z-index:                        20;
position:                        absolute;
padding:                        0px;
}
.unit-rating li a:hover {
background:                        url('https://www.hobby-basteln.info/images/ajaxrate_star.gif') left center;
z-index:                        2;
left:                                0px;
}
.unit-rating a.r1-unit {
left:                                0px;
}
.unit-rating a.r1-unit:hover {
width:                                30px;
}
.unit-rating a.r2-unit {
left:                                30px;
}
.unit-rating a.r2-unit:hover {
width:                                60px;
}
.unit-rating a.r3-unit {
left:                                60px;
}
.unit-rating a.r3-unit:hover {
width:                                90px;
}
.unit-rating a.r4-unit {
left:                                90px;
}
.unit-rating a.r4-unit:hover {
width:                                120px;
}
.unit-rating a.r5-unit {
left:                                120px;
}
.unit-rating a.r5-unit:hover {
width:                                150px;
}
.unit-rating a.r6-unit {
left:                                150px;
}
.unit-rating a.r6-unit:hover {
width:                                180px;
}
.unit-rating a.r7-unit {
left:                                180px;
}
.unit-rating a.r7-unit:hover {
width:                                210px;
}
.unit-rating a.r8-unit {
left:                                210px;
}
.unit-rating a.r8-unit:hover {
width:                                240px;
}
.unit-rating a.r9-unit {
left:                                240px;
}
.unit-rating a.r9-unit:hover {
width:                                270px;
}
.unit-rating a.r10-unit {
left:                                270px;
}
.unit-rating a.r10-unit:hover {
width:                                300px;
}
.unit-rating li.current-rating {
background:                        url('https://www.hobby-basteln.info/images/ajaxrate_star.gif') left bottom;
position:                        absolute;
height:                                30px;
display:                        block;
text-indent:                -9000px;
z-index:                        1;
}
.voted {
color:                                #999;
}
.thanks {
color:                                #36AA3D;
}